style.css (3757B)
1 /* main body styling */ 2 body,div#search-container form input{background:#1a1a1a;color:#cfcfcf;font-family:sans-serif;margin:0} 3 a{color:#add8e6;text-decoration:none} 4 5 /* nav menu */ 6 nav ul{flex:1 1 auto;list-style:none} 7 nav {display:flex; border-bottom:1px solid gray;height:50px;margin:0;padding:0} 8 nav ul {margin: 0; padding: 0} 9 nav ul li{border-right:1px solid gray} 10 nav ul li a,nav ul li strong{padding:15px;display:block} 11 nav ul li a:hover{background-color:#2a2a2a} 12 nav ul li ul li a,nav>ul>li>a{display:block} 13 nav ul li ul li ul li a{white-space:nowrap} 14 nav ul li ul li ul{top:0;left:100%;display:none} 15 nav ul li ul li,nav>ul>li{position:relative} 16 nav ul li ul li:hover>ul,nav ul li:hover>ul{display:block} 17 nav ul li ul{display:none;position:absolute;top:100%;left:0;z-index:1000;padding:0} 18 nav ul.sub-menu, nav ul.sub-menu li ul {border: 1px solid gray} 19 nav ul.sub-menu li {border-right: none} 20 nav ul.sub-menu li a:first-letter{text-transform:capitalize} 21 nav ul.sub-menu li a{color:#add8e6;background:#1a1a1a; min-width: 110px} 22 nav ul.sub-menu li ul li a{min-width: 170px} 23 nav ul.sub-menu li a:hover{background:#2a2a2a} 24 25 /* search bar */ 26 div#search-container form {border-left:1px solid gray} 27 div#search-container form input{border:1px solid gray;margin: 8px;padding:8px;outline: none; box-sizing: border-box} 28 div#search-container form input:focus{border:1px solid white;background-color:#3a3a3a} 29 30 /* gallery styling */ 31 div.gallery-item a{overflow:hidden;text-overflow:ellipsis} 32 div.gallery-item a svg{filter: invert(100%);} 33 div.gallery-item,div.gallery-item a,nav ul li,nav>ul>li{display:inline-block} 34 div.gallery-item,div.gallery-item a{width:250px;display:inline-block} 35 div.play-button {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 0; height: 0; border-left: 15px solid white; border-top: 10px solid transparent; border-bottom: 10px solid transparent; opacity: 0.8;} 36 div.gallery-video {position: relative; display: inline-block; width: 150px; max-width: 100%;} 37 38 /* descriptions */ 39 div.description-section {margin: 20px 0; padding: 15px;} 40 div#current-description {background: #2a2a2a; padding: 10px; border-radius: 3px; margin-bottom: 10px; white-space: pre-wrap; min-height: 20px;} 41 div#no-description {color: #666; font-style: italic; margin-bottom: 10px; padding: 10px;} 42 textarea#description-textarea {width: 100%; max-width: 600px; padding: 8px; border: 1px solid #ccc; border-radius: 3px; font-family: inherit; resize: vertical;} 43 button.text-button {border:none; background:none; color:#add8e6; cursor:pointer; padding:0; margin-left:2px;cursor: pointer;} 44 button.text-button::before{content:"[ "} 45 button.text-button::after{content:" ]"} 46 div.file-container {display: flex} 47 div.file-sidebar {flex: 0 0 auto; min-width: 15em} 48 span.file-tag-category,div.file-sidebar details ul li a {text-transform:capitalize} 49 50 details > summary {list-style: none; cursor: pointer; } 51 details > summary::before {content: "[+]"; display: inline-block; width: 2ch; margin-right: 0.5ch;} 52 details[open] > summary::before {content: "[-]";} 53 54 /* text viewer */ 55 pre#text-viewer{font-family:serif;font-size:25px;line-height:1.8} 56 #text-viewer-container:fullscreen{margin:0;max-width:75%;margin:auto;height:100vh;padding:1em;background:#000;display:flex;flex-direction:column} 57 #text-viewer-container:fullscreen #text-viewer{flex:1;max-height:none!important;margin:0;height:100%} 58 #text-viewer-container:fullscreen>div{flex-shrink:0} 59 60 /* pagination */ 61 .pagination .disabled,.pagination a{border-radius:4px;padding:.5rem 1rem} 62 .pagination{display:flex;justify-content:center;align-items:center;gap:1rem;margin:2rem 0;padding:1rem} 63 .pagination .disabled{color:#666;cursor:not-allowed} 64 .pagination .page-info{font-weight:700;padding:.5rem 1rem}