lbry.tech/.vuepress/scss/partials/_footer.scss
ポール ウェッブ b315b14226 iPhone X support
2018-05-11 09:07:16 -05:00

64 lines
1.2 KiB
SCSS

.footer {
background-color: $black;
color: rgba($white, 0.15);
font-size: 1rem;
padding-right: env(safe-area-inset-right);
padding-left: env(safe-area-inset-left);
> div:first-of-type {
@media (max-width: 900px) {
overflow: auto;
overflow-scrolling: touch;
white-space: nowrap;
width: 100%;
}
}
ul {
list-style-type: none;
padding-top: 2rem;
padding-bottom: 2rem;
@media (min-width: 901px) {
align-items: stretch;
display: flex;
flex-flow: row wrap;
}
li {
padding-right: 0.5rem;
padding-left: 0.5rem;
vertical-align: bottom;
@media (max-width: 900px) {
display: inline-block;
transform: translate3d(0, 0, 0);
transition: opacity 0.2s 0.2s ease, transform 0.4s 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
&:last-of-type {
margin-right: 3rem;
}
}
&:first-of-type {
flex: 1;
}
&:last-of-type {
cursor: default;
}
}
}
a {
transition: color 0.2s;
&:not(:hover) {
color: $white;
}
&:hover {
color: mix($black, $teal, 15%);
}
}
}