[web] Remove inline styles whenever possible

Most of the inline styles have been removed in favour of standard Bulma styles.
This commit is contained in:
Alain Nussbaumer
2023-07-01 18:19:29 +02:00
parent 60f1c84a21
commit 91c5a4fa67
18 changed files with 34 additions and 86 deletions

View File

@@ -1,6 +1,6 @@
<template>
<section>
<nav class="buttons is-centered fd-is-square" style="margin-bottom: 16px">
<nav class="buttons is-centered mb-4 fd-is-square">
<a
v-for="char in index"
:key="char"

View File

@@ -32,11 +32,7 @@
</div>
<div class="field">
<label class="checkbox is-size-7 is-small">
<input
v-model="rescan_metadata"
type="checkbox"
style="margin-right: 5px"
/>
<input v-model="rescan_metadata" type="checkbox" class="mr-2" />
<span v-text="$t('dialog.update.rescan-metadata')" />
</label>
</div>

View File

@@ -92,10 +92,7 @@
size="18"
/>
</a>
<div
class="navbar-dropdown is-right is-boxed"
style="margin-right: 6px; margin-bottom: 6px; border-radius: 6px"
>
<div class="navbar-dropdown is-right">
<div class="navbar-item">
<!-- Outputs: master volume -->
<div class="level is-mobile">
@@ -153,20 +150,19 @@
</div>
<div class="level-item">
<div class="is-flex-grow-1">
<p
class="heading"
<div
class="is-flex is-align-content-center"
:class="{ 'has-text-grey-light': !playing }"
>
<span v-text="$t('navigation.stream')" />
<a href="stream.mp3" class="ml-2" target="_blank"
<p class="heading" v-text="$t('navigation.stream')" />
<a href="stream.mp3" class="heading ml-2" target="_blank"
><mdicon
class="icon"
class="icon is-small"
name="open-in-new"
size="16"
style="vertical-align: middle"
/>
</a>
</p>
</div>
<input
v-model="stream_volume"
:disabled="!playing"
@@ -238,7 +234,7 @@
class="slider"
max="100"
type="range"
:style="{ '--ratio': player.volume }"
:style="{ '--ratio': player.volume / 100 }"
@change="change_volume"
/>
</div>
@@ -270,20 +266,19 @@
</div>
<div class="level-item">
<div class="is-flex-grow-1">
<p
class="heading"
<div
class="is-flex is-align-content-center"
:class="{ 'has-text-grey-light': !playing }"
>
<span v-text="$t('navigation.stream')" />
<a href="stream.mp3" class="ml-2" target="_blank"
<p class="heading" v-text="$t('navigation.stream')" />
<a href="stream.mp3" class="heading ml-2" target="_blank"
><mdicon
class="icon"
class="icon is-small"
name="open-in-new"
size="16"
style="vertical-align: middle"
/>
</a>
</p>
</div>
<input
v-model="stream_volume"
:disabled="!playing"

View File

@@ -118,10 +118,7 @@
<navbar-item-link to="/about">{{
$t('navigation.about')
}}</navbar-item-link>
<div
class="navbar-item is-hidden-desktop"
style="margin-bottom: 2.5rem"
/>
<div class="navbar-item is-hidden-desktop" />
</div>
</div>
</div>
@@ -129,7 +126,6 @@
<div
v-show="show_settings_menu"
class="is-overlay"
style="z-index: 10; width: 100vw; height: 100vh"
@click="show_settings_menu = false"
/>
</nav>

View File

@@ -5,7 +5,7 @@
ref="setting"
type="checkbox"
:checked="value"
style="margin-right: 5px"
class="mr-2"
@change="set_update_timer"
/>
<slot name="label" />

View File

@@ -12,10 +12,9 @@
<div class="control">
<input
ref="setting"
class="input"
class="column input is-one-fifth"
type="number"
min="0"
style="width: 10em"
:placeholder="placeholder"
:value="value"
@input="set_update_timer"