zrythm
/
zrythm-media
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

add open color css theme by lam

master
Alexandros Theodotou 2 years ago
parent
3fd20d0822
commit
4dbb381ae4
Signed by: alex
GPG Key ID: 022EAE42313D70F3
3 changed files with 602 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 5
      themes/css/lam-open-color1/README
  2. BIN
      themes/css/lam-open-color1/screenshot.png
  3. 597
      themes/css/lam-open-color1/theme.css

5
themes/css/lam-open-color1/README
Unescape View File

@ -0,0 +1,5 @@ @@ -0,0 +1,5 @@
Theme by LAM based on Open Color palette:
https://yeun.github.io/open-color/ (https://web.archive.org/web/20210616060808/https://yeun.github.io/open-color/)
Screenshot by LAM
Screenshot license: CC-BY 4.0

BIN
themes/css/lam-open-color1/screenshot.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 272 KiB

597
themes/css/lam-open-color1/theme.css
Unescape View File

@ -0,0 +1,597 @@ @@ -0,0 +1,597 @@
/*
* Copyright (C) 2018-2021 Alexandros Theodotou <alex at zrythm dot org>
* Copyright (C) 2021 LAM <matsynth at yahoo dot com>
*
* This file is part of Zrythm
*
* Zrythm is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* Zrythm is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
/*
* Define theme colors.
*
* These can be fetched with
* gtk_style_context_lookup_color().
*/
@define-color bg_color #212529;
@define-color bg_dark_variant1 #343a40;
@define-color bg_dark_variant2 #212529;
@define-color bg_darker_variant1 #343a40;
@define-color bg_darker_variant2 #212529;
@define-color bg_light_variant1 #212529;
@define-color bg_light_variant2 #495057;
@define-color bg_lighter_variant1 #495057;
@define-color bg_lighter_variant2 #343a40;
@define-color dark_variant1 #000000;
@define-color dark_variant2 #212529;
@define-color light_variant1 #495057;
@define-color light_variant2 #ced4da;
@define-color bright_green #66a80f;
@define-color darkish_green #66a80f;
@define-color dark_orange #fd7e14;
@define-color darker_orange #fd7e14;
@define-color z_yellow #fd7e14;
@define-color bright_orange #fd7e14;
@define-color z_purple #c2255c;
@define-color matcha #099268;
@define-color hover_color alpha (white, 0.1);
@define-color selection_color alpha (white, 0.07);
@define-color light_blueish #3b5bdb;
@define-color light_blueish alpha (#3b5bdb, 0.8);
@define-color prefader_send #c2255c;
@define-color postfader_send #099268;
@define-color solo_checked @darkish_green;
@define-color solo_active @matcha;
@define-color fader_fill_start @dark_orange;
@define-color fader_fill_end @z_yellow;
@define-color highlight_scale_bg #c2255c;
@define-color highlight_chord_bg #c2255c;
@define-color highlight_bass_bg @light_blueish;
@define-color highlight_both_bg #e64980;
@define-color highlight_scale_fg #fd7e14;
@define-color highlight_chord_fg @highlight_scale_fg;
@define-color highlight_bass_fg white;
@define-color highlight_both_fg white;
/* see https://coolors.co/ to generate more or use
* GPick */
window
{
-GtkWidget-window-dragging: true;
}
/*paned separator {*/
/*background-color: alpha(white, 0.80);*/
/*}*/
paned > separator {
min-height: 4px;
}
/*paned separator:hover {*/
/*background-color: alpha (white, 0.40);*/
/*}*/
/*paned#gpaned-instruments separator {*/
/*background-color: alpha(white, 0.22);*/
/*}*/
/*#gpaned-instruments separator:hover {*/
/*background-color: alpha (white, 0.40);*/
/*}*/
browser separator:hover
{
background-color: @hover_color;
}
browser separator
{
min-height: 6px;
}
entry:focus
{
border-color: @bright_orange;
}
spinbutton button:focus
{
border-left-color: @bright_orange;
}
entry selection
{
background-color: @z_yellow;
}
treeview.view:hover,
list row:hover,
scrollbar,
box.sidebar,
filechooser list
{
background-color: @bg_light_variant1;
}
/* for editing notebook tab line */
/*notebook > header.top > tabs > tab:hover {*/
/*box-shadow: inset 0 -2px alpha(#2eb398,0.6), 0 1px alpha(#2eb398,0.6);*/
/*}*/
/*notebook > header.top > tabs > tab:checked {*/
/*box-shadow: inset 0 -2px #2eb398, 0 1px #2eb398;*/
/*}*/
/*notebook > header.right > tabs > tab:hover {*/
/*box-shadow: inset 2px 0 alpha(#2eb398,0.6), -1px 0 alpha(#2eb398,0.6);*/
/*}*/
/*notebook > header.right > tabs > tab:checked {*/
/*box-shadow: inset 2px 0 #2eb398, -1px 0 #2eb398;*/
/*}*/
/*notebook > header.left > tabs > tab:hover {*/
/*box-shadow: inset -2px 0 alpha(#2eb398,0.6), 1px 0 alpha(#2eb398,0.6);*/
/*}*/
/*notebook > header.left > tabs > tab:checked {*/
/*box-shadow: inset -2px 0 #2eb398, 1px 0 #2eb398;*/
/*}*/
.header button.toggle:not(:checked)
{
background-color: @bg_darker_variant1;
}
treeview.view:selected,
list row:selected
{
background-color: @z_purple;
}
/* notebook page background */
notebook stack
{
background-color: @bg_color;
}
tracklist,
ruler,
piano-roll-labels,
window,
filechooser #pathbarbox,
paned
{
background-color: @bg_dark_variant1;
}
left-dock-edge notebook header,
right-dock-edge notebook header,
bot-dock-edge notebook header,
notebook header,
center-dock-bot-box,
center-dock-bot-box toolbar,
tracklist-header,
top-dock-edge,
top-dock-edge toolbar,
top-bar,
top-bar toolbar,
bot-bar,
bot-bar toolbar,
assistant,
buttonbox,
timeline-selection-info,
.timeline-toolbar,
piano-roll-selection-info,
piano-roll-toolbar,
browser toolbar,
dialog
{
background-color: @bg_dark_variant2;
}
browser toolbar
{
padding: 0px;
}
.header tabs,
.header header,
.header toolbar,
.header > box,
home-toolbar,
project-toolbar,
view-toolbar,
help-toolbar,
menubar
{
background-color: @bg_darker_variant2;
}
home-toolbar separator,
project-toolbar separator,
view-toolbar separator,
help-toolbar separator
{
background-color: grey;
margin: 4px;
}
.arranger-toolbar separator
{
background-color: alpha (grey, 0.6);
margin: 4px;
}
/*piano-roll-label.highlight_scale*/
/*{*/
/*background-color: alpha (#662266, 0.2);*/
/*}*/
/*piano-roll-label.highlight_chord*/
/*{*/
/*background-color: alpha (#BB22BB, 0.2);*/
/*}*/
/*piano-roll-label.highlight_both*/
/*{*/
/*background-color: alpha (#FF22FF, 0.2);*/
/*}*/
/* override button size from theme */
button
{
min-width: 4px;
min-height: 4px;
}
button.toggle,
button.popup,
button:not(.flat),
entry
{
background-color: @bg_light_variant2;
}
button.toggle:hover,
button.popup:hover,
button:hover,
button.flat:hover,
button.text-button:hover,
tooltip.background
{
background-color: @bg_lighter_variant1;
}
entry selection
{
color: @bg_lighter_variant1;
}
menu,
popover
{
background-color: @bg_lighter_variant2;
}
button:not(.record-button):not(.solo-button).toggle:checked,
stackswitcher button:checked,
menuitem:hover
{
background-color: @dark_orange;
}
button:not(.record-button).toggle:active,
.header button.toggle:active
{
background-color: @bright_orange;
}
button.toggle.record-button:checked
{
background-color: #ED2939;
}
button.toggle.solo-button:checked
{
background-color: @darkish_green;
}
button.toggle.record-button:active
{
background-color: #FF2400;
}
button.donate-button
{
border-radius: 8px;
}
button.toggle.solo-button:active
{
background-color: @matcha;
}
button:not(.toggle):active,
button.flat:not(.toggle):active,
button.text-button:active
{
background-color: @bright_orange;
}
bot-dock-edge toolbar
{
background-color: @bg_dark_variant2;
}
arranger-bg,
treeview.view,
list row,
timeline-minimap-bg
{
background-color: @bg_darker_variant1;
}
track-grid:selected,
channel:selected,
region:selected,
chord:selected,
marker:selected,
scale-object:selected,
midi-note:selected
velocity:selected,
automation-point:selected
{
background-color: @selection_color;
}
channel-slot:selected,
channel-send:selected
{
background-color: @light_blueish;
}
filechooser button:checked,
filechooser button:active
{
border-color: @selection_color;
}
track-grid:hover,
region:hover,
chord:hover,
scale-object:hover,
marker:hover,
fader:hover,
channel-slot:hover:not(:selected),
channel-send:hover:not(:selected),
balance-control:hover,
ruler-playhead:hover,
arranger-playhed:hover,
automation-point:hover
{
background-color: @hover_color;
}
.inspector expander-box,
.inspector two-col-expander-box,
modulator-view two-col-expander-box
{
margin: 4px;
border-style: solid;
border-width: 2px;
border-radius: 6px;
/* FIXME use predefined colors */
border-color: #555555;
}
/* curve the bottom edges of the fader section
* in the inspector */
.inspector .fader-controls-expander buttonbox
{
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
}
/* make mono switch smaller */
.track-input-expander button.toggle
{
padding-left: 4px;
padding-right: 4px;
}
.inspector expander-box >button,
.inspector two-col-expander-box>button
{
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
channel expander-box>button
{
/*border-top-left-radius: 6px;*/
/*border-top-right-radius: 6px;*/
}
channel expander-box
{
/*margin: 5px;*/
border-style: none;
border-width: 2px;
border-radius: 8px;
/* FIXME use predefined colors */
border-color: #BBBBBB;
}
channel button.flat
{
padding-left: 3px;
padding-right: 3px;
}
.piano_roll_key_box,
.chord_key
{
border-style: solid;
border-bottom-width: 1px;
border-color: alpha (grey, 0.3);
}
/* blend with header box on the right */
.header notebook {
border-right: 0px;
}
/* make the header box on the right match the
* style of the notebook */
.header > box {
border-top: 1px;
border-bottom: 1px;
border-right: 1px;
border-style: solid;
/* from matcha theme */
border-color: rgba (0, 0, 0, 0.2);
}
.header > box > box {
border-top: 1px;
border-style: solid;
border-color: #1b1b1b;
}
.header label,
.splash label,
statusbar {
font-size: 10.5pt;
}
center-dock > paned > paned > paned > separator {
background-color: alpha (white, 0.08);
}
center-dock > paned > paned > paned > separator:hover {
background-color: alpha (white, 0.12);
}
.thick-separator
{
min-height: 2px;
min-width: 2px;
}
track-lane,
automation-lane
{
border-style: solid;
border-top-width: 2px;
border-color: alpha (grey, 0.3);
}
.section_heading
{
font-weight: bold;
font-size: small;
}
.channel_label
{
font-size: small;
}
.channel_label_smaller
{
font-size: smaller;
}
.route_target_selector
{
padding-left: 1px;
padding-right: 1px;
}
/* statckswitcher in the inspector */
stackswitcher button image
{
padding-top: 0px;
padding-bottom: 0px;
padding-left: 3px;
padding-right: 3px;
}
textview {
font-family: Monospace;
font-size: 11pt;
}
/* button without padding */
.mini-button
{
padding: 0px;
}
.small-button
{
padding: 3px;
}
.left-of-ruler-box button
{
min-width: 24px;
}
.inspector_label
{
font-size: small;
}
/* arrow button */
.button-with-menu button
{
padding: 0;
border-width: 0;
min-height: 24px;
}
/* make dock tab height */
left-dock-edge notebook tab,
right-dock-edge notebook tab
{
min-height: 24px;
}
/*.button-with-menu separator*/
/*{*/
/*background-color: alpha (grey, 0.6);*/
/*margin-top: 2px;*/
/*margin-bottom: 2px;*/
/*margin-left: 0px;*/
/*margin-right: 0px;*/
/*min-height: 24px;*/
/*}*/
/* make snap grid popover buttons small */
popover.snap-grid-popover button.note-type {
padding: 0px 4px 0px 4px;
}
/* to be used on currently selected part of the UI
* (e.g., timeline, tracklist, etc.) */
.selected-element {
border: 2px solid alpha (#ccc, 0.4);
padding: 1px;
border-radius: 3px;
}
.selectable-element {
padding: 3px;
}
Write Preview
Loading…
Cancel
Save