X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2F%2Baccounts%2Faccounts.component.scss;h=56b952b657960bb31fad19b39a575166e6de8f34;hb=0c302acb3c358b4d4d8dee45aed1de1108ea37ea;hp=5043b98c40a192b0a563d11f289bca9d8d8ca603;hpb=a554bc1a260a525cd635d62404b9fe76fdb9e36b;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/+accounts/accounts.component.scss b/client/src/app/+accounts/accounts.component.scss index 5043b98c4..56b952b65 100644 --- a/client/src/app/+accounts/accounts.component.scss +++ b/client/src/app/+accounts/accounts.component.scss @@ -4,10 +4,8 @@ @use '_miniature' as *; .root { - --myGlobalTopPadding: 60px; - --myImgMargin: 30px; - --myFontSize: 16px; - --myGreyFontSize: 16px; + --myFontSize: 1rem; + --myGreyFontSize: 1rem; } .section-label { @@ -30,32 +28,31 @@ } } -my-user-moderation-dropdown { - margin: 0 10px; - - height: fit-content; -} - .copy-button { + @include margin-left(3px); + border: 0; + + my-global-icon { + width: 15px; + } } .account-info { @include grid-videos-miniature-margins(false, 15px); + @include padding-top(3.75rem); + @include padding-bottom(3.75rem); + @include margin-bottom(3rem); + @include font-size(1rem); - display: grid; grid-template-columns: 1fr min-content; grid-template-rows: auto auto; background-color: pvar(--submenuBackgroundColor); - margin-bottom: 45px; - padding-top: var(--myGlobalTopPadding); - padding-bottom: var(--myGlobalTopPadding); - font-size: var(--myFontSize); } .account-avatar-row { - @include avatar-row-responsive(var(--myImgMargin), var(--myGreyFontSize)); + @include avatar-row-responsive(2rem, var(--myGreyFontSize)); } .actor-display-name { @@ -70,8 +67,8 @@ my-user-moderation-dropdown { .show-more { @include show-more-description; + @include padding-bottom(3.75rem); - display: none; text-align: center; } @@ -84,25 +81,20 @@ my-user-moderation-dropdown { justify-content: flex-end; align-content: flex-start; - > *:not(:last-child) { - margin-bottom: 15px; + >*:not(:last-child) { + @include margin-bottom(1rem); } - > a { + >a { white-space: nowrap; } } -@media screen and (max-width: $small-view) { - .root { - --myGlobalTopPadding: 45px; - --myChannelImgMargin: 15px; - } +.pt-badge { + @include margin-right(5px); +} - .account-info { - display: block; - padding-bottom: 60px; - } +@media screen and (max-width: $small-view) { .description:not(.expanded) { @include fade-text(30px, pvar(--submenuBackgroundColor)); @@ -110,10 +102,6 @@ my-user-moderation-dropdown { max-height: 70px; } - .show-more { - display: block; - } - .buttons { justify-content: center; } @@ -121,22 +109,12 @@ my-user-moderation-dropdown { @media screen and (max-width: $mobile-view) { .root { - --myGlobalTopPadding: 15px; --myFontSize: 14px; --myGreyFontSize: 13px; } - .account-info { - display: block; - padding-bottom: 30px; - } - .links { margin: auto !important; width: min-content; } - - .show-more { - margin-bottom: 30px; - } }