Forum-Update Sommer 2019

arno¹ · 20. Juni 2019

ah so. das können die jungs ja im nachgang auf der datenbank richten, falls das wichtig ist.

Anzeige

Schau mal hier:
Forum-Update Sommer 2019 .

DAKAY · 20. Juni 2019

Könnt ihr bei "beobachte Themen" noch einen Filter für gelesen/ungelesen einbauen?

MTB-News.de

delphi1507 · 20. Juni 2019

Trail Surfer schrieb:
Ich meine, es wurde vorher von Marcus schon gesagt, dass das LMB beim Update über die Wupper geht.

Das wäre fürs KBU schade...

GG71 · 21. Juni 2019

arno¹ schrieb:
ah so. das können die jungs ja im nachgang auf der datenbank richten, falls das wichtig ist.

Mir ist das Schnulli, habe nur kurz Erklär-Bär gespielt.

luftschaukel · 21. Juni 2019

Na das schaut doch auf den ersten Blick ganz gut aus!

Danke an die Mods für die Arbeit!

PS
Dachte man kann jetzt auch die Smileys vom Smartphone mit benutzen? :confused:

imkreisdreher · 21. Juni 2019

luftschaukel schrieb:
PS
Dachte man kann jetzt auch die Smileys vom Smartphone mit benutzen?

dauert noch...

luftschaukel · 21. Juni 2019

Ok, danke für die Info.
Hatte das so im Podcast mitbekommen.

sp00n82 · 21. Juni 2019

Und Version 2 des Darkmodes mit ein paar Verbesserungen und fehlenden Elementen.

Code:

/**
 * Dark mode
 */
:root {
    --dark-background-main: #333334;
    --dark-background-dark: #2D2D2D;
    --dark-background-darker: #202020;
    --dark-background-light: #515151;
    --dark-background-lighter: #747474;
    --dark-border-color: #757575;
    --dark-border-color-light: #888888;
    --dark-border-color-code: #9b6a21;
    --dark-text-color-main: #eaeaea;
    --dark-text-color-header: #8c8c8c;
    --dark-text-color-code-title: #ffb74b;
    --dark-text-color-dark: #000000;
    --dark-text-color-light: #777777;
    --dark-link-color-default: #82BCE6;
}

/* Main color for the links */
a {
    color: var(--dark-link-color-default);
}

/* The title text of the current post */
.p-title-value {
    color: var(--dark-text-color-code-title);
}


/* The background color of the container surrounding the posts */
.p-body-inner {
    background-color: var(--dark-background-main);
}


/* General block messages */
.block-container {
    color: var(--dark-text-color-main);
    border-color: var(--dark-border-color);
    background-color: var(--dark-background-main);
}

.blockMessage {
    color: var(--dark-text-color-main);
    background-color: var(--dark-background-main);
    border-color: var(--dark-border-color);
}

.block-footer {
    background: linear-gradient(180deg, var(--dark-background-dark), var(--dark-background-main));
    border-color: var(--dark-border-color);
}

.contentRow-fader {
    background: linear-gradient(180deg, var(--dark-background-dark), var(--dark-background-main));
}

.block-row.block-row--clickable:focus,
.block-row.block-row--clickable:hover {
    background-color: var(--dark-background-light);
}

