Skip to content

G
gitlab-ce
Commit 71e55586 authored by Denys Mishunov's avatar Denys Mishunov Committed by David O'Regan
Browse files
Options

Removed excessive specificity 

To avoid unespected CSS changes, we remove the unwanted
specificity from the imported BASE stylesheet for the left
sidepanel
parent 320d3902
Show whitespace changes
Inline Side-by-side
Showing with 317 additions and 313 deletions
app/assets/stylesheets/framework/contextual_sidebar_refactoring/contextual_sidebar_base.scss
View file @ 71e55586
.page-with-contextual-sidebar {
transition: padding-left $sidebar-transition-duration;
@include media-breakpoint-up(md) {
padding-left: $contextual-sidebar-collapsed-width;
}
@include media-breakpoint-up(xl) {
padding-left: $contextual-sidebar-width;
}
.issues-bulk-update.right-sidebar.right-sidebar-expanded .issuable-sidebar-header {
padding: 10px 0 15px;
}
}
.page-with-icon-sidebar {
@include media-breakpoint-up(md) {
padding-left: $contextual-sidebar-collapsed-width;
}
}
.settings-avatar {
background-color: $white;
svg {
fill: $gl-text-color-secondary;
margin: auto;
}
}
@mixin collapse-contextual-sidebar-content {
@include context-header-collapsed;
......@@ -61,25 +30,7 @@
}
}
.nav-sidebar {
transition: width $sidebar-transition-duration, left $sidebar-transition-duration;
position: fixed;
z-index: 600;
width: $contextual-sidebar-width;
top: $header-height;
bottom: 0;
left: 0;
background-color: $gray-light;
box-shadow: inset -1px 0 0 $border-color;
transform: translate3d(0, 0, 0);
&:not(.sidebar-collapsed-desktop) {
@media (min-width: map-get($grid-breakpoints, sm)) and (max-width: map-get($grid-breakpoints, sm)) {
box-shadow: inset -1px 0 0 $border-color, 2px 1px 3px $dropdown-shadow-color;
}
}
@mixin collapse-contextual-sidebar {
@mixin collapse-contextual-sidebar {
width: $contextual-sidebar-collapsed-width;
.nav-sidebar-inner-scroll {
......@@ -102,6 +53,56 @@
.avatar-container {
margin: 0 auto;
}
}
@at-root {
.page-with-contextual-sidebar {
transition: padding-left $sidebar-transition-duration;
@include media-breakpoint-up(md) {
padding-left: $contextual-sidebar-collapsed-width;
}
@include media-breakpoint-up(xl) {
padding-left: $contextual-sidebar-width;
}
.issues-bulk-update.right-sidebar.right-sidebar-expanded .issuable-sidebar-header {
padding: 10px 0 15px;
}
}
.page-with-icon-sidebar {
@include media-breakpoint-up(md) {
padding-left: $contextual-sidebar-collapsed-width;
}
}
.settings-avatar {
background-color: $white;
svg {
fill: $gl-text-color-secondary;
margin: auto;
}
}
.nav-sidebar {
transition: width $sidebar-transition-duration, left $sidebar-transition-duration;
position: fixed;
z-index: 600;
width: $contextual-sidebar-width;
top: $header-height;
bottom: 0;
left: 0;
background-color: $gray-light;
box-shadow: inset -1px 0 0 $border-color;
transform: translate3d(0, 0, 0);
&:not(.sidebar-collapsed-desktop) {
@media (min-width: map-get($grid-breakpoints, sm)) and (max-width: map-get($grid-breakpoints, sm)) {
box-shadow: inset -1px 0 0 $border-color, 2px 1px 3px $dropdown-shadow-color;
}
}
&.sidebar-collapsed-desktop {
......@@ -167,15 +168,15 @@
@include collapse-contextual-sidebar-content;
}
}
}
}
.nav-sidebar-inner-scroll {
.nav-sidebar-inner-scroll {
height: 100%;
width: 100%;
overflow: auto;
}
}
.sidebar-sub-level-items {
.sidebar-sub-level-items {
display: none;
padding-bottom: 8px;
......@@ -200,9 +201,9 @@
}
}
}
}
}
.sidebar-top-level-items {
.sidebar-top-level-items {
margin-bottom: 60px;
> li {
......@@ -305,17 +306,17 @@
background-color: $link-hover-background;
}
}
}
}
// Collapsed nav
// Collapsed nav
.toggle-sidebar-button,
.close-nav-button {
.toggle-sidebar-button,
.close-nav-button {
@include side-panel-toggle;
}
}
.toggle-sidebar-button,
.close-nav-button {
.toggle-sidebar-button,
.close-nav-button {
position: fixed;
bottom: 0;
width: $contextual-sidebar-width - 1px;
......@@ -328,18 +329,18 @@
.icon-chevron-double-lg-right {
display: none;
}
}
}
.collapse-text {
.collapse-text {
white-space: nowrap;
overflow: hidden;
}
}
.sidebar-collapsed-desktop {
.sidebar-collapsed-desktop {
@include collapse-contextual-sidebar-content;
}
}
.fly-out-top-item {
.fly-out-top-item {
> a {
display: flex;
}
......@@ -347,19 +348,19 @@
.fly-out-badge {
margin-left: 8px;
}
}
}
.fly-out-top-item-name {
.fly-out-top-item-name {
flex: 1;
}
}
// Mobile nav
// Mobile nav
.close-nav-button {
.close-nav-button {
display: none;
}
}
@include media-breakpoint-down(sm) {
@include media-breakpoint-down(sm) {
.close-nav-button {
display: flex;
}
......@@ -380,4 +381,6 @@
z-index: $zindex-dropdown-menu;
}
}
}
}
app/assets/stylesheets/framework/contextual_sidebar_refactoring/contextual_sidebar_variant.scss
View file @ 71e55586
.page-with-contextual-sidebar {
transition: padding-left $sidebar-transition-duration;
@include media-breakpoint-up(md) {
padding-left: $contextual-sidebar-collapsed-width;
}
@include media-breakpoint-up(xl) {
padding-left: $contextual-sidebar-width;
}
.issues-bulk-update.right-sidebar.right-sidebar-expanded .issuable-sidebar-header {
padding: 10px 0 15px;
}
}
.page-with-icon-sidebar {
@include media-breakpoint-up(md) {
padding-left: $contextual-sidebar-collapsed-width;
}
}
.settings-avatar {
background-color: $white;
svg {
fill: $gl-text-color-secondary;
margin: auto;
}
}
@mixin collapse-contextual-sidebar-content {
@include context-header-collapsed;
......@@ -61,25 +30,7 @@
}
}
.nav-sidebar {
transition: width $sidebar-transition-duration, left $sidebar-transition-duration;
position: fixed;
z-index: 600;
width: $contextual-sidebar-width;
top: $header-height;
bottom: 0;
left: 0;
background: linear-gradient($purple-200, $orange-200);
box-shadow: inset -1px 0 0 $border-color;
transform: translate3d(0, 0, 0);
&:not(.sidebar-collapsed-desktop) {
@media (min-width: map-get($grid-breakpoints, sm)) and (max-width: map-get($grid-breakpoints, sm)) {
box-shadow: inset -1px 0 0 $border-color, 2px 1px 3px $dropdown-shadow-color;
}
}
@mixin collapse-contextual-sidebar {
@mixin collapse-contextual-sidebar {
width: $contextual-sidebar-collapsed-width;
.nav-sidebar-inner-scroll {
......@@ -102,6 +53,55 @@
.avatar-container {
margin: 0 auto;
}
}
.page-with-contextual-sidebar {
transition: padding-left $sidebar-transition-duration;
@include media-breakpoint-up(md) {
padding-left: $contextual-sidebar-collapsed-width;
}
@include media-breakpoint-up(xl) {
padding-left: $contextual-sidebar-width;
}
.issues-bulk-update.right-sidebar.right-sidebar-expanded .issuable-sidebar-header {
padding: 10px 0 15px;
}
}
.page-with-icon-sidebar {
@include media-breakpoint-up(md) {
padding-left: $contextual-sidebar-collapsed-width;
}
}
.settings-avatar {
background-color: $white;
svg {
fill: $gl-text-color-secondary;
margin: auto;
}
}
.nav-sidebar {
transition: width $sidebar-transition-duration, left $sidebar-transition-duration;
position: fixed;
z-index: 600;
width: $contextual-sidebar-width;
top: $header-height;
bottom: 0;
left: 0;
background: linear-gradient($purple-200, $orange-200);
box-shadow: inset -1px 0 0 $border-color;
transform: translate3d(0, 0, 0);
&:not(.sidebar-collapsed-desktop) {
@media (min-width: map-get($grid-breakpoints, sm)) and (max-width: map-get($grid-breakpoints, sm)) {
box-shadow: inset -1px 0 0 $border-color, 2px 1px 3px $dropdown-shadow-color;
}
}
&.sidebar-collapsed-desktop {
......@@ -381,3 +381,4 @@
}
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7