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

2
css/knacss.css
View file

File diff suppressed because one or more lines are too long

22
sass/components/_arrows.scss
View file

@ -3,16 +3,20 @@
/* ----------------------------- */ /* ----------------------------- */
/* see https://knacss.com/styleguide.html#arrows */ /* see https://knacss.com/styleguide.html#arrows */
[class*="icon-arrow-"]::after { [class*="icon-arrow-"] {
content: ""; vertical-align: middle;
display: inline-block;
width: 1em; &::after {
height: 1em; content: "";
mask-size: cover; display: inline-block;
background-color: $arrow-color; width: 1em;
line-height: 1; height: 1em;
vertical-align: baseline; mask-size: cover;
background-color: $arrow-color;
line-height: 1;
}
} }
.icon-arrow-down::after { .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"); 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");
} }