Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-10 09:08:31 -05:00
Code Issues Activity

WIP UI changes

Browse source
This commit is contained in:
elhombretecla 2020-10-20 11:31:24 +02:00
parent 65512d46c2
commit 6f58899f90
3 changed files with 25 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
frontend/resources/styles/common/dependencies/helpers.scss
View file

@ -6,11 +6,11 @@
// Copyright (c) 2015-2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
// Padding & Margin sizes
$x-small: 5px;
$small: 10px;
$medium: 15px;
$x-small: 4px;
$small: 8px;
$medium: 16px;
$big: 20px;
$x-big: 30px;
$x-big: 32px;
// New sizes
$size-1: 0.25rem;

19
frontend/resources/styles/main/partials/colorpicker.scss
View file

@ -13,7 +13,7 @@
.colorpicker-content {
display: flex;
flex-direction: column;
padding: 0.5rem;
padding: $small;
& > * {
width: 200px;
@ -21,7 +21,7 @@
.top-actions {
display: flex;
margin-bottom: 0.25rem;
margin-bottom: $x-small;
justify-content: space-between;
.picker-btn {
@ -50,7 +50,7 @@
margin: 0;
border: 1px solid $color-gray-20;
border-radius: 2px;
margin-left: 0.25rem;
margin-left: $x-small;
}
.active {
@ -69,8 +69,8 @@
.gradient-stops {
height: 10px;
display: flex;
margin-top: 0.5rem;
margin-bottom: 1rem;
margin-top: $small;
margin-bottom: $medium;
.gradient-background-wrapper {
height: 100%;
@ -303,11 +303,12 @@
background-position: 95% 48%;
background-size: 10px;
margin: 0;
margin-bottom: 0.5rem;
margin-bottom: $small;
width: 100%;
padding: 2px 0.25rem;
padding: $x-small 0.25rem;
font-size: 0.75rem;
color: $color-gray-40;
cursor: pointer;
border-color: $color-gray-10;
border-radius: 2px;
@ -443,7 +444,7 @@
.colorpicker-tabs {
display: flex;
margin: 0.5rem 0;
margin-bottom: $small;
border-radius: 5px;
border: 1px solid $color-gray-10;
height: 2rem;
@ -491,7 +492,7 @@
background-color: $color-gray-50;
border: 1px solid $color-gray-30;
border-radius: $br-small;
color: $color-gray-20;
color: $color-white;
height: 20px;
margin: 5px 0 0 0;
padding: 0 $x-small;

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

@ -61,16 +61,22 @@
.element-set {
border-bottom: 1px solid $color-gray-60;
color: $color-gray-20;
margin: 0 $x-small;
padding: $small $x-small;
.element-set-title {
color: $color-gray-10;
color: $color-gray-20;
display: flex;
font-size: $fs13;
padding: $small $x-small;
padding: $x-small;
width: 100%;
align-items: center;
}
&:hover {
.element-set-title {
color: $color-gray-10;
}
}
}
.element-list {
@ -185,7 +191,7 @@
background-color: $color-gray-50;
border: 1px solid transparent;
border-bottom-color: $color-gray-40;
color: $color-gray-10;
color: $color-white;
font-size: $fs12;
margin: $x-small;
padding: $x-small;
@ -217,7 +223,7 @@
}
.element-set-subtitle {
color: $color-gray-10;
color: $color-gray-20;
font-size: $fs11;
width: 12rem;
}