dbroqua/KNACSS
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

vertical alignment for arrows

Browse source
This commit is contained in:
Raphael Goetter 2017-10-24 16:35:00 +02:00
parent 2a403d0acb
commit 7426519638
3 changed files with 18 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
css/knacss-unminified.css
View file

@ -2277,6 +2277,10 @@ button:focus {
/* ==Arrows */
/* ----------------------------- */
/* see https://knacss.com/styleguide.html#arrows */
[class*="icon-arrow-"] {
vertical-align: middle;
}
[class*="icon-arrow-"]::after {
content: "";
display: inline-block;
@ -2286,7 +2290,6 @@ button:focus {
mask-size: cover;
background-color: #000;
line-height: 1;
vertical-align: baseline;
}
.icon-arrow-down::after {

2
css/knacss.css
View file

File diff suppressed because one or more lines are too long

8
sass/components/_arrows.scss
View file

@ -3,7 +3,10 @@
/* ----------------------------- */
/* see https://knacss.com/styleguide.html#arrows */
[class*="icon-arrow-"]::after {
[class*="icon-arrow-"] {
vertical-align: middle;
&::after {
content: "";
display: inline-block;
width: 1em;
@ -11,8 +14,9 @@
mask-size: cover;
background-color: $arrow-color;
line-height: 1;
vertical-align: baseline;
}
}
.icon-arrow-down::after {
mask-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20standalone%3D%22no%22%3F%3E%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20style%3D%22isolation%3Aisolate%22%20viewBox%3D%220%200%2020%2020%22%20width%3D%2220%22%20height%3D%2220%22%3E%3Cpath%20d%3D%22%20M%209.96%2011.966%20L%203.523%205.589%20C%202.464%204.627%200.495%206.842%201.505%207.771%20L%201.505%207.771%20L%208.494%2014.763%20C%209.138%2015.35%2010.655%2015.369%2011.29%2014.763%20L%2011.29%2014.763%20L%2018.49%207.771%20C%2019.557%206.752%2017.364%204.68%2016.262%205.725%20L%2016.262%205.725%20L%209.96%2011.966%20Z%20%22%20fill%3D%22inherit%22/%3E%3C/svg%3E");
}