Sha256: 0bc84f34229b8fa81dbe58fef28ef9fbed3184cb69a14135831055ca6cf1a0bc
Contents?: true
Size: 1.99 KB
Versions: 5
Compression:
Stored size: 1.99 KB
Contents
@import "blogelator/bourbon";
@import "blogelator/variables";
.save-button {
overflow: hidden;
position: relative;
.button-label {
display: block;
opacity: 1;
@include transform(scale(1));
@include transition-duration(0.3s);
@include transition-property(all);
}
.confirm {
bottom: 0;
display: block;
font-size: 20px;
left: 100%;
position: absolute;
text-align: center;
top: 0;
width: 100%;
z-index: 10;
@include transition-duration(0.3s);
@include transition-property(all);
.no,
.yes {
bottom: 0;
padding: 3px 0;
position: absolute;
top: 0;
width: 50%;
}
.no {
background-color: adjust-hue($base-accent-color, 210deg);
color: $base-body-color;
right: 0;
}
.yes {
background-color: $base-accent-color;
color: $base-body-color;
left: 0;
}
}
&.confirm {
.confirm {
left: 0;
}
}
.error,
.saved,
.saving {
background-color: $base-body-color;
color: $base-accent-color;
bottom: 0;
display: block;
font-size: 20px;
left: 0;
opacity: 0;
padding: 4px 0;
position: absolute;
right: 0;
text-align: center;
top: 0;
@include transform(scale(2));
@include transition-duration(0.3s);
@include transition-property(all);
}
.saving {
background-color: $base-accent-color;
color: $base-body-color;
font-size: 16px;
padding: 6px 0;
}
&.error,
&.saved,
&.saving {
.button-label {
opacity: 0;
@include transform(scale(0));
}
}
&.error {
.error {
opacity: 1;
@include transform(scale(1));
}
.saving {
opacity: 0;
@include transform(scale(0));
}
}
&.saved {
.saved {
opacity: 1;
@include transform(scale(1));
}
.saving {
opacity: 0;
@include transform(scale(0));
}
}
&.saving {
.saving {
opacity: 1;
@include transform(scale(1));
}
}
}
Version data entries
5 entries across 5 versions & 1 rubygems