Sötét oldaltéma fejlesztése

HUP

A közösségi, sötét oldaltémával kapcsolatos hibajelzések, fejlesztések gyüjtőhelye.

  • 2246 megtekintés

( kroozo v | 2025. 11. 03., h – 09:46 )

Most vettem észre, hogy a Bekezdés és a Forrás gombokon a szövegek hover hatására eltűnek.  Szerintem lemaradt a szín csere a konkrét tartalomról, mert csak ezen a kettőn van ikonon kívül más is. (és az ikonok ezeken is jók)

( kroozo v | 2025. 11. 03., h – 10:09 )

Illetve most volt kettő világos téma megint.

Az egyikben light volt a dark_mode_user (az egy főoldal), a másikban meg system (az meg konkrétan ez a topic, ide gépelem most a kommentet)

egyébként meg nyilván darkra van állítva.

( Nyizsa v | 2025. 11. 03., h – 10:29 )

A topic tetején az első új hozzászólásra mutató nyíl fekete.

Javaslat: kapjon ugyanolyan színt, mint a hozzászólásokban az előző/következő új hozzászólásra mutató nyilak.

Szerk: Most már tetszik, köszi!

Debian - The "What?!" starts not!
http://nyizsa.blogspot.com

( falu v | 2025. 11. 03., h – 12:34 )

Nálam random módon váltogatja a sötét/világos témát az oldalak közötti váltáskor. Lehet, hogy valami cache probléma ez, de nem nálam, mert ha ráfrissítek, akkor is világos marad.

[Falu.Me]==>[-][□][X]

( asch v | 2025. 11. 03., h – 14:23 )

A beküldés gombon nem látszik, hogy meg volt nyomva. Párosítva azzal, hogy lassan reagál egy kicsit zavaró, szerintem világos háttérrel nem így volt.

Hat, en idaig jutottam, igy nez ki: https://imgur.com/a/aEn702O

a ckeditorral nem nagyon tudok mit kezdeni, annyira nem ertek a lovakhoz es/vagy egy...

source (ez kell hozza, vagy beszeld ra az illetekeseket, hogy fejlesszek bele az oldalba :) https://github.com/openstyles/stylus):

#all {
	background: #24262b !important;
	color: white !important;
}
html[data-dmu-mode="dark"] body {
	--dm-background: #111;
	--dm-color: #e0e0e0;
	--dm-dcolor: #303030;
	--dm-hcolor: #FFFFFF;
	--dm-link-hover: #C0C0F0;
	--dm-d0-bg: #202226;
	--dm-d1-bg: #222;
	--dm-d1-bg-hl: #454545;
	--dm-d1-br-hl: #333;
	--dm-d1-br: #454545;
	--dm-d2-bg: #354840;
	--dm-d2-br: #505050;
	--dm-d3-bg: #909090;
	--dm-d3-br: #A0A0A0;
	--dm-hl-active: #C0C0F0;
	--dm-d0-bg-hl: #353535;

	color: var(--dm-color);
}

html[data-dmu-mode="dark"] #block-hup-theme-content article.new {
	background-color: #222 !important;
}

html[data-dmu-mode="dark"] #block-hup-theme-content .comment_info_wrapper {
	background-color: #222 !important;
}

/* footer */
html[data-dmu-mode="dark"] footer[role="contentinfo"] .region-footer {
	background-color: var(--dm-d1-bg);
	border-color: var(--dm-d2-br);
}

/* code block */
html[data-dmu-mode="dark"] .hljs {
	background-color: var(--dm-background);
}

/* cke */
html[data-dmu-mode="dark"] .ck.ck-toolbar {
	background-color: var(--dm-d1-bg) !important;
}

html[data-dmu-mode="dark"] .ck.ck-button:not(.ck-disabled):hover .ck-icon {
	filter: none;
	color: black;
}

html[data-dmu-mode="dark"] .ck-content pre {
  background:#111;
  border:1px solid #c4c4c4;
  border-radius:2px;
  color:white;
  direction:ltr;
  font-style:normal;
  min-width:200px;
  padding:1em;
  tab-size:4;
  text-align:left;
  white-space:pre-wrap
}

( hzsolt94 v | 2025. 11. 04., k – 18:53 )

Bármit is csinálok, nekem most nem működik a dark theme. Kitöröltem a cachet, beléptem privát ablakból, nem segít.

A drupalSettings.dark_mode_user értéke "light", hiába állítom "Rendszer" vagy akár fixen "Sötét" módra a profilomban.

( kroozo v | 2025. 11. 05., sze – 11:09 )

A link beszúrása felugró világos.

( kroozo v | 2025. 11. 05., sze – 11:11 )

Kódblokk editálás közben nem syntax highlightol (ez konzisztens a normálissal), cserébe eléggé szar kontrasztos szürke betűk vannak rajta (ránézésre a betű színe ugyanaz, mint a világoson, a doboz viszont sokkal sötétebb, azért).

( Sulc v | 2025. 11. 05., sze – 14:47 )

Ez az oldal is random sötét lett.

--
Szerk:

Beküldtem a választ, visszaállt világosra.

( kikadff v | 2025. 11. 05., sze – 17:50 )

Először beállítottam dark-ra, de mivel váltogat néha világosra véletlenszerűen és ez elég idegesítő, ezért visszaváltottam világosra. Most meg néha sötétre vált...

( asch v | 2025. 11. 06., cs – 02:34 )

Nem működik a pluszegy! Eltűnttt!!!44!négy

( hrgy84 | 2025. 11. 06., cs – 14:05 )

Két hibát is hoztam:

A főoldal random kivált világos módba. Ez azért izgalmas, mert a generált HTML tag ilyen:

<html lang="hu" dir="ltr" class=" js" data-dmu-mode="light" data-dmu-source="user" data-once="drupal-dialog-deprecation-listener dmu-system-init">

És kérem ez hazugság, nekm az user settings-em dark. A fórumoknál jó is amúgy.

A másik hiba a CKEditort érnti, ha beszúrok egy linket, az sötét témával szerkeztés közben nincs aláhúzva, és semmilyen módon nem különül el a normál szövegtől. 

Blog | @hron84

valahol egy üzemeltetőmaci most mérgesen toppant a lábával 

via @snq-

raadasul sotet temanal ha linket akarsz csinalni egy kijelolesbol az editorban, akkor a link szerkeszto ablak vilagos (feher) szinu. mondjuk ez ilyen huszadrangu dolog, csak erdekesseg inkabb. es igen a szerveszteskor nincs alahuzva a link, az picit zavarobb mert elsore azt hittem nem sikerult beallitani.

我认为技术论坛评论中的签名毫无意义，愿它们全部消失！

( realkry | 2025. 11. 07., p – 09:55 )

Random forum oldalon bedobta a sötét témát, szemem majd' kiesett. User beállításokat nem állítgattam.

( nevergone v | 2025. 11. 09., v – 09:59 )

A sötét mód css-ben történt valami fejlesztés?

A magyar ember jelképe a hátrafelé nyilazás. Vakon rohanunk a semmibe, miközben a múltunkat támadjuk.

( hrgy84 | 2025. 11. 11., k – 17:04 )

@Mcsiv: egy minimál feljesztési igény. Visszatért a +1-es szavazógomb, de sötét témával nagyon beleolvad a kommentbox láblécébe. Lehetne, hogy egy picit világosabb legyen a szövege? Köszi szépen!

Blog | @hron84

valahol egy üzemeltetőmaci most mérgesen toppant a lábával 

via @snq-

Én kérnék még valamit: a témák szerzőjénél van egy nyíl, ami az első új hozzászóláshoz visz (ha van). Azt át tudod dolgozni úgy, ahogy a többi ikonnal tetted? Köszi!

A magyar ember jelképe a hátrafelé nyilazás. Vakon rohanunk a semmibe, miközben a múltunkat támadjuk.

( Mcsiv v | 2025. 11. 12., sze – 19:33 )

Az eddig felmerült dolgok javítva/bővítve/stb. Ha van még valami ötlet/javaslat, akkor azt plz ez alá a hsz. alá, hogy egyszerűbb legyen követnem :)

( Nyosigomboc v | 2025. 11. 16., v – 02:01 )

A friss tartalom/koveto oldalon alul a lapozasnal a szamok nehezen latszanak.

.pager .pager-current, .pager a, .pager a:link, .pager a:visited {
 background-color: #F0F0E4; /* ez nem jo */
...}

A strange game. The only winning move is not to play. How about a nice game of chess?

( nevergone v | 2025. 11. 18., k – 09:00 )

Sziasztok!

Lesz még ebben fejlesztés, vagy történt változás a legutolsó frissítés óta?

