mirror of
https://github.com/home-assistant/home-assistant.io.git
synced 2025-06-18 08:06:52 +00:00
67 lines
1.1 KiB
SCSS
67 lines
1.1 KiB
SCSS
@charset "UTF-8";
|
|
@if $use-rules == true{
|
|
|
|
/*------------------------------------*\
|
|
$RULES
|
|
\*------------------------------------*/
|
|
/**
|
|
* Horizontal rules, extend `hr`.
|
|
*
|
|
* Demo: jsfiddle.net/inuitcss/L6GuZ
|
|
*
|
|
*/
|
|
.rule{
|
|
color:$base-ui-color;
|
|
border:none;
|
|
border-bottom-width:1px;
|
|
border-bottom-style:solid;
|
|
margin-bottom:$base-spacing-unit - 1px;
|
|
margin-bottom:(($base-spacing-unit - 1px) / $base-font-size)*1rem;
|
|
}
|
|
|
|
|
|
/**
|
|
* Dotted rules
|
|
*/
|
|
.rule--dotted{
|
|
border-bottom-style:dotted;
|
|
}
|
|
|
|
|
|
/**
|
|
* Dashed rules
|
|
*/
|
|
.rule--dashed{
|
|
border-bottom-style:dashed;
|
|
}
|
|
|
|
|
|
/**
|
|
* Ornamental rules. Places a § over the rule.
|
|
*/
|
|
.rule--ornament{
|
|
position:relative;
|
|
|
|
&:after{
|
|
content:"\00A7";
|
|
position:absolute;
|
|
top: 0;
|
|
right: 0;
|
|
left: 0;
|
|
line-height:0;
|
|
text-align:center;
|
|
}
|
|
|
|
/**
|
|
* Pass in an arbitrary ornament though a data attribute, e.g.:
|
|
*
|
|
<hr class="rule rule--ornament" data-ornament="!">
|
|
*
|
|
*/
|
|
&[data-ornament]:after{
|
|
content:attr(data-ornament);
|
|
}
|
|
}
|
|
|
|
}//endif
|