3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-08-04 12:08:23 +02:00
Code Issues Projects Releases Packages Wiki Activity

🎉 Enhance line caps selectors

Browse source
This commit is contained in:
Andrés Moya 2021-08-19 15:04:43 +02:00 • committed by Andrey Antukh
parent 837985ccc5
commit eb40297a35
10 changed files with 149 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

1
frontend/resources/images/cap-circle-marker.svg Normal file
View file

@ -0,0 +1 @@
<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><rect rx="6" ry="6" x="10" width="6" height="6"/><path d="M0 3h14.5" fill="none" stroke="#000"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 165 B

1
frontend/resources/images/cap-diamond-marker.svg Normal file
View file

@ -0,0 +1 @@
<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><rect rx="0" ry="0" x="11" y="1" transform="rotate(45 13 3)" width="4" height="4"/><path d="M0 3h14.5" fill="none" stroke="#000"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 199 B

1
frontend/resources/images/cap-line-arrow.svg Normal file
View file

@ -0,0 +1 @@
<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><path d="M0 3h14.5M11.7 0l1 1 1.6 2-2.6 3" fill="none" stroke="#000"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 139 B

1
frontend/resources/images/cap-round.svg Normal file
View file

@ -0,0 +1 @@
<svg viewBox="1863 1374 16 8" width="16" height="8" xmlns="http://www.w3.org/2000/svg"><path d="M1879 1374h-12s-4 0-4 4 4 4 4 4h12" fill="none" stroke="#000"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 166 B

1
frontend/resources/images/cap-square-marker.svg Normal file
View file

@ -0,0 +1 @@
<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><rect rx="0" ry="0" x="10" width="6" height="6" fill="#070707"/><path d="M0 3h14.5" fill="none" stroke="#000"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 180 B

1
frontend/resources/images/cap-square.svg Normal file
View file

@ -0,0 +1 @@
<svg viewBox="1863 1407 16 8" width="16" height="8" xmlns="http://www.w3.org/2000/svg"><path d="M1879 1407h-16v8h16" fill="none" stroke="#000"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 151 B

1
frontend/resources/images/cap-triangle-arrow.svg Normal file
View file

@ -0,0 +1 @@
<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><path d="M0 3h14.5" fill="none" stroke="#000"/><path d="M13 0l2.9 3L13 6V0z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 147 B

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

@ -1436,5 +1436,57 @@
}
}
}
}
.cap-select {
background-color: transparent;
border: 1px solid transparent;
border-bottom-color: $color-gray-40;
color: $color-gray-10;
cursor: pointer;
font-size: $fs11;
margin: $x-small;
overflow: hidden;
padding: $x-small;
padding-right: 20px;
position: relative;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
& .cap-select-button {
svg {
fill: $color-gray-10;
height: 11px;
position: absolute;
right: 5px;
top: 6px;
width: 11px;
}
}
&:hover {
border-color: $color-gray-40;
}
&:focus {
border-color: $color-primary;
}
}
.cap-select-dropdown {
right: 5px;
top: 30px;
z-index: 12;
min-width: 200px;
position: fixed;
& li.separator {
border-top: 1px solid $color-gray-10;
}
& li img {
width: 16px;
margin-right: $small;
}
}