margin-bottom: 35px;
img {
+ @include avatar(34px);
+
margin-left: 20px;
margin-right: 10px;
-
- @include avatar(34px);
}
.logged-in-info {
.button-block {
margin: 30px 25px 35px 25px;
- .login-button, .create-account-button {
- font-weight: $font-semibold;
- font-size: 15px;
- height: $button-height;
- line-height: $button-height;
- width: 100%;
- border-radius: 3px;
- text-align: center;
- color: $menu-color;
+ .login-button {
+ @include peertube-button-link;
+ @include orange-button;
+
display: block;
- cursor: pointer;
- margin-bottom: 15px;
+ width: 100%;
+ margin-bottom: 10px;
+ }
- @include disable-default-a-behaviour;
+ .create-account-button {
+ @include peertube-button-link;
- &.login-button {
- background-color: $orange-color;
- margin-bottom: 10px;
- }
+ display: block;
+ width: 100%;
+
+ color: #fff;
+ background-color: rgba(255, 255, 255, 0.25);
- &.create-account-button {
- background-color: rgba(255, 255, 255, 0.25);
+ &:hover {
+ background-color: rgba(255, 255, 255, 0.28);
}
}
}
font-weight: $font-bold; // Bold
font-size: 13px;
margin-bottom: 25px;
+ margin-left: 26px;
}
.panel-block {
margin-bottom: 45px;
- margin-left: 26px;
a {
display: flex;
+ align-items: center;
+ padding-left: 26px;
color: $menu-color;
cursor: pointer;
- height: 22px;
- line-height: 22px;
+ height: 40px;
font-size: 16px;
- margin-bottom: 15px;
+ transition: background-color .1s ease-in-out;
@include disable-default-a-behaviour;
+ &:hover {
+ background-color: rgba(255, 255, 255, 0.15);
+ }
+
.icon {
@include icon(22px);
background-image: url('../../assets/images/menu/recently-added.svg');
}
- &.icon-administration {
+ &.icon-videos-local {
width: 23px;
height: 23px;
-
- background-image: url('../../assets/images/menu/administration.svg');
- }
- }
- }
- }
-}
-
-@media screen and (max-width: 800px) {
- menu {
- .logged-in-block {
- padding-left: 10px;
-
- img {
- display: none;
- }
-
- .logged-in-info {
- .logged-in-username {
- font-size: 14px;
- }
-
- .logged-in-email {
- font-size: 11px;
- max-width: 120px;
+ position: relative;
+ top: -1px;
+ background-image: url('../../assets/images/menu/home.svg');
}
- }
- .logged-in-more {
- margin-right: 5px;
+ &.icon-administration {
+ width: 23px;
+ height: 23px;
- .login-button, .create-account-button {
- font-weight: $font-semibold;
- font-size: 15px;
- height: $button-height;
- line-height: $button-height;
- width: 190px;
+ background-image: url('../../assets/images/menu/administration.svg');
}
- }
- }
-
- .button-block {
- margin: 20px 10px 25px 10px;
-
- .login-button, .create-account-button {
- font-size: 13px;
- }
- }
- .panel-block {
- margin-bottom: 30px;
- margin-left: 10px;
-
- a {
- font-size: 14px;
+ &.icon-about {
+ width: 23px;
+ height: 23px;
- .icon {
- margin-right: 10px;
+ background-image: url('../../assets/images/menu/about.svg');
}
}
}