github/svgedit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Variabilisation of icon bkgd colors

Browse Source 
Update of color choice to fit new icons design
This commit is contained in:
mathieucura
2021-01-10 11:04:48 +01:00
parent 2a709c0e5f
commit 8da8747155
4 changed files with 15 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/editor/components/seButton.js
View File

@@ -6,7 +6,7 @@ template.innerHTML = `
<style>
:host(:hover) :not(.disabled)
{
background-color: #2B3C45;
background-color: var(--icon-bg-color-hover);
}
div
{
@@ -14,7 +14,7 @@ template.innerHTML = `
width: 24px;
margin: 2px 2px 4px;
padding: 3px;
background-color: #72797A;
background-color: var(--icon-bg-color);
cursor: pointer;
border-radius: 3px;
}
@@ -30,7 +30,7 @@ template.innerHTML = `
height: 100%;
}
.pressed {
background-color: #2B3C45;
background-color: var(--icon-bg-color-hover);
}
.disabled {
opacity: 0.3;

7
src/editor/components/seExplorerButton.js
View File

@@ -16,11 +16,10 @@ template.innerHTML = `
.overall.pressed .button-icon,
.overall.pressed,
.menu-item.pressed {
background-color: #2B3C45 !important;
background-color: var(--icon-bg-color-hover) !important;
}
.overall.pressed .menu-button {
box-shadow: inset 1px 1px 2px rgba(0,0,0,0.4), 1px 1px 0 white !important;
background-color: #2B3C45 !important;
background-color: var(--icon-bg-color-hover) !important;
}
.disabled {
opacity: 0.3;
@@ -31,7 +30,7 @@ template.innerHTML = `
width: 24px;
margin: 2px 2px 4px;
padding: 3px;
background-color: #72797A;
background-color: var(--icon-bg-color);
cursor: pointer;
position: relative;
border-radius: 3px;

8
src/editor/components/seFlyingButton.js
View File

@@ -6,7 +6,7 @@ template.innerHTML = `
}
.overall:hover *
{
background-color: #2B3C45;
background-color: var(--icon-bg-color-hover);
}
img {
border: none;
@@ -15,10 +15,10 @@ template.innerHTML = `
}
.overall.pressed .button-icon,
.overall.pressed .handle {
background-color: #2B3C45 !important;
background-color: var(--icon-bg-color-hover) !important;
}
.overall.pressed .menu-button {
background-color: #2B3C45 !important;
background-color: var(--icon-bg-color-hover) !important;
}
.disabled {
opacity: 0.3;
@@ -29,7 +29,7 @@ template.innerHTML = `
width: 24px;
margin: 2px 2px 4px;
padding: 3px;
background-color: #72797A;
background-color: var(--icon-bg-color);
cursor: pointer;
position: relative;
border-radius: 3px;

8
src/editor/svgedit.css
View File

@@ -1,13 +1,15 @@
:root{
--main-bg-color: #f4f4f4;
--main-bg-color: #72797A;
--text-color: #000000;
--border-color: #808080;
--canvas-bg-color: radial-gradient(#7a7676, #ffffff 50%);
--link-color: #19c;
--ruler-color: #f4f4f4;
--icon-bg-color: #72797A;
--icon-bg-color-hover: #2B3C45;
}
body {
body {
background: var(--main-bg-color);
}
@@ -123,7 +125,7 @@ hr {
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
align-items: center;
}
#layerlist {