Darker Than Blue Forum Theme

Users who are viewing this thread

Darker Than Blue is a dark theme. It is similar to the current default theme, however the dominant colours are black, dark shades of grey and sky blue. Only tested on Firefox, if it doesn't work on Chrome, not my problem.

I recommend Stylus, which is what I personally use.

CSS:
/* Darker Than Blue 11 - Borderless */
/*
##################################################################
########################### Animations ###########################
##################################################################
*/

@keyframes colourTransition
{
    from { color: inherit; }
    to { color: rgb(128, 175, 225); }
}

@keyframes colourTransition2
{
    from { color: rgb(128, 175, 225); }
    to { color: rgb(35, 124, 219); }
}

@keyframes colourTransition3
{
    from { color: black; }
    to { color: rgb(128, 175, 225); }
}

/*
##################################################################
####################### General Navigation #######################
##################################################################
*/

/* This is the old header before v7 */
#header { background-image: url("https://i.imgur.com/ItL64jv.png"); }

.p-nav-scroller .hScroller-action.hScroller-action--end
{ background: linear-gradient(to right, rgba(39,57,72,0) 0%, rgb(51, 51, 51) 33%); }

.offCanvasMenu--nav .offCanvasMenu-subList .offCanvasMenu-link:hover { background-color: rgba(128, 175, 225, .1); }

.bbCodeBlock-expandLink
{ background: linear-gradient(to bottom, rgba(39,57,72,0) 0%, rgba(51, 51, 51, .8) 25%) !important; }

.p-body, .p-header, .p-pageWrapper, .p-nav, #footer, .p-nav-list .p-navEl.is-menuOpen, .menu, .game-selector:hover .info a, .menu--emoji .menu-header, .offCanvasMenu--nav .offCanvasMenu-header, .offCanvasMenu--nav .offCanvasMenu-content
{ background-color: black; }

.badge.badge--highlighted, .badgeContainer.badgeContainer--highlighted::after, .label.label--red, label--red:hover,
.medio-tile-block .medio-tile-item .thumb, .label.label--yellow,
.label.label--silver, .message-newIndicator, .rio-tiled-block .rio-tiled-item .thumb, .offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected
{
    background-color: rgb(128, 175, 225);
    color: black;
    border: none;
}

.rio-showcase-container .rio-showcase-body
{
    background-color: transparent;
}

