public
Created

Intro to less

  • Download Gist
gistfile1.css
CSS
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53
 
// global colour variables:
@blue = #3CF;
@red = #DF1F45
 
 
#content {
background: #eee;
padding: 25px;
h2 {
color: @blue
border-bottom: 1px solid lighten(@blue, 5%);
&:hover {
color: darken(@blue, 5%);
border-bottom: 1px solid darken(@blue, 10%);
}
}
 
a {
border-bottom: 1px solid #444;
&:hover {
border-bottom: 1px solid @red;
}
}
}
 
 
Instead of:
 
#content {
background: #eee;
padding: 25px;
}
 
#content h2 {
color: #3CF;
border-bottom: 1px solid #1F7E91;
}
 
#content h2:hover {
color: #5CFfee;
border-bottom: 1px solid #4F2E91;
}
 
 
#content a {
border-bottom: 1px solid #444;
}
 
#content a:hover {
border-bottom: 1px solid red;
}

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.