blob: f10a61380773344cecc15157048bda0d0acb7ed1 [file] [log] [blame]
Matteo Scandolo2500e392016-03-25 17:20:27 -07001/************************* NAV *************************/
2
Arpit Agarwal701d8dc2016-07-18 14:01:39 -07003@import "../bootstrap/bootstrap/_variables.scss";
4
Matteo Scandolo2500e392016-03-25 17:20:27 -07005#sidebar-wrapper {
6 -webkit-box-shadow: 3px 0px 5px 0px rgba(50, 50, 50, 0.75);
7 -moz-box-shadow: 3px 0px 5px 0px rgba(50, 50, 50, 0.75);
8 box-shadow: 3px 0px 5px 0px rgba(50, 50, 50, 0.75);
9
10 .logo{
11 max-width: 100%;
Matteo Scandoloc89fc6a2016-07-18 16:34:58 -070012 margin: $default-spacing auto;
Matteo Scandolo2500e392016-03-25 17:20:27 -070013 }
14
15 a {
16 font-weight: bold;
17 }
18
19 // ICONS
20 .icon-app {
21 background-image: url("opencloudApp.png");
22 }
23 .icon-home {
24 /* Going with darker standard color nav -- so using over png's background-image: url("Home.png"); */
25 background-image: url("Home.png");
26 }
27 .icon-deployment{
28 background-image: url("Deployments.png");
29 }
30 .icon-site{
31 background-image: url("Sites.png");
32 }
33 .icon-slice{
34 background-image: url("Slices.png");
35 }
36 .icon-user{
37 background-image: url("Users.png");
38 }
39 .icon-reservation{
40 background-image: url("Reservations.png");
41 }
42 .icon-cog{
43 background-image: url("Services.png");
44 }
45
46 // ACTIVE ICONS
47 li.active a,
48 li.focus a {
49 .icon-home{
50 background-image: url("Home_over.png");
51 }
52 .icon-deployment{
53 background-image: url("Deployments_over.png");
54 }
55 .icon-site{
56 background-image: url("Sites_over.png");
57 }
58 .icon-slice{
59 background-image: url("Slices_over.png");
60 }
61 .icon-user{
62 background-image: url("Users_over.png");
63 }
64 .icon-reservation{
65 background-image: url("Reservations_over.png");
66 }
67 .icon-cog{
68 background-image: url("Services_over.png");
69 }
70 }
71
Arpit Agarwal701d8dc2016-07-18 14:01:39 -070072 li{
Matteo Scandoloc89fc6a2016-07-18 16:34:58 -070073 a {
74 transition: all .5s ease-in-out;
75 }
Arpit Agarwal701d8dc2016-07-18 14:01:39 -070076 ul.dashboard-list{
Matteo Scandoloc89fc6a2016-07-18 16:34:58 -070077 padding-left: $default-spacing;
Arpit Agarwal701d8dc2016-07-18 14:01:39 -070078 li{
Matteo Scandoloc89fc6a2016-07-18 16:34:58 -070079 list-style: none;
80 position: relative;
81 margin-top: $default-spacing / 4;
82 margin-bottom: $default-spacing / 4;
83 margin-left: $default-spacing;
Arpit Agarwal701d8dc2016-07-18 14:01:39 -070084
Matteo Scandoloc89fc6a2016-07-18 16:34:58 -070085 &:before {
86 display: inline-block;
87 font-size: 2em;
88 font-weight: 200;
89 position: absolute;
90 top: 15px;
91 left: -15px;
92 line-height: 0;
93 content: '-';
94 background-color: $nav-pills-active-link-hover-bg;
95 }
96 // Actual tabs (as links)
97 > a {
98 cursor: pointer;
99 display: block;
100 padding: 5px 0px;
101 margin-right: 0;
102 border-radius: $nav-pills-border-radius;
Arpit Agarwal701d8dc2016-07-18 14:01:39 -0700103
Matteo Scandoloc89fc6a2016-07-18 16:34:58 -0700104 &:hover,&:focus {
105 padding-left: 15px;
106 text-decoration: none;
107 background-color: $nav-link-hover-bg;
Arpit Agarwal701d8dc2016-07-18 14:01:39 -0700108 }
Matteo Scandoloc89fc6a2016-07-18 16:34:58 -0700109 }
Arpit Agarwal701d8dc2016-07-18 14:01:39 -0700110
Matteo Scandoloc89fc6a2016-07-18 16:34:58 -0700111 // Active state, and its :hover to override normal :hover
112 &.active > a {
113 padding-left: 15px;
114 color: $nav-pills-active-link-hover-color;
115 background-color: lighten($nav-pills-active-link-hover-bg, 5%);
116 }
Arpit Agarwal701d8dc2016-07-18 14:01:39 -0700117 }
118 }
119 }
Matteo Scandolo2500e392016-03-25 17:20:27 -0700120 [class^="icon-"]{
121 background-position: left center;
122 width:22px;
123 height:22px;
124 display: inline-block;
125 margin-right: 10px;
126 position: relative;
127 top: 5px;
128 }
129
130}
131
132/************************* END NAV *************************/