a:hover, .node--unread .node-icon i::before, .medio-tile-block .medio-tile-item .thumb .playall .fa--xf, .bbCodeSpoiler-button, .message-userContent a, .rio-tiled-block .rio-tiled-item .thumb .playall .far, .message-cell.message-cell--alert a
{
    animation-name: colourTransition;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

.p-nav-list .p-navEl.is-menuOpen, .menu, .p-body-inner, .block-container, .tabs--standalone, a.button, a.button.button--cta, .gridCard--container, .button, a.button.button--link, .button.button--link, .tagItem, .tooltip--basic .tooltip-content, .tooltip--reaction .tooltip-content, .block-filterBar .filterBar-filterToggle, .button.button--primary, .block--messages .message, .fr-view blockquote, .tooltip--preview .tooltip-content, .pageNav-page:not(:first-child), .pageNav-jump, .block-filterBar
{ border: none; }

.rio-tiled-block .rio-tiled-item .thumb .playall .far { text-shadow: none; }

.block-textHeader, .p-pageWrapper, .block-header, .node--unread .node-icon i::before, .block-minorHeader, .memberHeader-name,
.menu-tabHeader .tabs-tab.is-active, .fr-toolbar .fr-command.fr-btn.fr-active, .tabs--standalone .tabs-tab.is-active, .block-tabHeader .tabs-tab.is-active, .memberTooltip-name, .blockStatus-message::before, .medio-tile-block .medio-tile-item .thumb .playall .fa--xf, .blockLink.is-selected, .block-formSectionHeader, .message-avatar-wrapper .message-avatar-online::before, .message-userContent a, .groupViewNav--item.is-active a, .overlay-title, .fr-element a, .pageNav-page.pageNav-page--current,
.categoryList-link.is-selected, .pollResult--voted .pollResult-response::before, .notice.notice--accent a:not(.button--notice), .medio-category-list .medio-category-item.is-active, .menu--emoji .menu-header, .messageNotice::before, .messageNotice:not(.messageNotice--highlighted) a, .bbTable > table > tbody > tr > th, .block-minorTabHeader,
.block-minorTabHeader .tabs-tab.is-active, #uaThreadViewContainer h3, .calendarevents-date-container-month,
.fr-toolbar .fr-command.fr-btn.fr-active:not(.fr-disabled), .p-nav-scroller .hScroller-action.hScroller-action--end, .offCanvasMenu--nav .offCanvasMenu-header, .menu-header
{ color: rgb(35, 124, 219); }

.bbCodeDemoBlock-item a
{ color: rgb(35, 124, 219) !important; }

.node-icon i::before { color: rgb(128, 175, 225); }

.node--unread .node-icon i::before, .medio-tile-block .medio-tile-item .thumb .playall .fa--xf, .bbCodeSpoiler-button, .message-userContent a, .rio-tiled-block .rio-tiled-item .thumb .playall .far
{ animation-name: colourTransition2; }

.structItemContainer > .structItem:first-child, .structItemContainer > .structItemContainer-group:first-child > .structItem:first-child, .structItemContainer > .structItemContainer-group:first-child > .structItem:first-child, .overlay,
.structItemContainer-group--sticky, .pageNav-page, .pageNav-page.pageNav-page--current, .pageNav-jump, .structItem, .notice,
.tooltip--preview .tooltip-content, .node + .node, .medio-tile-block .medio-tile-item .thumb, .message + .message,
.rio-table-block .rio-table-row .preview > .avatar, .block-row.block-row--separated + .block-row, .bbCodeBlock,
.tooltip--member .tooltip-content, .block--messages .message, .select2-results__options, .bbCodeBlock--expandable .bbCodeBlock-expandContent .bbCodeBlock--expandable.bbCodeBlock--quote, .bbCodeBlock--expandable.bbCodeBlock--quote,
.bbTable > table > tbody > tr > td, .tooltip--share .tooltip-content, .reactionsBar, .blockMessage, .notices.notices--scrolling, .codeEditor.CodeMirror, .fr-toolbar .fr-btn-grp, 
.noticeScrollContainer .lSSlideWrapper, .rio-tiled-block .rio-tiled-item .thumb, .bbTable > table > tbody > tr > th, .blocks-textJoiner > span::before
{ border-color: transparent; }

::selection, .fr-toolbar .fr-command.fr-btn:hover, .fr-popup .fr-command.fr-btn:hover, a:hover .label.label--yellow,
.fr-box.fr-basic .fr-wrapper ::selection, .shareButtons--iconic .shareButtons-button:hover, .fr-desktop .fr-command:focus,
.button:not(.button--splitTrigger):active, a.button:not(.button--splitTrigger):active, a:hover .label.label--red, .fr-popup .fr-action-buttons button.fr-command:not(.button--splitTrigger):hover, .fr-popup .fr-action-buttons button.fr-command:not(.button--splitTrigger):active, .fr-popup .fr-action-buttons button.fr-command:not(.button--splitTrigger):focus, .button.button--primary:not(.button--splitTrigger):hover, .button.button--primary:not(.button--splitTrigger):active, .button:not(.button--splitTrigger):focus, .button.button--primary:not(.button--splitTrigger):focus, .button:not(.button--splitTrigger):hover, .bbCodeSpoiler-button-title:hover, .button:not(.button--splitTrigger):hover, a.button:not(.button--splitTrigger):hover, .button:not(.button--splitTrigger):focus, a.button:not(.button--splitTrigger):focus, .button.button--cta:not(.button--splitTrigger):focus, a.button.button--cta:not(.button--splitTrigger):focus, .fr-desktop .fr-command:hover,
a:hover .label.label--silver
{
    background-color: rgb(35, 124, 219);
    color: black;
}

.fr-box.fr-basic .fr-wrapper ::selection, .js-cancelButton .button, .formSubmitRow-controls > .js-cancelButton.button, .button.button--icon.button--icon--login
{
    background-color: rgb(35, 124, 219) !important;
    color: black !important;
}

.p-body-inner, .ftslider_content, .ftslider_excerpt, .ftslider_title_detail, .select2-results__options,
.tooltip--preview .tooltip-content, .inputGroup.inputGroup--joined .inputGroup-text, .ftslider_title_detail, .fullwidth-title, .fullwidth-slider .es-slides > li:hover .fullwidth-title .ftslider_title_detail, .fullwidth-slider .es-slides > li:hover .fullwidth-title .ftslider_content, .fr-toolbar, .bbCodeBlock--expandable.bbCodeBlock--quote, .bbCodeBlock-content,
.select2 .select2-selection ul > li.select2-selection__choice, .game-selector:hover .info a:hover, .bbCodeBlock, .fr-popup,
.block-filterBar .filterBar-filterToggle, .game-selector .info a, .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper,.fr-toolbar .fr-more-toolbar.fr-expanded, .fr-toolbar .fr-command.fr-btn.fr-open:not(:hover):not(:focus):not(:active), .overlay, .overlay-content > .block > .block-container > :first-child,
.fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active, .fr-separator.fr-vs, .autoCompleteList, .button.button--cta, .fr-view blockquote
{ background-color: rgb(28, 28, 28); }

.block-container, .block-header, .pageNav-page.pageNav-page--current, .pageNav-page, .pageNav-jump, .tabs--standalone, a.button, a.button.button--cta, .medio-tile-block .medio-tile-item, .medio-tile-block .medio-tile-item .thumb .overlays,
.block-filterBar, .gridCard--container, .gridCard--header, .rio-table-block .rio-table-row, .rio-table-block .rio-table-row .viewers > b, .button, .formRow > dt, a.button.button--link, .memberTooltip-header, .block--messages .message, .memberHeader-main, .button.button--link, .message-cell.message-cell--main, .tagItem, .message-cell.message-cell--user, .button--primary,
.blockStatus, .notice.notice--accent, .bbTable > table > tbody > tr > td, .message-responseRow, .blockMessage,
.tooltip--share .tooltip-content, .block--messages .block-row, .pollResult.pollResult--showVoters:hover, .pollResult-voters,
.button.button--primary, .block-row.block-row--separated + .block-row, .block-row.block-row--highlighted,
.notice.notice--primary, .rio-tiled-block .rio-tiled-item .thumb .overlays, .rio-tiled-block .rio-tiled-item,
.bbCodeDemoBlock-item > dd, .dataList-row.dataList-row--subSection .dataList-cell, .dataList-cell.dataList-cell--alt, .dataList-cell.dataList-cell--action, .block-minorTabHeader, .message-cell.message-cell--alert, .memberTooltip-blurb, .fr-view blockquote p, .message-articleUserInfo, .overlay-content > .blocks > .block:not(:last-child) > .block-container
{ background-color: rgb(51, 51, 51); }

.rio-table-block .rio-table-row, .formRow > dt, .block-footer, .message-cell.message-cell--user, .fr-toolbar, .p-nav,
.select2 .select2-selection ul > li.select2-selection__choice, .block-formSectionHeader, .formRowSep, hr, .overlay-title,
.message-avatar-wrapper .message-avatar-online::before, .message-responseRow, .fr-popup .fr-button, .fr-popup,
.block--messages .block-row, .gridCard--header, .avatar.avatar--separated, .block-body + .block-minorHeader,
.menu--emoji .menu-header, .rio-tiled-block .rio-tiled-item, .bbCodeDemoBlock-item > dd, .dataList-row.dataList-row--subSection .dataList-cell, .medio-tile-block .medio-tile-item, .block-minorTabHeader, .calendarevents-date-container-day,
.bbTable, .noborder .alternate, .bbTable > table, .overlay-content > .block > .block-container > :first-child, .block-header,
.pageNav-page.pageNav-page--current:first-child, .message-articleUserInfo
{ border: none; }

.fr-toolbar .fr-more-toolbar.fr-expanded
{ border: none !important; }

.fullwidth-slider .es-slides > li:hover .fullwidth-title .ftslider_content, .menu, .overlay { box-shadow: none; }

.message-signature, .blockStatus, .game-selector:hover, .message-avatar-wrapper .message-avatar-online::before,
.menu-linkRow:hover, .menu-linkRow.is-selected, .menu-linkRow:focus, a:hover .label.label--red, .messageNotice,
.CMTV_QT.questionMarkContainer .questionMark.questionMark--shape.questionMark--unsolved
{ border-color: transparent; }

.fr-view blockquote
{ border-left-color: transparent !important; }

.message-userArrow, .tooltip--member.tooltip--bottom .tooltip-arrow, .tooltip--member.tooltip--top .tooltip-arrow,
.tooltip--basic.tooltip--top .tooltip-arrow, .fr-popup .fr-arrow, .tooltip-arrow, .block-separator
{ display: none; }

.blockStatus, .bbCodeBlock, .reactionsBar, .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a:hover, .autoCompleteList li.is-selected { border-left: none !important; }

.bbCodeBlock-title, .bbCodeBlock--expandable .bbCodeBlock-expandContent .bbCodeBlock--expandable .bbCodeBlock-title, .reactionsBar, .fr-box.fr-basic .fr-toolbar.fr-top, .gridCard--container, .gridCard--header, .block-footer
{ background-color: rgb(38, 38, 38) !important; }

/* This is for banned people. */
[style="color: #F66;"] { color: rgb(129, 147, 225) !important; }

.p-pageWrapper, .formSubmitRow-bar, .menu-row.menu-row--alt, .menu-tabHeader, .p-navgroup-link.is-menuOpen, .menu-content,
.messageNotice, .menu-row.menu-row--clickable:hover, .menu-row.menu-row--highlighted, .calendarevents-date-container-month,
.calendarevents-date-container-day, .block-container:not(.block-container--noStripRadius) > .block-body:last-child .formSubmitRow:not(.is-sticky) .formSubmitRow-bar, .block-container:not(.block-container--noStripRadius) > .formSubmitRow:not(.is-sticky):last-child .formSubmitRow-bar, .formSubmitRow.formSubmitRow--sticky.is-sticky .formSubmitRow-bar, .bbTable > table, .alert.is-unread
{ background-color: transparent; }

.structItemContainer-group--sticky .structItem, .tooltip--reaction .tooltip-content, .tooltip--basic .tooltip-content, .bbCodeBlock-content, .bbCodeSpoiler-button, .overlay-title, /* .label.label--green, */ .CMTV_QT.questionMarkContainer .questionMark.questionMark--shape.questionMark--unsolved, .menu--emoji .menu-header, .bbTable > table > tbody > tr > th, .smilieText
{ background-color: rgb(61, 61, 61); }

.smilieText { border-color: rgb(61, 61, 61); }

.avatar.avatar--default.avatar--default--text, .bbCodeBlock-expandLink a
{
    background-color: transparent !important;
    color: lightblue !important;
}

.pageNav-page:not(:first-child):hover, .pageNav-page:first-child:hover,.block-filterBar .filterBar-filterToggle:hover,.block-filterBar .filterBar-menuTrigger:hover, .smilieText:hover,.tagItem:hover, .pageNav-jump.pageNav-jump--next:hover,
.pageNav-jump.pageNav-jump--prev:hover, .shareInput-button.inputGroup-text.js-shareButton:hover, .pageNav-jump:active, .pageNav-page:active, .button.button--cta:not(.button--splitTrigger):active, .button:not(.button--splitTrigger):focus,
a.button.button--cta:not(.button--splitTrigger):active, .inputGroup.inputGroup--joined .inputNumber-button:hover, .inputGroup.inputGroup--joined .inputGroup-text:hover, .inputGroup.inputGroup--joined .inputNumber-button:active, .inputGroup.inputGroup--joined .inputNumber-button:focus
{
    background-color: rgb(35, 124, 219);
    color: black;
    border: none;
    animation-name: colourTransition3;
}

/*
.CMTV_QT.bestAnswer:not(.is-mod-selected).bestAnswer--background .message-cell--main
{
    background-color: rgb(24, 188, 238) ;
    color: black;
}
*/

.button--primary, .button.button--icon.button--icon--save, .button.is-disabled, .button:hover, .pollResult-bar > i, .button:not(.button--splitTrigger):hover, a.button:not(.button--splitTrigger):hover
{
    background-color: rgb(35, 124, 219) !important;
    color: black !important;
    border: none !important;
}

li > .username, .structItem-minor > .username, .block-minorHeader { background: inherit;}

.tooltip--member .tooltip-content, .memberTooltip-header, .bbTable > table.alternate > tbody > tr:nth-child(2n) > td,
.memberTooltip-blurbContainer, .bbCodeBlock
{ background-color: rgb(51, 51, 51) !important; }

.memberTooltip-header { border-bottom: none !important; }



.bbTable > table > tbody > tr > th
{
    border-bottom: 1px solid rgb(128, 175, 225);
    border-top: 1px solid rgb(128, 175, 225);
}

.postItem .postItem-footer .postItem--comments::before { border-top: none; }

.shareButtons--iconic .shareButtons-button:hover { color: black !important; }

.bbCodeBlock-expandLink, .message-body.tlg-content-preview--enabled .tlg-content-cover
{ background: linear-gradient(to bottom, rgba(24,41,58,0) 0%, rgb(38, 38, 38) 80%); }

.message-avatar-wrapper .message-avatar-online
{
    left: 43%;
    margin-left: 0;
}

.bbCodeBlock-content, .menu-content
{
    scrollbar-width: thin;
    scrollbar-color: rgb(35, 124, 219) transparent;
    scrollbar-gutter: always; /* This does not work yet, but it eventually will. */
}

.p-footer { background-color: black !important; }

/* user #2 is armagan */
.username--moderator.username--admin.username--color-0 , [data-user-id="2"] > .username--color-0
{
    background: linear-gradient(silver, skyblue, steelblue);
    background-clip: text;
    color: transparent;
}

.username--staff.username--moderator, .memberTooltip-name > .username > .username--staff.username--moderator
{
    background: linear-gradient(white, lightblue, steelblue);
    background-clip: text;
    color: transparent;
}

.username--moderator { text-decoration: underline dotted; }

/* .p-body-inner { background-image: url("https://i.imgur.com/6P9WluV.png"); } */

/*
###########################################################################
####################### Syntactic Code Highlighting #######################
###########################################################################
*/

.bbCodeCode { color: steelblue; }

.bbCodeCode .prism-token.prism-comment
{
    font-family: "Times New Roman";
    font-style: oblique;
    color: lightgrey;
}

.bbCodeCode .prism-token.prism-selector, .bbCodeCode .prism-token.prism-function
{
    font-family: "courier";
    font-size: 10pt;
    color: skyblue;
}

.bbCodeCode .prism-token.prism-punctuation { color: cyan; }

.bbCodeCode .prism-token.prism-property { color: grey; }

.bbCodeCode .prism-token.prism-url
{
    font-style: oblique;
    color: white;
}

.bbCodeCode .prism-token.prism-symbol, .bbCodeCode .prism-token.prism-atrule, .bbCodeCode .prism-token.prism-keyword
{
    font-weight: bold;
    font-family: "courier";
    color: white;
}

.bbCodeCode .prism-token.prism-class-name { color: rgb(80, 255, 255);}

.bbCodeCode .prism-token.prism-important
{
    font-weight: bolder;
    font-style: oblique;
    text-decoration: underline overline dashed;
    color: lightgrey;
}

.bbCodeCode .prism-token.prism-string { color: rgb(35, 124, 219); }

.bbCodeCode .prism-token.prism-attr-value, .bbCodeCode .prism-token.prism-number { color: rgb(134, 148, 255); }

.bbCodeCode .prism-token.prism-operator
{
    font-size: 12pt;
    color: Aquamarine;
}

CSS:
/* Darker Than Blue 10 */
/*
##################################################################
########################### Animations ###########################
##################################################################
*/

@keyframes colourTransition
{
    from { color: inherit; }
    to { color: rgb(128, 175, 225); }
}

@keyframes colourTransition2
{
    from { color: rgb(128, 175, 225); }
    to { color: rgb(35, 124, 219); }
}

@keyframes colourTransition3
{
    from { color: black; }
    to { color: rgb(128, 175, 225); }
}

/*
##################################################################
####################### General Navigation #######################
##################################################################
*/

/* This is the old header before v7 */
#header { background-image: url("https://i.imgur.com/ItL64jv.png"); }

.p-nav-scroller .hScroller-action.hScroller-action--end
{ background: linear-gradient(to right, rgba(39,57,72,0) 0%, rgb(51, 51, 51) 33%); }

.offCanvasMenu--nav .offCanvasMenu-subList .offCanvasMenu-link:hover { background-color: rgba(128, 175, 225, .1); }

.bbCodeBlock-expandLink
{ background: linear-gradient(to bottom, rgba(39,57,72,0) 0%, rgba(51, 51, 51, .8) 25%) !important; }

.p-body, .p-header, .p-pageWrapper, .p-nav, #footer, .p-nav-list .p-navEl.is-menuOpen, .menu, .game-selector:hover .info a, .menu--emoji .menu-header, .offCanvasMenu--nav .offCanvasMenu-header, .offCanvasMenu--nav .offCanvasMenu-content
{ background-color: black; }

.badge.badge--highlighted, .badgeContainer.badgeContainer--highlighted::after, .label.label--red, label--red:hover,
.medio-tile-block .medio-tile-item .thumb, .rio-showcase-container .rio-showcase-body, .label.label--yellow,
.label.label--silver, .message-newIndicator, .rio-tiled-block .rio-tiled-item .thumb, .offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected
{
    background-color: rgb(128, 175, 225);
    color: black;
    border: none;
}

a:hover, .node--unread .node-icon i::before, .medio-tile-block .medio-tile-item .thumb .playall .fa--xf, .bbCodeSpoiler-button, .message-userContent a, .rio-tiled-block .rio-tiled-item .thumb .playall .far, .message-cell.message-cell--alert a
{
    animation-name: colourTransition;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

.p-nav-list .p-navEl.is-menuOpen, .menu, .p-body-inner, .block-container, .tabs--standalone, a.button, a.button.button--cta, .gridCard--container, .button, a.button.button--link, .button.button--link, .tagItem, .tooltip--basic .tooltip-content, .tooltip--reaction .tooltip-content, .block-filterBar .filterBar-filterToggle, .button.button--primary, .block--messages .message, .fr-view blockquote
{ border: 1px solid rgb(128, 175, 225); }

.rio-tiled-block .rio-tiled-item .thumb .playall .far { text-shadow: none; }

.block-textHeader, .p-pageWrapper, .block-header, .node--unread .node-icon i::before, .block-minorHeader, .memberHeader-name,
.menu-tabHeader .tabs-tab.is-active, .fr-toolbar .fr-command.fr-btn.fr-active, .tabs--standalone .tabs-tab.is-active, .block-tabHeader .tabs-tab.is-active, .memberTooltip-name, .blockStatus-message::before, .medio-tile-block .medio-tile-item .thumb .playall .fa--xf, .blockLink.is-selected, .block-formSectionHeader, .message-avatar-wrapper .message-avatar-online::before, .message-userContent a, .groupViewNav--item.is-active a, .overlay-title, .fr-element a, .pageNav-page.pageNav-page--current,
.categoryList-link.is-selected, .pollResult--voted .pollResult-response::before, .notice.notice--accent a:not(.button--notice), .medio-category-list .medio-category-item.is-active, .menu--emoji .menu-header, .messageNotice::before, .messageNotice:not(.messageNotice--highlighted) a, .bbTable > table > tbody > tr > th, .block-minorTabHeader,
.block-minorTabHeader .tabs-tab.is-active, #uaThreadViewContainer h3, .calendarevents-date-container-month,
.fr-toolbar .fr-command.fr-btn.fr-active:not(.fr-disabled), .p-nav-scroller .hScroller-action.hScroller-action--end, .offCanvasMenu--nav .offCanvasMenu-header, .menu-header
{ color: rgb(35, 124, 219); }

.node-icon i::before { color: rgb(128, 175, 225); }

.node--unread .node-icon i::before, .medio-tile-block .medio-tile-item .thumb .playall .fa--xf, .bbCodeSpoiler-button, .message-userContent a, .rio-tiled-block .rio-tiled-item .thumb .playall .far
{ animation-name: colourTransition2; }

.tooltip--preview .tooltip-content
{
    border-width: 1px;
    border-style: solid;
    border-right: none;
}

.structItemContainer > .structItem:first-child, .structItemContainer > .structItemContainer-group:first-child > .structItem:first-child, .structItemContainer > .structItemContainer-group:first-child > .structItem:first-child, .overlay,
.structItemContainer-group--sticky, .pageNav-page, .pageNav-page.pageNav-page--current, .pageNav-jump, .structItem, .notice,
.tooltip--preview .tooltip-content, .node + .node, .medio-tile-block .medio-tile-item .thumb, .message + .message,
.rio-table-block .rio-table-row .preview > .avatar, .block-row.block-row--separated + .block-row, .bbCodeBlock,
.tooltip--member .tooltip-content, .block--messages .message, .select2-results__options, .bbCodeBlock--expandable .bbCodeBlock-expandContent .bbCodeBlock--expandable.bbCodeBlock--quote, .bbCodeBlock--expandable.bbCodeBlock--quote,
.bbTable > table > tbody > tr > td, .tooltip--share .tooltip-content, .reactionsBar, .blockMessage, .notices.notices--scrolling,
.noticeScrollContainer .lSSlideWrapper, .rio-tiled-block .rio-tiled-item .thumb, .bbTable > table > tbody > tr > th
{ border-color: rgb(128, 175, 225); }

::selection, .fr-toolbar .fr-command.fr-btn:hover, .fr-popup .fr-command.fr-btn:hover, a:hover .label.label--yellow,
.fr-box.fr-basic .fr-wrapper ::selection, .shareButtons--iconic .shareButtons-button:hover, .fr-desktop .fr-command:focus,
.button:not(.button--splitTrigger):active, a.button:not(.button--splitTrigger):active, a:hover .label.label--red, .fr-popup .fr-action-buttons button.fr-command:not(.button--splitTrigger):hover, .fr-popup .fr-action-buttons button.fr-command:not(.button--splitTrigger):active, .fr-popup .fr-action-buttons button.fr-command:not(.button--splitTrigger):focus, .button.button--primary:not(.button--splitTrigger):hover, .button.button--primary:not(.button--splitTrigger):active, .button:not(.button--splitTrigger):focus, .button.button--primary:not(.button--splitTrigger):focus, .button:not(.button--splitTrigger):hover, .bbCodeSpoiler-button-title:hover, .button:not(.button--splitTrigger):hover, a.button:not(.button--splitTrigger):hover, .button:not(.button--splitTrigger):focus, a.button:not(.button--splitTrigger):focus, .button.button--cta:not(.button--splitTrigger):focus, a.button.button--cta:not(.button--splitTrigger):focus, .fr-desktop .fr-command:hover,
a:hover .label.label--silver
{
    background-color: rgb(35, 124, 219);
    color: black;
}

.fr-box.fr-basic .fr-wrapper ::selection, .js-cancelButton .button, .formSubmitRow-controls > .js-cancelButton.button
{
    background-color: rgb(35, 124, 219) !important;
    color: black !important;
}

.p-body-inner, .block-footer, .ftslider_content, .ftslider_excerpt, .ftslider_title_detail, .select2-results__options,
.tooltip--preview .tooltip-content, .inputGroup.inputGroup--joined .inputGroup-text, .ftslider_title_detail, .fullwidth-title, .fullwidth-slider .es-slides > li:hover .fullwidth-title .ftslider_title_detail, .fullwidth-slider .es-slides > li:hover .fullwidth-title .ftslider_content, .fr-toolbar, .bbCodeBlock--expandable.bbCodeBlock--quote, .bbCodeBlock-content,
.select2 .select2-selection ul > li.select2-selection__choice, .game-selector:hover .info a:hover, .bbCodeBlock, .fr-popup,
.block-filterBar .filterBar-filterToggle, .game-selector .info a, .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper,.fr-toolbar .fr-more-toolbar.fr-expanded, .fr-toolbar .fr-command.fr-btn.fr-open:not(:hover):not(:focus):not(:active), .overlay, .overlay-content > .block > .block-container > :first-child,
.fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active, .fr-separator.fr-vs, .autoCompleteList, .button.button--cta, .fr-view blockquote
{ background-color: rgb(28, 28, 28); }

.block-container, .block-header, .pageNav-page.pageNav-page--current, .pageNav-page, .pageNav-jump, .tabs--standalone, a.button, a.button.button--cta, .medio-tile-block .medio-tile-item, .medio-tile-block .medio-tile-item .thumb .overlays,
.block-filterBar, .gridCard--container, .gridCard--header, .rio-table-block .rio-table-row, .rio-table-block .rio-table-row .viewers > b, .button, .formRow > dt, a.button.button--link, .memberTooltip-header, .block--messages .message, .memberHeader-main, .button.button--link, .message-cell.message-cell--main, .tagItem, .message-cell.message-cell--user, .button--primary,
.blockStatus, .notice.notice--accent, .bbTable > table > tbody > tr > td, .message-responseRow, .blockMessage,
.tooltip--share .tooltip-content, .block--messages .block-row, .pollResult.pollResult--showVoters:hover, .pollResult-voters,
.button.button--primary, .block-row.block-row--separated + .block-row, .block-row.block-row--highlighted,
.notice.notice--primary, .rio-tiled-block .rio-tiled-item .thumb .overlays, .rio-tiled-block .rio-tiled-item,
.bbCodeDemoBlock-item > dd, .dataList-row.dataList-row--subSection .dataList-cell, .dataList-cell.dataList-cell--alt, .dataList-cell.dataList-cell--action, .block-minorTabHeader, .message-cell.message-cell--alert, .memberTooltip-blurb, .fr-view blockquote p
{ background-color: rgb(51, 51, 51); }

.block-filterBar, .menu-tabHeader
{ border-bottom-color: rgb(128, 175, 225); }

.rio-table-block .rio-table-row, .formRow > dt, .block-footer, .message-cell.message-cell--user, .fr-toolbar, .p-nav,
.select2 .select2-selection ul > li.select2-selection__choice, .block-formSectionHeader, .formRowSep, hr, .overlay-title,
.message-avatar-wrapper .message-avatar-online::before, .message-responseRow, .fr-popup .fr-button, .fr-popup,
.block--messages .block-row, .gridCard--header, .avatar.avatar--separated, .block-body + .block-minorHeader,
.menu--emoji .menu-header, .rio-tiled-block .rio-tiled-item, .bbCodeDemoBlock-item > dd, .dataList-row.dataList-row--subSection .dataList-cell, .medio-tile-block .medio-tile-item, .block-minorTabHeader, .calendarevents-date-container-day,
.bbTable, .noborder .alternate, .bbTable > table, .overlay-content > .block > .block-container > :first-child, .block-header
{ border: none; }

.fr-toolbar .fr-more-toolbar.fr-expanded
{ border: none !important; }

.fullwidth-slider .es-slides > li:hover .fullwidth-title .ftslider_content, .menu, .overlay { box-shadow: none; }

.message-signature, .blockStatus, .game-selector:hover, .message-avatar-wrapper .message-avatar-online::before,
.menu-linkRow:hover, .menu-linkRow.is-selected, .menu-linkRow:focus, a:hover .label.label--red, .messageNotice,
.CMTV_QT.questionMarkContainer .questionMark.questionMark--shape.questionMark--unsolved
{ border-color: rgb(35, 124, 219); }

.fr-view blockquote
{ border-left-color: rgb(35, 124, 219) !important; }

.message-userArrow, .tooltip--member.tooltip--bottom .tooltip-arrow, .tooltip--member.tooltip--top .tooltip-arrow,
.tooltip--basic.tooltip--top .tooltip-arrow, .fr-popup .fr-arrow, .tooltip-arrow, .block-separator
{ display: none; }

.blockStatus, .bbCodeBlock, .reactionsBar, .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a:hover, .autoCompleteList li.is-selected { border-left: 2px solid rgb(35, 124, 219) !important; }

.bbCodeBlock-title, .bbCodeBlock--expandable .bbCodeBlock-expandContent .bbCodeBlock--expandable .bbCodeBlock-title, .reactionsBar, .fr-box.fr-basic .fr-toolbar.fr-top, .gridCard--container, .gridCard--header
{ background-color: rgb(38, 38, 38) !important; }

/* This is for banned people. */
[style="color: #F66;"] { color: rgb(129, 147, 225) !important; }

.p-pageWrapper, .formSubmitRow-bar, .menu-row.menu-row--alt, .menu-tabHeader, .p-navgroup-link.is-menuOpen, .menu-content,
.messageNotice, .menu-row.menu-row--clickable:hover, .menu-row.menu-row--highlighted, .calendarevents-date-container-month,
.calendarevents-date-container-day, .block-container:not(.block-container--noStripRadius) > .block-body:last-child .formSubmitRow:not(.is-sticky) .formSubmitRow-bar, .block-container:not(.block-container--noStripRadius) > .formSubmitRow:not(.is-sticky):last-child .formSubmitRow-bar, .formSubmitRow.formSubmitRow--sticky.is-sticky .formSubmitRow-bar, .bbTable > table, .alert.is-unread
{ background-color: transparent; }

.structItemContainer-group--sticky .structItem, .tooltip--reaction .tooltip-content, .tooltip--basic .tooltip-content, .bbCodeBlock-content, .bbCodeSpoiler-button, .overlay-title, /* .label.label--green, */ .CMTV_QT.questionMarkContainer .questionMark.questionMark--shape.questionMark--unsolved, .menu--emoji .menu-header, .bbTable > table > tbody > tr > th, .smilieText
{ background-color: rgb(61, 61, 61); }

.smilieText { border-color: rgb(61, 61, 61); }

.avatar.avatar--default.avatar--default--text, .bbCodeBlock-expandLink a
{
    background-color: transparent !important;
    color: lightblue !important;
}

.bbCodeDemoBlock-item a
{ color: rgb(35, 124, 219) !important; }

.pageNav-page:not(:first-child):hover, .pageNav-page:first-child:hover,.block-filterBar .filterBar-filterToggle:hover,.block-filterBar .filterBar-menuTrigger:hover, .smilieText:hover,.tagItem:hover, .pageNav-jump.pageNav-jump--next:hover,
.pageNav-jump.pageNav-jump--prev:hover, .shareInput-button.inputGroup-text.js-shareButton:hover, .pageNav-jump:active, .pageNav-page:active, .button.button--cta:not(.button--splitTrigger):active, .button:not(.button--splitTrigger):focus,
a.button.button--cta:not(.button--splitTrigger):active, .inputGroup.inputGroup--joined .inputNumber-button:hover, .inputGroup.inputGroup--joined .inputGroup-text:hover, .inputGroup.inputGroup--joined .inputNumber-button:active, .inputGroup.inputGroup--joined .inputNumber-button:focus
{
    background-color: rgb(35, 124, 219);
    color: black;
    border: 1px solid rgb(35, 124, 219);
    animation-name: colourTransition3;
}

/*
.CMTV_QT.bestAnswer:not(.is-mod-selected).bestAnswer--background .message-cell--main
{
    background-color: rgb(24, 188, 238) ;
    color: black;
}
*/

.button--primary, .button.button--icon.button--icon--save, .button.is-disabled, .button:hover, .pollResult-bar > i, .button:not(.button--splitTrigger):hover, a.button:not(.button--splitTrigger):hover, .bbWrapper hr
{
    background-color: rgb(35, 124, 219) !important;
    color: black !important;
    border: 1px solid rgb(35, 124, 219) !important;
}

li > .username, .structItem-minor > .username, .block-minorHeader { background: inherit;}

.tooltip--member .tooltip-content, .memberTooltip-header, .bbTable > table.alternate > tbody > tr:nth-child(2n) > td,
.memberTooltip-blurbContainer
{ background-color: rgb(51, 51, 51) !important; }

.memberTooltip-header { border-bottom: none !important; }

.pageNav-page:last-child { border-right: 1px solid rgb(128, 175, 225) !important; }

.pageNav-page.pageNav-page--current, .bbTable > table > tbody > tr > th
{
    border-bottom: 1px solid rgb(128, 175, 225);
    border-top: 1px solid rgb(128, 175, 225);
}

.postItem .postItem-footer .postItem--comments::before { border-top: none; }

.pageNav-page.pageNav-page--current:first-child { border-left: 1px solid rgb(128, 175, 225); }

.shareButtons--iconic .shareButtons-button:hover { color: black !important; }

.bbCodeBlock-expandLink, .message-body.tlg-content-preview--enabled .tlg-content-cover
{ background: linear-gradient(to bottom, rgba(24,41,58,0) 0%, rgb(38, 38, 38) 80%); }

.message-avatar-wrapper .message-avatar-online
{
    left: 43%;
    margin-left: 0;
}

.bbCodeBlock-content, .menu-content
{
    scrollbar-width: thin;
    scrollbar-color: rgb(35, 124, 219) transparent;
    scrollbar-gutter: always; /* This does not work yet, but it eventually will. */
}

.p-footer { background-color: black !important; }

.codeEditor.CodeMirror, .fr-toolbar .fr-btn-grp { border-color: transparent; }

/* .label.label--green, .CMTV_QT.questionMarkContainer .questionMark.questionMark--shape.questionMark--solved, .CMTV_QT.bestAnswerMarkContainer .bestAnswerMark.bestAnswerMark--icon.bestAnswerMark--select { color: rgb(0, 231, 255); } */

/* .label.label--green { border-color: rgb(0, 231, 255); } */

/* a.label.label--green:hover, a:hover .label.label--green
{
    color: black;
    background: rgb(0, 231, 255);
    border-color: rgb(0, 231, 255);
} */

/* .CMTV_QT.questionMarkContainer .questionMark.questionMark--shape.questionMark--solved { border-color: rgb(0, 200, 230); } */

/* user #2 is armagan */
.username--moderator.username--admin.username--color-0 , [data-user-id="2"] > .username--color-0
{
    background: linear-gradient(silver, skyblue, steelblue);
    background-clip: text;
    color: transparent;
}

.username--staff.username--moderator, .memberTooltip-name > .username > .username--staff.username--moderator
{
    background: linear-gradient(white, lightblue, steelblue);
    background-clip: text;
    color: transparent;
}

.username--moderator { text-decoration: underline dotted; }

/* .p-body-inner { background-image: url("https://i.imgur.com/6P9WluV.png"); } */

/*
###########################################################################
####################### Syntactic Code Highlighting #######################
###########################################################################
*/

.bbCodeCode { color: steelblue; }

.bbCodeCode .prism-token.prism-comment
{
    font-family: "Times New Roman";
    font-style: oblique;
    color: lightgrey;
}

.bbCodeCode .prism-token.prism-selector, .bbCodeCode .prism-token.prism-function
{
    font-family: "courier";
    font-size: 10pt;
    color: skyblue;
}

.bbCodeCode .prism-token.prism-punctuation { color: cyan; }

.bbCodeCode .prism-token.prism-property { color: grey; }

.bbCodeCode .prism-token.prism-url
{
    font-style: oblique;
    color: white;
}

.bbCodeCode .prism-token.prism-symbol, .bbCodeCode .prism-token.prism-atrule, .bbCodeCode .prism-token.prism-keyword
{
    font-weight: bold;
    font-family: "courier";
    color: white;
}

.bbCodeCode .prism-token.prism-class-name { color: rgb(80, 255, 255);}

.bbCodeCode .prism-token.prism-important
{
    font-weight: bolder;
    font-style: oblique;
    text-decoration: underline overline dashed;
    color: lightgrey;
}

.bbCodeCode .prism-token.prism-string { color: rgb(35, 124, 219); }

.bbCodeCode .prism-token.prism-attr-value, .bbCodeCode .prism-token.prism-number { color: rgb(134, 148, 255); }

.bbCodeCode .prism-token.prism-operator
{
    font-size: 12pt;
    color: Aquamarine;
}
Make sure that you are using Firefox before reporting something as broken. Please look at last post for screenshots.
 
Last edited:
Great idea! Just a small tweak I'd recommend (per personal taste), but the pagination lacks a border-right, which looks a tad odd to me.

border-right-style: none; changed to border-right-width: thin;

Code:
.pageNav-page.pageNav-page--current,
.tooltip--preview .tooltip-content {
    border-width: 1px;
    border-style: solid;
    border-right-width: thin;
}

Aaaand that is a possible tweak in the making there, but the code field is almost unreadable! Can quickly fix with the below, but you'll probs want to adjust to the palette you're going for.

Code:
.bbCodeBlock--expandable.bbCodeBlock--quote, .bbCodeBlock-content {
    background-color: rgb(180, 180, 180);
}
 
Last edited:
yes I noticed, I was fixing those in a different way and didn't see your comment. I'm sorry. If you could compare your changes vs mine tell me which is better it would be great!

- game selector borders are now blue on hover instead of orange
- new message indicater now black on blue instead of orange
- fixed online indicater
- fixed last page nav button not displaying its right border
- code blocks are now dark grey instead of blue
- spoiler tool tips now dark grey instead of blue
- tables are now dark grey instead of blue, but they do now have blue borders
- response bars in groups now fixed to match the theme
- fixed reaction tooltip
- fixed active links in the group sidebar
- bbcode blocks and spoilers are a bit lighter; it makes syntaxically highlighted code more readable
- insufficient posting privilege message now fits the theme
- breadcrumbs removed (the superfluous Home link in the main body which is right under the Home link in the nav bar)
- it no longer rains (uncomment the last line in the code to make it rain again)

Edit: I noticed the preview text blocks also lack a right border, were you talking about those?

Edit 2:
Todo: redo the font colours for syntactic highlighting
Todo: fix the ugly scroll bars
Todo: fix the remaining orange
Todo: missing bottom and right borders in some tool tips
If anyone wants to add or change that todo list in some other way, they are free to post suggestions
 
Last edited:
Looks great! Few more things:
  • Line 100, .p-breadcrumbs is set to display:none --- this removes the breadcrumb for page navigation. So above your post, for example, we lose:
    • Home > Forums > Miscellaneous > The Anachronist's Guild - Off-Topic Chat
    • As such I'd suggest removing , .p-breadcrumbs from line 100.
  • Spoilers are now readable, which is great! But text in code windows, due to the background colour, is still difficult to read. I'd recommend either lightening up the background (or otherwise just giving the colour of the code window header and body an overhaul), or adjusting the font colours within the code window - maybe using how spoilers are coloured for inspiration?
  • I'd suggest adding, to line 6, , .p-header after p-body, as it helps finish the background by unifying it under a single colour, so there aren't grey cubes to the left and right of your logo.
 
Thank you for the feedback! I appreciate it greatly.

  • Line 100, .p-breadcrumbsis set to display:none --- this removes the breadcrumb for page navigation. So above your post, for example, we lose:
    • Home > Forums > Miscellaneous > The Anachronist's Guild - Off-Topic Chat
    • As such I'd suggest removing , .p-breadcrumbs from line 100.
I did that because I really dislike how the breadcrumbs look, but I admit I had forgotten about the functionality when I decided to remove it. I'll put it back to normal, sorry about that. (or maybe I'll try to make it look better)
  • Spoilers are now readable, which is great! But text in code windows, due to the background colour, is still difficult to read. I'd recommend either lightening up the background (or otherwise just giving the colour of the code window header and body an overhaul), or adjusting the font colours within the code window - maybe using how spoilers are coloured for inspiration?
Don't worry, redoing the syntax highlighting is on the top of my priority todo list for the next update!
  • I'd suggest adding, to line 6, , .p-header after p-body, as it helps finish the background by unifying it under a single colour, so there aren't grey cubes to the left and right of your logo.
Thank you for reporting that fact, I wasn't aware of the grey cubes!
 
Sorry for the double post, there's an update.
- Breadcrumbs is back
- Fixed rebellious orange selection
- Fixed the overlay box to match the rest of the theme
- Header is now entirely black, good bye grey squares!
- Redid the code coloration / style, it is functionnal, but I will need some feedback as I only looked at c#, js and css code with it
- Editing the code coloration took longer than I thought it would, so I didn't do anything else on my priority todo list, sorry!
- It no longer rains

Todo: fix the ugly scroll bars
Todo: fix the remaining orange
Todo: missing bottom and right borders in some tool tips
Edit: As will soon be usual, anyone is free to suggest changes to the priority todo list
 
Last edited:
New update:
- Orange links are now blue while typing.
- Fixed quotes within quotes.
- Blocks now all have the correct and matching blue coloured border.
- Active navigation button now blue instead of orange.
- Active navigation button now no longer has a right border .
- External Link Pop up mini menu now dark grey instead of blue.
- Fixed the "Oops! We ran into some problems." message pop up.
- All arrows should now hidden.
- Share tool tip is now dark grey instead of blue.
- Share buttons are now uniform and consistent with the theme.
- "Yellow" labels now blue on hover instead of orange
- All buttons should be blue instead of orange on hover.
- Fixed the "There are no posts to display" box in message groups.
- A group card header no longer has a bottom border.
- It no longer rains.
- Fixed missing borders.
- Polls have blue check marks and stat bars instead of orange.
- Polls no longer have a blue separator.
- Media filter now dark grey instead of blue.
- Reaction bar now dark grey instead of blue

Todo: fix the ugly scroll bars
Todo: Revamp the header image.
Todo: Remove all the remaining orange crap.
Todo: fix the stuff which happens to look broken on phones
Anyone is free to suggest changes to the priority todo list.
 
Last edited:
- Menu links have a blue right border instead of orange.
- "Click to expand" blocks are now dark grey instead of blue.
- Fixed online icon to be closer to the center of the avatar.
- Removed borders on small avatars.
- Fixed ugly scrollbars. The effect will not be visible for people who do not use Firefox.
- It no longer rains.
- Active buttons now blue instead of orange. I may have missed one or two though.
- Poll voters now dark grey instead of blue.
- Removed the remaining orange in game selection.
- Removed border of minor headers in account settings.
- Block message borders are sky blue instead of dark blue.

Todo: Revamp the header image.
Todo: Start working on true support for phones.
Anyone is free to suggest changes to the priority todo list.
 
Last edited:
- Button focus now blue instead of orange.
- Unsolved on hover is noew blue instead of red.
- Drop down sub menu elements of the text editor now have a blue left border instead of orange.
- Also, the focus of said elements is blue instead of orange.
- Drop down sub menus of the text editor are now dark grey instead of blue.
- Text editor button behaviour fixed.
- Text editor separators are now dark grey instead of blue.
- Solved tags are now bright cyan instead of green. This is temporary until I find a better colour. Also disabled by default.
- Fixed unsolved tags.
- It no longer rains.
- uh... so... uh, you'll probably not agree with what I did to the usernames. Tell me what you think.
- Autocomplete menu now has a blue border on hover instead of orange.
- Autocomplete menu now dark grey instead of blue.
- Insert button now blue on hover, active and focus instead of orange.
- Ditto for the reply, preview, ignore and watch buttons, which I'm pretty sure I had already covered. Refixed I guess.
- Fixed a rogue orange link.
- Fixed active submit media button.
- Colour eraser button now blue on hover instead of orange.
- Emoji menu headers now blue on dark grey instead of orange on blue.
- Fixed ignored content.
 
Last edited:
- Fixed Content Preview.
- Fixed notification links.
- Fixed alert area.
- Fixed primary notice.
- Fixed "silver" label.
- I doesn't rain anymore.
- Fixed the stream tile view.
- Help section's demo bbcode fixed.
- Help section's smilies fixed.
- Replaced the header's image with TaleWorlds' logo. The previous image is still in the code, commented, for those who prefer it.

I consider the current desktop version to be more or less complete. There may be a few things which need to be fixed which I am not yet aware of, but I'll be mostly working on small screens (phone / tablet screens) from now on.
 
Last edited:
- Fixed Reactions received.
- Fixed Alerts for the second time.
- Fixed Scrolling notice.
- Tried to make best answers better fit the theme. Not enabled by default. Tell me what you think.
- Fixed Footer.
- Fixed Invite button.
- Fixed new message alert.

This is just a maintenance update. I haven't had the time to really work on the theme for some time now.
 
Last edited:
Just a small update to fix an inconsistency in the theme's appearance when viewing groups which caught my attention. For now, I don't know when I'll start working on direct mobile support, but the project is not abandoned.
 
The newest update screwed up with a lot of things. It wouldn't have been that bad if it didn't add yet even more !importants :rolleyes: and overall the new css is as impressively stupid as before, so nothing new on that front. The code was pretty spaghetti before, but now it is ten times more messy. You can tell that I consequently enjoyed updating the theme. I think I lost a bit of my soul in there. By the way, if you spot any inconsistency, please report it here. I'll fix it as fast as I can.

* Fixed bbcode toolbar
* Fixed category border
* Fixed calendar
* Fixed tooltips
* Fixed bbtable
* Fixed groups
* Fixed selection
* Fixed save/cancel bar in editor
* I was tired of the current header image so we went back to the pre-v7 header image
* Some minor stuff
 
Last edited:
I finally took the time to take a look at and modify the small screen layout. Also includes small fixes.

- Return of the border for post blocks
- Removed the bottom border of category names (as before)
- Header scroller (for smaller viewports)
- Canvas menu (for smaller viewports)
- expand link
- temporary fix for quote blocks inside of editor
- fixed alerts
- fixed conversations

btw, if there's interest in other colour palettes or a border free version, I can look into that.
 
this new update is both minor and major; it only includes one small fix for the help section nobody goes to, but now the theme comes in different flavours;
  • The vanilla one, which looks like this:
  • The borderless one, which looks like this:

remark: avatars are not accurate to the real thing due to the fact that I'm using a plugin to remove the rounding also I took the screen captures too soon so some avatars didn't render in time, but that shouldn't be an issue for you.

edit: I now consider this theme complete and no longer a work in progress. From now on, the theme will only be updated once a year for maintenance if need be.
 
Last edited:
Back
Top Bottom