Build your src folder

Create a src folder with the following folder structure (this is optional to make use of the gulp tasks included to build LESS files)

General layout

  • .breath
    Breathing (padded from top and bottom)
  • .rbreath
    Right breath (left breath in RTL)
  • .lbreath
    Left breath (right breath in RTL)
  • .r
    float right (left float in RTL)
  • .l
    float left (right float in RTL)
  • .spaced
    bottom spaced
  • .margintop
    Margin top
  • .padtop
    Padding top
  • .txtr
    Right aligned (left alignted in RTL)
  • .txtc
    Center aligned
  • .bthin
    Bottom bordered, thin
  • .bthick
    Bottom bordered, thick
  • .clear
    Clear both
.bthin.spaced
.bthick.spaced
Formatting
  • .boldface: Bold
  • .italicface: italic
  • .large: Large
  • .larger: Larger
  • .small: Small
  • .smaller: Smaller
  • .lightfont: Light face font
  • .red: Red
  • .green: Greed
  • .blue: Blue
  • .light Light text
  • .lighter Even lighter text
label
  • .labeltext: Plain
  • .yellowtext
  • .lightyellowtext
  • .redtext
  • .lightredtext
  • .greentext
  • .lightgreentext
  • .greytext
  • .greydarktext
  • .greynormaltext
  • .whitetext
  • .bluetext
  • .lightbluetext
Boxes by style
  • .yellowbox
  • .lightyellowbox
  • .redbox
  • .lightredbox
  • .whitebox
  • .greenbox
  • .lightgreenbox
  • .greybox
  • .whitedarkbox
  • .greydarkbox
  • .greynormalbox
  • .whitenormalbox
  • .bluebox
  • .lightbluebox
  • h1: Header 1 Subtext (.hsub)

  • h2: Header 2 Subtext (.hsub)

  • h3: Header 3 Subtext (.hsub)

  • h4: Header 4 Subtext (.hsub)

  • h5: Header 5 Subtext (.hsub)
  • h6: Header 6
More boxes by type
  • .infobox
    title Info box
  • .alertbox
    title alertbox
  • .errorbox
    title errorbox

Lists

  • An ".alist"
  • Item
  • Item
  • A border list (.blist)
  • Item
  • Item
  • .rowlist (padded and borded)
  • Item
  • Item
  • Spaced out items
  • .spacedout
  • Item
  • Normal list (.normal)
  • Item
  • Item
  1. Normal ordered list (.normal)
  2. Item
  3. Item
  • Nested list (.nestedlist)
  • Item
    • Another nested list
    • Item
      • Item
      • Item

Tables

Striped and Tabulated (.striped .tabulated)
gcl1gcl2gcl3gcl4*
cl1cellcellcellcell
cl1cellcellcellcell
cl1cellcellcellcell
footerfooterfooterfooterfooter
.cl1 - .cl12 (per col in colgroup, or per td)
cl1cl2cl3cl4cl5*
cl1cellcellcellcellcell
cl1cellcellcellcellcell
cl1cellcellcellcellcell
footerfooterfooterfooterfooterfooter
Spacedout and Bordered (.spacedout .bordered)
gcl1gcl2gcl3gcl4*
cl1cellcellcellcell
cl1cellcellcellcell
cl1cellcellcellcell
footerfooterfooterfooterfooter
gcl1gcl2gcl3gcl4*
cl1cellcellcellcell
cl1cellcellcellcell
cl1cellcellcellcell
footerfooterfooterfooterfooter
Buttons
Text
  1. Required .errlabel
  2. Required .herrlabel
Name
Ayyash
Location
Amman
Name
Ayyash
Location
Amman
Name
Ayyash
Location
Amman

Explanation here

Help with question mark here*

anything goes

Vinepaper
Website
Shut
Framework name
Developer
Ayyash
Location
Amman
  • Label
    Content
  • Label
    Content
    1. Layout
    2. Content here
Header of page

loading...