diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-05-17 19:05:49 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-05-17 19:05:49 +0300 |
commit | 43a25d93ebdabea52f99b05e15b06250cd8f07d7 (patch) | |
tree | dceebdc68925362117480a5d672bcff122fb625b /app/assets/stylesheets/startup/startup-general.scss | |
parent | 20c84b99005abd1c82101dfeff264ac50d2df211 (diff) |
Add latest changes from gitlab-org/gitlab@16-0-stable-eev16.0.0-rc42
Diffstat (limited to 'app/assets/stylesheets/startup/startup-general.scss')
-rw-r--r-- | app/assets/stylesheets/startup/startup-general.scss | 147 |
1 files changed, 90 insertions, 57 deletions
diff --git a/app/assets/stylesheets/startup/startup-general.scss b/app/assets/stylesheets/startup/startup-general.scss index adafe719892..c5a5d1aa289 100644 --- a/app/assets/stylesheets/startup/startup-general.scss +++ b/app/assets/stylesheets/startup/startup-general.scss @@ -119,7 +119,7 @@ kbd kbd { .form-control { display: block; width: 100%; - height: 34px; + height: 32px; padding: 0.375rem 0.75rem; font-size: 0.875rem; font-weight: 400; @@ -132,10 +132,6 @@ kbd kbd { } @media (prefers-reduced-motion: reduce) { } -.form-control:-moz-focusring { - color: transparent; - text-shadow: 0 0 0 #333238; -} .form-control::placeholder { color: #626168; opacity: 1; @@ -144,18 +140,6 @@ kbd kbd { background-color: #fbfafd; opacity: 1; } -.form-inline { - display: flex; - flex-flow: row wrap; - align-items: center; -} -@media (min-width: 576px) { - .form-inline .form-control { - display: inline-block; - width: auto; - vertical-align: middle; - } -} .btn { display: inline-block; font-weight: 400; @@ -352,6 +336,7 @@ kbd kbd { border: 0; } .gl-avatar { + display: inline-flex; border-width: 1px; border-style: solid; border-color: rgba(31, 30, 36, 0.08); @@ -566,17 +551,13 @@ strong { svg { vertical-align: baseline; } -.form-control, -.search form { +.form-control { font-size: 0.875rem; } .hidden { display: none !important; visibility: hidden !important; } -.hide { - display: none; -} .badge:not(.gl-badge) { padding: 4px 5px; font-size: 12px; @@ -597,6 +578,14 @@ svg { html { overflow-y: scroll; } +.layout-page { + padding-top: calc( + var(--header-height, 48px) + + calc(var(--system-header-height) + var(--performance-bar-height)) + + var(--top-bar-height) + ); + padding-bottom: var(--system-footer-height); +} @media (min-width: 576px) { .logged-out-marketing-header { --header-height: 72px; @@ -636,39 +625,40 @@ html { color: #535158; vertical-align: baseline; } -.gl-font-sm { - font-size: 12px; +:root { + --performance-bar-height: 0px; + --system-header-height: 0px; + --top-bar-height: 0px; + --system-footer-height: 0px; + --mr-review-bar-height: 0px; } -.dropdown { - position: relative; -} -.dropdown-menu-toggle:active { - box-shadow: 0 0 0 1px #fff, 0 0 0 3px #428fdc; - outline: none; +.with-top-bar { + --top-bar-height: 48px; } -.search-input-container .dropdown-menu { - margin-top: 11px; +@media (min-width: 768px) { + .page-with-contextual-sidebar { + --application-bar-left: 56px; + } } -.dropdown-menu-toggle { - padding: 6px 8px 6px 10px; - background-color: #fff; - color: #333238; - font-size: 14px; - text-align: left; - border: 1px solid #dcdcde; - border-radius: 0.25rem; - white-space: nowrap; +@media (min-width: 1200px) { + .page-with-contextual-sidebar { + --application-bar-left: 256px; + } + .page-with-icon-sidebar { + --application-bar-left: 56px; + } + .page-with-super-sidebar { + --application-bar-left: 256px; + } + .page-with-super-sidebar-collapsed { + --application-bar-left: 0px; + } } -.dropdown-menu-toggle.no-outline { - outline: 0; +.gl-font-sm { + font-size: 12px; } -.dropdown-menu-toggle.dropdown-menu-toggle { - justify-content: flex-start; - overflow: hidden; - padding-right: 25px; +.dropdown { position: relative; - text-overflow: ellipsis; - width: 160px; } .dropdown-menu { display: none; @@ -751,11 +741,6 @@ html { min-width: 100%; } } -@media (max-width: 767.98px) { - .dropdown-menu-toggle.dropdown-menu-toggle { - width: 100%; - } -} input { border-radius: 0.25rem; color: #333238; @@ -794,7 +779,7 @@ kbd { min-height: var(--header-height, 48px); border: 0; position: fixed; - top: 0; + top: calc(var(--system-header-height) + var(--performance-bar-height)); left: 0; right: 0; border-radius: 0; @@ -1076,11 +1061,15 @@ kbd { } .nav-sidebar { position: fixed; - bottom: 0; + bottom: var(--system-footer-height); left: 0; z-index: 600; width: 256px; - top: var(--header-height, 48px); + top: calc( + var(--header-height, 48px) + + calc(var(--system-header-height) + var(--performance-bar-height)) + + var(--top-bar-height) + ); background-color: #fbfafd; border-right: 1px solid #e9e9e9; transform: translate3d(0, 0, 0); @@ -1493,6 +1482,50 @@ kbd { display: none; } } +.super-sidebar { + display: flex; + flex-direction: column; + position: fixed; + top: calc( + var(--header-height, 48px) + + calc(var(--system-header-height) + var(--performance-bar-height)) + ); + bottom: var(--system-footer-height); + left: 0; + background-color: var(--gray-10, #fbfafd); + border-right: 1px solid rgba(31, 30, 36, 0.08); + transform: translate3d(0, 0, 0); + width: 256px; + z-index: 600; +} +.super-sidebar.super-sidebar-loading { + transform: translate3d(-100%, 0, 0); +} +@media (min-width: 1200px) { + .super-sidebar.super-sidebar-loading { + transform: translate3d(0, 0, 0); + } +} +@media (prefers-reduced-motion: no-preference) { +} +.page-with-super-sidebar { + padding-left: 0; +} +@media (prefers-reduced-motion: no-preference) { +} +@media (min-width: 1200px) { + .page-with-super-sidebar { + padding-left: 256px; + } +} +.page-with-super-sidebar-collapsed .super-sidebar { + transform: translate3d(-100%, 0, 0); +} +@media (min-width: 1200px) { + .page-with-super-sidebar-collapsed { + padding-left: 0; + } +} input::-moz-placeholder { color: #89888d; opacity: 1; |