X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fsass%2Fapplication.scss;h=0c999d6599a3148c1c3f9bf7c2263792e1a2b7f7;hb=4cc66133abf1e37873316999b660c93ab92eb4a0;hp=58f07612bfaa299476cf8fb2601ba38e81fbedaa;hpb=b33f657c304b77938c1f68164d8e754787f5aae5;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/sass/application.scss b/client/src/sass/application.scss index 58f07612b..0c999d659 100644 --- a/client/src/sass/application.scss +++ b/client/src/sass/application.scss @@ -20,12 +20,19 @@ input.readonly { background-color: #fff !important; } -.form-control, .btn { - border-radius: 0; +label { + font-weight: $font-bold; + font-size: 15px; } -.dropdown-menu { - border-radius: 0; +.form-error { + display: block; + color: $red-error; + margin-top: 5px; +} + +.input-error { + border-color: $red-error !important; } .glyphicon-black { @@ -33,27 +40,54 @@ input.readonly { } .main-col { - .content-padding { - padding: 15px 30px; + margin-left: $menu-width; - @media screen and (max-width: 800px) { - padding: 15px 10px; - } + .margin-content { + margin-left: $not-expanded-horizontal-margins; + margin-right: $not-expanded-horizontal-margins; + } - @media screen and (min-width: 1400px) { - padding: 15px 40px; - } + .sub-menu { + background-color: #F7F7F7; + width: 100%; + height: 81px; + margin-bottom: 30px; + display: flex; + align-items: center; + padding-left: $not-expanded-horizontal-margins; + } + + // Override some properties if the main content is expanded (no menu on the left) + &.expanded { + margin-left: 0; - @media screen and (min-width: 1600px) { - padding: 15px 50px; + .margin-content { + margin-left: $expanded-horizontal-margins; + margin-right: $expanded-horizontal-margins; } - @media screen and (min-width: 1800px) { - padding: 15px 60px; + .sub-menu { + padding-left: $expanded-horizontal-margins; } } } +.title-page { + color: #000; + font-size: 16px; + display: inline-block; + margin-right: 55px; + font-weight: $font-semibold; + @include disable-default-a-behaviour; + + &.active, &.title-page-single { + border-bottom: 2px solid $orange-color; + font-weight: $font-bold; + margin-top: 30px; + margin-bottom: 25px; + } +} + // On small screen, menu is absolute and displayed over the page @media screen and (max-width: 500px) { .title-menu-left { @@ -104,3 +138,47 @@ p-datatable { } } } + +.dropdown-menu { + border-radius: 3px; + box-shadow: 0 3px 6px; + font-size: 15px; + + .dropdown-item { + padding: 3px 15px; + } + + a { + color: #000 !important; + } +} + +.modal { + .modal-header { + border-bottom: none; + + .title-page-single { + margin: 0; + } + } +} + +.orange-button { + @include peertube-button; + @include orange-button; +} + +.orange-button-link { + @include peertube-button-link; + @include orange-button; +} + +.grey-button { + @include peertube-button; + @include grey-button; +} + +.grey-button-link { + @include peertube-button-link; + @include grey-button; +}