aboutsummaryrefslogtreecommitdiff
path: root/login-page/src/styles.css
diff options
context:
space:
mode:
Diffstat (limited to 'login-page/src/styles.css')
-rw-r--r--login-page/src/styles.css135
1 files changed, 0 insertions, 135 deletions
diff --git a/login-page/src/styles.css b/login-page/src/styles.css
deleted file mode 100644
index 6640059..0000000
--- a/login-page/src/styles.css
+++ /dev/null
@@ -1,135 +0,0 @@
-/* Global */
-
-:root {
- --focus-color: forestgreen;
-}
-
-html, body {
- height: 100%;
- margin: 0;
-}
-
-body {
- font: 21px sans-serif;
-}
-
-form {
- width: 100%;
-}
-
-/* Styling of simple elements */
-
-#content {
- height: 100%;
- max-width: 20em;
- margin-left: auto;
- margin-right: auto;
-
- display: flex;
- align-items: center;
- justify-content: center;
- flex-direction: column;
-}
-
-#title {
- font-size: 2em;
- font-weight: bold;
-}
-
-#content input {
- border: 0;
- border-bottom: 1px solid grey;
- padding: 0.4em;
- padding-left: 0;
- width: 100%;
- box-sizing: border-box;
- font-size: inherit;
- margin-bottom: 0.5em;
-}
-
-#content #submit-btn {
- border: 2px solid black;
- border-radius: 0.4em;
- box-sizing: border-box;
- width: 100%;
- margin-top: 0.5em;
- font-size: 0.8em;
- padding: 0.3em;
-}
-
-input:focus, button:focus {
- outline: 0;
-}
-
-#content hr {
- width: 100%;
- border: 1px solid black;
- box-sizing: border-box;
-}
-
-/* Where the magic happens */
-
-#submit-btn {
- transition: 0.2s;
- background-color: black;
- color: white;
- text-align: center;
-}
-
-#submit-btn:hover {
- cursor: pointer;
- border-color: var(--focus-color) !important;
- color: var(--focus-color);
- background-color: white;
-}
-
-#submit-btn:active {
- transition: 0s;
- transform: scale(0.9);
-}
-
-.input-selection {
- position: relative;
- margin-top: 0.7em;
-}
-
-.input-selection label {
- transition: 0.2s;
- width: inherit;
- height: inherit;
- position: absolute;
- margin-top: 0.4em;
- scale: 1em;
- color: grey;
- left: 0;
-}
-
-.input-selection input::-webkit-input-placeholder {
- /* Don't show the placeholder when the label is on top */
- opacity: 0;
-}
-
-.input-selection:hover > label,
-.input-selection > input:not(:placeholder-shown) + label,
-.input-selection > input:focus + label {
- /* When hovering, typing or having typed something in an input,
- * make the label smaller, color it and then move it up
- */
- font-size: 0.7em;
- color: var(--focus-color);
- transform: translate(0, -1.2em);
-}
-
-.input-selection:hover > input::-webkit-input-placeholder,
-.input-selection > input:focus::-webkit-input-placeholder {
- opacity: 1;
-}
-
-.input-selection:hover > input,
-.input-selection > input:focus {
- border-color: var(--focus-color) !important;
- caret-color: var(--focus-color);
- border-width: 2px !important;
- margin-top: -1px !important;
-}
-