From 1ebc55c72a1a17293bbf4ad86e0177a10a794750 Mon Sep 17 00:00:00 2001 From: Joris Date: Sun, 17 Sep 2023 12:23:47 +0200 Subject: Make app packageable --- src/view/public/main.css | 235 ----------------------------------------------- 1 file changed, 235 deletions(-) delete mode 100644 src/view/public/main.css (limited to 'src/view/public/main.css') diff --git a/src/view/public/main.css b/src/view/public/main.css deleted file mode 100644 index f361cbe..0000000 --- a/src/view/public/main.css +++ /dev/null @@ -1,235 +0,0 @@ -/* Variables */ - -:root { - --color-focus: #888833; - - --font-size-dog: 1.5rem; - - --spacing-mouse: 0.25rem; - --spacing-cat: 0.5rem; - --spacing-dog: 1rem; - --spacing-horse: 2rem; - - --width-close-button: 3rem; - --width-book: 13rem; -} - -/* Top level */ - -html { - height: 100%; -} - -body { - margin: 0; - display: flex; - height: 100%; - font-family: sans-serif; -} - -dl { - margin: 0; -} - -dd { - margin-left: 0; -} - -p { - margin: 0; -} - -/* Modal */ - -.g-Modal { - width: 100vw; - height: 100vh; - position: fixed; - top: 0; - left: 0; - display: flex; - justify-content: center; - align-items: center; - background-color: rgba(0, 0, 0, 0.5); - z-index: 1; -} - -.g-Modal__Content { - position: relative; - background-color: white; - width: 50%; - border-radius: 0.2rem; - border: 1px solid #EEE; -} - -.g-Modal__Header { - display: flex; - justify-content: space-between; - align-items: center; - padding: var(--spacing-dog) var(--spacing-horse); - border-bottom: 1px solid #EEE; -} - -.g-Modal__Body { - padding: var(--spacing-horse); - max-height: 50vh; - overflow-y: scroll; -} - -.g-Modal__Close { - cursor: pointer; - font-weight: bold; - border-radius: 50%; - border: 1px solid #EEE; - background-color: transparent; - width: var(--width-close-button); - height: var(--width-close-button); - font-size: 1.7rem; - flex-shrink: 0; -} - -.g-Modal__Close:hover, .g-Modal__Close:focus { - background-color: #EEE; -} - -/* Filters */ - -aside { - background-color: #333; - color: white; - width: 200px; - overflow-y: auto; -} - -ul { - margin: 0; - padding: 0; - list-style-type: none; -} - -.g-FilterTitle { - padding: 0.5rem 1rem; - background-color: #555; - border-left: 8px solid transparent; - font-weight: bold; -} - -.g-Filter--Unselected { - border-left: 8px solid #555; -} - -.g-Filter--Selected { - border-left: 8px solid #883333; -} - -.g-Filter button { - border: none; - background-color: transparent; - color: inherit; - cursor: pointer; - padding: 0.5rem 1rem; - width: 100%; - text-align: left; -} - -.g-Filter button:hover { - background-color: var(--color-focus); -} - -/* Books */ - -main { - width: 100%; - padding: 1rem; - overflow-y: auto; -} - -header { - display: flex; - font-size: 120%; - margin-bottom: 1rem; -} - -.g-Search { - margin-right: 1rem; -} - -.g-Books { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(var(--width-book), 1fr)); - grid-gap: 1rem; -} - -.g-Book { - align-self: center; - border: 1px solid #DDDDDD; - padding: 0; - width: fit-content; -} - -.g-Book:hover { - cursor: pointer; - outline: none; -} - -.g-Book:hover .g-Book__Image { - transform: scale(105%); - opacity: 0.9; -} - -.g-Book__Image { - display: flex; - width: var(--width-book); - transition: all 0.2s ease-in-out; -} - -/* Book detail */ - -.g-BookDetail { - display: flex; - align-items: flex-start; -} - -.g-BookDetail img { - width: var(--width-book); - margin-right: var(--spacing-horse); - border: 1px solid #EEE; -} - -.g-BookDetail__Title { - font-size: var(--font-size-dog); - margin-bottom: var(--spacing-mouse); -} - -.g-BookDetail__Subtitle { - font-style: italic; - margin-bottom: var(--spacing-mouse); -} - -.g-BookDetail dl { - display: flex; - flex-direction: column; - gap: var(--spacing-cat); - margin-bottom: var(--spacing-dog); -} - -.g-BookDetail dt { - display: inline; - text-decoration: underline; -} - -.g-BookDetail dd { - display: inline; -} - -.g-BookDetail p { - font-family: serif; - text-align: justify; - line-height: 1.4rem; - font-size: 1.1rem; - text-indent: 1.5rem; -} - -.g-BookDetail p:not(:last-child) { - margin-bottom: var(--spacing-dog); -} -- cgit v1.2.3