diff options
Diffstat (limited to 'server/src/routes/ui/style/layout.css')
| -rw-r--r-- | server/src/routes/ui/style/layout.css | 119 | 
1 files changed, 0 insertions, 119 deletions
diff --git a/server/src/routes/ui/style/layout.css b/server/src/routes/ui/style/layout.css index ef03873..8f7afb4 100644 --- a/server/src/routes/ui/style/layout.css +++ b/server/src/routes/ui/style/layout.css @@ -71,7 +71,6 @@ nav a:hover {      background-size: 0 2px, 100% 2px;  } -  nav h1 {      margin: 0px;      font-size: 1.5em; @@ -92,121 +91,3 @@ nav h1 {      font-family: monospace;  } -.page.dir { -    padding: 1em; -    padding-left: 3em; -    padding-right: 3em; -} -.directorylisting { -    list-style: none; -    display: flex; -    flex-wrap: wrap; -} -.directorylisting li { -    display: block; -} - -.card.item { -    width: var(--card-size); -    height: calc(var(--card-size) * var(--banner-aspect)); -    padding: 1em; -} -.card.dir { -    width: calc(var(--card-size) * 2); -    height: calc(var(--card-size) * var(--banner-aspect)); -} - -.card.item .title { -    margin-top: 0.1em; -    text-align: center; -    text-overflow: ellipsis; -} -.card.item .banner { -    display: grid; -} -.card.item .banner a { -    grid-area: 1 / 1; -} -.card.item .banner a img { -    width: 100%; -    height: 100%; -    object-fit: cover; -    object-position: center; -} -.card.item .banner .hover { -    pointer-events: none; -    grid-area: 1 / 1; -    transition: opacity 0.3s, backdrop-filter 0.3s; -    opacity: 0; -    display: flex; -    justify-content: center; -    align-items: center; -} -.card.item .banner:hover .hover { -    opacity: 1; -    background-color: #0004; -    backdrop-filter: blur(3px); -} -.card.item .banner .hover a { -    text-decoration: none; -    font-stretch: 200%; -    width: 1em; -    height: 1em; -    line-height: 1; -    margin: auto; -    padding: 0.4em 0.3em 0.4em 0.5em; -    border-radius: 50%; -    font-size: 2.2em; -    pointer-events: all; -    background-color: #0005; -    transition: background-color 0.2s, font-size 0.2s; -} -.card.item .banner .hover a:hover { -    background-color: #0008; -    font-size: 3em; -} - -.backdrop { -    width: calc(100% + 2 * var(--main-side-margin)); -    height: calc(var(--backdrop-height) + 5em); -    margin-left: calc(-1 * var(--main-side-margin)); -    margin-right: calc(-1 * var(--main-side-margin)); -    margin-top: calc(-1 * var(--bar-height)); -    margin-bottom: -5em; -    mask-image: linear-gradient( -        rgba(0, 0, 0, 1), -        transparent calc(var(--backdrop-height) + 5em) -    ); -    mask-mode: alpha; -    pointer-events: none; -    object-fit: cover; -    object-position: center; -} -.page.item { -    position: relative; -    width: 100%; -} -.page.item .banner { -    width: max(8em, 20%); -    float: left; -    margin: 3em; -    margin-top: -1em; -} -.page.item .banner img { -    width: 100%; -    height: 100%; -    object-fit: cover; -    object-position: center; -} - -.page.item .title h1 { -    display: inline; -    margin-right: 1em; -} -.page.item .title .play { -    display: inline; -    font-stretch: 200%; -} -.page.item .title .play::before { -    content: "▶"; -}  |