fork/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2026-09-20 23:08:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

Update UI colors and alignment for consistency with the design mockup (#157)

Browse Source 
Closes #111
This commit is contained in:
Keavon Chambers
2021-05-23 19:01:13 -07:00
parent 4b19a459b7
commit 34efac990b
21 changed files with 286 additions and 182 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/web/src/components/widgets/buttons/IconButton.vue
+5 -9
View File
@@ -1,5 +1,5 @@
<template>
<button class="icon-button" :class="[`size-${String(size)}`, gapAfter && 'gap-after']">
<button class="icon-button" :class="`size-${String(size)}`">
<slot></slot>
</button>
</template>
@@ -14,7 +14,7 @@
border-radius: 2px;
background: none;
vertical-align: top;
fill: #ddd;
fill: var(--color-e-nearwhite);
width: 16px;
height: 16px;
@@ -23,14 +23,10 @@
margin-left: 0;
}
&.gap-after + .icon-button {
margin-left: 8px;
}
&:hover {
background: #666;
color: white;
fill: white;
background: var(--color-6-lowergray);
color: var(--color-f-white);
fill: var(--color-f-white);
}
&.size-10 {
client/web/src/components/widgets/buttons/PopoverButton.vue
+5 -5
View File
@@ -15,7 +15,7 @@
position: relative;
width: 16px;
height: 24px;
margin: 2px 4px;
flex: 0 0 auto;
.popover {
left: 50%;
@@ -29,12 +29,12 @@
border: none;
border-radius: 2px;
vertical-align: top;
background: #111;
fill: #ddd;
background: var(--color-1-nearblack);
fill: var(--color-e-nearwhite);
&:hover {
background: #666;
fill: #fff;
background: var(--color-6-lowergray);
fill: var(--color-f-white);
}
}
}