Add Bright UI Text theme color option

This commit is contained in:
JannisX11 2021-08-27 18:41:18 +02:00
parent 8ca28d9e9c
commit 223aaad47a
8 changed files with 21 additions and 14 deletions

View File

@ -1,7 +1,7 @@
{
"new_version": {
"color": "var(--color-bright_ui)",
"text_color": "var(--color-accent_text)",
"text_color": "var(--color-bright_ui_text)",
"graphic": {
"type": "image",
"source": "https://web.blockbench.net/content/splash_art.png?39",

View File

@ -627,7 +627,7 @@
background-color: var(--color-accent_text);
}
.theme_preview_menu > .theme_preview_text {
background-color: var(--color-accent_text);
background-color: var(--color-bright_ui_text);
display: block;
margin: 10px 7px;
}

View File

@ -191,7 +191,7 @@
width: fit-content;
padding: 0 12px;
background-color: var(--color-bright_ui);
color: var(--color-accent_text);
color: var(--color-bright_ui_text);
box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);;
text-align: center;
overflow-wrap: break-word;
@ -214,7 +214,7 @@
min-width: 100px;
max-width: 200px;
background-color: var(--color-bright_ui);
color: var(--color-accent_text);
color: var(--color-bright_ui_text);
box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);;
text-align: center;
cursor: default;
@ -238,7 +238,7 @@
position: absolute;
text-align: center;
background-color: var(--color-bright_ui);
color: var(--color-accent_text);
color: var(--color-bright_ui_text);
padding: 3px 8px;
pointer-events: none;
}
@ -416,9 +416,9 @@
padding-left: 5px;
padding-right: 5px;
padding-top: 2px;
color: var(--color-accent_text);
margin-top: 30px;
background: var(--color-bright_ui);
color: var(--color-bright_ui_text);
margin-top: 30px;
white-space: nowrap;
z-index: 18;
box-shadow: 0 0.4px 3.5px rgba(0, 0, 0, 0.6);
@ -457,7 +457,7 @@
width: fit-content;
min-width: 110px;
background-color: var(--color-bright_ui);
color: var(--color-accent_text);
color: var(--color-bright_ui_text);
z-index: 20;
box-shadow: 0.4px 0.4px 4px rgba(0, 0, 0, 0.7);
cursor: default;
@ -523,7 +523,8 @@
height: 2px;
width: 100%;
padding: 0;
background-color: var(--color-bright_border);
background-color: var(--color-bright_ui_text);
opacity: 0.28;
}
.contextMenu li.highlighted {
animation: menu_item_highlight 1s infinite ease-in-out;

View File

@ -1434,7 +1434,7 @@
height: 30px;
padding: 3px;
float: left;
color: var(--color-accent_text);
color: var(--color-bright_ui_text);
text-align: center;
}
#texture_pasting_overlay > div.control > div:hover {

View File

@ -303,6 +303,7 @@
--color-text: #cacad4;
--color-light: #f4f3ff;
--color-accent_text: #000006;
--color-bright_ui_text: #000006;
--color-subtle_text: #848891;
--color-bright_ui: #f4f3ff;
--color-bright_border: var(--color-text);

View File

