From 3a3d0fc3d4733f8908e23a03f860d76340479ec4 Mon Sep 17 00:00:00 2001 From: Dennis Kobert Date: Tue, 11 Jun 2019 23:53:30 +0200 Subject: Reorganize Project structure --- .../src/style/partials/front-layer/_base.scss | 23 ---- .../src/style/partials/front-layer/_copyright.scss | 10 -- .../style/partials/front-layer/_notifications.scss | 84 -------------- .../partials/front-layer/_server-listing.scss | 121 --------------------- 4 files changed, 238 deletions(-) delete mode 100644 WebInterface/NodeJSServer/src/style/partials/front-layer/_base.scss delete mode 100644 WebInterface/NodeJSServer/src/style/partials/front-layer/_copyright.scss delete mode 100644 WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss delete mode 100644 WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss (limited to 'WebInterface/NodeJSServer/src/style/partials/front-layer') diff --git a/WebInterface/NodeJSServer/src/style/partials/front-layer/_base.scss b/WebInterface/NodeJSServer/src/style/partials/front-layer/_base.scss deleted file mode 100644 index 6a2aa9a..0000000 --- a/WebInterface/NodeJSServer/src/style/partials/front-layer/_base.scss +++ /dev/null @@ -1,23 +0,0 @@ -.front-layer { - @keyframes start { - from {top: 100vh;} - to {top: 0;} - } - - position: relative; - border: none; - border-radius: 16px 16px 0 0; - min-height: 0; - height: 100%; - - box-sizing: border-box; - background-color: white; - margin-top: 8px; - animation-name: start; - animation-duration: 1s; - animation-timing-function: ease; - color: black; - - display: flex; - flex-direction: column; -} diff --git a/WebInterface/NodeJSServer/src/style/partials/front-layer/_copyright.scss b/WebInterface/NodeJSServer/src/style/partials/front-layer/_copyright.scss deleted file mode 100644 index 31ac614..0000000 --- a/WebInterface/NodeJSServer/src/style/partials/front-layer/_copyright.scss +++ /dev/null @@ -1,10 +0,0 @@ -.front-layer{ - .copyright-container { - box-sizing: border-box; - position: absolute; - width: 100%; - margin: 4px; - bottom: 0; - text-align: center; - } -} diff --git a/WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss b/WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss deleted file mode 100644 index d8e8159..0000000 --- a/WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss +++ /dev/null @@ -1,84 +0,0 @@ -@import '../colors'; - -.front-layer { - .banner { - background-color: white; - border: none; - border-radius: 16px 16px 0 0; - display: flex; - margin: 0; - margin-bottom: 1rem; - padding-top: 1rem; - max-height: 10rem; - flex-direction: row; - flex-wrap: wrap; - transform-origin: top; - transition: max-height 200ms ease, transform 200ms ease, visibility 200ms step-start; - min-height: 3.5rem; - justify-items: center; - justify-content: center; - - @media (max-height: 550px) { - position: absolute; - width: 100%; - box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22); - } - - &.hidden { - transform: scaleY(0); - visibility: hidden; - max-height: 0; - transition: max-height 200ms ease, transform 200ms ease, visibility 200ms step-end; - min-height: 0; - margin-bottom: 0; - } - - .notification-badge { - height: 1rem; - min-width: 1rem; - font-weight: bold; - color: $secondary-text; - font-size: 1rem; - padding: 0.5rem; - margin: 0.5rem 0 0.5rem 1rem; - text-align: center; - line-height: 1rem; - background-color: $secondary; - border: none; - border-radius: 50%; - - &.hidden { - display: none; - } - } - - .banner-text { - align-self: left; - margin: 1rem; - flex-grow: 100; - } - - .btn-container{ - display: flex; - flex-grow: 1; - text-align: right; - - - .banner-button { - color: $secondary-dark; - padding: 8px 16px; - margin: 0; - margin-right: 1rem; - letter-spacing: 0.125rem; - } - } - - hr { - width: 100%; - - @media (max-height: 550px) { - margin-bottom: 0; - } - } - } -} diff --git a/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss b/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss deleted file mode 100644 index 7e67178..0000000 --- a/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss +++ /dev/null @@ -1,121 +0,0 @@ -@import '../colors'; - -.front-layer { - .server-listing { - box-sizing: border-box; - background-color: $primary; - color: $primary-text; - min-height: 0; - display: flex; - flex-direction: column; - border-style: none; - border-radius: 8px; - margin: 1rem; - margin-bottom: 2rem; - padding: 0.5rem; - padding-top: 0.25rem; - box-shadow: 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12), 0 5px 5px -3px rgba(0, 0, 0, .2); - h1 { - text-align: center; - @media (max-height: 550px) { - display: none; - } - } - hr { - width: 100%; - @media (max-height: 550px) { - display: none; - } - } - - @media (max-height: 450px) { - padding-bottom: 0.125rem - } - - .server-entries { - overflow-y: auto; - min-height: 0; - - .server { - font-size: 1.25rem; - display: flex; - flex-direction: row; - - @media (max-width: 1000px) { - flex-wrap: wrap; - } - - align-items: center; - background-color: $primary-light; - padding: 0.5rem; - margin-bottom: 0.25rem; - border-style: none; - border-radius: 8px; - - .server-name { - font-weight: bold; - letter-spacing: 0.125rem; - white-space: nowrap; - overflow: hidden; - margin: 0.5rem 0; - } - - .right-aligned-items { - margin-left: auto; - white-space: nowrap; - display: flex; - align-items: center; - - .player-count-dot { - background-color: $online-green; - border-radius: 50%; - min-width: 1rem; - min-height: 1rem; - width: 1rem; - height: 1rem; - margin-right: 0.25rem; - } - - .player-count { - font-family: 'Roboto Condensed', sans-serif; - } - - .player-count-static { - @media (max-width: 1000px) { - display: none; - } - - white-space: nowrap; - margin-left: 0.25rem; - letter-spacing: 0; - font-family: 'Roboto Condensed', sans-serif; - } - - .join-btn { - margin-left: 0.5rem; - min-width: 12rem; - } - } - } - } - - .button-container { - display: flex; - flex-direction: row-reverse; - margin-top: 1rem; - margin-right: 0.25rem; - min-height: 2.5rem; - - @media (max-height: 450px) { - margin-top: 0.125rem; - min-height: 2rem; - } - - .btn { - @media (max-width: 450px) { - letter-spacing: 0; - } - } - } - } -} -- cgit v1.2.3-54-g00ecf