style: 层次化样式

ArgoZhang · ArgoZhang · commit f5fa3372d157 · 2024-11-16T19:51:03.000+08:00
diff --git a/src/BootstrapBlazor/Components/Layout/Layout.razor.scss b/src/BootstrapBlazor/Components/Layout/Layout.razor.scss
@@ -287,11 +287,20 @@
         }
 
         &.is-collapsed {
-            .layout-side:not(:hover) {
-                --bb-layout-sidebar-width: var(--bb-layout-sidebar-collapse-width);
-
-                .menu.is-vertical {
+            .layout-side {
+                &:not(:hover) {
                     --bb-layout-sidebar-width: var(--bb-layout-sidebar-collapse-width);
+
+                    .menu.is-vertical {
+                        --bb-layout-sidebar-width: var(--bb-layout-sidebar-collapse-width);
+                    }
+                }
+
+                &:hover {
+                    .layout-title,
+                    .menu.is-vertical .menu-text {
+                        opacity: 1;
+                    }
                 }
             }
 
@@ -307,13 +316,6 @@
             .menu.is-vertical .menu-text {
                 opacity: 0;
             }
-
-            .layout-side:hover {
-                .layout-title,
-                .menu.is-vertical .menu-text {
-                    opacity: 1;
-                }
-            }
         }
     }
 }

Original file line number	Diff line number	Diff line change
`@@ -287,11 +287,20 @@`
`287`	`287`	`}`
`288`	`288`
`289`	`289`	`&.is-collapsed {`
`290`		`- .layout-side:not(:hover) {`
`291`		`- --bb-layout-sidebar-width: var(--bb-layout-sidebar-collapse-width);`
`292`		`-`
`293`		`- .menu.is-vertical {`
	`290`	`+ .layout-side {`
	`291`	`+ &:not(:hover) {`
`294`	`292`	`--bb-layout-sidebar-width: var(--bb-layout-sidebar-collapse-width);`
	`293`	`+`
	`294`	`+ .menu.is-vertical {`
	`295`	`+ --bb-layout-sidebar-width: var(--bb-layout-sidebar-collapse-width);`
	`296`	`+ }`
	`297`	`+ }`
	`298`	`+`
	`299`	`+ &:hover {`
	`300`	`+ .layout-title,`
	`301`	`+ .menu.is-vertical .menu-text {`
	`302`	`+ opacity: 1;`
	`303`	`+ }`
`295`	`304`	`}`
`296`	`305`	`}`
`297`	`306`
`@@ -307,13 +316,6 @@`
`307`	`316`	`.menu.is-vertical .menu-text {`
`308`	`317`	`opacity: 0;`
`309`	`318`	`}`
`310`		`-`
`311`		`- .layout-side:hover {`
`312`		`- .layout-title,`
`313`		`- .menu.is-vertical .menu-text {`
`314`		`- opacity: 1;`
`315`		`- }`
`316`		`- }`
`317`	`319`	`}`
`318`	`320`	`}`
`319`	`321`	`}`