<link rel="stylesheet/less" type="text/css" href="styles.less" />
<script src="less.js" type="text/javascript"></script>
@couleur : #13BEEF;
h1{
color: @couleur;
size: 2em;
}
h2{
color: @couleur;
size: 1.5em;
}
.transition (@transition : color .2s ease-in-out){
-webkit-transition: @transition;
-moz-transition: @transition;
-o-transition: @transition;
-ms-transition: @transition;
transition: @transition;
}
.transition(opacity .25s ease .1s);
#titre{
font-size: 2em;
color: black;
p {
font-size: 1em;
&.colore{
color: blue;
}
}
}
#titre {...}
#titre p {...}
#titre p.colore {...}
a{
font-size: 1.5em;
text-decoration: underline;
&:hover {
color: @couleur;
}
}
@bordure : 1px;
.title {
border-left: @bordure;
border-right: @bordure * 3;
}
@couleur : #13BEEF;
h1{
color: @couleur;
}
h2{
color: (@couleur + #003300);
}
h3{
color: desaturate(@color, 20%);
}
@import('titres');
@import('titres.less');
.button {
background: white;
display: block;
width: 120px;
}
.blue-button {
.button();
background: blue;
}
.button {
background: white;
display: block;
width: 120px;
}
.blue-button {
display: block;
width: 120px;
background: blue;
}
.button {
background: white;
display: block;
width: 120px;
}
.blue-button:extend(.button) {
background: blue;
}
.button, .blue-button {
background: white;
display: block;
width: 120px;
}
.blue-button {
background: blue;
}