/* This is used e.g. for the search results */
.block-row.block-row--separated,
.block-row.block-row--separated + .block-row {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

/* Notices Overview */
.block-row.block-row--alt {
    color: var(--dark-text-color-main);
}

/* The settings left menu */
.blockLink:hover,
.blockLink.is-selected {
    background-color: var(--dark-background-lighter);
    color: var(--dark-text-color-main);
}


/* Thread block */
.structItem {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

/* Page links on hover */
.structItem:hover .structItem-pageJump a,
.has-touchevents .structItem-pageJump a {
    background: var(--dark-background-lighter);
    color: var(--dark-text-color-main);
}


/* Post container */
.block--messages .message,
.block--messages .block-row {
    color: var(--dark-text-color-main);
    background-color: var(--dark-background-dark);
    border-color: var(--dark-border-color);
}

/* Post user column */
.message-cell.message-cell--user,
.message-cell.message-cell--action {
    background-color: var(--dark-background-darker);
    border-right-color: var(--dark-border-color);
}

/* The arrow pointing to the user column */
.message-userArrow,
.message-userArrow::after {
    border-right-color: var(--dark-border-color);
}


/* Post header */
.message-attribution {
    color: var(--dark-text-color-header);
    border-bottom-color: var(--dark-border-color);
}

/* Code blocks and quotes */
.bbCodeBlock {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
    border-left-color: var(--dark-border-color-code);
}

/* Code block title */
.bbCodeBlock-title {
    color: var(--dark-text-color-code-title);
    background-color: var(--dark-background-light);
}

/* Signature */
.message-signature {
    border-color: var(--dark-border-color);
    color: #8c8c8c;
}

/* Reactions bar (likes, etc) */
.reactionsBar {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

.reactionsBar .reactionSummary > li,
.message-responseRow .reactionSummary > li {
    background: transparent;
    margin-left: 1px;
}


/* Tooltips */
.tooltip--bookmark .tooltip-content,
.tooltip--member .tooltip-content,
.tooltip--share .tooltip-content {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

.memberTooltip-header {
    background-color: var(--dark-background-dark);
    color: var(--dark-text-color-main);
}

.memberTooltip-name a {
    color: var(--dark-text-color-code-title);
}

.tooltip--bookmark .tooltip-content,
.tooltip--member .tooltip-content,
.tooltip--share .tooltip-content {
    color: var(--dark-text-color-main);
}

/* This is the tooltip for likes, etc */
.tooltip--reaction .tooltip-content {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}


/* Special user banner */
.userBanner.userBanner--staff,
.userBanner.userBanner--primary {
    background-color: var(--dark-background-main);
    border-color: var(--dark-border-color-code);
}


/* Quick reply tool bar */
.fr-toolbar {
    background-color: var(--dark-background-light);
    border-color: var(--dark-border-color);
    border-top-color: var(--dark-link-color-default);
}

/* Buttons in the tool bar */
.fr-toolbar .fr-command.fr-btn,
.fr-popup .fr-command.fr-btn {
    color: var(--dark-text-color-dark);
}

/* Disabled buttons */
.fr-toolbar .fr-command.fr-btn.fr-disabled,
.fr-popup .fr-command.fr-btn.fr-disabled {
    color: var(--dark-text-color-light);
}

/* Borders between buttons */
.fr-separator {
    background-color: var(--dark-border-color);
}

.fr-popup {
    background-color: var(--dark-background-main);
}

.fr-popup .fr-input-line input[type="text"],
.fr-popup .fr-input-line textarea {
    background-color: var(--dark-background-lighter);
    border-color: var(--dark-border-color-light);
}

.fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper {
    background-color: var(--dark-background-main);
    color: var(--dark-text-color-main);
}

/* Quick reply text box */
.fr-box.fr-basic .fr-wrapper {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

/* When switching to BBCode */
.message-editorWrapper .fr-box.bbWrapper textarea.input {
    background-color: var(--dark-background-darker);
    color: var(--dark-text-color-main);
}

/* The text color in the answer box */
.fr-box.fr-basic .fr-element {
    color: var(--dark-text-color-main);
}

/* Shortened quote box */
.bbCodeBlock-expandLink {
    background: linear-gradient(to bottom, rgba(50, 50, 50, 0) 0%, var(--dark-background-main) 80%);
}

/* Inline Preview */
.bbCodePreview-content {
    color: var(--dark-text-color-main);
}


/* Paginations */
.pageNav-jump {
    background: var(--dark-background-darker);
    border-color: var(--dark-border-color);
    color: var(--dark-link-color-default);
}

.pageNav-jump:hover,
.pageNav-jump:active {
    background: var(--dark-background-lighter);
    color: var(--dark-text-color-dark);
}

.pageNav-page {
    background: var(--dark-background-darker);
    border-color: var(--dark-border-color) !important; /* Needs to be important or the middle borders display wrong */
    color: var(--dark-link-color-default);
}

.pageNav-page:hover,
.pageNav-page:active {
    background: var(--dark-background-lighter);
    color: var(--dark-text-color-dark);
}

.pageNav-page.pageNav-page--current {
    background: var(--dark-text-color-code-title);
    color: var(--dark-text-color-dark);
}


/* Button links */
.button.button--link,
a.button.button--link {
    background: var(--dark-background-darker);
    border-color: var(--dark-border-color);
    color: var(--dark-link-color-default);    
}

.button.button--link:hover,
.button.button--link:focus,
.button.button--link:active,
a.button.button--link:hover,
a.button.button--link:focus,
a.button.button--link:active {
    background: var(--dark-background-lighter);
    color: var(--dark-text-color-dark);
}


/* Tabs */
.tabs--standalone {
    background: var(--dark-background-dark);
    border-color: var(--dark-border-color);
}

.block-minorTabHeader {
    background: var(--dark-background-dark);
    border-color: var(--dark-border-color);    
}

/* Overlay menus */
.menu-tabHeader {
    background: var(--dark-background-main);
}

.menu-content {
    background-color: var(--dark-background-main);
    color: var(--dark-text-color-main);
}

.menu-header {
    background: var(--dark-background-darker);
    color: var(--dark-text-color-code-title);
    border-bottom-color: var(--dark-border-color);
}

.menu-footer {
    background: var(--dark-background-main);
    border-top-color: var(--dark-border-color);
}

/* New notification entries */
.menu-row.menu-row--highlighted {
    background: var(--dark-background-light);
    color: var(--dark-text-color-main);
}

/* Old notification entries */
.menu-row.menu-row--alt {
    background: var(--dark-background-main);
    color: var(--dark-text-color-main);
}

.menu-row.menu-row--clickable:hover {
    background: var(--dark-background-main);
}

.menu-row.menu-row--separated + .menu-row {
    border-top-color: var(--dark-border-color);
}

/* Settings overlay links */
.menu-linkRow {
    color: var(--dark-text-color-main);
}

.menu-linkRow.is-selected,
.menu-linkRow:hover,
.menu-linkRow:focus {
    color: var(--dark-text-color-main);
}

/* Extra styles for the smiley overlay */
.menu--emoji .menu-header {
    background: var(--dark-background-main);
    border-color: var(--dark-border-color);
}


/* More overlays */
.overlay {
    border-color: var(--dark-border-color);
}

.overlay-title {
    background: linear-gradient(0deg, var(--dark-background-main), var(--dark-background-dark));
}

.overlay-content {
    background-color: var(--dark-background-light);
}

/* Overwrite the general block message style */
.overlay-content .blockMessage {
    background-color: var(--dark-background-light);
}


/* Input fields */
.input {
    background-color: var(--dark-background-lighter);
    border-color: var(--dark-border-color-light);
}

.input:focus,
.input.is-focused {
    background-color: var(--dark-background-lighter);
}

.input::placeholder {
    color: rgba(0, 0, 0, 0.8);
}

.input:focus::placeholder,
.input.is-focused::placeholder {
    color: rgba(0, 0, 0, 0.8);
}

.inputGroup.inputGroup--joined .inputGroup-text {
    background-color: var(--dark-background-light);
    color: var(--dark-link-color-default);
    border-color: var(--dark-border-color-light);
}

.inputGroup.inputGroup--joined .input + .inputGroup-text,
.inputGroup.inputGroup--joined .input + .input,
.inputGroup.inputGroup--joined .inputGroup-text + .input {
    border-left-color: var(--dark-border-color-light);
}


/* Used e.g. for the settings left row */
.formRow > dt {
    background-color: var(--dark-background-darker);
}

/* And the bottom bar */
.formSubmitRow-bar {
    background-color: var(--dark-background-darker);
}


/* User profile */
.memberHeader-main {
    background-color: var(--dark-background-darker);
}

.memberHeader-name {
    color: var(--dark-text-color-code-title);
}

.message-responseRow {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

.memberOverviewBlock-seeMore {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}


/* Private message receipient */
.select2 .select2-selection ul > li.select2-selection__choice {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
    color: var(--dark-text-color-code-title);
}

/* Error message when no recipient is there */
.select2-results__options {
    background-color: var(--dark-background-light);
    border-color: var(--dark-border-color);
    color: var(--dark-text-color-main);
}

sp00n82 · 21. Juni 2019

Und gerade aufgefallen: die Verhaltensregeln und das Impressum unten im Footer verweisen auf emtb-news.de anstatt auf mtb-news.de. Im alten Forum war das noch nicht so, also vermute ich einen Bug hier.

imkreisdreher · 21. Juni 2019

sp00n82 schrieb:

Und Version 2 des Darkmodes mit ein paar Verbesserungen und fehlenden Elementen.

Code:

/**
* Dark mode
*/
:root {
    --dark-background-main: #333334;
    --dark-background-dark: #2D2D2D;
    --dark-background-darker: #202020;
    --dark-background-light: #515151;
    --dark-background-lighter: #747474;
    --dark-border-color: #757575;
    --dark-border-color-light: #888888;
    --dark-border-color-code: #9b6a21;
    --dark-text-color-main: #eaeaea;
    --dark-text-color-header: #8c8c8c;
    --dark-text-color-code-title: #ffb74b;
    --dark-text-color-dark: #000000;
    --dark-text-color-light: #777777;
    --dark-link-color-default: #82BCE6;
}

/* Main color for the links */
a {
    color: var(--dark-link-color-default);
}

/* The title text of the current post */
.p-title-value {
    color: var(--dark-text-color-code-title);
}


/* The background color of the container surrounding the posts */
.p-body-inner {
    background-color: var(--dark-background-main);
}


/* General block messages */
.block-container {
    color: var(--dark-text-color-main);
    border-color: var(--dark-border-color);
    background-color: var(--dark-background-main);
}

.blockMessage {
    color: var(--dark-text-color-main);
    background-color: var(--dark-background-main);
    border-color: var(--dark-border-color);
}

.block-footer {
    background: linear-gradient(180deg, var(--dark-background-dark), var(--dark-background-main));
    border-color: var(--dark-border-color);
}

.contentRow-fader {
    background: linear-gradient(180deg, var(--dark-background-dark), var(--dark-background-main));
}

.block-row.block-row--clickable:focus,
.block-row.block-row--clickable:hover {
    background-color: var(--dark-background-light);
}

/* This is used e.g. for the search results */
.block-row.block-row--separated,
.block-row.block-row--separated + .block-row {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

/* Notices Overview */
.block-row.block-row--alt {
    color: var(--dark-text-color-main);
}

/* The settings left menu */
.blockLink:hover,
.blockLink.is-selected {
    background-color: var(--dark-background-lighter);
    color: var(--dark-text-color-main);
}


/* Thread block */
.structItem {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

/* Page links on hover */
.structItem:hover .structItem-pageJump a,
.has-touchevents .structItem-pageJump a {
    background: var(--dark-background-lighter);
    color: var(--dark-text-color-main);
}


/* Post container */
.block--messages .message,
.block--messages .block-row {
    color: var(--dark-text-color-main);
    background-color: var(--dark-background-dark);
    border-color: var(--dark-border-color);
}

/* Post user column */
.message-cell.message-cell--user,
.message-cell.message-cell--action {
    background-color: var(--dark-background-darker);
    border-right-color: var(--dark-border-color);
}

/* The arrow pointing to the user column */
.message-userArrow,
.message-userArrow::after {
    border-right-color: var(--dark-border-color);
}


/* Post header */
.message-attribution {
    color: var(--dark-text-color-header);
    border-bottom-color: var(--dark-border-color);
}

/* Code blocks and quotes */
.bbCodeBlock {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
    border-left-color: var(--dark-border-color-code);
}

/* Code block title */
.bbCodeBlock-title {
    color: var(--dark-text-color-code-title);
    background-color: var(--dark-background-light);
}

/* Signature */
.message-signature {
    border-color: var(--dark-border-color);
    color: #8c8c8c;
}

/* Reactions bar (likes, etc) */
.reactionsBar {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

.reactionsBar .reactionSummary > li,
.message-responseRow .reactionSummary > li {
    background: transparent;
    margin-left: 1px;
}


/* Tooltips */
.tooltip--bookmark .tooltip-content,
.tooltip--member .tooltip-content,
.tooltip--share .tooltip-content {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

.memberTooltip-header {
    background-color: var(--dark-background-dark);
    color: var(--dark-text-color-main);
}

.memberTooltip-name a {
    color: var(--dark-text-color-code-title);
}

.tooltip--bookmark .tooltip-content,
.tooltip--member .tooltip-content,
.tooltip--share .tooltip-content {
    color: var(--dark-text-color-main);
}

/* This is the tooltip for likes, etc */
.tooltip--reaction .tooltip-content {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}


/* Special user banner */
.userBanner.userBanner--staff,
.userBanner.userBanner--primary {
    background-color: var(--dark-background-main);
    border-color: var(--dark-border-color-code);
}


/* Quick reply tool bar */
.fr-toolbar {
    background-color: var(--dark-background-light);
    border-color: var(--dark-border-color);
    border-top-color: var(--dark-link-color-default);
}

/* Buttons in the tool bar */
.fr-toolbar .fr-command.fr-btn,
.fr-popup .fr-command.fr-btn {
    color: var(--dark-text-color-dark);
}

/* Disabled buttons */
.fr-toolbar .fr-command.fr-btn.fr-disabled,
.fr-popup .fr-command.fr-btn.fr-disabled {
    color: var(--dark-text-color-light);
}

/* Borders between buttons */
.fr-separator {
    background-color: var(--dark-border-color);
}

.fr-popup {
    background-color: var(--dark-background-main);
}

.fr-popup .fr-input-line input[type="text"],
.fr-popup .fr-input-line textarea {
    background-color: var(--dark-background-lighter);
    border-color: var(--dark-border-color-light);
}

.fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper {
    background-color: var(--dark-background-main);
    color: var(--dark-text-color-main);
}

/* Quick reply text box */
.fr-box.fr-basic .fr-wrapper {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

/* When switching to BBCode */
.message-editorWrapper .fr-box.bbWrapper textarea.input {
    background-color: var(--dark-background-darker);
    color: var(--dark-text-color-main);
}

/* The text color in the answer box */
.fr-box.fr-basic .fr-element {
    color: var(--dark-text-color-main);
}

/* Shortened quote box */
.bbCodeBlock-expandLink {
    background: linear-gradient(to bottom, rgba(50, 50, 50, 0) 0%, var(--dark-background-main) 80%);
}

/* Inline Preview */
.bbCodePreview-content {
    color: var(--dark-text-color-main);
}


/* Paginations */
.pageNav-jump {
    background: var(--dark-background-darker);
    border-color: var(--dark-border-color);
    color: var(--dark-link-color-default);
}

.pageNav-jump:hover,
.pageNav-jump:active {
    background: var(--dark-background-lighter);
    color: var(--dark-text-color-dark);
}

.pageNav-page {
    background: var(--dark-background-darker);
    border-color: var(--dark-border-color) !important; /* Needs to be important or the middle borders display wrong */
    color: var(--dark-link-color-default);
}

.pageNav-page:hover,
.pageNav-page:active {
    background: var(--dark-background-lighter);
    color: var(--dark-text-color-dark);
}

.pageNav-page.pageNav-page--current {
    background: var(--dark-text-color-code-title);
    color: var(--dark-text-color-dark);
}


/* Button links */
.button.button--link,
a.button.button--link {
    background: var(--dark-background-darker);
    border-color: var(--dark-border-color);
    color: var(--dark-link-color-default);   
}

.button.button--link:hover,
.button.button--link:focus,
.button.button--link:active,
a.button.button--link:hover,
a.button.button--link:focus,
a.button.button--link:active {
    background: var(--dark-background-lighter);
    color: var(--dark-text-color-dark);
}


/* Tabs */
.tabs--standalone {
    background: var(--dark-background-dark);
    border-color: var(--dark-border-color);
}

.block-minorTabHeader {
    background: var(--dark-background-dark);
    border-color: var(--dark-border-color);   
}

/* Overlay menus */
.menu-tabHeader {
    background: var(--dark-background-main);
}

.menu-content {
    background-color: var(--dark-background-main);
    color: var(--dark-text-color-main);
}

.menu-header {
    background: var(--dark-background-darker);
    color: var(--dark-text-color-code-title);
    border-bottom-color: var(--dark-border-color);
}

.menu-footer {
    background: var(--dark-background-main);
    border-top-color: var(--dark-border-color);
}

/* New notification entries */
.menu-row.menu-row--highlighted {
    background: var(--dark-background-light);
    color: var(--dark-text-color-main);
}

/* Old notification entries */
.menu-row.menu-row--alt {
    background: var(--dark-background-main);
    color: var(--dark-text-color-main);
}

.menu-row.menu-row--clickable:hover {
    background: var(--dark-background-main);
}

.menu-row.menu-row--separated + .menu-row {
    border-top-color: var(--dark-border-color);
}

/* Settings overlay links */
.menu-linkRow {
    color: var(--dark-text-color-main);
}

.menu-linkRow.is-selected,
.menu-linkRow:hover,
.menu-linkRow:focus {
    color: var(--dark-text-color-main);
}

/* Extra styles for the smiley overlay */
.menu--emoji .menu-header {
    background: var(--dark-background-main);
    border-color: var(--dark-border-color);
}


/* More overlays */
.overlay {
    border-color: var(--dark-border-color);
}

.overlay-title {
    background: linear-gradient(0deg, var(--dark-background-main), var(--dark-background-dark));
}

.overlay-content {
    background-color: var(--dark-background-light);
}

/* Overwrite the general block message style */
.overlay-content .blockMessage {
    background-color: var(--dark-background-light);
}


/* Input fields */
.input {
    background-color: var(--dark-background-lighter);
    border-color: var(--dark-border-color-light);
}

.input:focus,
.input.is-focused {
    background-color: var(--dark-background-lighter);
}

.input::placeholder {
    color: rgba(0, 0, 0, 0.8);
}

.input:focus::placeholder,
.input.is-focused::placeholder {
    color: rgba(0, 0, 0, 0.8);
}

.inputGroup.inputGroup--joined .inputGroup-text {
    background-color: var(--dark-background-light);
    color: var(--dark-link-color-default);
    border-color: var(--dark-border-color-light);
}

.inputGroup.inputGroup--joined .input + .inputGroup-text,
.inputGroup.inputGroup--joined .input + .input,
.inputGroup.inputGroup--joined .inputGroup-text + .input {
    border-left-color: var(--dark-border-color-light);
}


/* Used e.g. for the settings left row */
.formRow > dt {
    background-color: var(--dark-background-darker);
}

/* And the bottom bar */
.formSubmitRow-bar {
    background-color: var(--dark-background-darker);
}


/* User profile */
.memberHeader-main {
    background-color: var(--dark-background-darker);
}

.memberHeader-name {
    color: var(--dark-text-color-code-title);
}

.message-responseRow {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

.memberOverviewBlock-seeMore {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}


/* Private message receipient */
.select2 .select2-selection ul > li.select2-selection__choice {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
    color: var(--dark-text-color-code-title);
}

/* Error message when no recipient is there */
.select2-results__options {
    background-color: var(--dark-background-light);
    border-color: var(--dark-border-color);
    color: var(--dark-text-color-main);
}

geil! wie baue ich das ein?

sp00n82 · 21. Juni 2019

imkreisdreher schrieb:
geil! wie baue ich das ein?

Mit dem Stylus Addon für Firefox oder Chrome. Für mobiles geht da nix soweit ich weiß, kein Browser unterstützt sowas dort.

MTB-News.de

Deleted 30320 · 21. Juni 2019

sp00n82 schrieb:
Und gerade aufgefallen: die Verhaltensregeln und das Impressum unten im Footer verweisen auf emtb-news.de anstatt auf mtb-news.de. Im alten Forum war das noch nicht so, also vermute ich einen Bug hier.

siehste ja wo die Reise hingeht :lol:

Deleted 225700 · 21. Juni 2019

Raumfahrer schrieb:
Dort kommt man wie hin?
Per Smartphone ist es etwas schwieriger zu finden....

Auf das Like batschen und halten, am Rechner reicht drüberhoovern :mexican:

Marcus · 21. Juni 2019

soprano schrieb:
Ich komme in die Trainingsverwaltung nicht rein?! Melde mich beim Forum an und es geht trotzdem nicht ?!

Geht jetzt auch wieder.

Gewichte usw. laufen auch bald wieder.

EnDurOFoX · 21. Juni 2019

sp00n82 schrieb:
Und Version 2 des Darkmodes mit ein paar Verbesserungen und fehlenden Elementen.

Danke funktioniert super und kein Augenkrebs mehr

Marcus · 21. Juni 2019

luftschaukel schrieb:
Ok, danke für die Info.
Hatte das so im Podcast mitbekommen.

Vgl. https://www.mtb-news.de/forum/t/forum-update-sommer-2019.891040/post-15964746

vergilbt · 21. Juni 2019

DAKAY schrieb:
Könnt ihr bei "beobachte Themen" noch einen Filter für gelesen/ungelesen einbauen?

Den Unterschied dazwischen erkennt man mit "Fett" für "ungelesen"

MTB-News.de

Jekyll1000 · 21. Juni 2019

rik schrieb:
Geht jetzt auch wieder.

Gewichte usw. laufen auch bald wieder.

roliK · 21. Juni 2019

sp00n82 schrieb:
Ich hab jetzt mal einen Stylesheet für nen Darkmode zusammengezimmert. Aus Gewohnheit mit den Kommentaren in Englisch, ist mir gerade eben selbst erst aufgefallen.
Sollte man einfach so ein Stylus einfügen können (vom Stylish Addon rate ich aus Datenschutzgründen ab, die sammeln wohl alle besuchten Seiten...).

Sorry, stimmt natürlich. Ich verwende aus den gleichen Gründen auch Stylus.

Danke für das Stylesheet!

Marcus · 21. Juni 2019

Kleine Bitte: könntet ihr die Diskussion über das Dark-Mode-CSS in ein separates Thema auslagern? Dieses Thema hier soll eher zum allgemeinen Support dienen.

Danke :love:

Mehrsau · 21. Juni 2019

sp00n82 schrieb:

Ich hab jetzt mal einen Stylesheet für nen Darkmode zusammengezimmert. Aus Gewohnheit mit den Kommentaren in Englisch, ist mir gerade eben selbst erst aufgefallen.

Sollte man einfach so ein Stylus einfügen können (vom Stylish Addon rate ich aus Datenschutzgründen ab, die sammeln wohl alle besuchten Seiten...).

Code:

/**
* Dark mode
*/
:root {
    --dark-background-main: #333334;
    --dark-background-darker: #202020;
    --dark-background-light: #515151;
    --dark-background-lighter: #747474;
    --dark-border-color: #757575;
    --dark-border-color-code: #9b6a21;
    --dark-text-color-main: #dadada;
    --dark-text-color-header: #8c8c8c;
    --dark-text-color-code-title: #ffb74b;
    --dark-text-color-dark: #000000;
    --dark-text-color-light: #777777;
    --dark-link-color-default: #7095b0;
}

/* Main color for the links */
a {
    color: var(--dark-link-color-default);
}

/* The title text of the current post */
.p-title-value {
    color: var(--dark-text-color-code-title);
}


/* The background color of the container surrounding the posts */
.p-body-inner {
    background-color: var(--dark-background-main);
}


/* General block messages */
.block-container {
    color: var(--dark-text-color-main);
}

.blockMessage {
    color: var(--dark-text-color-main);
    background-color: var(--dark-background-main);
    border-color: var(--dark-border-color);
}

.block-footer {
    background: linear-gradient(180deg, var(--dark-background-dark), var(--dark-background-main));
}


.contentRow-fader {
    background: linear-gradient(180deg, var(--dark-background-dark), var(--dark-background-main));
}

.block-row.block-row--clickable:focus,
.block-row.block-row--clickable:hover {
    background-color: var(--dark-background-light);
}


/* Post container */
.block--messages .message,
.block--messages .block-row {
    color: var(--dark-text-color-main);
    background-color: var(--dark-background-main);
    border-color: var(--dark-border-color);
}

/* Post user column */
.message-cell.message-cell--user,
.message-cell.message-cell--action {
    background-color: var(--dark-background-darker);
    border-right-color: var(--dark-border-color);
}

/* The arrow pointing to the user column */
.message-userArrow::after {
    border-right-color: var(--dark-border-color);
}


/* Post header */
.message-attribution {
    color: var(--dark-text-color-header);
    border-bottom-color: var(--dark-border-color);
}

/* Code blocks and quotes */
.bbCodeBlock {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
    border-left-color: var(--dark-border-color-code);
}

/* Code block title */
.bbCodeBlock-title {
    color: var(--dark-text-color-code-title);
    background-color: var(--dark-background-light);
}

/* Signature */
.message-signature {
    border-color: var(--dark-border-color);
    color: #8c8c8c;
}

/* Reactions bar (likes, etc) */
.reactionsBar {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}

.reactionsBar .reactionSummary > li,
.message-responseRow .reactionSummary > li {
    background: transparent;
    margin-left: 1px;
}

.tooltip--reaction .tooltip-content {
    background-color: var(--dark-background-darker);
    border-color: var(--dark-border-color);
}


/* Special user banner */
.userBanner.userBanner--staff,
.userBanner.userBanner--primary {
    background-color: var(--dark-background-main);
    border-color: var(--dark-border-color-code);
}


/* A general block container. Also used for the quick reply */
.block-container {
    background-color: var(--dark-background-main);
}

/* Quick reply tool bar */
.fr-toolbar {
    background-color: var(--dark-background-light);
    border-top-color: var(--dark-link-color-default);
}

/* Buttons in the tool bar */
.fr-toolbar .fr-command.fr-btn,
.fr-popup .fr-command.fr-btn {
    color: var(--dark-text-color-dark);
}

/* Disabled buttons */
.fr-toolbar .fr-command.fr-btn.fr-disabled,
.fr-popup .fr-command.fr-btn.fr-disabled {
    color: var(--dark-text-color-light);
}

/* Quick reply text box */
.fr-box.fr-basic .fr-wrapper {
    background-color: var(--dark-background-darker);
}

/* The text color in the answer box */
.fr-box.fr-basic .fr-element {
    color: var(--dark-text-color-main);
}

/* Shortened quote box */
.bbCodeBlock-expandLink {
    background: linear-gradient(to bottom, rgba(50, 50, 50, 0) 0%, var(--dark-background-main) 80%);
}

/* Inline Preview */
.bbCodePreview-content {
    color: var(--dark-text-color-main);
}


/* Paginations */
.pageNav-jump {
    background: var(--dark-background-darker);
    border-color: var(--dark-border-color);
    color: var(--dark-link-color-default);
}

.pageNav-jump:hover,
.pageNav-jump:active {
    background: var(--dark-background-lighter);
    color: var(--dark-text-color-dark);
}

.pageNav-page {
    background: var(--dark-background-darker);
    border-color: var(--dark-border-color) !important; /* Needs to be important or the middle borders display wrong */
    color: var(--dark-link-color-default);
}

.pageNav-page:hover,
.pageNav-page:active {
    background: var(--dark-background-lighter);
    color: var(--dark-text-color-dark);
}

.pageNav-page.pageNav-page--current {
    background: var(--dark-text-color-code-title);
    color: var(--dark-text-color-dark);
}


/* Button links */
.button.button--link,
a.button.button--link {
    background: var(--dark-background-darker);
    border-color: var(--dark-border-color);
    color: var(--dark-link-color-default);  
}

.button.button--link:hover,
.button.button--link:focus,
.button.button--link:active,
a.button.button--link:hover,
a.button.button--link:focus,
a.button.button--link:active {
    background: var(--dark-background-lighter);
    color: var(--dark-text-color-dark);
}


/* Overlay menus */
.menu-content {
    background-color: var(--dark-background-main);
    color: var(--dark-text-color-main);
}

.menu-header {
    background: var(--dark-background-darker);
    color: var(--dark-text-color-code-title);
    border-bottom-color: var(--dark-border-color);
}

.menu-footer {
    background: var(--dark-background-main);
    border-top-color: var(--dark-border-color);
}

/* New notification entries */
.menu-row.menu-row--highlighted {
    background: var(--dark-background-light);
}

.menu-row.menu-row--clickable:hover {
    background: var(--dark-background-main);
}

/* Old notification entries */
.menu-row.menu-row--alt {
    background: var(--dark-background-main);
}

.menu-row.menu-row--separated + .menu-row {
    border-top-color: var(--dark-border-color);
}

/* Extra styles for the smiley overlay */
.menu--emoji .menu-header {
    background: var(--dark-background-main);
    border-color: var(--dark-border-color);
}


/* More overlays */
.overlay {
    border-color: var(--dark-border-color);
}

.overlay-title {
    background: linear-gradient(0deg, var(--dark-background-main), var(--dark-background-dark));
}

.overlay-content {
    background-color: var(--dark-background-light);
}

/* Overwrite the general block message style */
.overlay-content .blockMessage {
    background-color: var(--dark-background-light);
}


/* Input fields */
.input {
    background-color: var(--dark-background-lighter);
}

.input:focus,
.input.is-focused {
    background-color: var(--dark-background-lighter);
}

PS:
Dieses inline-Preview für eine Antwort macht mich ganz kirre, vor allem wenn da so viele Scrollleisten sind. Das alte Popup oder gleich die komplett neue Seite war da besser.

Es ist wundervoll! :love:

Vielen Dank!

harryhallers · 21. Juni 2019

Danke fürs die Arbeit.

War die Navigation <<vorherige>> 8 von 8 schon immer nur unten bei der mobilen Variante ? Wenn ich zum letzten Beitrag will muss ich immer nach unten scrollen, oder geht das auch anders?

Funktioniert es jetzt das ich bei jeden neuen Beitrag eine Mail bekomme oder nur wenn ich den Beitrag auch aufrufe?

migges · 21. Juni 2019

Guten Morgen rik
Ich kann mich bei E-mtb nicht mehr anmelden,hier klappts wie gewohnt.

code	"no_api_key_in_request"
message	"Die Anforderung enthielt keinen API-Schlüssel."
params	[]

Muss ich was ändern?

Mehrsau · 21. Juni 2019

Auch wenn es ein kleines bisschen offtopic ist: Viele monieren die Werbung und auch ich finde sie mobil furchtbar nervig.

Gibt es die Möglichkeit mtb-news finanziell zu unterstützen? Bestenfalls mit einem Art "Pro-Account" der dann alle Werbung ausblendet und das Layout anpasst?

DAKAY · 21. Juni 2019

vergilbt schrieb:
Den Unterschied dazwischen erkennt man mit "Fett" für "ungelesen"

Is klar, würde die gelesenen aber gerne ausblenden, so wie bisher.

Forum-Update Sommer 2019

Moderator

Anzeige

fuerimmerdeinfeind

noob

noob

noob

Deleted 30320

Guest

Deleted 225700

Guest

Ohne Jekyll & Spaß dabei 😁

You like it, bike it.

Ride on

Migges

fuerimmerdeinfeind

Ähnliche Themen