borekon/PeerTube_original
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix my library/account/admin sub titles alignment

Browse Source
This commit is contained in:
Chocobozzz 2021-04-29 09:29:00 +02:00
parent 8b5c8cd1e5
commit cd262619ab
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
3 changed files with 51 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
client/src/app/+my-library/+my-video-channels/my-video-channels.component.html
View File

@ -1,9 +1,7 @@
<h1> <h1>
<span> <my-global-icon iconName="channel" aria-hidden="true"></my-global-icon>
<my-global-icon iconName="channel" aria-hidden="true"></my-global-icon> <ng-container i18n>My channels</ng-container>
<ng-container i18n>My channels</ng-container> <span class="badge badge-secondary">{{ totalItems }}</span>
<span class="badge badge-secondary">{{ totalItems }}</span>
</span>
</h1> </h1>
<div class="video-channels-header d-flex justify-content-between"> <div class="video-channels-header d-flex justify-content-between">

87
client/src/app/+my-library/+my-video-channels/my-video-channels.component.scss
View File

@ -1,6 +1,11 @@
@import '_variables'; @import '_variables';
@import '_mixins'; @import '_mixins';
h1 my-global-icon {
position: relative;
top: -2px;
}
.create-button { .create-button {
@include create-button; @include create-button;
} }
@ -9,10 +14,8 @@ input[type=text] {
@include peertube-input-text(300px); @include peertube-input-text(300px);
} }
::ng-deep .action-button { my-edit-button {
&.action-button-edit { margin-right: 10px;
margin-right: 10px;
}
} }
.video-channel { .video-channel {
@ -25,35 +28,35 @@ input[type=text] {
margin-right: 10px; margin-right: 10px;
} }
}
.video-channel-info { .video-channel-info {
flex-grow: 1; flex-grow: 1;
}
a.video-channel-names { .video-channel-names {
@include disable-default-a-behaviour; @include disable-default-a-behaviour;
width: fit-content; width: fit-content;
display: flex; display: flex;
align-items: baseline; align-items: baseline;
color: pvar(--mainForegroundColor); color: pvar(--mainForegroundColor);
}
.video-channel-display-name { .video-channel-display-name {
font-weight: $font-semibold; font-weight: $font-semibold;
font-size: 18px; font-size: 18px;
} }
.video-channel-name { .video-channel-name {
font-size: 14px; font-size: 14px;
color: $grey-actor-name; color: $grey-actor-name;
margin-left: 5px; margin-left: 5px;
} }
}
}
.video-channel-buttons { .video-channel-buttons {
margin-top: 10px; margin-top: 10px;
min-width: 190px; min-width: 190px;
}
} }
::ng-deep .chartjs-render-monitor { ::ng-deep .chartjs-render-monitor {
@ -73,21 +76,6 @@ input[type=text] {
.video-channel { .video-channel {
padding-bottom: 10px; padding-bottom: 10px;
.video-channel-info {
padding-bottom: 10px;
text-align: center;
.video-channel-names {
flex-direction: column;
align-items: center !important;
margin: auto;
.video-channel-name {
margin-left: 0 !important;
}
}
}
img { img {
margin-right: 0; margin-right: 0;
} }
@ -96,6 +84,21 @@ input[type=text] {
align-self: center; align-self: center;
} }
} }
.video-channel-info {
padding-bottom: 10px;
text-align: center;
}
.video-channel-names {
flex-direction: column;
align-items: center !important;
margin: auto;
}
.video-channel-name {
margin-left: 0 !important;
}
} }
@media screen and (max-width: $mobile-view) { @media screen and (max-width: $mobile-view) {

4
client/src/sass/include/_mixins.scss
View File

@ -897,15 +897,17 @@
padding-bottom: 15px; padding-bottom: 15px;
margin-bottom: $sub-menu-margin-bottom; margin-bottom: $sub-menu-margin-bottom;
> span > my-global-icon,
> my-global-icon { > my-global-icon {
margin-right: 10px; margin-right: 10px;
vertical-align: bottom;
width: 24px; width: 24px;
height: 24px; height: 24px;
vertical-align: top;
} }
.badge { .badge {
margin-left: 7px; margin-left: 7px;
vertical-align: top;
} }
} }
} }