From 396c1f3c9499a2bb50b2b5f3760cc58acfe9b87f Mon Sep 17 00:00:00 2001 From: 0neGal Date: Sun, 23 Jan 2022 23:18:45 +0100 Subject: minor aesthetic changes --- src/app/browser.js | 2 +- src/app/main.css | 59 ++++++++++++++++++++++++++++++++---------------------- 2 files changed, 36 insertions(+), 25 deletions(-) (limited to 'src/app') diff --git a/src/app/browser.js b/src/app/browser.js index 8af6afe..eb18fe5 100644 --- a/src/app/browser.js +++ b/src/app/browser.js @@ -61,7 +61,7 @@ function BrowserEl(properties) {
${properties.title}
-
${properties.description} - by ${properties.author}
+
${properties.description} - ${lang("gui.browser.madeby")} ${properties.author}
diff --git a/src/app/main.css b/src/app/main.css index acec007..67174b8 100644 --- a/src/app/main.css +++ b/src/app/main.css @@ -26,12 +26,40 @@ background: var(--red); } +::selection { + color: black; + background: var(--red); +} + +body { + margin: 0; + overflow: hidden; + user-select: none; +} + +body, button, input {font-family: "Roboto", sans-serif} + +button {outline: none} +b, strong {font-weight: 700} +body, input, button {font-weight: 500} + +button { + border: none; + color: white; + outline: none; + cursor: pointer; + font-weight: 700; + padding: 5px 10px; + border-radius: 5px; + transition: 0.2s ease-in-out; +} + .playBtn, .gamesContainer button, #winbtns div { cursor: pointer; } #browser { - --spacing: calc(var(--padding) * 3); + --spacing: var(--padding); z-index: 2; opacity: 0.0; @@ -116,9 +144,14 @@ #browser #search { border: none; outline: none; + transition: filter 0.15s ease-in-out; width: calc(100% - var(--spacing) * 2); } +#browser #search:focus { + filter: brightness(1.5); +} + #browser #close { --height: calc(var(--padding) * 1.5); @@ -182,28 +215,6 @@ #winbtns div:hover {opacity: 1.0} #winbtns div:active {transform: scale(0.98)} -body { - margin: 0; - overflow: hidden; - user-select: none; -} - -body, button, input {font-family: "Roboto", sans-serif} - -button {outline: none} -b, strong {font-weight: 700} -body, input, button {font-weight: 500} - -button { - border: none; - color: white; - outline: none; - font-weight: 700; - padding: 5px 10px; - border-radius: 5px; - transition: 0.2s ease-in-out; -} - button:hover {filter: brightness(110%)} button:active {filter: brightness(90%)} @@ -513,8 +524,8 @@ code { } .modbtns button { - --spacing: calc(var(--padding) / 3); margin-left: var(--spacing); + --spacing: calc(var(--padding) / 3); margin-top: calc(var(--spacing) / 2); margin-bottom: calc(var(--spacing) / 2); } -- cgit v1.2.3