diff --git a/style.css b/style.css new file mode 100644 index 0000000..b38fbe8 --- /dev/null +++ b/style.css @@ -0,0 +1,93 @@ +* { user-select: none; } + +body { + max-width: 50vw; + height: 99vh; + display: flex; + align-items: center; + justify-content: center; + font-family: var(--font); + text-align: left; + margin: 0 auto; + background-color: var(--background); + font-size: var(--font-size); +} + +#clock { + position: absolute; + top: 3%; + display: flex; + align-items: center; + justify-content: center; + font-size: 140%; + color: var(--clock); +} + +#parent { + margin-left: 30px; + width: 100%; + text-align: left; +} + +.cmd-dir { color: var(--cmd-dir); } + +.cmd-dollar { color: var(--cmd-dollar); } + +.cmd-cmd, .search-title { + color: var(--text); + user-select: text; +} + +#trees { display: grid; } + +#trees li { + list-style: "├"; + color: var(--branch); +} + +#trees li:last-child { + list-style: "└"; +} + +.title { grid-row: 1; } + +.tree { grid-row: 2; } + +.r1 { grid-column: 1; } + +.r2 { grid-column: 2; } + +.r3 { grid-column: 3; } + +.r4 { grid-column: 4; } + +.search-form { + width: 100%; + display: flex; + align-items: center; + justify-content: center; +} + +.search-input { + outline: none; + min-width: 100px; + padding: 5px 1px; + border-radius: 5px; + background: var(--background); + color: var(--text); + font-family: var(--font); + border: 1px solid var(--search-border); + filter: drop-shadow(0 0 15px var(--search-shadow)); +} + +h4 { margin: 8px; } + +a { + font-family: var(--font); + font-size: calc(var(--font-size) + 10%); + text-decoration: none !important; + color: var(--links); + transition: color 200ms; +} + +a:hover { color: var(--links-hover); }