style: Add gruvbox stylesheet

2022-01-29 17:02:35 +01:00 · 2022-01-29 17:02:35 +01:00 · faabc577b0
commit faabc577b0
parent dd3843720b
1 changed files with 124 additions and 0 deletions
--- a/css/main-gruvbox.css
+++ b/css/main-gruvbox.css
@ -0,0 +1,124 @@
+body {
+    background-color: #252525;
+}
+
+body > .container:first-child {
+    margin: 3rem auto 0;
+}
+
+h1 {
+    color: #9dd08e;
+}
+
+a {
+    text-decoration: none;
+    color: #549699;
+}
+
+a.file-name {
+    color: #ecdbb2;
+}
+
+
+.list-sort {
+    background: #413e3d;
+    border-radius: 1rem;
+    padding: 1.5rem 2rem .5rem;
+    color: #ecdbb2;
+}
+
+input[name="sort"] {
+    accent-color: #fe6142;
+}
+
+.list-sort label {
+    display: inline-block;
+    margin: 0 1rem 0 0;
+}
+
+.file-list {
+    list-style: none;
+}
+
+.file-list li {
+    margin: 1rem 0;
+}
+
+.file-list .file-name {
+    line-height: 4rem;
+    display: inline-block;
+    position: relative;
+    padding-left: 4rem;
+}
+
+.file-list .file-name::before {
+    background: no-repeat center center;
+    background-size: contain;
+    width: 3rem;
+    content: "";
+    display: block;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+}
+
+.file-list .directory .file-name::before {
+    background-image: url(../image/directory.png);
+
+}
+
+.file-list .file .file-name::before {
+    background-image: url(../image/file.png);
+}
+
+.file-list .other .file-name::before {
+    background-image: url(../image/other.png);
+}
+
+.file-list .parent .file-name::before {
+    background-image: url(../image/parent.png);
+}
+
+.file-list .file-link {
+
+}
+
+.file-list .file-date {
+    padding: .25rem .5rem;
+    background: #549699;
+    border-radius: .5rem;
+    font-size: 70%;
+    margin: 0 .5rem;
+    color: #ecdbb2;
+}
+
+.file-list .directory .file-date {
+}
+
+.file-list .parent .file-date {
+    display: none;
+}
+
+.file-list .file-size {
+    padding: .25rem .5rem;
+    background: #79aa7d;
+    border-radius: .5rem;
+    font-size: 70%;
+    margin: 0 .5rem;
+    color: #ecdbb2;
+}
+
+.file-list .other .file-size,
+.file-list .parent .file-size,
+.file-list .directory .file-size {
+    display: none;
+}
+
+footer {
+    text-align: center;
+}
+
+footer small + small {
+    margin-left: 2rem;
+}