Update dark mode styles.

This commit is contained in:
kovacsv 2021-08-28 11:48:29 +02:00
parent 281e789261
commit 464c431ac6
7 changed files with 59 additions and 56 deletions

View File

@ -56,7 +56,7 @@ h1
margin-top: 30px;
margin-bottom: 20px;
padding: 10px 0px;
border-bottom: 1px solid var(--ov_light_border_color);
border-bottom: 1px solid var(--ov_border_color);
}
h1 a
@ -76,7 +76,7 @@ h2
margin-top: 30px;
margin-bottom: 20px;
padding: 10px 0px;
border-bottom: 1px solid var(--ov_light_border_color);
border-bottom: 1px solid var(--ov_border_color);
}
h3
@ -120,7 +120,7 @@ table
table td, th
{
padding: 10px;
border: 1px solid var(--ov_light_border_color);
border: 1px solid var(--ov_border_color);
}
table th

View File

@ -26,7 +26,7 @@ div.ov_svg_icon.light
div.ov_svg_icon.selected
{
color: var(--ov_primary_color);
color: var(--ov_button_color);
}
div.ov_thin_scrollbar
@ -48,18 +48,18 @@ div.ov_thin_scrollbar::-webkit-scrollbar-thumb
div.ov_button
{
color: var(--ov_secondary_color);
background: var(--ov_primary_color);
color: var(--ov_button_text_color);
background: var(--ov_button_color);
text-align: center;
padding: 3px;
border: 1px solid var(--ov_primary_color);
border: 1px solid var(--ov_button_color);
border-radius: 5px;
cursor: pointer;
}
div.ov_button.outline
{
color: var(--ov_primary_color);
color: var(--ov_button_color);
background: transparent;
}
@ -67,7 +67,7 @@ div.ov_tooltip
{
color: var(--ov_foreground_color);
background: var(--ov_background_color);
border: 1px solid var(--ov_light_border_color);
border: 1px solid var(--ov_border_color);
padding: 5px 10px;
border-radius: 5px;
position: absolute;
@ -79,14 +79,14 @@ div.ov_tooltip
div.ov_button:hover
{
background: var(--ov_primary_hover_color);
border: 1px solid var(--ov_primary_hover_color);
background: var(--ov_button_hover_color);
border: 1px solid var(--ov_button_hover_color);
}
div.ov_button.outline:hover
{
background: var(--ov_secondary_hover_color);
border: 1px solid var(--ov_primary_color);
background: var(--ov_hover_color);
border: 1px solid var(--ov_button_color);
}
}

View File

@ -2,20 +2,21 @@
{
--ov_foreground_color: #000000;
--ov_background_color: #ffffff;
--ov_primary_color: #3393bd;
--ov_primary_hover_color: #146a8f;
--ov_secondary_color: #ffffff;
--ov_secondary_hover_color: #e4f4ff;
--ov_button_color: #3393bd;
--ov_button_hover_color: #146a8f;
--ov_button_text_color: #ffffff;
--ov_icon_color: #263238;
--ov_hover_color: #c9e5f8;
--ov_light_icon_color: #838383;
--ov_logo_text_color: #15334a;
--ov_logo_border_color: #000000;
--ov_toolbar_background_color: #f5f5f5;
--ov_toolbar_selected_background_color: #e1e1e1;
--ov_toolbar_selected_color: #e1e1e1;
--ov_toolbar_separator_color: #cccccc;
--ov_treeview_selected_color: #eeeeee;
--ov_dialog_foreground_color: #000000;
--ov_dialog_background_color: #ffffff;
--ov_border_color: #cccccc;
--ov_light_border_color: #dddddd;
--ov_border_color: #dddddd;
--ov_shadow: 0px 0px 10px #cccccc;
--ov_small_shadow: 0px 0px 3px #cccccc;
}
@ -41,7 +42,7 @@ html, body
a
{
color: var(--ov_primary_color);
color: var(--ov_button_color);
text-decoration: none;
}

View File

@ -104,7 +104,7 @@ div.ov_dialog a.ov_dialog_file_link
div.ov_dialog div.ov_file_link_img
{
color: var(--ov_primary_color);
color: var(--ov_button_color);
margin-right: 10px;
float: left;
}
@ -117,7 +117,7 @@ div.ov_dialog div.ov_dialog_file_link_text
div.ov_dialog div.ov_dialog_copyable_input
{
padding: 3px;
border: 1px solid var(--ov_light_border_color);
border: 1px solid var(--ov_border_color);
border-radius: 5px;
overflow: auto;
}
@ -221,12 +221,12 @@ div.ov_progress div.ov_progress_text
div.ov_dialog a.ov_dialog_file_link:hover
{
background: var(--ov_secondary_hover_color);
background: var(--ov_hover_color);
}
div.ov_popup div.ov_popup_list_item:hover
{
background: var(--ov_secondary_hover_color);
background: var(--ov_hover_color);
}
}

View File

@ -12,8 +12,8 @@ div.ov_tree_view div.ov_tree_item
div.ov_tree_view div.ov_tree_item.selected
{
background: #eeeeee;
font-weight: bold;;
background: var(--ov_treeview_selected_color);
font-weight: bold;
}
div.ov_tree_view div.ov_tree_item.clickable
@ -59,7 +59,7 @@ div.ov_tree_view div.ov_tree_view_children
div.ov_tree_view div.ov_tree_item.clickable:hover
{
background: var(--ov_secondary_hover_color);
background: var(--ov_hover_color);
}
}

View File

