This might be the final design
This commit is contained in:
@@ -8,11 +8,9 @@
|
|||||||
@define-color text rgba(255, 255, 255, 1.0);
|
@define-color text rgba(255, 255, 255, 1.0);
|
||||||
@define-color surface1 rgba(255, 255, 255, 0.08);
|
@define-color surface1 rgba(255, 255, 255, 0.08);
|
||||||
@define-color subtext1 rgba(255, 255, 255, 0.35);
|
@define-color subtext1 rgba(255, 255, 255, 0.35);
|
||||||
|
|
||||||
@define-color blue rgba(51, 204, 255, 0.933);
|
@define-color blue rgba(51, 204, 255, 0.933);
|
||||||
@define-color green rgba(0, 255, 153, 0.933);
|
@define-color green rgba(0, 255, 153, 0.933);
|
||||||
@define-color red rgba(255, 0, 0, 0.90);
|
@define-color red rgba(255, 0, 0, 0.90);
|
||||||
|
|
||||||
* {
|
* {
|
||||||
color: @text;
|
color: @text;
|
||||||
font-family:
|
font-family:
|
||||||
@@ -21,7 +19,6 @@
|
|||||||
Sans;
|
Sans;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Remove list selection glow */
|
/* Remove list selection glow */
|
||||||
list,
|
list,
|
||||||
listview,
|
listview,
|
||||||
@@ -36,12 +33,10 @@ listview row:active {
|
|||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Popups: keep window transparent, but make the *notification surfaces* opaque base */
|
/* Popups: keep window transparent, but make the *notification surfaces* opaque base */
|
||||||
window#notification-window {
|
window#notification-window {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Control center — EXACT same as Waybar base */
|
/* Control center — EXACT same as Waybar base */
|
||||||
.control-center {
|
.control-center {
|
||||||
background-color: @base;
|
background-color: @base;
|
||||||
@@ -52,7 +47,6 @@ window#notification-window {
|
|||||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Widget headers — use Waybar surface1 */
|
/* Widget headers — use Waybar surface1 */
|
||||||
.widget-title {
|
.widget-title {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
@@ -61,19 +55,16 @@ window#notification-window {
|
|||||||
background-color: @surface1;
|
background-color: @surface1;
|
||||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||||
}
|
}
|
||||||
|
|
||||||
.widget-title > label {
|
.widget-title > label {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Cards — EXACT same as Waybar base */
|
/* Cards — EXACT same as Waybar base */
|
||||||
.notification-background {
|
.notification-background {
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
.notification-background .notification {
|
.notification-background .notification {
|
||||||
background-color: @base;
|
background-color: @base;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
@@ -81,7 +72,6 @@ window#notification-window {
|
|||||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Accent by urgency */
|
/* Accent by urgency */
|
||||||
.notification.critical {
|
.notification.critical {
|
||||||
border-left: 4px solid @red;
|
border-left: 4px solid @red;
|
||||||
@@ -92,7 +82,6 @@ window#notification-window {
|
|||||||
.notification.normal {
|
.notification.normal {
|
||||||
border-left: 4px solid @green;
|
border-left: 4px solid @green;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Meta */
|
/* Meta */
|
||||||
.notification .app-name {
|
.notification .app-name {
|
||||||
color: @subtext1;
|
color: @subtext1;
|
||||||
@@ -102,20 +91,17 @@ window#notification-window {
|
|||||||
color: @subtext1;
|
color: @subtext1;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Text */
|
/* Text */
|
||||||
.notification .summary {
|
.notification .summary {
|
||||||
color: @text;
|
color: @text;
|
||||||
font-weight: 800;
|
font-weight: 800;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.notification .body {
|
.notification .body {
|
||||||
color: @subtext1;
|
color: @subtext1;
|
||||||
margin-top: 6px;
|
margin-top: 6px;
|
||||||
line-height: 1.25;
|
line-height: 1.25;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Buttons */
|
/* Buttons */
|
||||||
.notification button {
|
.notification button {
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
@@ -124,7 +110,6 @@ window#notification-window {
|
|||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
padding: 6px 10px;
|
padding: 6px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.notification button:hover {
|
.notification button:hover {
|
||||||
background-color: rgba(255, 255, 255, 0.14);
|
background-color: rgba(255, 255, 255, 0.14);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"layer": "top",
|
"layer": "top",
|
||||||
"height": 42,
|
"height": 34,
|
||||||
|
|
||||||
//"modules-left": ["hyprland/window"],
|
//"modules-left": ["hyprland/window"],
|
||||||
|
|
||||||
|
|||||||
@@ -22,7 +22,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
window#waybar {
|
window#waybar {
|
||||||
background-color: @base;
|
background-color: transparent;
|
||||||
color: @text;
|
color: @text;
|
||||||
transition-property: background-color;
|
transition-property: background-color;
|
||||||
border-bottom: 0px solid rgba(0, 0, 0, 0);
|
border-bottom: 0px solid rgba(0, 0, 0, 0);
|
||||||
|
|||||||
Reference in New Issue
Block a user