Changes to the flex UI

This commit is contained in:
alonso.torres 2022-12-09 14:59:38 +01:00 committed by Andrey Antukh
parent f2fe1dd6f8
commit de6cba8c0b
7 changed files with 127 additions and 54 deletions

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="500" height="500" viewBox="0 0 132.292 132.292">
<path d="M0 22.608v87.272h11.232V22.608Zm22.399 0V60.45h-.016v11.181h.016v38.147h87.557v-87.17zm98.661 0v87.272h11.232V22.608Z"/>
</svg>

After

Width:  |  Height:  |  Size: 235 B

View file

@ -396,6 +396,10 @@ ul.slider-dots {
width: 43px;
}
&.auto {
width: auto;
}
// Input amounts
&.pixels {

View file

@ -1612,11 +1612,23 @@
align-items: center;
margin-right: 5px;
font-family: "worksans", sans-serif;
&.justify-content {
align-items: start;
margin-top: 4px;
}
}
.btn-wrapper {
display: flex;
width: 100%;
max-width: 185px;
&.justify-content {
display: flex;
flex-direction: column;
gap: 5px;
}
.direction,
.wrap-type,
.align-items-style,
@ -1711,7 +1723,8 @@
margin-bottom: 8px;
height: 26px;
.gap-row,
.gap-column {
.gap-column,
.padding-row {
display: flex;
justify-content: center;
align-items: center;
@ -1751,6 +1764,13 @@
border: none;
cursor: pointer;
border-radius: $br-small;
&.lock {
border: 1px solid $color-gray-60;
border-radius: $br-small;
width: 30px;
height: 30px;
}
&.active {
svg {
fill: $color-primary;
@ -1765,10 +1785,17 @@
}
}
.padding-row {
grid-template-columns: auto 30px;
}
.margin-row {
grid-template-columns: 65px auto;
}
.padding-row,
.margin-row {
display: grid;
grid-template-columns: 65px auto;
height: 26px;
.padding-icons,
.margin-icons {
@ -1799,15 +1826,27 @@
fill: $color-gray-30;
}
}
:last-child {
border: none;
}
}
.padding-icons {
margin-bottom: 8px;
margin-top: 3px;
margin-right: 1px;
height: 30px;
width: 30px;
}
.wrapper {
display: flex;
height: 26px;
.input-element {
margin: 0;
margin-top: 3px;
height: 26px;
}
}