Fix channel buttons height

pull/5648/head
Chocobozzz 2023-02-22 09:03:41 +01:00
parent 39a88d24c7
commit b849adf9d8
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
2 changed files with 22 additions and 17 deletions

View File

@ -34,14 +34,15 @@
} }
.channel-info { .channel-info {
// Use the same margin as the videos grid
@include grid-videos-miniature-margins(false, 15px); @include grid-videos-miniature-margins(false, 15px);
@include margin-bottom(3rem);
display: grid; display: grid;
grid-template-columns: 1fr auto; grid-template-columns: 1fr auto;
grid-template-rows: auto auto; grid-template-rows: auto auto;
background-color: pvar(--channelBackgroundColor); background-color: pvar(--channelBackgroundColor);
margin-bottom: 45px;
padding-top: var(--myGlobalTopPadding); padding-top: var(--myGlobalTopPadding);
font-size: var(--myFontSize); font-size: var(--myFontSize);
} }
@ -68,24 +69,26 @@
.channel-buttons { .channel-buttons {
display: flex; display: flex;
align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
gap: 1rem;
> *:not(:last-child) { &.right {
@include margin-right(15px); @include margin-left(3rem);
} }
}
.channel-buttons.right { // Only used on small screen
@include margin-left(45px); &.bottom {
} @include margin-bottom(2rem);
// Only used by mobile justify-content: center;
.channel-buttons.bottom { display: none;
display: none; }
} }
.owner-card { .owner-card {
@include margin-left(105px); @include margin-left(105px);
grid-column: 2; grid-column: 2;
// Takes all the column // Takes all the column
grid-row: 1 / 3; grid-row: 1 / 3;
@ -194,14 +197,14 @@
display: inline-block; display: inline-block;
} }
.channel-buttons.bottom { .channel-buttons {
display: flex; &.right {
justify-content: center; display: none;
margin-bottom: 30px; }
}
.channel-buttons.right { &.bottom {
display: none; display: flex;
}
} }
.owner-card { .owner-card {

View File

@ -4,6 +4,8 @@
.btn-group-subscribe { .btn-group-subscribe {
@include peertube-button; @include peertube-button;
padding: 0;
button.dropdown-toggle { button.dropdown-toggle {
font-size: $button-font-size; font-size: $button-font-size;
line-height: 1.2; line-height: 1.2;