Adapta sidebar a su nueva estructura (ebe832a9) · Commits · REDMIC Project / Client / Style

src/redmic/Sidebar.styl

+40 −37

Original line number	Diff line number	Diff line
		@@ -2,15 +2,24 @@
		Plantilla para controlar las barras laterales de navegación.
		*/

		$sidebar-size-high-factor = 0.85
		$sidebar-size-medium-factor = 0.75
		$sidebar-size-low-factor = 0.65

		.sidebarWidthSizing
		width $sidebar-size
		@media (max-width $media-high-size)
		width $sidebar-size * $sidebar-size-high-factor
		@media (max-width $media-medium-size)
		width $sidebar-size * $sidebar-size-medium-factor
		@media (max-width $media-low-size)
		width $sidebar-size * $sidebar-size-low-factor

		.mainSidebar
		@extend .shadowBox
		@extend .sidebarWidthSizing
		top $topbar-size !important
		height "calc(100% - %s)" % $topbar-size !important
		noPadding()
		z-index 4

		> div
		height 100%
		padding 0

		.main-nav-list
		& > ul
		@@ -48,22 +57,22 @@
		text-decoration none

		.main-nav
		&.primarySidebar nav
		nav&.secondarySidebar
		nav.primarySidebar
		nav.secondarySidebar
		@extend .main-nav-list

		&.primarySidebar nav
		nav.primarySidebar
		@extend .shadowBox
		@extend .sidebarWidthSizing
		position absolute
		top $topbar-size
		left 0
		height "calc(100% - %s)" % $topbar-size
		z-index 4
		flexible v space-between center
		background $color13
		height 100%
		overflow auto
		width $sidebar-size
		@media (max-width $media-high-size)
		width $sidebar-size * 0.85
		@media (max-width $media-medium-size)
		width $sidebar-size * 0.75
		@media (max-width $media-low-size)
		width $sidebar-size * 0.65

		& > ul
		width 100%
		@@ -93,7 +102,7 @@
		textEllipsis()
		padding 0.1rem

		nav&.secondarySidebar
		nav.secondarySidebar
		position absolute
		top $topbar-size
		z-index 3
		@@ -139,11 +148,11 @@
		&.overall
		left $sidebar-size
		@media (max-width $media-high-size)
		left $sidebar-size * 0.85
		left $sidebar-size * $sidebar-size-high-factor
		@media (max-width $media-medium-size)
		left $sidebar-size * 0.75
		left $sidebar-size * $sidebar-size-medium-factor
		@media (max-width $media-low-size)
		left $sidebar-size * 0.65
		left $sidebar-size * $sidebar-size-low-factor
		transition left 0.4s ease-in 0s, z-index 0.05s ease 0.48s

		.overlaySidebarBackground
		@@ -158,22 +167,16 @@
		pointer-events none

		body
		&.reducedWidth.uncollapsedSidebar
		&.reducedWidth
		.mainSidebar
		width 0

		&.uncollapsedSidebar
		.overlaySidebarBackground
		opacity 0.5
		pointer-events all

		&:not(.uncollapsedSidebar)
		.main-nav
		&.primarySidebar nav
		&.secondarySidebar
		.mainSidebar
		.main-nav > nav
		width 0

		.mainContainer
		& > .main-nav.primarySidebar
		@extend .shadowBox
		position absolute
		top $topbar-size
		left 0
		height "calc(100% - %s)" % $topbar-size
		z-index 4