0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-26 08:29:42 -05:00
penpot/resources/styles/partials/main-bar.scss
2016-03-28 08:55:06 +02:00

121 lines
1.8 KiB
SCSS

// This Source Code Form is subject to the terms of the Mozilla Public
// License, v. 2.0. If a copy of the MPL was not distributed with this
// file, You can obtain one at http://mozilla.org/MPL/2.0/.
//
// Copyright (c) 2015-2016 Andrey Antukh <niwi@niwi.nz>
// Copyright (c) 2015-2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
.main-bar {
align-items: center;
background-color: $primary-ui-bg;
display: flex;
height: 60px;
padding: $x-small $medium;
position: relative;
z-index: 10;
.main-logo {
svg {
fill: $medium-ui-icons;
height: 40px;
width: 120px;
}
}
}
.main-nav {
align-items: center;
display: flex;
height: 50px;
margin: 0 0 0 120px;
li {
a {
color: $soft-ui-text;
padding: 1rem;
&:hover {
color: $intense-ui-text;
}
}
&.current {
a {
color: $intense-ui-text;
}
}
}
}
.user-zone {
align-items: center;
cursor: pointer;
display: flex;
margin-left: auto;
position: relative;
span {
color: $medium-ui-text;
margin: $small;
}
img {
border: 2px solid $dark-ui-bg;
border-radius: 50%;
flex-shrink: 0;
width: 32px;
}
.dropdown {
background-color: $color-white;
border-radius: $br-small;
border: 1px solid $soft-ui-border;
min-width: 150px;
padding: 0 $small;
position: absolute;
top: 0;
right: 0;
width: 100%;
z-index: 12;
@include animation(0,.2s,fadeInDown);
li {
font-size: $fs13;
padding: $small 0;
svg {
fill: $medium-ui-text;
height: 12px;
width: 12px;
}
span {
color: $medium-ui-text;
}
&:hover {
span {
color: $intense-ui-text;
}
svg {
fill: $intense-ui-text;
}
}
}
}
}