@ -27,6 +27,7 @@ const CustomTheme = {
text: '#cacad4',
light: '#f4f3ff',
accent_text: '#000006',
bright_ui_text: '#000006',
subtle_text: '#848891',
grid: '#495061',
wireframe: '#576f82',
@ -380,7 +381,8 @@ const CustomTheme = {
}
}
if (data.text_acc) {
app.colors.accent_text = data.text_acc
app.colors.accent_text = data.text_acc;
app.colors.bright_ui_text = data.text_acc;
}
} else if (data && data.colors) {

View File

@ -507,7 +507,9 @@
"layout.color.light": "Light",
"layout.color.light.desc": "Highlighted text",
"layout.color.accent_text": "Accent Text",
"layout.color.accent_text.desc": "Text on bright or accent elements",
"layout.color.accent_text.desc": "Text on accent backgrounds",
"layout.color.bright_ui_text": "Bright UI",
"layout.color.bright_ui_text.desc": "Text on bright backgrounds",
"layout.color.subtle_text": "Subtle Text",
"layout.color.subtle_text.desc": "Secondary text color with less contrast",
"layout.color.checkerboard": "Checkerboard",

View File

@ -6,7 +6,7 @@
"main_font": "",
"headline_font": "",
"code_font": "",
"css": ".contextMenu,\ndialog,\n.dialog_close_button,\n#start_screen content,\n#quick_message_box,\naction_selector > #action_selector_list\n{\n border: 1px solid var(--color-border);\n}\n#start_screen section {\n border-bottom: 1px solid var(--color-border);\n}\n.panel {\n margin-top: -1px;\n border-top: 01px solid var(--color-border);\n}\n#right_bar {\n border-left: 1px solid var(--color-border);\n}\n#left_bar {\n border-right: 1px solid var(--color-border);\n}\n.preview .preview_menu {\n right: 0;\n}\n.dialog_sidebar {\n border-right: 1px solid var(--color-border);\n}\n.dialog_handle {\n background: transparent;\n border-bottom: 1px solid var(--color-border);\n}\n.dialog_close_button {\n right: -1px;\n top: -1px;\n height: 31px;\n}\n#work_screen {\n grid-template-rows: 31px minmax(200px, 5000px) 26px;\n}\n#main_toolbar, #tab_bar {\n border-bottom: 01px solid var(--color-border);\n}\n#status_bar {\n border-top: 01px solid var(--color-border);\n}\n\n#mode_selector li {\n padding: 2px 10px;\n}\n#mode_selector li.selected {\n background-color: var(--color-accent);\n color: var(--color-accent_text);\n}\n\n#tab_bar .project_tab.selected,\n.dialog_sidebar_pages li.selected,\n.tool.enabled\n{\n background-color: var(--color-accent) !important;\n color: var(--color-accent_text);\n}\n.contextMenu li {\n height: 34px;\n padding-top: 6px;\n padding-bottom: 6px;\n}\n.contextMenu li.menu_separator {\n height: 2px;\n padding: 0;\n background-color: var(--color-border);\n}\n.dialog_sidebar_pages li.selected {\n background-color: var(--color-accent) !important;\n color: var(--color-accent_text);\n}",
"css": ".contextMenu,\ndialog,\n.dialog_close_button,\n#start_screen content,\n#quick_message_box,\naction_selector > #action_selector_list\n{\n border: 1px solid var(--color-border);\n}\n#start_screen section {\n border-bottom: 1px solid var(--color-border);\n}\n.panel {\n margin-top: -1px;\n border-top: 01px solid var(--color-border);\n}\n#right_bar {\n border-left: 1px solid var(--color-border);\n}\n#left_bar {\n border-right: 1px solid var(--color-border);\n}\n.preview .preview_menu {\n right: 0;\n}\n.dialog_sidebar {\n border-right: 1px solid var(--color-border);\n}\n.dialog_handle {\n background: transparent;\n border-bottom: 1px solid var(--color-border);\n}\n.dialog_close_button {\n right: -1px;\n top: -1px;\n height: 31px;\n}\nli.animation_file {\n border-top: 1px solid var(--color-border);\n}\n#work_screen {\n grid-template-rows: 31px minmax(200px, 5000px) 26px;\n}\n#main_toolbar, #tab_bar {\n border-bottom: 01px solid var(--color-border);\n}\n#status_bar {\n border-top: 01px solid var(--color-border);\n}\n\n#mode_selector li {\n padding: 2px 10px;\n}\n#mode_selector li.selected {\n background-color: var(--color-accent);\n color: var(--color-accent_text);\n}\n\n#tab_bar .project_tab.selected,\n.dialog_sidebar_pages li.selected,\n.tool.enabled\n{\n background-color: var(--color-accent) !important;\n color: var(--color-accent_text);\n}\n.contextMenu li {\n height: 34px;\n padding-top: 6px;\n padding-bottom: 6px;\n}\n.contextMenu li.menu_separator {\n height: 2px;\n padding: 0;\n background-color: var(--color-border);\n}\n.dialog_sidebar_pages li.selected {\n background-color: var(--color-accent) !important;\n color: var(--color-accent_text);\n}",
"colors": {
"ui": "#17191d",
"back": "#17191d",
@ -19,7 +19,8 @@
"frame": "#181a1f",
"text": "#d0d0db",
"light": "#f4f3ff",
"accent_text": "#dadae6",
"accent_text": "#eeeef5",
"bright_ui_text": "#d0d0dd",
"subtle_text": "#adb2bc",
"grid": "#727683",
"wireframe": "#5f96bc",