Add checkbox focus shadows, and admin resolution descriptions

pull/2362/head
Rigel Kent 2020-01-06 12:40:59 +01:00
parent a6051ba746
commit 46db9430af
No known key found for this signature in database
GPG Key ID: 5E53E96A494E452F
7 changed files with 20 additions and 6 deletions

View File

@ -549,7 +549,11 @@
<my-peertube-checkbox
[inputName]="getResolutionKey(resolution.id)" [formControlName]="resolution.id"
i18n-labelText labelText="Resolution {{resolution.label}} enabled"
></my-peertube-checkbox>
>
<ng-template *ngIf="resolution.description" ptTemplate="help">
<div i18n [innerHTML]="resolution.description"></div>
</ng-template>
</my-peertube-checkbox>
</div>
</ng-container>

View File

@ -18,7 +18,7 @@ import { ServerConfig } from '@shared/models'
export class EditCustomConfigComponent extends FormReactive implements OnInit {
customConfig: CustomConfig
resolutions: { id: string, label: string }[] = []
resolutions: { id: string, label: string, description?: string }[] = []
transcodingThreadOptions: { label: string, value: number }[] = []
languageItems: SelectItem[] = []
@ -40,7 +40,8 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
this.resolutions = [
{
id: '0p',
label: this.i18n('Audio-only')
label: this.i18n('Audio-only'),
description: `A <code>.mp4</code> that keeps the original audio track, with no video`
},
{
id: '240p',

View File

@ -31,6 +31,10 @@
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="https://joinpeertube.org/help" target="_blank" rel="noopener noreferrer">
<my-global-icon iconName="help"></my-global-icon> <ng-container i18n>Help</ng-container>
</a>
<a (click)="logout($event)" class="dropdown-item" href="#">
<my-global-icon iconName="sign-out"></my-global-icon> <ng-container i18n>Log out</ng-container>
</a>

View File

@ -6,6 +6,7 @@
.form-group-checkbox {
display: flex;
align-items: center;
.label-text {
font-weight: $font-regular;
@ -23,6 +24,6 @@
my-help {
position: relative;
top: -2px;
top: 2px;
}
}

View File

@ -26,7 +26,7 @@
font-size: 13px;
background-color: var(--mainBackgroundColor);
color: var(--mainForegroundColor);
box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
p {
margin-bottom: 0;

View File

@ -337,7 +337,7 @@
position: absolute;
&:focus + span {
outline: 1px solid #1e5180;
box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2);
}
& + span {

View File

@ -330,6 +330,10 @@ p-calendar .ui-datepicker {
}
}
p-tablecheckbox:hover div .ui-chkbox-box {
box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2);
}
.ui-chkbox {
&, .ui-chkbox-box {