mirrors/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2025-12-23 10:11:54 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Adjust OptionalInput widget design to add back its right border

Browse source
This commit is contained in:
Keavon Chambers 2021-07-15 01:01:05 -07:00
parent 86bd9e7cdf
commit 7785ed2b1d
3 changed files with 3 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/web/src/App.vue
View file

@ -40,7 +40,7 @@
// TODO: Replace with CSS color() function to calculate alpha when browsers support it
// See https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/color() and https://caniuse.com/css-color-function
// E6 = 90% alpha
// F2 = 95% alpha
--floating-menu-opacity-color-2-mildblack: #222222f2;
--floating-menu-shadow: rgba(0, 0, 0, 50%);
}

2
client/web/src/components/widgets/buttons/PopoverButton.vue
View file

@ -37,7 +37,7 @@
}
// TODO: Refactor this and other complicated cases dealing with joined widget margins and border-radius by adding a single standard set of classes: joined-first, joined-inner, and joined-last
div[class*="-input"]:not(.optional-input) + & {
div[class*="-input"] + & {
margin-left: 1px;
.icon-button {

12
client/web/src/components/widgets/inputs/OptionalInput.vue
View file

@ -11,13 +11,11 @@
align-items: center;
white-space: nowrap;
justify-content: center;
margin-right: 1px;
width: 23px;
width: 24px;
height: 24px;
border: 1px solid var(--color-7-middlegray);
border-radius: 2px 0 0 2px;
box-sizing: border-box;
border-right: none;
&:hover {
background: var(--color-6-lowergray);
@ -26,19 +24,11 @@
input:checked + label {
border: 1px solid var(--color-accent);
border-right: none;
&:hover {
border: 1px solid var(--color-accent-hover);
border-right: none;
background: none;
}
// border: none;
// background: var(--color-e-nearwhite);
// &:hover {
// background: var(--color-f-white);
// }
}
}
</style>