diff --git a/Railway/cinnamon/cinnamon.css b/Railway/cinnamon/cinnamon.css index 458c97b..5179054 100644 --- a/Railway/cinnamon/cinnamon.css +++ b/Railway/cinnamon/cinnamon.css @@ -3410,3 +3410,60 @@ or .applet-icon, width: 16px; height: 16px; } + +/* ====================================== + * ! Transparent panels + * ====================================== */ +.panel-transparent, +.panel-transparent-with-shadow { + text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.75); +} + +.panel-transparent .system-status-icon, +.panel-transparent-with-shadow .system-status-icon { + icon-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); +} + +.panel-transparent .window-list-item-box, +.panel-transparent-with-shadow .window-list-item-box { + text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.75); +} + +.panel-transparent #panelLeft, .panel-transparent #panelCenter, .panel-transparent #panelRight, +.panel-transparent-with-shadow #panelLeft, +.panel-transparent-with-shadow #panelCenter, +.panel-transparent-with-shadow #panelRight { + border-image: none; +} + +.panel-transparent { + background: transparent; +} + +.panel-transparent-with-shadow.panel-top { + background-gradient-direction: vertical; + background-gradient-start: rgba(0, 0, 0, 0.4); + background-gradient-end: transparent; +} + +.panel-transparent-with-shadow.panel-bottom { + background-gradient-direction: vertical; + background-gradient-start: transparent; + background-gradient-end: rgba(0, 0, 0, 0.4); +} + +.panel-transparent-with-shadow.panel-left { + background-gradient-direction: horizontal; + background-gradient-start: rgba(0, 0, 0, 0.4); + background-gradient-end: transparent; +} + +.panel-transparent-with-shadow.panel-right { + background-gradient-direction: horizontal; + background-gradient-start: transparent; + background-gradient-end: rgba(0, 0, 0, 0.4); +} + +.panel-semi-transparent { + /* Do nothing, theme is already semi-transparent */ +} diff --git a/Railway/cinnamon/scss/third-party__extensions/0-INDEX.scss b/Railway/cinnamon/scss/third-party__extensions/0-INDEX.scss index eecd046..3071dee 100644 --- a/Railway/cinnamon/scss/third-party__extensions/0-INDEX.scss +++ b/Railway/cinnamon/scss/third-party__extensions/0-INDEX.scss @@ -1 +1,2 @@ @import "g-tile"; +@import "transparent-panels"; diff --git a/Railway/cinnamon/scss/third-party__extensions/_transparent-panels.scss b/Railway/cinnamon/scss/third-party__extensions/_transparent-panels.scss new file mode 100644 index 0000000..9e8b467 --- /dev/null +++ b/Railway/cinnamon/scss/third-party__extensions/_transparent-panels.scss @@ -0,0 +1,55 @@ +/* ====================================== + * ! Transparent panels + * ====================================== */ + +.panel-transparent, +.panel-transparent-with-shadow { + text-shadow: 1px 1px 2px rgba(#000, .75); + .system-status-icon { + icon-shadow: 1px 1px 2px rgba(#000, .5); + } + + .window-list-item-box { + text-shadow: 1px 1px 2px rgba(#000, .75); + } + + #panelLeft, #panelCenter, #panelRight { + border-image: none; + } +} + +.panel-transparent { + background: transparent; +} + +.panel-transparent-with-shadow { + $initial-color: rgba(#000, .4); + + &.panel-top { + background-gradient-direction: vertical; + background-gradient-start: $initial-color; + background-gradient-end: transparent; + } + + &.panel-bottom { + background-gradient-direction: vertical; + background-gradient-start: transparent; + background-gradient-end: $initial-color; + } + + &.panel-left { + background-gradient-direction: horizontal; + background-gradient-start: $initial-color; + background-gradient-end: transparent; + } + + &.panel-right { + background-gradient-direction: horizontal; + background-gradient-start: transparent; + background-gradient-end: $initial-color; + } +} + +.panel-semi-transparent { + /* Do nothing, theme is already semi-transparent */ +}