scinote-web/app/assets/stylesheets/themes/main_navigation.scss

416 lines
6.3 KiB
SCSS
Raw Normal View History

2018-03-12 23:27:35 +08:00
@import 'constants';
@import "mixins";
#main-nav {
box-shadow: 0 3px 6px $color-alto;
2018-03-12 23:27:35 +08:00
margin-bottom: 0;
}
#notifications-dropdown {
.fa-bell {
2018-03-30 15:54:57 +08:00
font-size: $font-size-large;
2018-03-12 23:27:35 +08:00
}
#count-notifications {
2018-03-28 19:54:01 +08:00
background-color: $brand-primary;
2018-03-12 23:27:35 +08:00
border-radius: 5px;
2018-03-28 19:54:01 +08:00
color: $color-concrete;
2018-03-12 23:27:35 +08:00
display: none;
font-size: 11px;
font-weight: bold;
margin-left: 12px;
padding: 1px 6px;
position: relative;
z-index: 1;
}
}
.navbar {
border-radius: 0;
2018-03-16 22:56:12 +08:00
padding-right: 15px;
2018-03-12 23:27:35 +08:00
}
.navbar-default {
background-color: $color-white;
border-color: $color-alto;
}
.navbar-default .navbar-brand {
& > img {
margin-top: -7px;
max-width: 55px;
max-height: 38px;
}
}
.dropdown-notifications {
max-height: 500px;
overflow-x: hidden;
overflow-y: scroll;
padding-bottom: 0;
padding-top: 0;
width: 450px;
word-wrap: break-word;
.notifications-no-recent {
padding-bottom: 10px;
padding-left: 10px;
padding-top: 10px;
}
.notification {
border-bottom: 1px solid $color-alto;
padding-bottom: 10px;
padding-top: 10px;
&:hover {
background-color: $color-concrete;
}
}
.unseen {
2018-03-28 19:54:01 +08:00
border-left: 4px solid $brand-primary;
2018-03-12 23:27:35 +08:00
}
.text-center {
margin-left: 12px;
}
.avatar {
top: 0px;
margin-top: 5px;
height: 45px;
width: 45px;
}
.assignment {
2018-03-28 19:54:01 +08:00
background-color: $brand-primary;
2018-03-12 23:27:35 +08:00
border-radius: 50%;
2018-03-28 19:54:01 +08:00
color: $color-concrete;
2018-03-12 23:27:35 +08:00
display: block;
2018-03-30 15:54:57 +08:00
font-size: $font-size-h3;
2018-03-12 23:27:35 +08:00
height: 45px;
padding-top: 5px;
width: 45px;
}
.deliver {
2018-03-28 19:54:01 +08:00
background-color: $brand-warning;
2018-03-12 23:27:35 +08:00
border-radius: 50%;
2018-03-28 19:54:01 +08:00
color: $color-concrete;
2018-03-12 23:27:35 +08:00
display: block;
2018-03-30 15:54:57 +08:00
font-size: $font-size-h3;
2018-03-12 23:27:35 +08:00
height: 45px;
padding-top: 5px;
width: 45px;
}
.system-message {
2018-05-15 23:10:31 +08:00
background-color: $brand-success;
2018-03-12 23:27:35 +08:00
border-radius: 50%;
2018-03-28 19:54:01 +08:00
color: $color-concrete;
2018-03-12 23:27:35 +08:00
display: block;
2018-03-30 15:54:57 +08:00
font-size: $font-size-h3;
2018-03-12 23:27:35 +08:00
height: 45px;
padding-top: 8px;
width: 45px;
}
.notifications-dropdown-footer {
background-color: $color-gainsboro;
2018-03-12 23:27:35 +08:00
padding: 8px;
text-align: center;
a:hover {
background-color: $color-gainsboro;
}
}
}
2018-03-12 23:27:35 +08:00
.notification {
padding-right: 8px;
word-wrap: break-word;
}
#search-menu {
padding-right: 0;
.nav {
position: relative;
z-index: 1000;
}
}
#search-content {
padding-left: 0;
}
#search-container {
padding-left: 45px;
}
/** Search */
.nav-search {
li.disabled {
2018-03-16 23:38:59 +08:00
opacity: .8;
2018-03-12 23:27:35 +08:00
.badge {
background-color: $color-emperor;
2018-03-16 23:38:59 +08:00
opacity: .8;
2018-03-12 23:27:35 +08:00
}
}
.repositories-team {
padding: 10px 15px;
&.active {
2018-03-28 19:54:01 +08:00
color: $brand-primary;
2018-03-12 23:27:35 +08:00
}
}
.repository-search {
padding-left: 15px;
}
}
.preferences-settings-container {
2018-03-12 23:27:35 +08:00
margin-bottom: 50px;
margin-top: 50px;
h4 {
font-weight: 600;
margin-bottom: 2rem;
}
.col-sm-4 {
padding-left: 5rem;
padding-top: .5rem;
word-break: break-word;
}
.col-sm-2 {
padding-left: 3rem;
padding-top: .7rem;
}
@media (max-width: 768px) {
.col-sm-4 {
margin-bottom: 1rem;
padding-left: 1.8rem;
}
.col-sm-2 {
padding-left: 1.8rem;
}
}
.btn-group {
margin-bottom: 15px;
}
.assignment {
2018-03-28 19:54:01 +08:00
background-color: $brand-primary;
2018-03-12 23:27:35 +08:00
border-radius: 50%;
2018-03-28 19:54:01 +08:00
color: $color-concrete;
2018-03-12 23:27:35 +08:00
display: block !important;
2018-03-30 15:54:57 +08:00
font-size: $font-size-base;
2018-03-12 23:27:35 +08:00
height: 30px;
margin-right: 15px;
padding: 7px;
padding-bottom: 5px;
padding-top: 5px;
width: 30px;
}
.system-message {
2018-05-15 23:10:31 +08:00
background-color: $brand-success;
2018-03-12 23:27:35 +08:00
border-radius: 50%;
2018-03-28 19:54:01 +08:00
color: $color-concrete;
2018-03-12 23:27:35 +08:00
display: block !important;
2018-03-30 15:54:57 +08:00
font-size: $font-size-base;
2018-03-12 23:27:35 +08:00
height: 30px;
margin-right: 15px;
padding: 8px;
padding-bottom: 5px;
padding-top: 5px;
width: 30px;
}
.img-circle {
margin-right: 15px;
}
}
// Global team switch
#team-switch {
word-wrap: break-word;
.team-name {
margin-left: 17px;
}
.fa-check-circle {
color: $brand-primary;
2018-05-15 23:10:31 +08:00
margin-left: -2px;
margin-right: 2px;
2018-03-12 23:27:35 +08:00
}
.team-name-item {
border-bottom: 1px solid $color-gainsboro;
2018-03-12 23:27:35 +08:00
padding-bottom: 8px;
padding-top: 5px;
}
2018-04-19 19:26:10 +08:00
li:last-child {
border-bottom: 0;
}
.btn-default:not(.dropdown-toggle) {
2018-04-18 23:06:47 +08:00
margin-left: 15px;
2018-03-12 23:27:35 +08:00
text-align: right;
width: 300px;
}
.btn-group {
margin-top: 8px;
}
.dropdown-menu {
border-radius: 0;
margin-top: 0;
padding-top: 0;
2018-03-12 23:27:35 +08:00
width: 100%;
}
i {
margin-right: 5px;
}
li {
display: block;
text-align: left;
word-wrap: break-word;
&:hover {
background-color: $color-concrete;
}
a {
color: $color-emperor;
display: block;
line-height: 1.6em;
padding: 3px 20px;
text-align: left;
text-decoration: none;
word-wrap: break-word;
}
}
}
#nav-team-switch {
margin-left: 0;
2018-03-12 23:27:35 +08:00
}
.custom-nav-dropdown {
2018-03-28 19:54:01 +08:00
border: 1px solid $color-alto;
2018-03-12 23:27:35 +08:00
padding: 10px 0 10px 30px;
}
2018-03-13 23:33:48 +08:00
// Alert
.alert {
border-radius: 0;
margin-bottom: 0;
opacity: .86;
width: 100%;
&.alert-hidden {
display: none;
}
a#hide-alert {
margin-left: 15px;
}
&.alert-floating {
position: fixed;
top: 50px;
z-index: 1000;
}
}
#content-wrapper {
margin-top: 50px;
2018-03-20 21:30:07 +08:00
margin-left: 83px;
2018-03-13 23:33:48 +08:00
}
2018-04-18 23:06:47 +08:00
#search-bar {
padding-right: 0;
}
@media (max-width: 768px) {
#search-bar {
padding: 10px 30px;
}
}
2018-03-13 23:33:48 +08:00
2018-03-12 23:27:35 +08:00
// reset margins on small screens
@media (max-width: 1188px) {
2018-03-16 23:38:59 +08:00
2018-03-12 23:27:35 +08:00
#nav-team-switch {
margin-left: 0;
}
}
// System notiifcations dropdown
#system-notifications-dropdown {
.fa-gift {
font-size: $font-size-large;
}
#count-system-notifications {
background-color: $brand-primary;
border-radius: 5px;
color: $color-concrete;
display: none;
font-size: 11px;
font-weight: bold;
margin-left: 12px;
padding: 1px 6px;
position: relative;
z-index: 1;
}
}
.dropdown-system-notifications {
margin-bottom: 10px;
max-height: 500px;
overflow-x: hidden;
overflow-y: scroll;
padding-bottom: 0;
padding-top: 0;
width: 450px;
word-wrap: break-word;
.system-notifications-no-recent {
padding: 10px;
text-align: center;
}
.system-notifications-dropdown-header {
margin-bottom: 0;
.show-all {
margin-left: 20px;
}
a {
font-size: $font-size-small;
font-weight: $headings-font-weight;
}
}
}