Gazook89
c791c0f60b
modify the interactive states
...
more closely match the properties editor behavior. removed some unnecessary (unused) properties. Outline only appears when element is focused (rather than on hover as well).
2024-08-17 15:36:12 -05:00
Gazook89
f204b0ebc0
tool elements use width:auto for flexibility, but with min-width
...
Set the child elements of the toolbar to have auto width (can expand as needed), but have a min-width so no button, such as an icon, is too small.
2024-08-17 15:34:13 -05:00
Gazook89
adab8449e0
Change toolbar spacing
...
replace column-/row-gap with a single gap at 5px. Padding on each child element will provide the space. Set a height on toolbar, so child elements can be set to 100% height to improve bg color change on hover.
2024-08-17 15:32:30 -05:00
Gazook89
fc96f6bf95
text input changes (text-transform, radius, border, focus)
...
Aligning input here with Properties editor inputs. Removed border radius, added thin border, a focus border.
2024-08-17 14:45:50 -05:00
Gazook89
9924c6049e
Aesthetic changes to tooltip (radius, bg color)
...
Matching tooltip color to the background of the input it belongs to, for better cohesion. Removed border-radius as well.
2024-08-17 14:26:45 -05:00
Gazook89
21e9251043
aesthetic changes (border, text align, font size)
...
Text align isn't doing anything, and no other UI element is using a border and doesn't seem necessary here. Maintains the "flat" design.
2024-08-17 14:25:04 -05:00
Gazook89
19e6d94419
Set as Relative position, remove extra properties
...
Doesn't need to be Sticky positioning, relative is fine (it is still fixed above the iframe). Allows us to remove a bunch of extra properties.
Add a smidgen of padding.
2024-08-17 14:23:33 -05:00
Gazook89
232f28b5b4
Remove extra styling of the slider thumb
...
can just use browser defaults for this.
2024-08-17 14:06:58 -05:00
Gazook89
6af5abd37d
Rearrange nesting of slider tooltip
...
Just moving the :hover:after tooltip to within the existing css rule for sliders.
2024-08-17 14:06:14 -05:00
Gazook89
e0e49c606f
Utilize browser defined style for slider, with accent-color
...
Avoid over-styling of browser-defined slider, but still apply a HB appropriate color scheme. Prevents us from having to create our own tick marks, so we can just define the `option`s in the datalist and get tick marks in the right spot.
2024-08-17 14:05:14 -05:00
Víctor Losada Hernández
5ee4ada112
"Updated ToolBar component: added zoom level limits, refactored zoom level handling, and modified CSS styles for input and slider elements."
2024-08-16 15:58:00 +02:00
Víctor Losada Hernández
f0765b5aaa
"refactored ToolBar component to use a single state object, and updated styles in toolBar.less"
2024-08-15 20:05:23 +02:00
Víctor Losada Hernández
a5f453f1e5
linting toolBar.less
2024-06-02 16:13:04 +02:00
Víctor Losada Hernández
e3c1e4b6f0
"Updated toolbar.less: changed hover selector to also include focus-within"
2024-06-02 15:50:47 +02:00
Víctor Losada Hernández
69db1e2cb7
change page works, added change zoom via input too
2024-05-31 19:43:09 +02:00
Víctor Losada Hernández
bc9ab284d8
Initial UI
2024-05-21 08:01:50 +02:00
