Digital KIT
Elementi e documentazione sul tema AOLClassi CSS utili
Classi CSS applicabili a singole porzioni di HTML o a intere portlet tramite il Look&Feel.
Generali
.nascondi
Nasconde il contenuto web agli utenti non loggati
Aspetto del testo
.f-size-[14/16/18/20/22/24/28/36/48]
- Grandezza del testo in pixel.t[300/400/500/600/700]
- Imposta il Font Weight..ls[1/2/3/4/5]
- Imposta il Letter Spacing in pixel..noheight
- Imposta l'altezza dell'elemento a 0px..nolineheight
- Imposta la Line height dell'elemento a 0px..font-body
- Imposta il tipo di font come quello del body (Open sans).font-primary
- Imposta il tipo di font come quello del body (Open sans)..font-secondary
- Changes the Font Family of the Element equal to the one used for the Secondary Text..fancy-bordered-titles
- Assegna la classe .fancy-title.title-dotted-border ai titoli h* figli dell'elemento
Margini e padding
.allmargin
- Margin of 50px on all sides..topmargin
- Margin of 50px on the top side..bottommargin
- Margin of 50px on the bottom side..leftmargin
- Margin of 50px on the left side..rightmargin
- Margin of 50px on the right side..allmargin-sm
- Margin of 30px on all sides..topmargin-sm
- Margin of 30px on the top side..bottommargin-sm
- Margin of 30px on the bottom side..leftmargin-sm
- Margin of 30px on the left side..rightmargin-sm
- Margin of 30px on the right side..allmargin-lg
- Margin of 80px on all sides..topmargin-lg
- Margin of 80px on the top side..bottommargin-lg
- Margin of 80px on the bottom side..leftmargin-lg
- Margin of 80px on the left side..rightmargin-lg
- Margin of 80px on the right side..nomargin
- No Margin on all sides..notopmargin
- No Margin on the top side..nobottommargin
- No Margin on the bottom side..noleftmargin
- No Margin on the left side..norightmargin
- No Margin on the right side..noborder
- No Border on all sides..notopborder
- No Border on the top side..nobottomborder
- No Border on the bottom side..noleftborder
- No Border on the left side..norightborder
- No Border on the right side..nopadding
- No Padding on all sides..notoppadding
- No Padding on the top side..nobottompadding
- No Padding on the bottom side..noleftpadding
- No Padding on the left side..norightpadding
- No Padding on the right side..col-padding
- Padding of 60px on all sides.
Aspetto 'box model'
.header-stick
- Sticks content with the Header..footer-stick
- Sticks content with the Footer..noradius
- No Border Radius..noshadow
- No Box Shadows..nobg
- No Backgrounds..nobgcolor
- No Background Colors..noabsolute
- Forces Relative Position..hidden
- Hidden Blocks..nothidden
- No Hidden Blocks..inline-block
- Inline Blocks..center
- Center Aligned Text..tright
- Right Aligned Text..divcenter
- Center Aligned DIVs..fleft
- Left Aligned DIVs..fright
- Right Aligned DIVs..color
- Theme Text Color..bgcolor
- Theme Background Color..border-color
- Theme Border Color..bgicon
- Background Icon..bganimate
- Animates Background Vertically..grayscale
- Adds a Grayscale Filter to the Images and Colors on Hover..imagescale
- Adds a Zoom Out Effect on the Image when Hovered.
Standards, validatori, checkers
Validator W3C
https://validator.w3.org/nu/
PageSpeed Insights
https://developers.google.com/speed/pagespeed/insights/?hl=it
Pingdom Website Speed Test
https://tools.pingdom.com/
WHATWG community
https://html.spec.whatwg.org/
Text/Background contrast checker
https://webaim.org/resources/contrastchecker/
Word to HTML cleaner
https://wordhtml.com/
https://html-cleaner.com/
Colori del tema
-
ExampleCodice esadecimaleVariabile SASS
-
#2B79A6$theme-color ($blue-sky)
-
#cc7800$aol-orange
-
#af6700$aol-orange-dark
-
#5F801E$aol-green
-
#c02942$aol-red
-
#0B3C5D$blue-dark
-
#e41b62$fuchsia
-
#efd00b$gold
-
#1D2731$aol-black
-
#555$body-color
-
#444$heading-color