chore: cleanup
This commit is contained in:
parent
fa55f40899
commit
1c445a6275
25 changed files with 227 additions and 245 deletions
|
@ -9,7 +9,8 @@
|
|||
|
||||
&:focus svg,
|
||||
&:focus-within svg {
|
||||
outline: var(--outline-default)
|
||||
outline: var(--outline-default);
|
||||
border-radius: var(--border-radius-slight);
|
||||
}
|
||||
}
|
||||
}
|
|
@ -59,6 +59,7 @@
|
|||
.book-focus {
|
||||
& img {
|
||||
border: var(--border-default);
|
||||
border-radius: var(--border-radius-slight);
|
||||
}
|
||||
|
||||
& .book-meta {
|
||||
|
|
|
@ -6,6 +6,7 @@
|
|||
|
||||
& .link-box {
|
||||
border: 1px solid var(--gray-light);
|
||||
border-radius: var(--border-radius-slight);
|
||||
padding: var(--sizing-xs) var(--sizing-sm);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
|
||||
& img {
|
||||
border: var(--border-default);
|
||||
border-radius: var(--border-radius-slight);
|
||||
width: 100%;
|
||||
height: auto;
|
||||
aspect-ratio: var(--aspect-ratio-square);
|
||||
|
|
|
@ -1,29 +1,29 @@
|
|||
a:focus > .watching.hero.shadow::after,
|
||||
a:focus-within > .watching.hero.shadow::after {
|
||||
border: 0;
|
||||
outline: var(--outline-default);
|
||||
}
|
||||
|
||||
a:hover > .watching.hero.shadow::after,
|
||||
a:active > .watching.hero.shadow::after {
|
||||
border-color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
.watching {
|
||||
& a:focus img,
|
||||
& a:focus-within img {
|
||||
border: 0
|
||||
}
|
||||
|
||||
& a:focus .shadow:after,
|
||||
& a:focus-within .shadow:after {
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%
|
||||
}
|
||||
|
||||
& img {
|
||||
border: var(--border-default);
|
||||
border-radius: var(--border-radius-slight);
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
&.hero {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
aspect-ratio: var(--aspect-ratio-banner);
|
||||
|
||||
& img {
|
||||
aspect-ratio: var(--aspect-ratio-banner);
|
||||
border-radius: var(--border-radius-slight);
|
||||
}
|
||||
|
||||
& div.meta-text {
|
||||
|
@ -56,11 +56,16 @@
|
|||
position: absolute;
|
||||
z-index: 1;
|
||||
content: '';
|
||||
bottom: 1px;
|
||||
left: 1px;
|
||||
box-shadow: inset 0 -85px 60px -65px var(--black);
|
||||
width: calc(100% - 2px);
|
||||
height: calc(100% - 1px);
|
||||
top: 0;
|
||||
left: 0;
|
||||
box-shadow: inset 0 -85px 60px -60px var(--black);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: var(--border-default);
|
||||
border-radius: var(--border-radius-slight);
|
||||
transition-property: border-color;
|
||||
transition-timing-function: var(--transition-ease-in-out);
|
||||
transition-duration: 300ms;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -75,6 +80,17 @@
|
|||
aspect-ratio: var(--aspect-ratio-banner);
|
||||
}
|
||||
|
||||
& a:hover .item.shadow::after,
|
||||
& a:active .item-wrapper.shadow::after {
|
||||
border-color: var(--accent-color-hover)
|
||||
}
|
||||
|
||||
& a:focus .item.shadow::after,
|
||||
& a:focus-within .item.shadow::after {
|
||||
border: 0;
|
||||
outline: var(----outline-default);
|
||||
}
|
||||
|
||||
& div {
|
||||
position: relative;
|
||||
|
||||
|
@ -123,10 +139,15 @@
|
|||
z-index: 1;
|
||||
content: '';
|
||||
top: 0;
|
||||
left: 1px;
|
||||
box-shadow: inset 0 -85px 60px -65px var(--black);
|
||||
width: calc(100% - 2px);
|
||||
height: calc(100% - 1px);
|
||||
left: 0;
|
||||
box-shadow: inset 0 -85px 60px -60px var(--black);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: var(--border-default);
|
||||
border-radius: var(--border-radius-slight);
|
||||
transition-property: border-color;
|
||||
transition-timing-function: var(--transition-ease-in-out);
|
||||
transition-duration: 300ms;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Reference in a new issue