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

add view nav styles

Browse source
This commit is contained in:
elhombretecla 2016-06-26 12:22:34 +02:00 • committed by Andrey Antukh
parent 6c26ffecd5
commit fb913fcefc
No known key found for this signature in database
GPG key ID: 4DFEBCB8316A8B95
3 changed files with 116 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -218,3 +218,55 @@
}
}
.options-btn {
align-items: center;
border-right: 4px double $soft-ui-border;
display: flex;
margin: 0;
&:last-child {
border: none;
}
li {
align-items: center;
background-color: $secondary-ui-bg;
border: 1px solid transparent;
border-radius: $br-small;
cursor: pointer;
display: flex;
flex-shrink: 0;
height: 30px;
justify-content: center;
margin: 0 $small;
position: relative;
width: 30px;
a {
padding-top: 6px;
}
svg {
fill: $intense-ui-icons;
height: 18px;
width: 18px;
}
&:hover {
background-color: $color-white;
border-color: $soft-ui-border;
}
&.selected {
background-color: $main-ui-color;
svg {
fill: $color-white;
}
}
}
}

53
resources/styles/view/layouts/main-layout.scss
View file

@ -23,12 +23,65 @@
flex-shrink: 0;
height: 55px;
width: 100%;
@include bp(tablet) {
border-right: 1px solid $soft-ui-border;
border-top: 0;
height: 100%;
width: 70px;
}
}
.view-options-btn {
align-items: center;
display: flex;
margin: auto;
@include bp(tablet) {
flex-direction: column;
}
li {
align-items: center;
background-color: $secondary-ui-bg;
border: 1px solid transparent;
border-radius: $br-small;
cursor: pointer;
display: flex;
flex-shrink: 0;
height: 40px;
justify-content: center;
margin: $small;
position: relative;
width: 40px;
a {
padding-top: 6px;
}
svg {
fill: $intense-ui-icons;
height: 24px;
width: 24px;
}
&:hover {
background-color: $color-white;
border-color: $soft-ui-border;
}
&.selected {
background-color: $main-ui-color;
svg {
fill: $color-white;
}
}
}
}
.view-canvas {