Draw grippie with CSS.
This commit is contained in:
parent
927bf19d93
commit
66f14ab0b8
Binary file not shown.
Before Width: | Height: | Size: 90 B |
|
@ -69,14 +69,25 @@ body {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
$grippie-border-color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 50%));
|
||||||
|
|
||||||
.grippie {
|
.grippie {
|
||||||
width: 100%;
|
position: relative;
|
||||||
cursor: row-resize;
|
cursor: row-resize;
|
||||||
height: 11px;
|
margin: auto;
|
||||||
overflow: hidden;
|
height: 4.5px;
|
||||||
display:block;
|
width: 27px;
|
||||||
border-top: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
|
border-top: 1px solid $grippie-border-color;
|
||||||
background: image-url("grippie.png") dark-light-diff($primary, $secondary, 90%, -60%) no-repeat center 3px;
|
border-bottom: 1px solid $grippie-border-color;
|
||||||
|
top: 4px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grippie:before {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
border-top: 1px solid $grippie-border-color;
|
||||||
|
margin-top: 0.5px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue