Cikkajánló
Kértétek és elhoztam azt a leírást, amivel ikonokat lehet tenni a G-Portálon majdnem bárhová :) Ennek a leírása itt olvasható el. Ahhoz a leíráshoz kapcsolódik ez a rész is.
Az eddig elkészült rendelések előnézeti képeit feltöltöttem a galériába, ott meg tudjátok nézni. Akiknek még nem jeleztem, hogy kész a design-juk, legyenek türelemmel, mert készülnek azok is.:) Most Sosugary
Újabb teljes kinézetet készítettem G-Portál-ra. A design átalakítható, de minden esetben kötelező a forrás feltüntetése linkelve. Ezzel együtt Emilia Clarke-os .png képek is készültek összesen 22 darab, amiket pedig
Blog téma G-Portálra 2.0 Betűtípus kereső Teszteld oldalad felbontását URL cím értelmezése CSS kód beillesztése G-Portálra
2016. március. 23.
CSS kód a blog modul lapozójához

Volt egy kis időm, így készítettem CSS kódot a blog modul lapozójához. Kicsit átvariáltam superuser CSS kódját. Összevontam pár részt benne, meg megcsináltam, hogy a lapozó pont a blog modul szélétől széléig tartson. Nekem így jobban tetszik :)

 

 

CSS kód
Az elejére, újabbak, régebbiek végére CSS kódokat összevontam, így csak egy helyen kell ezeknek a színeit módosítani. A lapozók közül pedig eltüntettem az elválasztó vonalat, mert így szebb :) Biztos, ami biztos minden érték után tegyetek !important szócskát, mert ha nem, akkor pl. a linkelt szavak nem biztos, hogy felveszik az itt megadott értékeket, hanem a sima linkét fogja használni. Stb…

 

<style type="text/css">
/* lapozó */
.pager { /* a teljes doboz */
background: transparent;
font-size: 0px !important;
text-transform: uppercase;
margin-left: -12px !important; /* ezzel állítod, hogy a blog szélétől kezdődjön a lapozó is */
margin-top: 20px !important; /* ezzel állítod, hogy mennyivel legyen a blog alatt a lapozó */
}
.pager_first, .pager_prev, .pager_next, .pager_last {
background: #3e8986 !important;
color: #ffffff !important;
font-size: 13px !important;
font-style: normal !important;
text-transform: none !important;
border-bottom: 4px solid #c79c6f;
padding: 10px !important; /* háttér és link közötti távolság */
margin-right: 10px !important; /* két lapozó közötti távolság */
}
.pager_first:hover, .pager_prev:hover, .pager_next:hover, .pager_last:hover {
background: #97c3c1 !important; /* a háttér színe, ha ráviszed az egeret a lapozóla */
}
.topofpage { /* oldal tetejére + a háttér kinézete */
background: #c79c6f;
border-bottom: 4px solid #3e8986;
padding: 7px;
margin-right: -12px !important;
margin-top: 0px !important;
}
.topofpage a { /* oldal tetejére link kinézete */
color: #ffffff !important;
font-size: 13px;
font-weight: bold !important;
}
.topofpage:hover { /* ha ráviszed az egeret oldal tetejére kinézete */
background: #97c3c1;
}
--></style>

Kapcsolódó bejegyzések

lindadesign
669 megtekintés

Előző, következő cikk

Új CSS class-ok a Blog modulhoz

Remélem nem baj, ha megemlítem, de pár napja írtam a G-Portál Webmesterének, hogy milyen jó lenne, ha a Blog modul alatt a lapozót is lehetne CSS kóddal átalakítani. Erre a mai napon meg is érkezett a válasz. :) Mivel

.png képek a galériában – 284 darab

Nagyon-nagyon régen nem hoztam érdemi frisst (most sem fogok sajnos), de azért legalább a .png képeket feltöltöttem már a galériába, amiket készítettem egy ideje. Összeszoktam várni őket, hogy több legyen, mire feltöltöm mindet. Most elég sokat vártam velük, így

 

Hozzászólások