A magyar ember jelképe a hátrafelé nyilazás. Vakon rohanunk a semmibe, miközben a múltunkat támadjuk.

    html[data-dmu-mode="dark"] #block-hup-theme-huplogo img {
       width: 0;
       height: 0;
   }
   html[data-dmu-mode="dark"] #block-hup-theme-huplogo a::after {
       content: "HUP.hu";      
   }

ne kérdezd, hogy mi a francért az a-ra kell tenni az aftert, az imagen nem jó.

 

ja, és amit mutattam előbb, oda meg nyilván be lehet tenni másik svgt urlencodeolva, az működik, szóval a logót is ki lehet cserélni :)

Bizonyos tag-ekre, amik a "replaced element" kategóriába tartoznak (mint pl. az img vagy iframe) nem alkalmazható az after. Más esetekben pedig az lehet még a probléma, hogy az after -al a létrejött pseudo element az eredeti elem tulajdonságait örökli, de ezt pl. egy display: inline-block; -al lehet orvosolni ;)

(replaced element az, amikor az elem tartalma külső forrásból jön, vagyis nem az eredeti document része)

En idaig jutottam. Jobb kontraszt, jobban kituno sajat/uj HSZ-ek.

Kepek kicserelese nem'tom mi fan terem, ha egyaltalan lehet olyat Stylusban. Nekem kulon tetszene az alt text, mert hozza a HUP-hoz illo 90's stilust. :D

CK code block editalaskor picit fura igy, mert valahonnan orokli a "sajat user" hatteret, de en sajnos elvesztem a CKeditor "karacsonyfaban" es rahagytam.
 

all {
	background: #24262b !important;
	color: white !important;
}
html[data-dmu-mode="dark"] body {
	--dm-background: #111;
	--dm-color: #e0e0e0;
	--dm-dcolor: #303030;
	--dm-hcolor: #FFFFFF;
	--dm-link-hover: #C0C0F0;
	--dm-d0-bg: #202226;
	--dm-d1-bg: #222;
	--dm-d1-bg-hl: #454545;
	--dm-d1-br-hl: #333;
	--dm-d1-br: #454545;
	--dm-d2-bg: #354840;
	--dm-d2-br: #505050;
	--dm-d3-bg: #909090;
	--dm-d3-br: #A0A0A0;
	--dm-hl-active: #C0C0F0;
	--dm-d0-bg-hl: #353535;

	/*background-color: var(--dm-background);*/
	color: var(--dm-color);

	/*	--ck-color-list-button-hover: black;
	--ck-color-button-default-hover-background: white;*/
}

html[data-dmu-mode="dark"] #block-hup-theme-content article.new {
	background-color: #222 !important;
}

html[data-dmu-mode="dark"] #block-hup-theme-content .comment_info_wrapper {
	background-color: #222 !important;
}

/* forum topics */
html[data-dmu-mode="dark"] .view-tracker table tr {
	background-color: var(--dm-background) !important;
}

/* footer */
html[data-dmu-mode="dark"] footer[role="contentinfo"] .region-footer {
	background-color: var(--dm-d1-bg);
	border-color: var(--dm-d2-br);
}

/* code block */
html[data-dmu-mode="dark"] .hljs {
	background-color: var(--dm-background);
}

/* cke */
html[data-dmu-mode="dark"] .ck {
	--ck-custom-background: var(--dm-d1-bg);
}

/*
html[data-dmu-mode="dark"] .ck.ck-button:not(.ck-disabled):hover .ck-icon {
	background-color: var(--dm-d1-bg) !important;
}
*/
html[data-dmu-mode="dark"] .ck.ck-toolbar {
	background-color: var(--dm-d1-bg) !important;
}


html[data-dmu-mode="dark"] .ck.ck-editor__editable.ck-focused:not(.ck-editor__nested-editable) {
	border-color: var(--dm-d1-br);
}


/* Hide the tracking protection notification banner */
.smartblock-placeholder-wrapper {
	display: none !important;
}

Nyugi, nem is fogok. Most kíváncsiságból megnéztem, de pont az ilyen esetekre mondtam, hogy nem fogom a tartalmat két témához igazítani. A világos a hivatalos, ha azon jó, akkor készen van. Én nem használom a sötétet, szerintem a fekete háttéren fehér szöveg szarabb a szemnek, mint a homokszínűn a fekete. 

trey @ gépház