1KA_F2F/resources/sass/admin/navigation.scss

475 lines
8.7 KiB
SCSS
Raw Permalink Normal View History

/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
Created on : 18-Jul-2018, 11:07:46
Author : podkrizniku
*/
$first_navigation_text: $grey_super_dark;
$comment_number_text: #ffffff;
$second_navigation_text: $grey_normal;
$export_dropdown_text: $grey_dark;
$second_navigation_background: #ffffff;
#surveyNavigation {
width: auto;
height: 60px;
padding: 0px;
margin: 0px;
background-color: $soft_blue;
min-width: 1002px;
}
#firstNavigation {
height: 50px;
width: 100%;
font-size: 15px;
line-height: 26px;
text-align: center;
padding-top: 10px;
#mojeAnketeLink {
a {
position: absolute;
left: 0;
padding: 0 25px;
z-index: 10;
color: $first_navigation_text;
background-color: $soft_blue;
transition: 0.2s;
span.sprites {
margin: 0 7px 3px 0;
}
span.library_link {
line-height: 50px;
}
&:hover {
background: $soft_blue_lighten;
}
}
.left-1ka {
margin-left: 40px !important;
height: 50px;
}
}
ol {
margin: 0px;
padding: 0px;
display: inline;
li {
display: inline;
float: left;
list-style-image: none;
list-style-position: outside;
list-style-type: none;
#status_link_off {
padding: 0 25px;
height: 50px;
line-height: 50px;
//padding: 2px 15px 0px 15px;
color: $first_navigation_text;
background-color: $soft_blue;
transition: 0.2s;
span.status_link {
display: inline-block;
//line-height: 47px;
margin-right: 5px;
}
span.faicon {
margin: 0 10px 0 0;
position: relative;
top: -2px;
}
&:hover {
background: $soft_blue_lighten;
}
}
#status_link_on {
//padding: 2px 15px;
padding: 5px 25px;
color: $first_navigation_text;
background-color: $second_navigation_background;
span.status_link {
display: inline-block;
line-height: 40px;
margin-right: 5px;
}
span.faicon {
margin: 0 10px 0 0;
position: relative;
top: -2px;
}
}
a {
div.smaller-singlebutton-off {
line-height: 50px;
padding: 0px 25px;
background: none;
border: 0;
background: none;
color: $first_navigation_text;
transition: 0.2s;
&:hover {
background: $soft_blue_lighten;
}
}
div.smaller-singlebutton-on {
line-height: 50px;
padding: 0px 25px;
background: none;
border: 0;
background: white;
color: $first_navigation_text;
}
}
}
}
ol.left-side.right-space {
background-color: $soft_blue;
}
ol.right-space {
margin-left: 182px;
}
ol.left-side {
float: left;
}
li.spaceLarge {
width: 100px;
}
li.space {
width: 10px;
}
ol.smaller {
line-height: 26px;
margin: 0px 10px 0px 10px;
}
ol.help-1ka {
margin-left: 20px !important;
a {
display: inline-block;
}
.smaller-singlebutton-off {
color: $orange !important;
transition: 0.2s;
&:hover {
color: $orange_lighten !important;
}
}
.smaller-singlebutton-on {
color: $orange !important;
}
}
ol.left-1ka {
margin-left: 40px !important;
}
ol.right-side {
float: right;
margin-right: 20px !important;
margin-top: 10px;
}
.left-off {
display: none;
}
.left-on {
display: none;
}
.right-off {
display: none;
}
.right-on {
float: left;
height: 50px;
width: 18px;
background-image: url("../../../admin/survey/img_new/sprites.png");
background-position: -17px -74px;
background-repeat: no-repeat;
}
.step-on {
float: left;
height: 50px;
line-height: 50px;
padding: 0px 25px;
background-color: $second_navigation_background;
color: $first_navigation_text;
}
.step-off {
float: left;
height: 50px;
line-height: 50px;
width: auto;
padding: 0px 25px;
background-color: $soft_blue;
color: $first_navigation_text;
transition: 0.2s;
&:hover {
background: $soft_blue_lighten;
}
}
/*.separator-left {
float: left;
height: 38px;
width: 2px;
}
.separator-right {
float: left;
height: 38px;
width: 2px;
}*/
.separator {
height: 38px;
width: 2px;
}
ol.quick_settings {
li {
float: right;
margin: 4px 5px 0 0;
&:first-of-type{
margin-right: 30px;
}
}
}
}
#firstNavigation.frontpage {
margin-left: 0px;
height: 50px;
font-size: 15px;
.sprites {
margin: 0 6px 2px 0;
}
li.spaceLarge {
width: 50px;
}
li.spaceBig {
width: 2px;
}
ol.help-1ka {
display: none;
}
}
#quick_comments_link.newCss {
font-size: 12px;
margin-top: 3px !important;
margin-right: 5px !important;
a {
margin-right: 0px !important;
color: $link !important;
font-weight: 600;
&:hover {
color: $orange !important;
}
span.comments_blue_off {
margin-top: 4px !important;
}
span.comments_orange_off {
margin-top: 4px !important;
}
span.comments_blue_on {
margin-top: -1px !important;
}
span.comments_orange_on {
margin-top: -1px !important;
}
}
}
span.sprites.comments_blue_on {
color: $comment_number_text;
font-size: 11px;
font-weight: bold;
line-height: 12px;
text-align: center;
}
span.sprites.comments_orange_on {
color: $comment_number_text;
font-size: 11px;
font-weight: bold;
line-height: 12px;
text-align: center;
}
div#secondNavigation {
display: block;
z-index: 1;
left: 0px;
right: 0px;
padding: 8px 20px 0 145px;
height: 33px;
border-bottom: 1px solid $soft_blue;
background-color: $second_navigation_background;
}
ul.secondNavigation {
display: inline-block;
float: left;
width: auto;
margin-top: 1px !important;
margin-bottom: 0;
}
.secondNavigation {
display: inline-block;
list-style-image: none;
list-style-position: outside;
list-style-type: none;
padding: 0px;
width: 100%;
li {
display: list-item;
float: left;
padding: 0px;
margin: 0px;
}
.blank {
height: 12px;
width: 6px;
}
.no-img {
padding: 0px 12px !important;
background-image: none !important;
}
a {
display: block;
line-height: 30px;
font-size: 14px;
color: $second_navigation_text;
&:hover {
border-bottom: 2px solid $orange;
}
}
a.active {
color: $orange;
background-color: inherit;
border-bottom: 2px solid $orange;
}
.side-left {
padding-left: 10px;
}
.side-right {
padding-right: 12px;
}
.space {
width: 20px;
height: 19px;
padding: 0px;
}
.single {
padding: 0px 12px 0px 24px¸;
&:hover {
text-shadow: 0px 1px 0px #fff;
}
&:active {
color: $grey_normal;
}
}
}
div#secondNavigation.library {
padding-left: 35px;
a {
font-size: 14px;
}
ul.secondNavigation {
.space {
width: 25px;
}
}
}
#secondNavigation_links {
position: relative;
float: right;
width: auto;
margin-top: -7px;
line-height: 38px;
z-index: 2;
text-align: right;
#hover_export {
display: none;
position: absolute;
z-index: 99999;
right: 10px;
top: 39px;
padding: 5px 0 5px 13px;
width: 180px;
text-align: left;
line-height: normal;
background-color: $second_navigation_background;
border: 1px $soft_blue solid;
-webkit-box-shadow: 0 5px 15px 0 rgba(0,0,0,0.4);
box-shadow: 0 5px 15px 0 rgba(0,0,0,0.4);
-moz-box-shadow: 0 5px 15px 0 rgba(0,0,0,0.4);
a {
display: block;
padding: 6px 0;
color: $export_dropdown_text;
font-size: 14px;
transition: 0.2s;
&:hover {
color: $orange;
}
}
span.hover_export_icon {
display: inline-block;
width: 40px;
}
}
}
ul.secondNavigationArchive {
display: inline-block;
float: left;
width: auto;
padding: 0px;
margin: 0 0 0 10px !important;
padding-left: 23px;
padding-top: 0px;
font-size: 14px;
list-style-image: none;
list-style-position: outside;
list-style-type: none;
border-left: 1px dotted $soft_blue;
li {
display: list-item;
padding: 0 12px;
float: left;
margin: 0px;
transition: 0.2s;
a {
color: $second_navigation_text;
line-height: 31px;
}
a.active {
color: $orange;
}
&:hover {
border-bottom: 2px solid $orange;
}
}
li.aactive{
border-bottom: 2px solid $orange;
}
}
// skrijemo breadcrumbs na desktopu
div.breadcrumbs {
display: none;
}