aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/app.component.scss
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2017-12-01 09:20:19 +0100
committerChocobozzz <florian.bigard@gmail.com>2017-12-01 10:55:56 +0100
commitb33f657c304b77938c1f68164d8e754787f5aae5 (patch)
tree93c47cfff0124a1084e7c5344969a82ed60ee926 /client/src/app/app.component.scss
parentfef2c7164e025b12a64185dbab058ef4129733c6 (diff)
downloadPeerTube-b33f657c304b77938c1f68164d8e754787f5aae5.tar.gz
PeerTube-b33f657c304b77938c1f68164d8e754787f5aae5.tar.zst
PeerTube-b33f657c304b77938c1f68164d8e754787f5aae5.zip
Begin new menu design
Diffstat (limited to 'client/src/app/app.component.scss')
-rw-r--r--client/src/app/app.component.scss63
1 files changed, 30 insertions, 33 deletions
diff --git a/client/src/app/app.component.scss b/client/src/app/app.component.scss
index a656d5c29..28e86097c 100644
--- a/client/src/app/app.component.scss
+++ b/client/src/app/app.component.scss
@@ -2,10 +2,23 @@
2 min-height: calc(100vh - #{$header-height} - #{$footer-height} - #{$footer-margin}); 2 min-height: calc(100vh - #{$header-height} - #{$footer-height} - #{$footer-margin});
3} 3}
4 4
5.main-col {
6 margin-left: $menu-width;
7
8 &.expanded {
9 margin-left: 0;
10 }
11}
12
13.sub-header-container {
14 margin-top: $header-height;
15}
16
5.title-menu-left { 17.title-menu-left {
6 position: fixed; 18 position: fixed;
7 height: calc(100vh - #{$header-height}); 19 height: calc(100vh - #{$header-height});
8 padding: 0; 20 padding: 0;
21 width: $menu-width;
9 22
10 .title-menu-left-block.menu { 23 .title-menu-left-block.menu {
11 height: 100%; 24 height: 100%;
@@ -14,35 +27,28 @@
14 27
15.header { 28.header {
16 height: $header-height; 29 height: $header-height;
17 30 position: fixed;
18 .fake-title-block { 31 width: 100%;
19 display: inline-block; 32 background-color: #fff;
20 } 33 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16);
34 display: flex;
21 35
22 .top-left-block { 36 .top-left-block {
23 z-index: 100; 37 width: $menu-width;
24 background-color: #fff; 38 z-index: 1001;
25 border-right: 1px solid $header-border-color;
26 height: $header-height; 39 height: $header-height;
27 line-height: $header-height; 40 line-height: $header-height;
28 margin-top: 0; 41 margin-top: 0;
29 margin-bottom: 0; 42 margin-bottom: 0;
30 display: flex; 43 display: flex;
31 position: fixed;
32 padding: 0; 44 padding: 0;
33 45
34 &.border-bottom {
35 border-bottom: 1px solid $header-border-color;
36 }
37
38 .hamburger-block { 46 .hamburger-block {
39 margin-right: 15px; 47 margin-right: 10px;
40 margin-left: 15px; 48 margin-left: 25px;
41 49
42 .glyphicon { 50 .glyphicon {
43 cursor: pointer; 51 cursor: pointer;
44 position: relative;
45 top: 4px;
46 } 52 }
47 } 53 }
48 54
@@ -50,12 +56,9 @@
50 a { 56 a {
51 color: inherit !important; 57 color: inherit !important;
52 display: block; 58 display: block;
53 background: url('../assets/logo.png') no-repeat; 59 background: url('../assets/logo.svg') no-repeat;
54 background-size: contain; 60 width: 24px;
55 background-position: center; 61 height: 24px;
56 height: 100%;
57 margin: auto;
58 width: 135px;
59 62
60 &:hover { 63 &:hover {
61 color: inherit !important; 64 color: inherit !important;
@@ -122,17 +125,11 @@
122 } 125 }
123 } 126 }
124 127
125 my-search { 128 .header-right {
126 position: fixed; 129 text-align: right;
127 z-index: 1000; 130 height: $header-height;
128 // Fix col-md-* padding 131 margin-left: $menu-width;
129 padding: 0; 132 flex-grow: 1;
130 }
131
132 .search-col {
133 height: 100%;
134 margin-left: -15px;
135 padding: 0;
136 } 133 }
137} 134}
138 135