@ -125,7 +125,7 @@ div.main_sidebar
div.main_viewer canvas
{
margin: 10px;
border: 1px solid var(--ov_light_border_color);
border: 1px solid var(--ov_border_color);
outline: none;
display: block;
}
@ -150,12 +150,12 @@ div.ov_toolbar div.ov_toolbar_button.right
div.ov_toolbar div.ov_toolbar_button.selected
{
background: var(--ov_toolbar_selected_background_color);
background: var(--ov_toolbar_selected_color);
}
div.ov_toolbar div.ov_toolbar_separator
{
background: var(--ov_border_color);
background: var(--ov_toolbar_separator_color);
width: 1px;
height: 28px;
margin: 5px 8px;
@ -170,7 +170,7 @@ div.ov_navigator_tree_title
overflow: hidden;
padding-bottom: 10px;
margin-bottom: 10px;
border-bottom: 1px solid var(--ov_light_border_color);
border-bottom: 1px solid var(--ov_border_color);
}
div.ov_navigator_tree_panel
@ -182,14 +182,14 @@ div.ov_navigator_tree_panel
div.ov_navigator_info_panel
{
overflow: auto;
border-top: 1px solid var(--ov_light_border_color);
border-top: 1px solid var(--ov_border_color);
}
div.ov_navigator_info_panel div.ov_navigator_info_button
{
cursor: pointer;
margin-top: 10px;
border: 1px solid var(--ov_light_border_color);
border: 1px solid var(--ov_border_color);
border-radius: 5px;
overflow: auto;
}
@ -215,7 +215,7 @@ div.ov_sidebar_title
overflow: hidden;
padding-bottom: 10px;
margin-bottom: 10px;
border-bottom: 1px solid var(--ov_light_border_color);
border-bottom: 1px solid var(--ov_border_color);
}
div.ov_sidebar_title div.ov_sidebar_title_text
@ -290,7 +290,7 @@ div.ov_property_table_custom
{
margin-top: 8px;
padding-top: 8px;
border-top: 1px solid var(--ov_light_border_color);
border-top: 1px solid var(--ov_border_color);
}
div.ov_property_table div.ov_property_table_row
@ -336,7 +336,7 @@ div.ov_property_table div.ov_property_table_value
div.ov_property_table div.ov_property_table_button
{
color: var(--ov_primary_color);
color: var(--ov_button_color);
cursor: pointer;
}
@ -345,22 +345,22 @@ div.ov_property_table div.ov_property_table_button
div.title_right div.header_button:hover
{
color: var(--ov_primary_color);
color: var(--ov_button_color);
}
div.ov_toolbar div.ov_toolbar_button:hover
{
background: #c9e5f8;
background: var(--ov_hover_color);
}
div.ov_navigator_info_panel div.ov_navigator_info_panel_title:hover
{
background: var(--ov_secondary_hover_color);
background: var(--ov_hover_color);
}
div.ov_navigator_info_panel div.ov_navigator_info_button:hover
{
background: var(--ov_secondary_hover_color);
background: var(--ov_hover_color);
}
}

View File

@ -5,20 +5,21 @@ OV.ThemeHandler = class {
'css' : {
'--ov_foreground_color': '#000000',
'--ov_background_color': '#ffffff',
'--ov_primary_color': '#3393bd',
'--ov_primary_hover_color': '#146a8f',
'--ov_secondary_color': '#ffffff',
'--ov_secondary_hover_color': '#e4f4ff',
'--ov_button_color': '#3393bd',
'--ov_button_hover_color': '#146a8f',
'--ov_button_text_color': '#ffffff',
'--ov_icon_color': '#263238',
'--ov_hover_color': '#c9e5f8',
'--ov_light_icon_color': '#838383',
'--ov_logo_text_color': '#15334a',
'--ov_logo_border_color': '#000000',
'--ov_toolbar_background_color': '#f5f5f5',
'--ov_toolbar_selected_background_color': '#e1e1e1',
'--ov_toolbar_selected_color': '#e1e1e1',
'--ov_toolbar_separator_color': '#cccccc',
'--ov_treeview_selected_color': '#eeeeee',
'--ov_dialog_foreground_color': '#000000',
'--ov_dialog_background_color': '#ffffff',
'--ov_border_color': '#cccccc',
'--ov_light_border_color': '#dddddd',
'--ov_border_color': '#dddddd',
'--ov_shadow': '0px 0px 10px #cccccc',
'--ov_small_shadow': '0px 0px 3px #cccccc'
}
@ -26,21 +27,22 @@ OV.ThemeHandler = class {
'dark' : {
'css' : {
'--ov_foreground_color': '#fafafa',
'--ov_background_color': '#222222',
'--ov_primary_color': '#3393bd',
'--ov_primary_hover_color': '#146a8f',
'--ov_secondary_color': '#ffffff',
'--ov_secondary_hover_color': '#e4f4ff',
'--ov_background_color': '#2a2b2e',
'--ov_button_color': '#3393bd',
'--ov_button_hover_color': '#146a8f',
'--ov_button_text_color': '#ffffff',
'--ov_icon_color': '#fafafa',
'--ov_hover_color': '#667c86',
'--ov_light_icon_color': '#dadada',
'--ov_logo_text_color': '#fafafa',
'--ov_logo_border_color': '#fafafa',
'--ov_toolbar_background_color': '#333333',
'--ov_toolbar_selected_background_color': '#444444',
'--ov_toolbar_background_color': '#3d3e42',
'--ov_toolbar_selected_color': '#272727',
'--ov_toolbar_separator_color': '#888888',
'--ov_treeview_selected_color': '#38393d',
'--ov_dialog_foreground_color': '#fafafa',
'--ov_dialog_background_color': '#333333',
'--ov_border_color': '#444444',
'--ov_light_border_color': '#333333',
'--ov_shadow': 'none',
'--ov_small_shadow': 'none'
}