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

🐸 integration with backend data

Browse source
This commit is contained in:
alonso.torres 2020-03-24 14:31:15 +01:00
parent 4102dca55c
commit 57d633b1d2
17 changed files with 301 additions and 116 deletions
Download patch file Download diff file Expand all files Collapse all files

45
frontend/resources/styles/main/partials/color-palette.scss
View file

@ -11,21 +11,23 @@
background-color: $color-gray-50;
border-top: 1px solid $color-gray-60;
display: flex;
padding: 1rem;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
z-index: 11;
.right-arrow,
.left-arrow {
cursor: pointer;
& .right-arrow,
& .left-arrow {
cursor: pointer;
svg {
fill: $color-gray-light;
height: 30px;
height: 1rem;
margin: 0 .5rem;
width: 30px;
width: 1rem;
}
&:hover {
svg {
fill: $color-gray-darker;
@ -35,12 +37,21 @@
display: none;
}
}
.left-arrow {
transform: rotate(180deg);
transform: rotate(180deg);
padding-top: 10px;
}
&.fade-out-down {
@include animation(0,.5s,fadeOutDown);
}
&.left-sidebar-open {
left: 280px;
width: calc(100% - 280px);
}
}
.color-palette-actions {
@ -48,7 +59,12 @@
flex-direction: column;
flex-shrink: 0;
margin-right: .5rem;
width: 200px;
border: 1px solid #1F1F1F;
align-self: stretch;
padding: 0.5rem;
justify-content: center;
.color-palette-buttons {
align-items: center;
display: flex;
@ -56,6 +72,15 @@
}
}
.color-palette-actions-button {
cursor: pointer;
& svg {
width: 1rem;
height: 1rem;
fill: #AFB2BF;
}
}
.btn-palette {
align-items: center;
border: 2px solid $color-gray-lighter;
@ -90,6 +115,7 @@
display: flex;
overflow: hidden;
width: 100%;
padding: 0.25rem;
}
.color-palette-inside {
@ -106,15 +132,14 @@
display: flex;
flex-direction: column;
flex-shrink: 0;
margin: 0 10px;
position: relative;
flex-basis: 66px;
.color {
background-color: $color-gray-lighter;
border: 2px solid $color-gray-60;
border-radius: 50%;
flex-shrink: 0;
margin-bottom: .4rem;
padding: 1.5rem;
}
.color-text {

36
frontend/resources/styles/main/partials/workspace-libraries.scss
View file

@ -1,3 +1,35 @@
.libraries-window-bar {
display: grid;
grid-template-columns: repeat(2, 50%);
padding: 0.5rem;
align-items: center;
}
.libraries-window-bar-title {
color: #F0F0F0;
}
.libraries-window-bar-options {
font-size: 12px;
display: flex;
justify-content: space-between;
padding: 0 0.5rem;
button {
border: none;
padding: 0;
margin: 0;
background: transparent;
cursor: pointer;
}
& svg {
width: 0.5rem;
height: 0.5rem;
fill: #F0F0F0;
transform: rotate(90deg);
}
}
.library-tab {
display: flex;
flex-direction: column;
@ -10,7 +42,6 @@
flex-direction: row;
flex-wrap: wrap;
padding: 0.25rem;
height: 100%;
overflow-y: scroll;
.icons-tab & {
@ -80,8 +111,9 @@
width: 90%;
padding: 0.5rem;
box-sizing: border-box;
color: white;
color: #AFB2BF;
font-size: 12px;
border: 1px solid #7c7c7c;
}
.library-tab-libraries-item {