[taffybar] Simplify taffybar.hs
This commit is contained in:
@@ -1,17 +1,35 @@
|
||||
@define-color bg-color #000000;
|
||||
@define-color bg-tone #1E1E20;
|
||||
@define-color active-window-color #374140;
|
||||
@define-color urgent-window-color #D9CB9E;
|
||||
@define-color font-color #FFFFFF;
|
||||
@define-color transparent rgba(0.0, 0.0, 0.0, 0.0);
|
||||
@define-color white #FFFFFF;
|
||||
@define-color black #000000;
|
||||
@define-color taffy-blue #0c7cd5;
|
||||
|
||||
.InnerPad {
|
||||
@define-color active-window-color @white;
|
||||
@define-color urgent-window-color @taffy-blue;
|
||||
@define-color font-color @white;
|
||||
@define-color menu-background-color @white;
|
||||
@define-color menu-font-color @black;
|
||||
|
||||
/* Top level styling */
|
||||
|
||||
.taffy-window * {
|
||||
font-family: "Noto Sans", sans-serif;
|
||||
font-size: 10pt;
|
||||
color: @font-color;
|
||||
}
|
||||
|
||||
.taffy-box {
|
||||
border-radius: 10px;
|
||||
background-color: rgba(0.0, 0.0, 0.0, 0.3);
|
||||
}
|
||||
|
||||
.inner-pad {
|
||||
padding-bottom: 5px;
|
||||
padding-top: 5px;
|
||||
padding-left: 2px;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
.Contents {
|
||||
.contents {
|
||||
padding-bottom: 4px;
|
||||
padding-top: 4px;
|
||||
padding-right: 2px;
|
||||
@@ -20,94 +38,84 @@
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.Active .Contents, .Visible .Contents {
|
||||
/* Workspaces styling */
|
||||
|
||||
.workspace-label {
|
||||
padding-right: 3px;
|
||||
padding-left: 2px;
|
||||
font-size: 12pt;
|
||||
}
|
||||
|
||||
.active .contents {
|
||||
background-color: rgba(0.0, 0.0, 0.0, 0.5);
|
||||
}
|
||||
|
||||
.WorkspaceLabel {
|
||||
padding-right: 3px;
|
||||
padding-left: 2px;
|
||||
font-size: 10pt;
|
||||
.visible .contents {
|
||||
background-color: rgba(0.0, 0.0, 0.0, 0.2);
|
||||
}
|
||||
|
||||
.Windows * {
|
||||
color: @bg-color;
|
||||
border-color: @bg-color;
|
||||
}
|
||||
|
||||
.TrayContainer {
|
||||
background-color: @urgent-window-color;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.TrayWidget {
|
||||
background-color: @urgent-window-color;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.TrayWidgetContainer {
|
||||
background-color: @urgent-window-color;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.TaffyBox {
|
||||
border-bottom: solid;
|
||||
border-width: 1px;
|
||||
border-color: #FFFFFF;
|
||||
background-color: rgba(0.0, 0.0, 0.0, 0.3);
|
||||
}
|
||||
|
||||
.Taffybar * {
|
||||
font-family: "Noto Sans", sans-serif;
|
||||
font-size: 10pt;
|
||||
color: @font-color;
|
||||
}
|
||||
|
||||
.Menu * {
|
||||
color: #FFFFFF;
|
||||
background-color: rgba(1.0, 1.0, 1.0, 1.0);
|
||||
}
|
||||
|
||||
.OuterPad * {
|
||||
background-color: rgba(1.0, 0.0, 0.0, 0.0);
|
||||
}
|
||||
|
||||
.OuterPad:focus {
|
||||
background-color: rgba(0.0, 0.0, 0.0, 0.3);
|
||||
box-shadow: inset 0 -3px #0c7cd5;
|
||||
}
|
||||
|
||||
.OuterPad *:hover {
|
||||
box-shadow: inset 0 -3px #0c7cd5;
|
||||
}
|
||||
|
||||
.IconImage {
|
||||
transition: opacity .5s, background-color .5s;
|
||||
opacity: 1;
|
||||
padding-bottom: 1px;
|
||||
padding-top: 1px;
|
||||
}
|
||||
|
||||
.IconContainer {
|
||||
border-bottom: 0px;
|
||||
transition: opacity .5s, box-shadow 1s;
|
||||
padding-bottom: 4px;
|
||||
.window-icon-container {
|
||||
transition: opacity .5s, box-shadow .5s;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.IconContainer.Active {
|
||||
border-color: rgba(255, 255, 255, 1.0);
|
||||
/* background-color: rgba(255, 255, 255, 0.3); */
|
||||
border-radius: 0px;
|
||||
opacity: 1;
|
||||
box-shadow: inset 0 -1px #FFFFFF;
|
||||
/* This gives space for the box-shadow (they look like underlines) that follow.
|
||||
This will actually affect all widgets, (not just the workspace icons), but
|
||||
that is what we want since we want the icons to look the same. */
|
||||
.auto-size-image, .sni-tray {
|
||||
padding-top: 3px;
|
||||
padding-bottom: 3px;
|
||||
}
|
||||
|
||||
.IconContainer.Urgent {
|
||||
.window-icon-container.active {
|
||||
box-shadow: inset 0 -3px @white;
|
||||
}
|
||||
|
||||
.window-icon-container.urgent {
|
||||
box-shadow: inset 0 -3px @urgent-window-color;
|
||||
}
|
||||
|
||||
.IconContainer.Minimized .IconImage {
|
||||
transition: opacity .5s;
|
||||
.window-icon-container.inactive .window-icon {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.window-icon-container.minimized .window-icon {
|
||||
opacity: .3;
|
||||
}
|
||||
|
||||
.window-icon {
|
||||
opacity: 1;
|
||||
transition: opacity .5s;
|
||||
}
|
||||
|
||||
/* Button styling */
|
||||
|
||||
button {
|
||||
background-color: @transparent;
|
||||
border-width: 0px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
button:checked, button:hover .Contents:hover {
|
||||
box-shadow: inset 0 -3px @taffy-blue;
|
||||
}
|
||||
|
||||
/* Menu styling */
|
||||
|
||||
/* The ".taffy-window" prefixed selectors are needed because if they aren't present,
|
||||
the top level .Taffybar selector takes precedence */
|
||||
.taffy-window menuitem *, menuitem * {
|
||||
color: @menu-font-color;
|
||||
}
|
||||
|
||||
.taffy-window menuitem, menuitem {
|
||||
background-color: @menu-background-color;
|
||||
}
|
||||
|
||||
.taffy-window menuitem:hover, menuitem:hover {
|
||||
background-color: @taffy-blue;
|
||||
}
|
||||
|
||||
.taffy-window menuitem:hover > label, menuitem:hover > label {
|
||||
color: @white;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user