improve tiny screen layouts
This commit is contained in:
parent
2b68ee9f70
commit
2dfcf29c43
22
index.css
22
index.css
|
@ -160,6 +160,16 @@ a:active {
|
||||||
background: var(--bright-grey);
|
background: var(--bright-grey);
|
||||||
color: var(--dark-grey);
|
color: var(--dark-grey);
|
||||||
}
|
}
|
||||||
|
@media screen and (max-width: 56em) {
|
||||||
|
.info-wrapper {
|
||||||
|
bottom: 2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (max-height: 36em) {
|
||||||
|
.info-wrapper {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
.info-wrapper a:hover {
|
.info-wrapper a:hover {
|
||||||
color: var(--ink-black);
|
color: var(--ink-black);
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
|
@ -525,15 +535,3 @@ footer .logo:last-child {
|
||||||
float: none;
|
float: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media screen and (max-width: 56em) and (max-height: 36em) {
|
|
||||||
section.select-list a.website {
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
section.select-list .entry {
|
|
||||||
padding: 0 1em;
|
|
||||||
}
|
|
||||||
footer p:first-of-type,
|
|
||||||
footer p:first-of-type + p {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
Loading…
Reference in New Issue