add extra link support to index page
This commit is contained in:
parent
980d790874
commit
5a1181ec76
3 changed files with 63 additions and 30 deletions
|
@ -4,10 +4,12 @@ body {
|
|||
width: 40em;
|
||||
}
|
||||
|
||||
.gallery-list {
|
||||
.gallery-list, .link-list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 50%);
|
||||
align-items: center;
|
||||
--gap: 0.05em;
|
||||
grid-gap: var(--gap);
|
||||
background: var(--text);
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
@ -16,41 +18,50 @@ body {
|
|||
font-weight: 600;
|
||||
}
|
||||
|
||||
.gallery-list a {
|
||||
.gallery-list {
|
||||
grid-template-columns: repeat(2, 50%);
|
||||
}
|
||||
|
||||
.link-list {
|
||||
grid-template-columns: 100%;
|
||||
}
|
||||
|
||||
.gallery-list + .link-list {
|
||||
padding-top: var(--gap);
|
||||
}
|
||||
|
||||
main a {
|
||||
display: block;
|
||||
font-weight: inherit;
|
||||
color: var(--text);
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
.gallery-list a:hover {
|
||||
main a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.gallery-list li {
|
||||
main li {
|
||||
list-style: none;
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.gallery-list li {
|
||||
background: var(--green);
|
||||
}
|
||||
|
||||
.gallery-list li:nth-child(2n) {
|
||||
border-left: 2px solid hsla(0, 0%, 100%, 30%);
|
||||
}
|
||||
|
||||
.gallery-list li:nth-child(2n+1) {
|
||||
border-right: 2px solid hsla(0, 0%, 100%, 30%);
|
||||
}
|
||||
|
||||
|
||||
.gallery-list .nsfw {
|
||||
li.nsfw {
|
||||
background: var(--red);
|
||||
}
|
||||
|
||||
.link-list li {
|
||||
background: var(--yellow);
|
||||
}
|
||||
|
||||
.nsfw a::after {
|
||||
content: url(18_plus.svg);
|
||||
display: inline-block;
|
||||
|
@ -78,14 +89,14 @@ footer {
|
|||
}
|
||||
|
||||
@media (hover) and (prefers-reduced-motion: no-preference) {
|
||||
.gallery-list a:hover {
|
||||
main a:hover {
|
||||
transform: scale(110%);
|
||||
transition: transform 0.25s ease-in-out;
|
||||
}
|
||||
}
|
||||
|
||||
@media (pointer: coarse) {
|
||||
.gallery-list {
|
||||
main {
|
||||
font-size: 300%;
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue