tilderadio
/
AzuraCast
mirror of https://github.com/AzuraCast/AzuraCast.git
4
0
Fork 0
Code Issues Releases Wiki Activity

Style fixes for Vue 3 spacing rules

This commit is contained in:
Buster Neece 2022-12-11 19:49:40 -06:00
parent fbf4df9ae2
commit 79e7ed7eb3
No known key found for this signature in database
GPG Key ID: F1D2E64A0005E80E
9 changed files with 39 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/scss/_common.scss
View File

@ -95,6 +95,7 @@ $enable-print-styles: true !default;
// Overrides for the Daemonite Material theme
@import 'azuracast/overrides/body';
@import 'azuracast/overrides/buttons';
@import 'azuracast/overrides/card';
@import 'azuracast/overrides/footer';
@import 'azuracast/overrides/forms';

21
frontend/scss/azuracast/overrides/_buttons.scss Normal file
View File

@ -0,0 +1,21 @@
.btn > .material-icons {
margin-right: calc($btn-padding-x / 2);
}
.btn-lg > .material-icons {
margin-right: calc($btn-padding-x-lg / 2);
}
.btn-sm > .material-icons {
margin-right: calc($btn-padding-x-sm / 2);
}
.buttons {
& > * {
margin-right: .5rem;
}
& > *:last-child {
margin-right: 0;
}
}

2
frontend/vue/components/Admin/AuditLog.vue
View File

@ -6,7 +6,7 @@
<translate key="lang_title">Audit Log</translate>
</h2>
<div class="flex-shrink">
<date-range-dropdown v-model="dateRange" @update="relist"></date-range-dropdown>
<date-range-dropdown v-model:date-range="dateRange" @update="relist"></date-range-dropdown>
</div>
</div>
</div>

12
frontend/vue/components/Common/DateRangeDropdown.vue
View File

@ -1,7 +1,7 @@
<template>
<date-range-picker
v-bind="$props" ref="picker" controlContainerClass="" opens="left" show-dropdowns
:time-picker-increment="1" :ranges="ranges" @update="onUpdate">
:time-picker-increment="1" :ranges="ranges" :date-range="modelValue" @update="onUpdate">
<template #input="datePicker">
<a class="btn btn-bg dropdown-toggle" id="reportrange" href="#" @click.prevent="">
<icon icon="date_range"></icon>
@ -27,11 +27,7 @@ import {DateTime} from 'luxon';
export default {
name: 'DateRangeDropdown',
components: {DateRangePicker, Icon},
emits: ['update', 'input'],
model: {
prop: 'dateRange',
event: 'update',
},
emits: ['update:modelValue', 'update'],
props: {
tz: {
type: String,
@ -53,7 +49,7 @@ export default {
type: Boolean,
default: false,
},
dateRange: { // for v-model
modelValue: {
type: [Object],
default: null,
required: true
@ -64,7 +60,6 @@ export default {
},
},
computed: {
ranges() {
let ranges = {};
@ -113,6 +108,7 @@ export default {
},
methods: {
onUpdate(newValue) {
this.$emit('update:modelValue', newValue);
this.$emit('update', newValue);
}
}

2
frontend/vue/components/Common/FlowUpload.vue
View File

@ -17,8 +17,8 @@
<div class="file-drop-target" ref="file_drop_target">
<translate key="lang_upload_target">Drag file(s) here to upload or</translate>
<button ref="file_browse_target" class="file-upload btn btn-primary text-center ml-1" type="button">
<translate key="lang_select_file">Select File</translate>
<icon icon="cloud_upload"></icon>
<translate key="lang_select_file">Select File</translate>
</button>
<small class="file-name"></small>
<input type="file" :accept="validMimeTypesList" :multiple="allowMultiple"

4
frontend/vue/components/Dashboard.vue
View File

@ -10,12 +10,12 @@
<h3 class="card-subtitle">{{ user.email }}</h3>
</div>
<div class="flex-md-shrink-0 mt-3 mt-md-0">
<div class="flex-md-shrink-0 mt-3 mt-md-0 buttons">
<a class="btn btn-bg" role="button" :href="profileUrl">
<icon icon="account_circle"></icon>
<translate key="dashboard_btn_my_account">My Account</translate>
</a>
<a v-if="showAdmin" class="btn btn-bg ml-2" role="button" :href="adminUrl">
<a v-if="showAdmin" class="btn btn-bg" role="button" :href="adminUrl">
<icon icon="settings"></icon>
<translate key="dashboard_btn_administration">Administration</translate>
</a>

8
frontend/vue/components/Stations/Media/MediaToolbar.vue
View File

@ -1,9 +1,9 @@
<template>
<div class="row pt-4" id="app-toolbar">
<div class="col-md-8">
<div class="col-md-8 buttons">
<div class="btn-group dropdown allow-focus">
<b-dropdown size="sm" variant="primary" ref="setPlaylistsDropdown" v-b-tooltip.hover
class="mr-2" :title="langPlaylistDropdown">
:title="langPlaylistDropdown">
<template #button-content>
<icon icon="clear_all"></icon>
<translate key="lang_playlists_title">Playlists</translate>
@ -41,11 +41,11 @@
</b-dropdown-form>
</b-dropdown>
</div>
<b-button size="sm" variant="primary" class="mr-2" v-b-modal.move_file>
<b-button size="sm" variant="primary" v-b-modal.move_file>
<icon icon="open_with"></icon>
<translate key="lang_btn_move">Move</translate>
</b-button>
<b-dropdown size="sm" variant="default" class="mr-2">
<b-dropdown size="sm" variant="default">
<template #button-content>
<icon icon="more_horiz"></icon>
{{ langMore }}

5
frontend/vue/components/Stations/Reports/Listeners.vue
View File

@ -9,14 +9,15 @@
<translate key="lang_header">Listeners</translate>
</h2>
</div>
<div class="flex-shrink">
<div class="flex-shrink buttons">
<a class="btn btn-bg" id="btn-export" :href="exportUrl" target="_blank">
<icon icon="file_download"></icon>
<translate key="lang_download_csv_button">Download CSV</translate>
</a>
<date-range-dropdown v-if="!isLive" time-picker :min-date="minDate" :max-date="maxDate"
:tz="stationTimeZone" v-model="dateRange" @update="updateListeners">
:tz="stationTimeZone" v-model="dateRange"
@update="updateListeners">
</date-range-dropdown>
</div>
</div>

3
frontend/vue/components/Stations/Reports/Overview.vue
View File

@ -6,7 +6,8 @@
<translate key="hdr">Station Statistics</translate>
</h2>
<div class="flex-shrink">
<date-range-dropdown time-picker v-model="dateRange" :tz="stationTimeZone"></date-range-dropdown>
<date-range-dropdown time-picker v-model="dateRange"
:tz="stationTimeZone"></date-range-dropdown>
</div>
</div>
</div>