Diskusjon.no CSS - Dark theme/skin - beta - oppdatert 25.12.11

[Occi]

 

Oppdatering:

Temaet er nå lansert (beta!) hos UserStyles.org, installer det vha. Stylish her!

 

Temaet er optimalisert for bruk av Diskusjon eller Diskusjon Dynamisk skinsa som du velger nederst, noe annet kan jeg ikke garantere ser bra ut!

 

For å oppdatere må først themet slettes (trykk på Stylish-logoen, delete og gå til linken og installer på nytt). Dette er pga. det er instillinger, og da fungerer ikke update.

 

--------------

 

Changelog: (påbegynt 04.12.11)

 

04.12.11

- Fikset hover over forumkategoriene på venstrekolonne

- En feil i koden foresaket av søk-knappen mistet ikonet sitt, det skal være fikset nå

- Flere farger lagt til i fargefilteret

- Syntax-feil fikset

- Lagt til et ikon til i 'lest'-bildeendringen (dvs. den grå pila i stedet for et mappeikon)

- Lagt til farge på teksten for multisitat når denne er satt på

 

06.12.11

- Oppdaterte screenshots

 

25.12.11

- Fikset "emnet er låst" og litt annet på thread-controllers

- Endret størrelsen på footer-kontrollers (like bred som resten av siden)

- Fikset border rundt alle kommentarer på profil (tidligere kun .row1, dvs. annenhver kommentar)

- Fjernet bakgrunnen på +/- knappene på forsidens siste innlegg

- Lagt til bedre mellomrom mellom livefeed og "Dette diskuteres nå"

- Ordnet border på livefeed

