feat(eww): finish most scss of quick settings

This commit is contained in:
matt1432 2023-07-30 19:13:59 -04:00
parent e3a8309c53
commit 082485d7a5
3 changed files with 134 additions and 66 deletions

View file

@ -51,13 +51,14 @@
font-size: 30px; font-size: 30px;
margin-left: 15px; margin-left: 15px;
margin-right: 10px; margin-right: 10px;
min-width: 50px;
} }
.grid-chev { .grid-chev {
margin-left: -10px; margin-left: 0px;
font-size: 40px; font-size: 40px;
margin-right: 0px; margin-right: 5px;
} }
.button-grid { .button-grid {
@ -74,12 +75,13 @@
.button-row { .button-row {
min-height: 70px; min-height: 70px;
min-width: 450px; min-width: 450px;
margin-left: 20px;
} }
.grid-button { .grid-button {
min-height: 65px; min-height: 65px;
min-width: 70px; min-width: 70px;
margin: 15px; margin: 5px;
} }
.left-part { .left-part {
@ -93,17 +95,71 @@
.right-part { .right-part {
background: #1b1b1b; background: #1b1b1b;
border-top-right-radius: 15px; border-top-right-radius: 30px;
border-bottom-right-radius: 15px; border-bottom-right-radius: 30px;
border-right: 2px solid $contrastbg; border-right: 2px solid $contrastbg;
border-top: 2px solid $contrastbg; border-top: 2px solid $contrastbg;
border-bottom: 2px solid $contrastbg; border-bottom: 2px solid $contrastbg;
} }
.left-part:hover,
.right-part:hover { .right-part:hover {
color: $contrastbg; color: $contrastbg;
border: 2px solid $contrastbg; border: 2px solid $contrastbg;
border-radius: 7px; border-top-left-radius: 7px;
border-bottom-left-radius: 7px;
transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;
} }
.left-part:hover {
color: $contrastbg;
border: 2px solid $contrastbg;
border-top-right-radius: 7px;
border-bottom-right-radius: 7px;
transition: all 0.5s ease-in-out;
}
.slider-box {
min-height: 100px;
min-width: 470px;
background-color: $bgfull;
border-top: 2px solid $contrastbg;
border-bottom: 2px solid $contrastbg;
border-radius: 15px;
margin-top: 30px;
.slider {
margin-left: 10px;
margin-right: 10px;
}
.slider-label {
font-size: 30px;
min-width: 30px;
}
scale {
min-height: 55px;
min-width: 400px;
margin-left: 18px;
highlight {
margin: 0px;
background-color: #79659f;
border-radius: 2em;
}
trough {
background-color: #363847;
border-radius: 2em;
}
slider {
margin: -4px;
min-width: 20px;
min-height: 20px;
background: #3e4153;
border-radius: 100%;
box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
}
}
}

View file

@ -81,6 +81,8 @@
:width 0 :width 0
:height 0 :height 0
:halign "center" :halign "center"
:style "margin-top: 15px;
margin-bottom: 7px"
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(box :class "grid-button" (box :class "grid-button"
:orientation "h" :orientation "h"
@ -90,10 +92,32 @@
(eventbox :class "left-part" (eventbox :class "left-part"
:cursor "pointer" :cursor "pointer"
:onclick "notify-send 'set this up moron'"
(label :text " 󰖩 " (label :text " 󰖩 "
:class "grid-label" :class "grid-label"
) )
) )
(eventbox :class "right-part"
:cursor "pointer"
:onclick "nm-connection-editor &"
(label :text " " :class "grid-chev")
)
)
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(box :class "grid-button"
:orientation "h"
:space-evenly false
:width 0
:height 0
(eventbox :class "left-part"
:cursor "pointer"
(label :text " 󰂯 "
:class "grid-label"
)
)
(eventbox :class "right-part" (eventbox :class "right-part"
:cursor "pointer" :cursor "pointer"
(label :text " " :class "grid-chev") (label :text " " :class "grid-chev")
@ -108,43 +132,7 @@
(eventbox :class "left-part" (eventbox :class "left-part"
:cursor "pointer" :cursor "pointer"
(label :text " 󰖩 " (label :text " 󰌾 "
:class "grid-label"
)
)
(eventbox :class "right-part"
:cursor "pointer"
(label :text " " :class "grid-chev")
)
)
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(box :class "grid-button"
:orientation "h"
:space-evenly false
:width 0
:height 0
(eventbox :class "left-part"
:cursor "pointer"
(label :text " 󰖩 "
:class "grid-label"
)
)
(eventbox :class "right-part"
:cursor "pointer"
(label :text " " :class "grid-chev")
)
)
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(box :class "grid-button"
:orientation "h"
:space-evenly false
:width 0
:height 0
(eventbox :class "left-part"
:cursor "pointer"
(label :text " 󰖩 "
:class "grid-label" :class "grid-label"
) )
) )
@ -163,6 +151,8 @@
:width 0 :width 0
:height 0 :height 0
:halign "center" :halign "center"
:style "margin-top: 7px;
margin-bottom: 15px;"
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(box :class "grid-button" (box :class "grid-button"
:orientation "h" :orientation "h"
@ -172,7 +162,7 @@
(eventbox :class "left-part" (eventbox :class "left-part"
:cursor "pointer" :cursor "pointer"
(label :text " 󰖩 " (label :text " 󰕾 "
:class "grid-label" :class "grid-label"
) )
) )
@ -190,7 +180,7 @@
(eventbox :class "left-part" (eventbox :class "left-part"
:cursor "pointer" :cursor "pointer"
(label :text " 󰖩 " (label :text " 󰍬 "
:class "grid-label" :class "grid-label"
) )
) )
@ -208,7 +198,7 @@
(eventbox :class "left-part" (eventbox :class "left-part"
:cursor "pointer" :cursor "pointer"
(label :text " 󰖩 " (label :text " 󰍃 "
:class "grid-label" :class "grid-label"
) )
) )
@ -218,25 +208,50 @@
) )
) )
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(box :class "grid-button" )
:orientation "h" )
:space-evenly false (box :class "slider-box"
:orientation "v"
:space-evenly true
:spacing 0
:width 0 :width 0
:height 0 :height 0
:halign "center"
(eventbox :class "left-part" (box :class "slider"
:cursor "pointer" :orientation "h"
(label :text " 󰖩 " :valign "start"
:class "grid-label" :halign "center"
:width 0
:height 0
:space-evenly false
(label :text "󰕾 " :class "slider-label")
(scale :value 0
:min 0
:max 101
:height 0
:width 0
) )
) )
(eventbox :class "right-part" (box :class "slider"
:cursor "pointer" :orientation "h"
(label :text " " :class "grid-chev") :valign "start"
:halign "center"
:width 0
:height 0
:space-evenly false
(label :text "󰃟 " :class "slider-label")
(scale :value 0
:min 0
:max 101
:height 0
:width 0
) )
) )
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
)
) )
) )
) )

View file

@ -10,13 +10,10 @@ on () {
} }
off () { off () {
(
eww update showqs=false eww update showqs=false
sleep .55
eww close quick-settings-reveal eww close quick-settings-reveal
eww close quick-settings-smol-reveal eww close quick-settings-smol-reveal
eww close quick-settings-logo-reveal eww close quick-settings-logo-reveal
)
} }
[[ "$1" == "on" ]] && on [[ "$1" == "on" ]] && on