X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fvideos%2F%2Bvideo-edit%2Fvideo-add.component.scss;h=dd97b79eed685d06b65583ad436733ca97746b83;hb=8eaa6d62c6c5659dae7db16f3718327df572a91c;hp=c0b5f3d070fe6a746c487413f9035770b68c966b;hpb=84455f2b94d14b387f77fdb92f5e646621d7bef9;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/videos/+video-edit/video-add.component.scss b/client/src/app/videos/+video-edit/video-add.component.scss index c0b5f3d07..dd97b79ee 100644 --- a/client/src/app/videos/+video-edit/video-add.component.scss +++ b/client/src/app/videos/+video-edit/video-add.component.scss @@ -1,101 +1,55 @@ @import '_variables'; @import '_mixins'; -.upload-video-container { - border-radius: 3px; - background-color: #F7F7F7; - border: 3px solid #EAEAEA; - width: 100%; - height: 440px; - margin-top: 40px; - display: flex; - justify-content: center; - align-items: center; +$border-width: 3px; +$border-type: solid; +$border-color: #EAEAEA; - .peertube-select-container { - @include peertube-select-container(190px); +/deep/ .root-tabset.video-add-tabset { + &.hide-nav > .nav { + display: none !important; } - .upload-video { - display: flex; - flex-direction: column; - align-items: center; - - .form-group-channel { - margin-bottom: 20px; - } + & > .nav { - .icon.icon-upload { - @include icon(90px); - margin-bottom: 25px; - cursor: default; + border-bottom: $border-width $border-type $border-color; + margin: 0 !important; - background-image: url('../../../assets/images/video/upload.svg'); + & > li { + margin-bottom: -$border-width; } - .button-file { - @include peertube-button-file(auto); - - min-width: 190px; - } - - .button-file-extension { - display: block; - font-size: 12px; - margin-top: 5px; - } - } - - .form-group-channel { - margin-top: 35px; - } -} + a.nav-link { + @include disable-default-a-behaviour; -.upload-progress-cancel { - display: flex; - margin-top: 25px; - margin-bottom: 40px; + height: 40px !important; + padding: 0 30px !important; + font-size: 15px; - p-progressBar { - flex-grow: 1; + &.active { + border: $border-width $border-type $border-color; + border-bottom: none; + background-color: var(--submenuColor) !important; - /deep/ .ui-progressbar { - font-size: 15px !important; - color: #fff !important; - height: 30px !important; - line-height: 30px !important; - border-radius: 3px !important; - background-color: rgba(11, 204, 41, 0.16) !important; - - .ui-progressbar-value { - background-color: #0BCC29 !important; - } - - .ui-progressbar-label { - text-align: left; - padding-left: 18px; - margin-top: 0 !important; - } - } - - &.processing { - /deep/ .ui-progressbar-label { - // Same color as background to hide "100%" - color: rgba(11, 204, 41, 0.16) !important; - - &::before { - content: 'Processing...'; - color: #fff; + span { + border-bottom: 2px solid var(--mainColor); + font-weight: $font-bold; } } } } - input { - @include peertube-button; - @include grey-button; + .upload-video-container { + border: $border-width $border-type $border-color; + border-top: none; - margin-left: 10px; + background-color: var(--submenuColor); + border-radius: 3px; + width: 100%; + min-height: 440px; + padding-bottom: 20px; + display: flex; + justify-content: center; + align-items: center; } -} - +} \ No newline at end of file