Miten rbot.fi paremman näköiseksi?

[living_death]

Lähdetään taas kehittämään omia tyylitiedostoja juuri julkaistulle vielä beta-vaiheessa olevalle rbot.fi uutiskeräimen sivustolle.

Aloitan omalla parissa tunnissa väännetyllä versiolla.

rbot.fi - Dark Theme | Userstyles.org

Ensimmäinen versio juuri julkaistusta beta-vaiheessa olevasta rbot.fi uutiskeräimen tyylitiedostosta.

Vasemman ja oikean reunan sivupalkit pysyvät paikoillaan vaikka sivua skrollataan ylös tai alas.

Uutisotsikoiden esikatselu piilotettu oletuksena, mutta se tulee esille kun vie hiiren esikatselualueen kohdalle.

Värejä myös optimoitu ja poistettu uutisotsikkokentän mouse hover efekti turhana.

 

[Hessu]

Lähdetään taas kehittämään omia tyylitiedostoja juuri julkaistulle vielä beta-vaiheessa olevalle rbot.fi uutiskeräimen sivustolle.

Aloitan omalla parissa tunnissa väännetyllä versiolla.

rbot.fi - Dark Theme | Userstyles.org

Varsin miellyttävä omasta mielestäni. Saatko mobiiliistakin screen shotin?

 

[living_death]

Varsin miellyttävä omasta mielestäni. Saatko mobiiliistakin screen shotin?

En ole vielä testannut mobiilisti lainkaan kun tosiaan vein vasta hetki sitten tyttären äidillensä ja rakensin heti sen jälkeen parissa tunnissa tämän version

 

[Hessu]

En ole vielä testannut mobiilisti lainkaan kun tosiaan vein vasta hetki sitten tyttären äidillensä ja rakensin heti sen jälkeen parissa tunnissa tämän version

Noh, kunhan saat niin iske aloituspostiin ja päivitä tänne. Hieman epäselkeä tuo nykyinen tumma teema rbotissa.

 

[shepherde]

Nice, käyttöön otin

 

[living_death]

Nice, käyttöön otin

Thanks!

Tein vielä muutoksia linkkien värien, kokojen yms. suhteen ja lisäsin linkkien alkuun ">" väliaikaisen merkin, jonka tulen vaihtamaan kuvaksi myöhemmin.

Valmiit Font Awesome ikonit eivät tuntuneet toimivan rbot sivulla oikein.

Kasvatin myös peukkujen kokoa aavistuksen verran ja laitoin vasemman puoleisen palkin aktiivisen uutisalueen taustavärin vihreäksi.

 

[living_death]

Nyt tyylitiedostossa ei ole enää uutisotsikoiden alla reunusta ja jokaisen uutisotsikon edessä on vihreä nuolen kuva.

Kuvassa punaisella korostamastani kohdasta näkee miltä näyttää kun hiiren osoittimen vie uutisen esikatselukentän päälle, eli oletuksena esikatseluita ei näytetä jotta luettavuus olisi mahdollisimman helppoa (ei liikaan informaatiota kerralla ruudulle).

 

[living_death]

@Hessu kaipasi kuvaruutukopiota ja @copter käyttäjälle muuten vaan tiedoksi.

Nyt tyylitiedoston pitäisi toimia myös mobiilipäätelaitteissa.

Piti käpistellä vähän css-koodia sellaiselta alueelta joka ei ollut ennestään tuttua, että sain samaan aikaan pysymään sivupalkit paikoillaan skrollatessa desktop-versioissa ja kuitenkin hävitettyä ne mobiilipäätelaitteissa

Alla olevassa kuvassa punaisella merkitsemässäni kohdassa olen täpännyt sormella uutisotsikon alta esikatselua saadakseni esille lyhyen koosteen uutisen sisällöstä.

Jos kiinnostaa kokeilla, tyylitiedoston voi ladata täältä: rbot.fi - Dark Theme | Userstyles.org

 

[Riabo]

Kiitoksia @living_death Aivan loistava.

Tämän kun saisi vielä viralliseksi teemaksi, että ei tarteisi lisäosia.


Pieni bugi ainakin vivaldi selaimella. Jos selain on pienenä ikkunana niin sivun ulkoasu rupeaa hajoamaan 1680px kohalla ja siitä isompana. Koko ruudulla ei ole ongelmaa. Edit: Sokea, menee elementit päällekkäin 1680px jälkeen...

 

[living_death]

@Riabo

Kiitos huomiosta ja näin tekee myös Firefox jos avaa ruudun koko ruutuun.

Täytyy yrittää purkata kuntoon.

 

[living_death]

Kiitoksia @living_death Aivan loistava.

Tämän kun saisi vielä viralliseksi teemaksi, että ei tarteisi lisäosia.


Pieni bugi ainakin vivaldi selaimella. Jos selain on pienenä ikkunana niin sivun ulkoasu rupeaa hajoamaan 1680px kohalla ja siitä isompana. Koko ruudulla ei ole ongelmaa. Edit: Sokea, menee elementit päällekkäin 1680px jälkeen...

Tein korjauksia koodissa. Voisitko päivittää tyylitiedoston ja raportoida vieläkö leiska menee rikki?

 

[Riabo]

Tein korjauksia koodissa. Voisitko päivittää tyylitiedoston ja raportoida vieläkö leiska menee rikki?

Toimii.

 

[living_death]

Pientä päivitystä.

rbot.fi - Dark Theme | Userstyles.org

 

[living_death]

Taas päivitystä

Päivitykset (viimeisin 07.06.2017)
- Yleisiä värimäärityksiä
- Vihreät linkit siistimmällä värillä (myös mouse hover)
- Lisätty kellokuvakkeet

Aiemmat päivitykset
- Poistettu uutisotsikkosarakkeiden vasemman reunan vihreä mouse hover pystypalkki (mobiilipäätelaitteissa näkyy vielä)
- Otettu käyttöön rbot.fi vakiokirjasimet

 

[living_death]

Pahoittelut nopeasta nostosta, mutta nyt olisi myös oikea sivupalkki tyyliin sopivissa väreissä ja kellonaikapalkit kapeampia kuin vakiona.

Ideoita ja palautetta?

 

[living_death]

@apek

Uutisotsikon linkin alleviivaus poistui vasta kun lisäsin koodiin !important; loitsun.

div.cell.headline a:hover {
   box-shadow: none !important;
}

 

[apek]

Hyvä että onnistui. Minulla se poistui ilman importanttia.

Käytän Chromiumia ja Stylebot liitännäistä. Varmaan on vähän eroja liitännäisissä.

Versio 64.0.3282.167 (Virallinen koontiversio) Built on Ubuntu , running on Ubuntu 16.04 (64-bittinen)

 

[living_death]

Aika usein joutuu käyttämään !important; loitsua mutta unohdin laittaa sen eilen

Tässä viimeisin tyylitiedosto, joka kyllä tulee muuttumaan vielä radikaalisti ennen virallista versiota.

Uudessa tyylitiedostossa on varmaan tähän mennessä hyödyllisin toiminto sivupalkkien kiinnitys sivua alas tai ylös skrollatessa.

rbot.fi - Dark Theme | Userstyles.org