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

Design tweaks to frontend components

Browse Source
This commit is contained in:
Keavon Chambers
2021-05-07 02:47:37 -07:00
parent 2500fc5053
commit 46eb6b46ec
5 changed files with 32 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/web/assets/svg/24x24-bounds-16x16-icon/flip-horizontal.svg
+6 -6
View File
@@ -1,8 +1,8 @@
<svg viewBox="0 0 24 24"> <svg viewBox="0 0 24 24">
<path d="M20,8.62v6.76l-4-2v-2.76L20,8.62 M21,7l-6,3v4l6,3V7L21,7z" /> <path d="M19.8,8.6v6.8l-4.7-2v-2.8L19.8,8.6 M21,7l-7,3v4l7,3V7L21,7z" />
<polygon points="10,14 4,17 4,7 10,10" /> <polygon points="9,14 3,17 3,7 9,10" />
<rect x="12" y="17" width="1" height="2" /> <rect x="11" y="17" width="1" height="2" />
<rect x="12" y="13" width="1" height="2" /> <rect x="11" y="13" width="1" height="2" />
<rect x="12" y="9" width="1" height="2" /> <rect x="11" y="9" width="1" height="2" />
<rect x="12" y="5" width="1" height="2" /> <rect x="11" y="5" width="1" height="2" />
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 326 B

After

Width:  |  Height:  |  Size: 326 B

client/web/assets/svg/24x24-bounds-16x16-icon/flip-vertical.svg
+6 -6
View File
@@ -1,8 +1,8 @@
<svg viewBox="0 0 24 24"> <svg viewBox="0 0 24 24">
<path d="M13.38,16l2,4H8.62l2-4H13.38 M14,15h-4l-3,6h10L14,15L14,15z" /> <path d="M13.4,15.2l2,4.7H8.6l2-4.7H13.4 M14,14h-4l-3,7h10L14,14L14,14z" />
<polygon points="10,10 7,4 17,4 14,10" /> <polygon points="10,9 7,3 17,3 14,9" />
<rect x="5" y="12" width="2" height="1" /> <rect x="5" y="11" width="2" height="1" />
<rect x="9" y="12" width="2" height="1" /> <rect x="9" y="11" width="2" height="1" />
<rect x="13" y="12" width="2" height="1" /> <rect x="13" y="11" width="2" height="1" />
<rect x="17" y="12" width="2" height="1" /> <rect x="17" y="11" width="2" height="1" />
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 328 B

After

Width:  |  Height:  |  Size: 329 B

client/web/src/components/widgets/NumberInput.vue
+16 -5
View File
@@ -9,11 +9,11 @@
<style lang="scss"> <style lang="scss">
.number-input { .number-input {
width: 64px; width: 64px;
height: 22px; height: 24px;
position: relative; position: relative;
border: 1px solid #888;
border-radius: 2px; border-radius: 2px;
background: #111; background: #111;
overflow: hidden;
input { input {
width: calc(100% - 8px); width: calc(100% - 8px);
@@ -42,15 +42,25 @@
top: 0; top: 0;
outline: none; outline: none;
border: none; border: none;
background: #333; background: none;
padding: 9px 0;
&:hover { &:hover {
background: #666; background: #666;
&.right::before {
border-color: transparent transparent transparent #fff;
}
&.left::after {
border-color: transparent #fff transparent transparent;
}
} }
&.right { &.right {
right: 0; right: 0;
padding: 8px 6px 8px 7px; padding-left: 7px;
padding-right: 6px;
&::before { &::before {
content: ""; content: "";
@@ -65,7 +75,8 @@
&.left { &.left {
left: 0; left: 0;
padding: 8px 7px 8px 6px; padding-left: 6px;
padding-right: 7px;
&::after { &::after {
content: ""; content: "";
client/web/src/components/widgets/RadioPicker.vue
+2 -1
View File
@@ -9,7 +9,7 @@
font-size: 0; font-size: 0;
button { button {
fill: #fff; fill: #ddd;
border-radius: 0; border-radius: 0;
margin: 0; margin: 0;
@@ -31,6 +31,7 @@
&.active { &.active {
background: #3194d6; background: #3194d6;
fill: #fff;
} }
& + .icon-button { & + .icon-button {
client/web/src/components/widgets/ShelfItem.vue
+2 -1
View File
@@ -7,7 +7,8 @@
<style lang="scss"> <style lang="scss">
.shelf-item { .shelf-item {
padding: 4px; padding: 4px;
border-radius: 4px; border-radius: 2px;
font-size: 0;
&:hover { &:hover {
background: #666; background: #666;