Sha256: 306440b403ce262ce0b78c0d198eddd844f2465a73c25e84eddeca584a7fa67f
Contents?: true
Size: 1.5 KB
Versions: 29
Compression:
Stored size: 1.5 KB
Contents
.graph{
width: 100%;
height: 50px;
position: relative;
&__cap{
border-radius: 100%;
height: 100%;
width: 50px;
display: block;
float: left;
position: absolute;
background-color: $stone;
&--right{
@extend .graph__cap;
right: 0;
}
&--filled{
background-color: $brand-blue-light;
}
}
&__middle{
height: 100%;
width: calc(100% - 50px);
background-color: $stone;
display: block;
float: left;
margin-left: 27px;
position: relative;
&--filled{
background-color: $brand-blue-light;
min-width: 20%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 3;
display: table;
}
&--filled-fourth{
@extend .graph__middle--filled;
width: 20%
}
&--filled-half{
@extend .graph__middle--filled;
width: 50%
}
&--filled-full{
@extend .graph__middle--filled;
width: 100%
}
}
&__middle-text{
color: $slate;
position: absolute;
left: 20%;
width: 80%;
text-align: center;
z-index: 5;
@include vertical-center;
&--half{
@extend .graph__middle-text;
width: 47%;
left: 53%;
}
&--full{
@extend .graph__middle-text;
color: $white;
width: 100%;
text-align: center;
left: 0;
}
}
&-label{
text-align: center;
color: $slate;
margin-top: $base-margin;
p{
@extend .small-text;
line-height: 0.8rem;
}
}
}
Version data entries
29 entries across 29 versions & 1 rubygems