X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fvideos%2F%2Bvideo-edit%2Fshared%2Fvideo-edit.component.scss;h=1b7bc56b4ac6216aae01f7ccedafb49f2e5ab8d4;hb=a6d5ff7604a3c2a94ff8814e2df7ca7bb2b48634;hp=81e3a0d19b634c019a99608e099b3f0662d5d092;hpb=cb9244de975909bac2922c4412fd948646ff3ba7;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/videos/+video-edit/shared/video-edit.component.scss b/client/src/app/videos/+video-edit/shared/video-edit.component.scss index 81e3a0d19..1b7bc56b4 100644 --- a/client/src/app/videos/+video-edit/shared/video-edit.component.scss +++ b/client/src/app/videos/+video-edit/shared/video-edit.component.scss @@ -1,16 +1,36 @@ @import '_variables'; @import '_mixins'; +label { + font-weight: $font-regular; + font-size: 100%; +} + .peertube-select-container { @include peertube-select-container(auto); } -.peertube-select-disabled-container { - @include peertube-select-disabled-container(auto); +.title-page a { + color: var(--mainForegroundColor); + + &:hover { + text-decoration: none; + opacity: .8; + } +} + +my-peertube-checkbox { + display: block; + margin-bottom: 1rem; +} + +.nav-tabs { + margin-bottom: 15px; } .video-edit { height: 100%; + min-height: 300px; .form-group { margin-bottom: 25px; @@ -19,52 +39,89 @@ input { @include peertube-input-text(100%); display: block; + } - &[type=checkbox] { - @include peertube-checkbox(1px); - } + .label-tags + span { + font-size: 15px; } - input, select { - font-size: 15px + .advanced-settings .form-group { + margin-bottom: 20px; } +} - .form-group-checkbox { +.captions { + + .captions-header { + text-align: right; + + .create-caption { + @include create-button; + } + } + + .caption-entry { display: flex; + height: 40px; align-items: center; - label { - font-weight: $font-regular; - margin: 0; + a.caption-entry-label { + @include disable-default-a-behaviour; + + color: #000; + + &:hover { + opacity: 0.8; + } } - input { - width: 10px; - margin-right: 10px; + .caption-entry-label { + font-size: 15px; + font-weight: bold; + + margin-right: 20px; + width: 150px; + } + + .caption-entry-state { + width: 200px; + + &.caption-entry-state-create { + color: #39CC0B; + } + + &.caption-entry-state-delete { + color: #FF0000; + } + } + + .caption-entry-delete { + @include peertube-button; + @include grey-button; } } - .label-tags + span { + .no-caption { + text-align: center; font-size: 15px; } } .submit-container { text-align: right; - position: relative; - bottom: $button-height; .message-submit { display: inline-block; margin-right: 25px; - color: #585858; + color: $grey-foreground-color; font-size: 15px; } .submit-button { @include peertube-button; @include orange-button; + @include button-with-icon(20px, 1px); display: inline-block; @@ -74,78 +131,26 @@ border: none; padding: 0; outline: 0; - } - - .icon.icon-validate { - @include icon(20px); - - cursor: inherit; - position: relative; - top: -1px; - margin-right: 4px; - background-image: url('../../../../assets/images/global/validate.svg'); + color: inherit; + font-weight: $font-semibold; } } } -/deep/ { - .ng2-tag-input { - border: none !important; - } - - .ng2-tags-container { - display: flex; - align-items: center; - border: 1px solid #C6C6C6; - border-radius: 3px; - padding: 5px !important; - height: 40px; - } - - tag-input-form { - input { - height: 30px !important; - background-color: #fff !important; - } - } - - tag { - background-color: #E5E5E5 !important; - border-radius: 3px !important; - font-size: 15px !important; - color: #000 !important; - height: 30px !important; - line-height: 30px !important; - margin: 0 5px 0 0 !important; - cursor: default !important; - padding: 0 8px 0 10px !important; - - div { - height: 100% !important; - } - } +p-calendar { + display: block; - delete-icon { - cursor: pointer !important; - height: auto !important; - vertical-align: middle !important; - padding-left: 6px !important; - - svg { - position: relative; - top: -1px; - height: auto !important; - vertical-align: middle !important; - fill: #585858 !important; + ::ng-deep { + input, + .ui-calendar { + width: 100%; } - &:hover { - transform: none !important; + input { + @include peertube-input-text(100%); + color: #000; } } } -.little-information { - font-size: 0.8em; - font-style: italic; -} +@include ng2-tags