aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--common/cinnamon/cinnamon-dark.css99
-rw-r--r--common/cinnamon/cinnamon.css99
-rw-r--r--common/cinnamon/common-assets/misc/sound-overlay.svg68
-rw-r--r--common/cinnamon/sass/_common.scss114
4 files changed, 377 insertions, 3 deletions
diff --git a/common/cinnamon/cinnamon-dark.css b/common/cinnamon/cinnamon-dark.css
index 536965e..fdaf2d5 100644
--- a/common/cinnamon/cinnamon-dark.css
+++ b/common/cinnamon/cinnamon-dark.css
@@ -149,7 +149,15 @@ StScrollBar {
StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
background-color: #5294E2; }
-.popup-slider-menu-item {
+.separator {
+ -gradient-height: 1px;
+ -gradient-start: transparent;
+ -gradient-end: transparent;
+ -margin-horizontal: 1.5em;
+ height: 1em; }
+
+.popup-slider-menu-item,
+.slider {
-slider-height: 4px;
-slider-background-color: #2b2e39;
-slider-border-color: transparent;
@@ -239,6 +247,8 @@ StScrollBar {
min-width: 200px;
color: #D3DAE3;
border-image: url("dark-assets/menu/menu.svg") 9 9 9 9; }
+ .popup-menu-arrow {
+ icon-size: 16px; }
.popup-menu .popup-sub-menu {
background-gradient-direction: none;
box-shadow: none;
@@ -1075,10 +1085,71 @@ StScrollBar {
.sound-playback-control {
padding: 5px 10px 10px 10px; }
+.sound-player {
+ padding: 0 4px; }
+ .sound-player > StBoxLayout:first-child {
+ padding: 5px 10px 12px 10px;
+ spacing: 0.5em; }
+ .sound-player > StBoxLayout:first-child StButton:small {
+ width: 16px;
+ height: 8px;
+ padding: 1px; }
+ .sound-player > StBoxLayout:first-child StButton:small StIcon {
+ icon-size: 12px; }
+ .sound-player-generic-coverart {
+ background: rgba(0, 0, 0, 0.2); }
+ .sound-player-overlay {
+ width: 290px;
+ height: 70px;
+ padding: 15px;
+ spacing: 0.5em;
+ background: rgba(42, 45, 55, 0.85);
+ border: 0px solid rgba(31, 33, 40, 0.95);
+ border-bottom: 1px;
+ color: #BAC3CF; }
+ .sound-player-overlay StButton {
+ width: 22px;
+ height: 13px;
+ padding: 5px;
+ color: #BAC3CF;
+ border-radius: 2px;
+ border: 1px solid rgba(53, 57, 69, 0); }
+ .sound-player-overlay StButton StIcon {
+ icon-size: 16px; }
+ .sound-player-overlay StButton:hover {
+ text-shadow: 0 1px rgba(64, 69, 82, 0);
+ color: #BAC3CF;
+ border: 1px solid rgba(26, 28, 34, 0.35);
+ background-color: rgba(119, 127, 151, 0.45); }
+ .sound-player-overlay StButton:active {
+ text-shadow: 0 1px rgba(64, 69, 82, 0);
+ color: #ffffff;
+ background-color: #5294E2;
+ border: 1px solid #5294E2;
+ box-shadow: inset 0 2px 4px #5294E2; }
+ .sound-player-overlay StBoxLayout {
+ padding-top: 2px; }
+ .sound-player .slider {
+ height: 0.5em;
+ padding: 0;
+ border: none;
+ -slider-height: 0.5em;
+ -slider-background-color: #2d303b;
+ -slider-border-color: transparent;
+ -slider-active-background-color: #5294E2;
+ -slider-active-border-color: transparent;
+ -slider-border-width: 0px;
+ -slider-handle-radius: 0px; }
+
#workspaceSwitcher {
spacing: 0px;
padding: 3px; }
+/* Controls the styling when using the "Simple buttons" option */
+.workspace-switcher {
+ padding-left: 3px;
+ padding-right: 3px; }
+
.workspace-button {
width: 20px;
height: 10px;
@@ -1091,6 +1162,32 @@ StScrollBar {
.workspace-button:hover {
color: rgba(82, 148, 226, 0.5); }
+/* Controls the style when using the "Visual representation" option */
+.workspace-graph {
+ padding: 3px;
+ spacing: 3px; }
+
+.workspace-graph .workspace {
+ border: 1px solid rgba(0, 0, 0, 0.4);
+ background-gradient-direction: none;
+ background-color: rgba(0, 0, 0, 0.2); }
+
+.workspace-graph .workspace:active {
+ border: 1px solid #5294E2;
+ background-gradient-direction: none; }
+
+.workspace-graph .workspace .windows {
+ -active-window-background: rgba(76, 82, 99, 0.95);
+ -active-window-border: rgba(0, 0, 0, 0.8);
+ -inactive-window-background: rgba(76, 82, 99, 0.95);
+ -inactive-window-border: rgba(0, 0, 0, 0.8); }
+
+.workspace-graph .workspace:active .windows {
+ -active-window-background: rgba(87, 93, 113, 0.95);
+ -active-window-border: rgba(0, 0, 0, 0.8);
+ -inactive-window-background: rgba(54, 58, 70, 0.95);
+ -inactive-window-border: rgba(0, 0, 0, 0.8); }
+
#panel-launchers-box {
padding-left: 7px; }
diff --git a/common/cinnamon/cinnamon.css b/common/cinnamon/cinnamon.css
index a8576ca..f63389d 100644
--- a/common/cinnamon/cinnamon.css
+++ b/common/cinnamon/cinnamon.css
@@ -149,7 +149,15 @@ StScrollBar {
StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
background-color: #5294E2; }
-.popup-slider-menu-item {
+.separator {
+ -gradient-height: 1px;
+ -gradient-start: transparent;
+ -gradient-end: transparent;
+ -margin-horizontal: 1.5em;
+ height: 1em; }
+
+.popup-slider-menu-item,
+.slider {
-slider-height: 4px;
-slider-background-color: #cfd6e6;
-slider-border-color: transparent;
@@ -239,6 +247,8 @@ StScrollBar {
min-width: 200px;
color: #5c616c;
border-image: url("light-assets/menu/menu.svg") 9 9 9 9; }
+ .popup-menu-arrow {
+ icon-size: 16px; }
.popup-menu .popup-sub-menu {
background-gradient-direction: none;
box-shadow: none;
@@ -1075,10 +1085,71 @@ StScrollBar {
.sound-playback-control {
padding: 5px 10px 10px 10px; }
+.sound-player {
+ padding: 0 4px; }
+ .sound-player > StBoxLayout:first-child {
+ padding: 5px 10px 12px 10px;
+ spacing: 0.5em; }
+ .sound-player > StBoxLayout:first-child StButton:small {
+ width: 16px;
+ height: 8px;
+ padding: 1px; }
+ .sound-player > StBoxLayout:first-child StButton:small StIcon {
+ icon-size: 12px; }
+ .sound-player-generic-coverart {
+ background: rgba(0, 0, 0, 0.2); }
+ .sound-player-overlay {
+ width: 290px;
+ height: 70px;
+ padding: 15px;
+ spacing: 0.5em;
+ background: rgba(42, 45, 55, 0.85);
+ border: 0px solid rgba(31, 33, 40, 0.95);
+ border-bottom: 1px;
+ color: #BAC3CF; }
+ .sound-player-overlay StButton {
+ width: 22px;
+ height: 13px;
+ padding: 5px;
+ color: #BAC3CF;
+ border-radius: 2px;
+ border: 1px solid rgba(53, 57, 69, 0); }
+ .sound-player-overlay StButton StIcon {
+ icon-size: 16px; }
+ .sound-player-overlay StButton:hover {
+ text-shadow: 0 1px rgba(255, 255, 255, 0);
+ color: #BAC3CF;
+ border: 1px solid rgba(26, 28, 34, 0.35);
+ background-color: rgba(119, 127, 151, 0.45); }
+ .sound-player-overlay StButton:active {
+ text-shadow: 0 1px rgba(255, 255, 255, 0);
+ color: #ffffff;
+ background-color: #5294E2;
+ border: 1px solid #5294E2;
+ box-shadow: inset 0 2px 4px #5294E2; }
+ .sound-player-overlay StBoxLayout {
+ padding-top: 2px; }
+ .sound-player .slider {
+ height: 0.5em;
+ padding: 0;
+ border: none;
+ -slider-height: 0.5em;
+ -slider-background-color: #cfd6e6;
+ -slider-border-color: transparent;
+ -slider-active-background-color: #5294E2;
+ -slider-active-border-color: transparent;
+ -slider-border-width: 0px;
+ -slider-handle-radius: 0px; }
+
#workspaceSwitcher {
spacing: 0px;
padding: 3px; }
+/* Controls the styling when using the "Simple buttons" option */
+.workspace-switcher {
+ padding-left: 3px;
+ padding-right: 3px; }
+
.workspace-button {
width: 20px;
height: 10px;
@@ -1091,6 +1162,32 @@ StScrollBar {
.workspace-button:hover {
color: rgba(82, 148, 226, 0.5); }
+/* Controls the style when using the "Visual representation" option */
+.workspace-graph {
+ padding: 3px;
+ spacing: 3px; }
+
+.workspace-graph .workspace {
+ border: 1px solid rgba(0, 0, 0, 0.4);
+ background-gradient-direction: none;
+ background-color: rgba(0, 0, 0, 0.2); }
+
+.workspace-graph .workspace:active {
+ border: 1px solid #5294E2;
+ background-gradient-direction: none; }
+
+.workspace-graph .workspace .windows {
+ -active-window-background: rgba(76, 82, 99, 0.95);
+ -active-window-border: rgba(0, 0, 0, 0.8);
+ -inactive-window-background: rgba(76, 82, 99, 0.95);
+ -inactive-window-border: rgba(0, 0, 0, 0.8); }
+
+.workspace-graph .workspace:active .windows {
+ -active-window-background: rgba(87, 93, 113, 0.95);
+ -active-window-border: rgba(0, 0, 0, 0.8);
+ -inactive-window-background: rgba(54, 58, 70, 0.95);
+ -inactive-window-border: rgba(0, 0, 0, 0.8); }
+
#panel-launchers-box {
padding-left: 7px; }
diff --git a/common/cinnamon/common-assets/misc/sound-overlay.svg b/common/cinnamon/common-assets/misc/sound-overlay.svg
new file mode 100644
index 0000000..ad62be0
--- /dev/null
+++ b/common/cinnamon/common-assets/misc/sound-overlay.svg
@@ -0,0 +1,68 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ width="32"
+ height="32"
+ viewBox="0 0 32 32"
+ id="svg5386"
+ version="1.1"
+ inkscape:version="0.91 r13725"
+ sodipodi:docname="sound-overlay.svg">
+ <defs
+ id="defs5388" />
+ <sodipodi:namedview
+ id="base"
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1.0"
+ inkscape:pageopacity="0.0"
+ inkscape:pageshadow="2"
+ inkscape:zoom="16"
+ inkscape:cx="21.881475"
+ inkscape:cy="5.8350717"
+ inkscape:document-units="px"
+ inkscape:current-layer="layer1"
+ showgrid="true"
+ units="px"
+ inkscape:snap-bbox="true"
+ inkscape:bbox-paths="true"
+ inkscape:bbox-nodes="true"
+ inkscape:snap-bbox-edge-midpoints="true">
+ <inkscape:grid
+ type="xygrid"
+ id="grid5954" />
+ </sodipodi:namedview>
+ <metadata
+ id="metadata5391">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ <dc:title />
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <g
+ inkscape:label="Ebene 1"
+ inkscape:groupmode="layer"
+ id="layer1"
+ transform="translate(0,-1020.3622)">
+ <rect
+ style="display:inline;opacity:0.75;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+ id="rect4164"
+ width="22"
+ height="32.000019"
+ x="5"
+ y="1020.3622" />
+ </g>
+</svg>
diff --git a/common/cinnamon/sass/_common.scss b/common/cinnamon/sass/_common.scss
index 1a16835..6568dfd 100644
--- a/common/cinnamon/sass/_common.scss
+++ b/common/cinnamon/sass/_common.scss
@@ -133,10 +133,19 @@ StScrollBar {
}
}
+.separator {
+ -gradient-height: 1px;
+ -gradient-start: rgba(0,0,0,0);
+ -gradient-end: rgba(0,0,0,0);
+ -margin-horizontal: 1.5em;
+ height: 1em;
+}
+
//
// Slider
//
-.popup-slider-menu-item {
+.popup-slider-menu-item,
+.slider {
-slider-height: 4px;
-slider-background-color: $button_border; //background of the trough
-slider-border-color: transparentize(black, 1); //trough border color
@@ -255,6 +264,8 @@ StScrollBar {
color: $fg_color;
border-image: url("#{$asset_path}/menu/menu.svg") 9 9 9 9;
+ &-arrow { icon-size: 16px; }
+
.popup-sub-menu {
background-gradient-direction: none;
box-shadow: none;
@@ -1303,6 +1314,70 @@ StScrollBar {
.sound-playback-control { padding: 5px 10px 10px 10px; }
+// 2.8
+.sound-player {
+ padding: 0 4px;
+
+ > StBoxLayout:first-child {
+ padding: 5px 10px 12px 10px;
+ spacing: 0.5em;
+
+ StButton:small {
+ width: 16px;
+ height: 8px;
+ padding: 1px;
+
+ StIcon { icon-size: 12px; }
+ }
+ }
+
+ &-generic-coverart {
+ background: rgba(0,0,0,0.2);
+ }
+
+ &-overlay {
+ width: 290px;
+ height: 70px;
+ padding: 15px;
+ spacing: 0.5em;
+ background: transparentize(darken($osd_bg_color, 5%), 0.1);
+ border: 0px solid darken($osd_bg_color, 10%);
+ border-bottom: 1px ;
+ color: $osd_fg_color;
+
+ StButton {
+ width: 22px;
+ height: 13px;
+ padding: 5px;
+ color: $osd_fg_color;
+ border-radius: 2px;
+ border: 1px solid transparentize($osd_bg_color,1);
+
+ StIcon { icon-size: 16px; }
+
+ &:hover{ @include button(osd-hover); }
+ &:active { @include button(active); }
+ }
+
+ StBoxLayout {
+ padding-top: 2px;
+ }
+ }
+
+ .slider {
+ height: 0.5em;
+ padding: 0;
+ border: none;
+ -slider-height: 0.5em;
+ -slider-background-color: if($variant == 'light', $button_border, darken($bg_color, 5%));
+ -slider-border-color: rgba(0,0,0,0);
+ -slider-active-background-color: $selected_bg_color;
+ -slider-active-border-color: rgba(0,0,0,0);
+ -slider-border-width: 0px;
+ -slider-handle-radius: 0px;
+ }
+}
+
//
// Workspace Switcher applet (workspaceSwitcher.js)
//
@@ -1311,6 +1386,12 @@ StScrollBar {
padding: 3px;
}
+/* Controls the styling when using the "Simple buttons" option */
+.workspace-switcher {
+ padding-left: 3px;
+ padding-right: 3px;
+}
+
.workspace-button {
width: 20px;
height: 10px;
@@ -1323,6 +1404,37 @@ StScrollBar {
&:hover { color: transparentize($selected_bg_color, 0.5) }
}
+/* Controls the style when using the "Visual representation" option */
+.workspace-graph {
+ padding: 3px;
+ spacing: 3px;
+}
+
+.workspace-graph .workspace {
+ border: 1px solid transparentize(black, 0.6);
+ background-gradient-direction: none;
+ background-color: transparentize(black, 0.8);
+}
+
+.workspace-graph .workspace:active {
+ border: 1px solid $selected_bg_color;
+ background-gradient-direction: none;
+}
+
+.workspace-graph .workspace .windows {
+ -active-window-background: lighten($panel_bg, 15%);
+ -active-window-border: rgba(0, 0, 0, 0.8);
+ -inactive-window-background: lighten($panel_bg, 15%);
+ -inactive-window-border: rgba(0, 0, 0, 0.8);
+}
+
+.workspace-graph .workspace:active .windows {
+ -active-window-background: lighten($panel_bg, 20%);
+ -active-window-border: rgba(0, 0, 0, 0.8);
+ -inactive-window-background: lighten($panel_bg, 5%);
+ -inactive-window-border: rgba(0, 0, 0, 0.8);
+}
+
//
// Panel Launchers Applet (panelLaunchers.js)
//