Webmobili 5: differenze tra le versioni
Da Webmobili Wiki.
Nessun oggetto della modifica |
Nessun oggetto della modifica |
||
| Riga 2: | Riga 2: | ||
'''Webmobili 5''' è l'attuale implementazione del progetto Webmobili. | '''Webmobili 5''' è l'attuale implementazione del progetto Webmobili. | ||
== CSS - Organizzazione == | |||
Abbiamo fatto largo utilizzo di SCSS in quanto generano un output minificato. | |||
'''File usati''' (in ordine crescente di specificità) | |||
* designbest-custom.scss (è costruito importando tutti gli altri file) | |||
* _designbest-custom.variables.scss (dove vengono definite i valori delle variabili di grandezza, colore, dimensioni più usate nel sito) | |||
* _designbest-custom.mixins.scss (punto unico dei mixin tipo transition, shadow, transform ecc...) | |||
* _designbest-custom.reset.scss (cambia il comportamento base dei tag) | |||
* _designbest-custom.general.scss (classi generiche utilizzate in tutte le pagine) | |||
* _designbest-custom.components.scss (moduli che si ripetono in diverse pagine) | |||
* _designbest-custom.header.scss (specifiche regole per l'header) | |||
* _designbest-custom.footer.scss (specifiche regole per il footer) | |||
Approccio misto, definire gli elementi che si usano di più crearne le classe e in parallelo creare le classi mattoncino per sovrascrivere gli attributi che cambiano in situazioni particolari. | |||
=== CSS generici === | |||
Sono globali, sempre inclusi nel bundle e devono rispettare la nomenclatura che segue: | |||
<syntaxhighlight lang="css"> | |||
.wm-text-size-big1 { | |||
font-size: $font-size-big1; | |||
} | |||
.wm-text-size-medium1 { | |||
font-size: $font-size-medium1; | |||
} | |||
.wm-text-size-medium2 { | |||
font-size: $font-size-medium2; | |||
} | |||
/* ... */ | |||
</syntaxhighlight> | |||
con '''wm-''' come prefisso. | |||
=== CSS specifici === | |||
Gli ''.scss'' specifici per pagina stanno nella cartella ''pages''. Possono essere più "sporchi" perché sono l'ultimo gradino di inclusione (si consiglia sempre e comunque di mantenere ordine ed eleganza). | |||
== Sottoprogetti == | |||
* [[TrovaOccasioni|Outlet (TrovaOccasioni)]] | |||
* [[Webmobili 4/Progetti|Progetti]] | |||
* [[Sitemaps di Webmobili]] | |||
* [[Wishlist]] | |||
* [[Email Deliver Summary]] | |||
Versione delle 15:08, 22 feb 2021
| Webmobili 5 | |
|---|---|
| http://www.designbest.com | |
| Ambiente di test | http://www.dbdemo47.it (altri dettagli) |
| Sistema di versionamento | |
| Tipo | SVN |
| URL del trunk | https://svn.office.webmobili.it/svn/WM4/WM45 |
| URL base dei branch | https://svn.office.webmobili.it/svn/WM4/branches/ |
Webmobili 5 è l'attuale implementazione del progetto Webmobili.
CSS - Organizzazione
Abbiamo fatto largo utilizzo di SCSS in quanto generano un output minificato. File usati (in ordine crescente di specificità)
- designbest-custom.scss (è costruito importando tutti gli altri file)
- _designbest-custom.variables.scss (dove vengono definite i valori delle variabili di grandezza, colore, dimensioni più usate nel sito)
- _designbest-custom.mixins.scss (punto unico dei mixin tipo transition, shadow, transform ecc...)
- _designbest-custom.reset.scss (cambia il comportamento base dei tag)
- _designbest-custom.general.scss (classi generiche utilizzate in tutte le pagine)
- _designbest-custom.components.scss (moduli che si ripetono in diverse pagine)
- _designbest-custom.header.scss (specifiche regole per l'header)
- _designbest-custom.footer.scss (specifiche regole per il footer)
Approccio misto, definire gli elementi che si usano di più crearne le classe e in parallelo creare le classi mattoncino per sovrascrivere gli attributi che cambiano in situazioni particolari.
CSS generici
Sono globali, sempre inclusi nel bundle e devono rispettare la nomenclatura che segue:
.wm-text-size-big1 {
font-size: $font-size-big1;
}
.wm-text-size-medium1 {
font-size: $font-size-medium1;
}
.wm-text-size-medium2 {
font-size: $font-size-medium2;
}
/* ... */
con wm- come prefisso.
CSS specifici
Gli .scss specifici per pagina stanno nella cartella pages. Possono essere più "sporchi" perché sono l'ultimo gradino di inclusione (si consiglia sempre e comunque di mantenere ordine ed eleganza).
