NodeBB customisation

[phenomlab]

@jac said in NodeBB customisation:

I’m unsure if this is poss for individual widgets

Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

[JAC]

@phenomlab that definitely sounds great if it is possible .

[JAC]

@phenomlab said in NodeBB customisation:

@jac said in NodeBB customisation:

I’m unsure if this is poss for individual widgets

Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

Interested to see how this would look.

[phenomlab]

@jac It’ll look like this

CSS (already applied to your forum)

.panel-heading.custom {
    background: #ffc557;
    color: #194F90;
}
.panel-body.custom2 {
    background: #194F90;
    color: #ffffff;
}
.panel-body.custom2 small {
    color: #ffffff;
    font-size: 40%;
}
.row.forum-stats {
    margin-left: 5px;
    margin-right: 5px;
}

[JAC]

@phenomlab said in NodeBB customisation:

@jac It’ll look like this

CSS (already applied to your forum)

.panel-heading.custom {
    background: #ffc557;
    color: #194F90;
}
.panel-body.custom2 {
    background: #194F90;
    color: #ffffff;
}
.panel-body.custom2 small {
    color: #ffffff;
    font-size: 40%;
}
.row.forum-stats {
    margin-left: 5px;
    margin-right: 5px;
}

Wow that looks great!!

[JAC]

@jac said in NodeBB customisation:

@phenomlab said in NodeBB customisation:

@jac It’ll look like this

CSS (already applied to your forum)

.panel-heading.custom {
    background: #ffc557;
    color: #194F90;
}
.panel-body.custom2 {
    background: #194F90;
    color: #ffffff;
}
.panel-body.custom2 small {
    color: #ffffff;
    font-size: 40%;
}
.row.forum-stats {
    margin-left: 5px;
    margin-right: 5px;
}

Wow that looks great!!

Many thanks Mark incredibly happy with the result!

[phenomlab]

@jac Good. Thanks for letting me know.

[JAC]

@phenomlab brilliant mate . Thanks again.

[JAC]

I wonder if the slider can be customised with CSS?

Looking to add colour thoughout here and there without overdoing it of course.

[phenomlab]

@jac Can can customise anything with CSS…

[JAC]

@phenomlab very happy to hear this

[phenomlab]

@jac said in NodeBB customisation:

@phenomlab very happy to hear this

Yes, but the key here is to not over egg…

[JAC]

@phenomlab Absolutely, I’m just looking to do subtle changes which I think you have achieved so far, can’t thank you enough for the help given via Sudonix .

[JAC]

@jac

Is there any way to chance the colour of these at all?

[JAC]

@jac I was thinking the boxes to have a blue background with white icons, and for the reply arrow to be a yellow background colour with a white or blue arrow icon.

[phenomlab]

@jac yes, but the css classes used by these are also used elsewhere which may result in undesirable behavior elsewhere.

[JAC]

@phenomlab hmm! I see, it’s a tough one then!?

[JAC]

@jac just looking at other little bits to improve then…

What about doing the reverse of the ‘forum stats’ widget?

Many thanks as always.

[phenomlab]

@jac Like this ?

Revised and simplified CSS

.custom {
    background: #ffc557 !important;
    color: #00205c!important
}
.custom a {
    color: #00205c !important;
}
.custom2 {
    background: #194F90 !important;
    color: #ffffff;
}
.custom2 small {
    color: #ffffff;
    font-size: 40%;
}

[JAC]

@phenomlab brilliant mate, thanks very much for that .