mirror of
https://github.com/4gray/iptvnator.git
synced 2026-10-08 17:06:15 -08:00
style: visual improvements on settings page
This commit is contained in:
1 parent
94ef51d0ff
commit
737d4be387
2 files changed
+76
-65
No files matched your search
@@ -66,7 +66,7 @@
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
<mat-divider />
|
||||
</ng-container>
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
@@ -92,47 +92,53 @@
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
<div class="row" *ngIf="settingsForm.value.player === 'mpv'">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.MPV_PLAYER_PATH_LABEL' | translate }}
|
||||
<p>{{ 'SETTINGS.MPV_PLAYER_PATH_DESCRIPTION' | translate }}</p>
|
||||
@if (settingsForm.value.player === 'mpv') {
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.MPV_PLAYER_PATH_LABEL' | translate }}
|
||||
<p>
|
||||
{{ 'SETTINGS.MPV_PLAYER_PATH_DESCRIPTION' | translate }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="column">
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label for="mpvPlayerPath">{{
|
||||
'SETTINGS.MPV_PLAYER_PATH' | translate
|
||||
}}</mat-label>
|
||||
<input
|
||||
matInput
|
||||
type="text"
|
||||
id="mpvPlayerPath"
|
||||
formControlName="mpvPlayerPath"
|
||||
/>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label for="mpvPlayerPath">{{
|
||||
'SETTINGS.MPV_PLAYER_PATH' | translate
|
||||
}}</mat-label>
|
||||
<input
|
||||
matInput
|
||||
type="text"
|
||||
id="mpvPlayerPath"
|
||||
formControlName="mpvPlayerPath"
|
||||
/>
|
||||
</mat-form-field>
|
||||
}
|
||||
@if (settingsForm.value.player === 'vlc') {
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.VLC_PLAYER_PATH_LABEL' | translate }}
|
||||
<p>
|
||||
{{ 'SETTINGS.VLC_PLAYER_PATH_DESCRIPTION' | translate }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="column">
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label for="vlcPlayerPath">{{
|
||||
'SETTINGS.VLC_PLAYER_PATH' | translate
|
||||
}}</mat-label>
|
||||
<input
|
||||
matInput
|
||||
type="text"
|
||||
id="vlcPlayerPath"
|
||||
formControlName="vlcPlayerPath"
|
||||
/>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
</div>
|
||||
<div class="row" *ngIf="settingsForm.value.player === 'vlc'">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.VLC_PLAYER_PATH_LABEL' | translate }}
|
||||
<p>{{ 'SETTINGS.VLC_PLAYER_PATH_DESCRIPTION' | translate }}</p>
|
||||
</div>
|
||||
<div class="column">
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label for="vlcPlayerPath">{{
|
||||
'SETTINGS.VLC_PLAYER_PATH' | translate
|
||||
}}</mat-label>
|
||||
<input
|
||||
matInput
|
||||
type="text"
|
||||
id="vlcPlayerPath"
|
||||
formControlName="vlcPlayerPath"
|
||||
/>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
</div>
|
||||
}
|
||||
<mat-divider />
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.LANGUAGE' | translate }}
|
||||
@@ -159,7 +165,7 @@
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
<mat-divider />
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.THEME' | translate }}
|
||||
@@ -186,7 +192,7 @@
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
<mat-divider />
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.SHOW_CAPTIONS' | translate }}
|
||||
@@ -200,7 +206,7 @@
|
||||
</div>
|
||||
</div>
|
||||
@if (isPwa || isElectron) {
|
||||
<mat-divider></mat-divider>
|
||||
<mat-divider />
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.REMOTE_CONTROL' | translate }}
|
||||
@@ -216,26 +222,31 @@
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
<mat-divider></mat-divider>
|
||||
<div class="row" *ngIf="settingsForm.value.remoteControl === true">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.REMOTE_CONTROL_PORT' | translate }}
|
||||
<p>
|
||||
{{ 'SETTINGS.REMOTE_CONTROL_PORT_DESCRIPTION' | translate }}
|
||||
</p>
|
||||
@if (settingsForm.value.remoteControl === true) {
|
||||
<mat-divider />
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.REMOTE_CONTROL_PORT' | translate }}
|
||||
<p>
|
||||
{{
|
||||
'SETTINGS.REMOTE_CONTROL_PORT_DESCRIPTION'
|
||||
| translate
|
||||
}}
|
||||
</p>
|
||||
</div>
|
||||
<div class="column" style="margin-right: 10px">
|
||||
<mat-form-field appearance="outline" class="full-width">
|
||||
<input
|
||||
matInput
|
||||
type="text"
|
||||
id="remoteControlPort"
|
||||
formControlName="remoteControlPort"
|
||||
/>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column" style="margin-right: 10px">
|
||||
<mat-form-field appearance="outline" class="full-width">
|
||||
<input
|
||||
matInput
|
||||
type="text"
|
||||
id="remoteControlPort"
|
||||
formControlName="remoteControlPort"
|
||||
/>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
}
|
||||
<mat-divider />
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.VERSION' | translate }}
|
||||
@@ -246,7 +257,7 @@
|
||||
{{ updateMessage }}
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
<mat-divider />
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
{{ 'SETTINGS.IMPORT_EXPORT_DATA' | translate }}
|
||||
@@ -307,7 +318,7 @@
|
||||
}}</a>
|
||||
</div>
|
||||
|
||||
<mat-divider></mat-divider>
|
||||
<mat-divider />
|
||||
<div class="action-buttons" align="end">
|
||||
<button
|
||||
mat-button
|
||||
|
||||
@@ -5,7 +5,7 @@ button {
|
||||
|
||||
.settings-container {
|
||||
overflow: auto;
|
||||
height: calc(100vh - 140px);
|
||||
height: calc(100vh - 100px);
|
||||
}
|
||||
|
||||
.row {
|
||||
|
||||
Reference in new issue
Block a user