- Endret style på ['notis], ['warning] og ['moderator]

 

05.01.12

- +/- knappene på 'siste innlegg var omvendt (pluss var minus og omvendt), nå fikset

 

Kjente bug/todos:

 

- Farger i teksteditoren er veldig forskjellig fra nettleser til nettleser og person til person pga. det er brukt iFrame (dårlig kodeløsning fra IP.Board sin side)

- Prøve å lage et større skille mellom fargene til mods og veiledere

- Lage option for å skru av/på nye ikoner og farger

 

 

 

--------------

 

Hei,

 

Jeg har nå sett meg lei på diskusjon.no-temaene, og siden resten av GUIet mitt i OSet jeg bruker er mørkt, så var det irriterende at diskusjon.no som jeg henger på så mye er så lyst. Begynte derfor i går å kode en custom .css til diskusjon.no med fokus på minimalisme, redigerbarhet og selvsagt fargevalg (som i dette tilfellet er mørkt).

 

Har fjernet endel ting fra siden som jeg ser som unødvendig for meg selv, endret noen ikoner og forenklet endel strukturer. Det gjenstår endel arbeid med posting, profiler, innboks, kontrollpanel m.mer. Har også endret ikoner, endret default avatar og litt annet snacks. Er også mye hovering og slikt.

 

Er klar over at det kommer en oppdatering på forumet etterhvert (3.3 er lansert, så det er spørsmål om tid før administrasjonen får tid), men dette er mest for morro.

 

Jeg har ikke brukt noe spesielt mye tid på å rydde i CSSen enda, men det er kommentarer stort sett overalt der det er nødvendig. Det må nevnes at HTML-koden på ganske mange steder her på diskusjon.no er en reneste salat, og det er derfor litt tungvint å lage en CSS for denne siden.

 

Kildekoden kan du hente her. Jeg bruker Stylish for å legge inn custom CSS, og den er laget for Chromium (evt. Chrome), og har ikke sjekket om den er fin i andre nettlesere enda. Det er uansett forløpig bare et utkast, og endel mangler.

 

Så ja, tilbakemeldinger og slikt tas i mot med glede, dog så ser jeg lite poeng i å kritisere CSS-koden enda, da den ikke er kikket igjennom eller er ferdig! (Er dog bare et par feil om du sjekker i jigsaw etter css 3)

 

Nok snakk, her er et par bilder!

 

Mine innlegg

 

 

Eksempeltråd, topp

 

 

Eksempeltråd med kodebit

 

 

 

Eksempeltråd med siteringsblokker

 

Endret 25. desember 2015 av Occi

[Occi]

Ny dag nye muligheter

 

Har da kommet over et problem som kan være ganske vanskelig, om i det hele tatt mulig med CSS. QuickReply (og Reply for den saks skyld) er HTML inni HTML, dvs. at den har en egen style, og det virker ikke som om den arver fra hoved CSSen.

 

Oppsettet er som følger: (for QuickReply)

 

html -> #contentContainer -> #colCenterWrapper -> #colCenterMiddle -> #content -> div -> #fast_reply -> div -> form -> fieldset -> #editor_fast-reply -> #fast-reply_wrap -> #fast-reply_iframe -> #fast-reply_html -> body.withRTL

 

Hvor da #fast-reply_html er IDen til starten på html-tagen. I head-biten er det en egen styleseksjon, så selv om det er slik at den arver fra min CSS, så vil denne uansett ha høyere prioritet, selv med !important tydeligvis (aka. jeg tror ikke det fungerer).

 

Må jeg ty til JavaScript, og i så fall, noen som har en idé til hvordan?

 

Trenger også nye ikoner for 'Siste 24 Timer', 'Ubesvarte tråder' osv. på venstresiden, da de er litt for fargesterke (dog er de fine, tok de fra Hille! )

Endret 1. desember 2011 av Occi

[Kaptein Snus]

Må si at det så veldig neat ut!

 

Merker selv at jeg kunne trengt en liten forandring på Diskusjon.no bare fordi man blir lei av det samme designet dag etter dag, hehe. Bra jobba!

[TheKims]

Skulle ha fått til noe alla dette

 

 

Behagelig for øynene samtidig som det ser kult ut

[Muggkaare]

Kult nok, men merker på meg selv at over lengre perioder trives øynene mine best med mørk font på lys bakgrunn.

[Occi]

Må si at det så veldig neat ut!

 

Merker selv at jeg kunne trengt en liten forandring på Diskusjon.no bare fordi man blir lei av det samme designet dag etter dag, hehe. Bra jobba!

Takker

Det finnes flere themes i footeren (bunnen av siden) som du kan prøve ut. Gamer.no-skin'et ser ganske bra ut synes nå jeg, men det tar litt mye plass særlig i toppen, slik at det er noen modifikasjoner som trengs for at det skal være greit.

Skulle ha fått til noe alla dette

 

 

Behagelig for øynene samtidig som det ser kult ut

Jeg veit det finnes en Theme Creator i alle fall i neste versjon (om mulig også i dagens versjon) av forumet som diskusjon.no bruker, men jeg gidder ikke legge tid i å lage mer enn et theme nå når jeg veit det mest sannsynligvis vil bli ødelagt ved neste update. Men når den kommer skal altså jeg og muligens en annen med stor sannsynlighet lage et mer offisielt theme til diskusjon.no, dette er mer som en hack som trolig fungerer beste akkurat for min nettleserversjon.

 

Kult nok, men merker på meg selv at over lengre perioder trives øynene mine best med mørk font på lys bakgrunn.

Det er det som er standarden og de fleste undersøkelser viser at dette er det beste for øynene om skjermen er riktig stilt inn, men det er gjerne tester hvor de tester helt svart bakgrunn med hvit tekst. Jeg har mørkegrå bakgrunn med lysegrå tekst, så det er endel mindre konstrast. Endel sier at høyere kontrast skaper bedre lesbarhet, men jeg liker i alle fall ikke å se på en hvit bakgrunn hele dagen lang (og jeg har allerede lysstyrken på skjermen min veldig lavt).

 

Her er en lengre diskusjon med ganske mange gode punkter, generelt sett er det sagt at lys bakgrunn med mørk tekst er det beste alternativet, så det strider jo litt mot dette themet Link.

 

Hensikten min er altså å få mindre kontrast som sliter mindre på øyene føler nå jeg i alle fall.

Endret 2. desember 2011 av Occi

[Kaptein Snus]

Vet det finnes fler, men synes ikke de skiller seg så veldig utfira det standard Diskusjon.no Dynamisk

[Occi]

Det er forsåvidt sant, det skin'et som endrer mest er vel kanskje IP-Board eller Gamer.no. Btw, det blir oppdateringer i CSSen etterhvert (se trådtittel for siste oppdatering), så om det er noen her som bruker det så får dere titte innom tråden fra tid til annen.

 

Forløpig er det største hinderet posting, da den "rich text editor" er iframe og html-tag inni siden, og dette gjør at min CSS ikke når denne biten av siden. Jeg veit det kan løses vha. javascript, men vil helst avstå fra dette som sagt. Utenom det så har søk og kontrollpanel blitt gjort ferdig også siden sist.

[Occi]

Da har jeg lagt ut themet på userstyles.org, og du finner det her. Dette betyr at det eneste du trenger å gjøre for å installere det er å legge til Stylish til din nettleser og legge til themet via nettsiden. Merk at det er laget for Chrome/Chromium, og er fortsatt under utvikling, så jeg vet ikke hvor godt det fungerer i forskjellige versjoner eller andre nettlesere. Jeg bruker forøvrig standard-themet (dvs. ikke den dynamiske versjonen).

Endret 2. desember 2011 av Occi

[Occi]

Ny oppdatering:

Themet begynner å nærme seg å kunne kalles ferdig. Det mest åpenbare som ikke er ferdig er dessverre editoren (dvs. der man skriver ting) pga. denne bruker en litt dårlig løsning, og krever trolig JavaScripting.

 

Har lagt til options på UserStyles-siden! Nå kan du velge hva du vil skjule f. eks, og det blir litt mer opp til deg hvordan det skal se ut!

Du kan for eksempel skjule reklamebanneren (om du ikke bruker adblocker), sosiale media-ikonene, avataren din ved brukernavigeringsbiten (dvs. den oppe til venstre) og mye mer.

 

Er veldig interessert i at folk kan teste det for meg, nå har jeg sittet og kodet det her ganske mange timer og har ikke så veldig lyst til å prøve det i alle mulige nettlesere om jeg ikke vet om noen kommer til å bruke det engang. Derfor; om du prøver det og det er noe som ser rart ut; si ifra!

 

Håper i alle fall noen der ute får bruk for det...!

 

Link til UserStyles.org -> Diskusjon.no Dark Theme/Mørkt Tema

[Muffinss]

Meget fett OCCI, prøves ut i chrome atm.

Kommer til å gi tilbakemeldinger om det er noe som ikke stemmer i forhold til plassering osv.

Digg med noe nytt You just deserved some muffin street credz my man!

[Occi]

Takker :---D

Klag i vei, så fikser jeg! Er oppdateringer hele tiden utover dagen etterhvert som jeg finner ting som jeg vil gjøre annerledes. Dessverre går det ikke an å oppdatere themet siden det er med instillinger, og må derfor slettes og legges til på nytt, men themet er uansett ganske komplett nå etterhvert, så kan si i fra når det blir noen større oppdateringer!

Endret 3. desember 2011 av Occi

[TheKims]

på hurtigsvar ser man nesten ikke hva man skriver. Skulle vært mørk bakgrunn der å, eller svart skrift.

[Occi]

Jeg har påpekt at ingen av tekstboksene som har den "rike tekst editoren" har en mørk bakgrunn pga. en dårlig løsning fra InvisionPower sin side (utvikleren av forumet diskusjon.no bruker). Jeg driver og sjekker ut saken, men det vil trolig kreve javascript som vil trenge en annet script i tillegg til themet, noe som er litt uheldig.

 

Hos meg er i alle fall teksten svart, med hvit bakgrunn. Er teksten lysegrå/hvit hos deg så er jeg veldig interessert i å fikse denne buggen i alle fall. Trenger å vite nettleserversjonen du bruker og hvilket skin du bruker her på Diskusjon.no (dvs. det valgt helt nederst).

 

Endret 3. desember 2011 av Occi

[TheKims]

Ja er lysegrått hos meg.

 

 

Jeg bruker siste versjon Firefox og Diskusjon.no skin.

Endret 3. desember 2011 av Kim Spartacus

[Occi]

Ser dette. Uten å gå for teknisk inn i hvorfor så kan det virke som om Firefox behandler iframe-biten (editoren) ulikt hva som er standarden. Du kan godt prøve nå, jeg har endret tekstfargen til en mørk en igjen slik at de av dere som blir påvirket av dette kan se noe. Ser i alle fall greit ut i min Firefox 8.01 for Linux.

[TheKims]

Hmm, er fremdeles grått her

[eXa]

Dynamisk bredde?

[Occi]

Hmm, er fremdeles grått her

Jeg la inn en ny oppdatering hvor jeg mer eller mindre prøvde å sette det meste jeg kunne finne til å være en mørk tekst. Om det ikke fungerer nå så må jeg bare pent ta å prøve å fortsette i morra. Det hadde vært fint om du ga meg hvilken versjon av Firefox du har også.

 

Beklager altså problemene som du har i themet (hos meg er alt fint i både Chrome og Firefox bortsett posting pga. iframe), men det er som beskrevet i tittelen en beta og under utvikling, har skrevet det på bare et par dager så har ikke rukket å teste så mye enda. CSSen er på over 1k linjer så er litt å gå igjennom kan en si...

 

Dynamisk bredde?

Ja, det har nesten ingenting å si. Det er noen steder ting som skal være på linje ikke er det, men utenom det er det helt normalt i dynamisk (dog ikke bruk hardware.no dynamis el.l., da den tar med seg en stygg meny, bruk diskusjon.no dynamisk).

Endret 3. desember 2011 av Occi

[TheKims]

Der fungerer det.

 

Tusen takk for at du har tatt deg tid til å lage et så fantaskisk skin