6 height: calc(100vh - #{$header-height});
12 background-color: $menu-background;
17 text-overflow: ellipsis;
22 flex-direction: column;
31 background-color: rgba(255, 255, 255, 0.15);
34 justify-content: center;
38 @include avatar(34px);
49 font-weight: $font-semibold;
53 @include disable-default-a-behaviour;
61 text-overflow: ellipsis;
81 margin: 30px 25px 35px 25px;
84 @include peertube-button-link;
85 @include orange-button;
92 .create-account-button {
93 @include peertube-button-link;
99 background-color: rgba(255, 255, 255, 0.25);
102 background-color: rgba(255, 255, 255, 0.28);
108 text-transform: uppercase;
109 font-weight: $font-bold; // Bold
121 padding-left: $menu-left-padding;
126 transition: background-color .1s ease-in-out;
127 @include disable-default-a-behaviour;
130 background-color: rgba(255, 255, 255, 0.15);
138 &.icon-videos-subscriptions {
141 background-image: url('../../assets/images/menu/subscriptions.svg');
144 &.icon-videos-overview {
146 background-image: url('../../assets/images/menu/globe.svg');
149 &.icon-videos-trending {
152 background-image: url('../../assets/images/menu/trending.svg');
155 &.icon-videos-recently-added {
158 background-image: url('../../assets/images/menu/recently-added.svg');
161 &.icon-videos-local {
168 background-image: url('../../assets/images/menu/home.svg');
171 &.icon-administration {
175 background-image: url('../../assets/images/menu/administration.svg');
182 background-image: url('../../assets/images/menu/about.svg');
189 padding-bottom: 15px;
190 padding-left: $menu-left-padding;
192 .language, .color-palette {
193 display: inline-block;
194 color: $menu-bottom-color;
197 font-weight: $font-semibold;
209 background-image: url('../../assets/images/menu/language.png');
219 background-image: url('../../assets/images/menu/moonsun.svg');
230 @media screen and (max-width: 400px) {
232 width: 100% !important;