Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-03 04:49:03 -05:00
Code Issues Activity

✨ Remove dom nesting on dropdown.

Browse source
This commit is contained in:
Andrey Antukh 2020-03-19 17:30:36 +01:00 • committed by Alonso Torres
parent c663d54eb8
commit 16dab34864
4 changed files with 84 additions and 56 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

47
frontend/resources/styles/main/partials/main-bar.scss
View file

@ -99,47 +99,44 @@
width: 25px;
}
.dropdown {
ul.profile-menu {
position: absolute;
top: 0;
left: 0;
z-index: 12;
width: 180px;
background-color: $color-gray-60;
border-radius: $br-small;
padding: 0 $small;
ul.profile-menu {
background-color: $color-gray-60;
border-radius: $br-small;
padding: 0 $small;
@include animation(0,.2s,fadeInDown);
@include animation(0,.2s,fadeInDown);
li {
font-size: $fs13;
padding: $small 0;
li {
font-size: $fs13;
padding: $small 0;
svg {
fill: $color-gray-20;
height: 12px;
width: 12px;
}
svg {
fill: $color-gray-20;
height: 12px;
width: 12px;
}
span {
color: $color-white;
}
&:hover {
span {
color: $color-white;
color: $color-primary;
}
&:hover {
span {
color: $color-primary;
}
svg {
fill: $color-primary;
}
svg {
fill: $color-primary;
}
}
}
}

44
frontend/resources/styles/main/partials/workspace-bar.scss
View file

@ -15,7 +15,7 @@
position: relative;
z-index: 12;
.dropdown {
.workspace-menu {
position: absolute;
top: 40px;
left: 40px;
@ -23,34 +23,32 @@
z-index: 12;
@include animation(0,.2s,fadeInDown);
.workspace-menu {
background-color: $color-gray-60;
border-radius: $br-small;
padding: 0 $small;
background-color: $color-gray-60;
border-radius: $br-small;
padding: 0 $small;
li {
font-size: $fs13;
padding: $small 0;
li {
font-size: $fs13;
padding: $small 0;
svg {
fill: $color-gray-20;
height: 12px;
width: 12px;
}
svg {
fill: $color-gray-20;
height: 12px;
width: 12px;
}
span {
color: $color-white;
}
&:hover {
span {
color: $color-white;
color: $color-primary;
}
svg {
fill: $color-primary;
}
&:hover {
span {
color: $color-primary;
}
svg {
fill: $color-primary;
}
}
}
}
}

46
frontend/resources/styles/main/partials/workspace.scss
View file

@ -5,18 +5,53 @@
// Copyright (c) 2015-2016 Andrey Antukh <niwi@niwi.nz>
// Copyright (c) 2015-2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
.workspace-context-menu {
position: absolute;
top: 40px;
left: 740px;
width: 230px;
z-index: 12;
background-color: $color-gray-60;
border-radius: $br-small;
padding: 0 $small;
li {
font-size: $fs13;
padding: $small 0;
cursor: pointer;
svg {
fill: $color-gray-20;
height: 12px;
width: 12px;
}
span {
color: $color-white;
}
&:hover {
span {
color: $color-primary;
}
svg {
fill: $color-primary;
}
}
}
}
.workspace-content {
background-color: $color-canvas;
display: flex;
height: 100%;
/* width: 100%; */
/* padding: 0 230px 0 230px; */
/* position: relative; */
width: calc(100% - 460px);
width: calc(100% - 500px);
padding: 0;
margin: 0;
position: fixed;
right: 190px;
right: 230px;
&.scrolling {
cursor: grab;
@ -76,7 +111,6 @@
width: 100%;
.viewport {
&.drawing {
cursor: cell;
}

3
frontend/src/uxbox/main/ui/components/dropdown.cljs
View file

@ -38,5 +38,4 @@
(assert (boolean? (gobj/get props "show")) "missing `show` prop")
(when (gobj/get props "show")
[:div.dropdown
(mf/element dropdown-container props)]))
(mf/element dropdown-container props)))