3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-06-03 21:11:39 +02:00
Code Issues Projects Releases Packages Wiki Activity

🎉 Adds support for auto

Browse source
This commit is contained in:
alonso.torres 2020-05-19 10:52:11 +02:00 • committed by Andrés Moya
parent 1d2ae6d5eb
commit ad99e6df9d
6 changed files with 261 additions and 105 deletions
Download patch file Download diff file Expand all files Collapse all files

139
frontend/resources/styles/main/partials/sidebar-element-options.scss
View file

@ -263,11 +263,6 @@
padding: $x-small $big $x-small $x-small;
position: relative;
& hr {
margin: 0;
border-color: $color-gray-20;
}
.dropdown-button {
position: absolute;
right: $x-small;
@ -284,7 +279,9 @@
font-size: $fs13;
}
.custom-select-dropdown {
}
.custom-select-dropdown {
position: absolute;
left: 0;
z-index: 12;
@ -297,6 +294,11 @@
border-radius: $br-small;
box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.25);
hr {
margin: 0;
border-color: $color-gray-20;
}
li {
color: $color-gray-60;
cursor: pointer;
@ -327,63 +329,96 @@
}
}
& li.checked-element {
padding-left: 0;
& li.checked-element {
padding-left: 0;
& span {
margin: 0;
color: $color-black;
}
& span {
margin: 0;
color: $color-black;
}
& svg {
visibility: hidden;
width: 8px;
height: 8px;
background: none;
margin: 0.25rem;
fill: $color-black;
}
& svg {
visibility: hidden;
width: 8px;
height: 8px;
background: none;
margin: 0.25rem;
fill: $color-black;
}
&.is-selected {
& svg {
visibility: visible;
}
}
}
}
&.is-selected {
& svg {
visibility: visible;
}
}
}
.editable-select {
height: 38px;
margin-right: $small;
position: relative;
width: 60%;
.input-text {
left: 0;
position: absolute;
top: -1px;
position: relative;
height: 38px;
margin-right: $small;
position: relative;
width: 60%;
}
.input-select {
background-color: transparent;
border: none;
border-bottom: 1px solid $color-gray-40;
color: transparent;
left: 0;
position: absolute;
top: 0;
width: 100%;
option {
color: $color-gray-60;
background: $color-white;
font-size: $fs12;
svg {
fill: $color-gray-40;
height: 10px;
width: 10px;
}
.input-text {
left: 0;
position: absolute;
top: -1px;
width: 60%;
}
.input-select {
background-color: transparent;
border: none;
border-bottom: 1px solid $color-gray-40;
color: transparent;
left: 0;
position: absolute;
top: 0;
width: 100%;
option {
color: $color-gray-60;
background: $color-white;
font-size: $fs12;
}
}
.dropdown-button {
position: absolute;
top: 7px;
right: 0;
}
&.input-option {
height: 2rem;
border-bottom: 1px solid #64666A;
width: 100%;
margin-left: 0.25rem;
.input-text {
border: none;
margin: 0;
width: calc(100% - 12px);
height: 100%;
top: auto;
color: #b1b2b5;
}
}
}
}
}
.grid-option-main .editable-select.input-option .input-text {
padding: 0;
padding-top: 0.18rem;
}
.color-th {
background-color: $color-gray-10;
border: 1px solid $color-gray-10;