body { min-width: 100vw; min-height: 100vh; } :root { --mdc-theme-primary: #007bff; --mdc-theme-secondary: #007bff; --dark-backgroud: #343a40; color-scheme: only light; } body { background-color: white; } .nav-menu { z-index: 100; position: fixed; background-color: white; box-sizing: border-box; display: block; left: -64px; transition: all 0.5s ease; height: 100vh; max-width: 64px; } .nav-menu.open { left: 0px; } .main { position: relative; top: 64px; } .settings { margin: 0 18%; padding-top: 40px; transition: 0.6s; } .settings div.text { width: 100%; } .settings label { line-height: 40px; } .settings .mdc-text-field label { line-height: revert; top: 22px; bottom: auto; } .settings #s-cookies .mdc-text-field { min-width: 50%; } .settings #s-port .mdc-text-field { min-width: 100px; } .settings div.text.helper { display: flex; } .settings div.text.helper label { margin-top: 14px; } .settings div.text.helper.outlined label { margin-top: 7px; } .settings div.text.outlined .mdc-text-field label { top: 14px; } .settings div.text.outlined .mdc-text-field.mdc-text-field--focused label { top: 22px; } .settings div.text.outlined.label { margin-top: 6px; } .settings .text-box { margin: 0 10px; } .settings .text-box .text { display: flex; justify-content: space-between; align-items: center; } .settings .text-box .text .mdc-text-field::after { width: 0; } .settings .text-box .text .mdc-text-field::before { width: 0; } .settings .ua { position: relative; } .settings .ua>button { position: absolute; top: 30px; left: -10px; } @media (max-width:767px) {} @media (max-width:1280px) { .settings { margin: 0; } } .task_manager { padding: 16px; display: flex; flex-direction: column; } .task_amounts { display: flex; height: 64px; } .task_amounts>div { flex: auto; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; color: aliceblue; } .task_amounts>div:first-child { border-radius: 8px 0 0 8px; background-color: black; } .task_amounts>div:last-child { border-radius: 0 8px 8px 0 } .btn-success { background-color: #28a745 } .btn-warning { background-color: #ffc107 } .btn-danger { background-color: #dc3545 } .btn-primary { background-color: #007bff } .dark-scheme { background: var(--dark-backgroud); color: white; color-scheme: dark; } .dark-scheme .mdc-top-app-bar { background-color: black; } .dark-scheme .mdc-text-field__input { color: white !important; } .dark-scheme .mdc-select__native-control { color: white !important; } .dark-scheme .mdc-text-field__input { color: white !important; } .dark-scheme .mdc-floating-label { color: white !important; } .dark-scheme .mdc-select-item { background-color: black !important; } .dark-scheme .mdc-list { background-color: #272727; } .dark-scheme .mdc-list-item { color: white; } .dark-scheme .mdc-notched-outline__idle { color: white !important; } .dark-scheme .mdc-dialog__surface { background-color: var(--dark-backgroud); } .mdc-top-app-bar__section--align-end>* { margin: 0 5px; } .task_manager .new_task { position: fixed; right: 50px; bottom: 50px; }