Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-22 22:49:01 -05:00
Code Issues Activity

🐛 Fix constraints buttons

Browse source
This commit is contained in:
Eva Marco 2024-10-11 16:18:11 +02:00 • committed by Andrey Antukh
parent 784274f8ae
commit bd888dcde2
2 changed files with 32 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
CHANGES.md
View file

@ -28,6 +28,7 @@
### :bug: Bugs fixed
- Fix problem with constraints buttons [Taiga #8465](https://tree.taiga.io/project/penpot/issue/8465)
- Fix problem with go back button on error page [Taiga #8887](https://tree.taiga.io/project/penpot/issue/8887)
- Fix problem with shadows in text for Safari [Taiga #8770](https://tree.taiga.io/project/penpot/issue/8770)
- Fix a regression with feedback form subject and content limits [Taiga #8908](https://tree.taiga.io/project/penpot/issue/8908)

56
frontend/src/app/main/ui/workspace/sidebar/options/menus/constraints.scss
View file

@ -36,32 +36,37 @@
.constraints-bottom {
@include flexCenter;
grid-area: top;
.constraint-btn,
.constraint-btn-special,
.constraint-btn-rotated {
@include buttonStyle;
@include flexCenter;
width: 100%;
height: 100%;
.resalted-area {
width: $s-32;
height: $s-3;
border-radius: $br-8;
background-color: var(--button-constraint-background-color-rest);
padding: 0;
margin: 0;
}
&.active .resalted-area {
outline: $s-4 solid var(--button-constraint-border-color-hover);
background-color: var(--button-constraint-background-color-hover);
}
&:hover .resalted-area,
&:focus .resalted-area {
outline: $s-4 solid var(--button-constraint-border-color-hover);
background-color: var(--button-constraint-background-color-hover);
}
}
.constraint-btn,
.constraint-btn-special,
.constraint-btn-rotated {
@include buttonStyle;
@include flexCenter;
width: 100%;
height: 100%;
--resalted-area-background-color: var(--button-constraint-background-color-rest);
--resalted-area-border-color: none;
&.active {
--resalted-area-border-color: var(--button-constraint-border-color-hover);
--resalted-area-background-color: var(--button-constraint-background-color-hover);
}
&:hover,
&:focus-visible {
--resalted-area-border-color: var(--button-constraint-border-color-hover);
--resalted-area-background-color: var(--button-constraint-background-color-hover);
}
}
.resalted-area {
width: $s-32;
height: $s-3;
border-radius: $br-8;
background-color: var(--resalted-area-background-color);
outline: $s-4 solid var(--resalted-area-border-color);
padding: 0;
margin: 0;
}
.constraints-left {
grid-area: left;
.constraint-btn-rotated {
@ -73,6 +78,7 @@
}
}
}
.constraints-center {
grid-area: center;
position: relative;
@ -113,7 +119,7 @@
grid-area: bottom;
}
.contraints-selects {
.constraints-selects {
@include flexColumn;
}