diff --git a/src/styles/controlcenter.css b/src/styles/controlcenter.css index 72fefa2..d229886 100644 --- a/src/styles/controlcenter.css +++ b/src/styles/controlcenter.css @@ -2,6 +2,7 @@ font-size: 16px; font-family: "SF Pro Rounded"; font-weight: bold; + margin-bottom:10px; } #control-center-menu { @@ -311,63 +312,15 @@ } #volume-widget-icon { - font-size: 22px; - margin-top: -35px; - margin-right: -36px; - color: #000; + margin-left: 10px; + color: alpha(#000, 0.4); } #brightness-widget-icon { - font-size: 15px; - margin-top: -27px; - margin-right: -29px; - color: #000; + margin-left: 10px; + color: alpha(#000, 0.4); } -#control-center-menu slider { - background: linear-gradient(135deg, @text-main 0%, #f0f1f2 100%); - border-color: #000; - min-width: 28px; - min-height: 28px; - margin: -2px; - border-radius: apply(radius-full); - /* background-image: none; */ - /* background-color: transparent; */ - /* min-width: 4px; */ - /* min-height: 40px; */ - /* margin: -9px; */ -} - -#control-center-menu slider:hover { - border-color: @text-dim; - min-width: 30px; - min-height: 30px; - margin: -3px; - border-radius: apply(radius-full); - /* background-image: none; */ - /* background-color: transparent; */ - /* min-width: 4px; */ - /* min-height: 40px; */ - /* margin: -9px; */ -} - -#control-center-menu scale { - background-color: transparent; - margin-top: 10px; - border-radius: apply(radius-xl); -} - -#control-center-menu trough { - min-width: 25px; - border-radius: apply(radius-full); - background-color: alpha(#666, 0.5); - border: 1px solid alpha(#444, 0.3); -} - -#control-center-menu highlight { - background: alpha(@text-main, 0.8); - border-radius: apply(radius-full); -} #control-center-menu mark indicator { background: none; @@ -437,64 +390,6 @@ letter-spacing: -0.01em; } -/* Apple-style volume slider */ -#apple-volume-slider { - background-color: transparent; - margin-top: 4px; - margin-bottom: 4px; - min-height: 32px; -} - -#apple-volume-slider trough { - min-width: 28px; - min-height: 6px; - border-radius: 3px; - background-color: alpha(@text-main, 0.25); - border: none; - box-shadow: inset 0 1px 2px alpha(#000, 0.2); -} - -#apple-volume-slider highlight { - background: linear-gradient(90deg, @accent 0%, #0051d0 100%); - border-radius: 3px; - border: none; - box-shadow: 0 1px 3px alpha(@accent, 0.3); -} - -#apple-volume-slider slider { - background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%); - /* border: 2px solid alpha(@accent, 0.8); */ - border-radius: apply(radius-full); - min-width: 20px; - min-height: 20px; - margin: -10px; - box-shadow: - 0 2px 8px alpha(#000, 0.15), - 0 1px 3px alpha(#000, 0.2); - transition: all 0.15s ease; -} - -#apple-volume-slider slider:hover { - background: linear-gradient(135deg, @text-main 0%, #f0f1f2 100%); - border-color: @accent; - box-shadow: - 0 4px 12px alpha(#000, 0.2), - 0 2px 6px alpha(@accent, 0.3); - min-width: 22px; - min-height: 22px; - margin: -9px; -} - -#apple-volume-slider slider:active { - background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); - min-width: 21px; - min-height: 21px; - margin: -9px; - box-shadow: - 0 2px 6px alpha(#000, 0.25), - 0 1px 3px alpha(@accent, 0.4); -} - /* Legacy app volume styles (fallback) */ .app-volume-item { margin: 8px 0; @@ -511,31 +406,6 @@ margin-bottom: 5px; } -#app-volume-slider { - background-color: transparent; - margin-top: 5px; -} - -#app-volume-slider trough { - min-width: 20px; - border-radius: apply(radius-full); - background-color: alpha(#666, 0.5); - border: 1px solid alpha(#444, 0.3); -} - -#app-volume-slider highlight { - background: alpha(#0078d4, 0.8); - border-radius: apply(radius-full); -} - -#app-volume-slider slider { - background-color: @text-main; - padding: 2px; - min-width: 4px; - min-height: 18px; - border-radius: apply(radius-xl); -} - /* Circle button for per-app volume */ #per-app-volume-button { background-color: alpha(@text-main, 0.15); diff --git a/src/styles/widgets.css b/src/styles/widgets.css index 81d9004..4f6e791 100644 --- a/src/styles/widgets.css +++ b/src/styles/widgets.css @@ -274,12 +274,16 @@ .flat-scale { margin: 4px 0px; } + .flat-scale slider { - background-color: @text-main; + /* background: linear-gradient(135deg, @text-main 0%, #f0f1f2 100%); */ + background-color: white; min-height: 24px; min-width: 24px; border-radius: apply(radius-full); } + + .flat-scale trough { background-color: alpha(#666, 0.5); min-height: 25px;