Tweak card styles and use events

This commit is contained in:
Samuel Elliott 2018-03-31 00:45:14 +01:00
parent 069b1ff689
commit 5331afb763
No known key found for this signature in database
GPG Key ID: 8420C7CDE43DC4D6
8 changed files with 28 additions and 27 deletions

View File

@ -45,7 +45,7 @@ export class Patcher {
static overrideFn(patch) {
return function () {
let retVal = null;
let retVal = undefined;
if (!patch.children) return patch.originalFunction.apply(this, arguments);
for (const superPatch of patch.children.filter(c => c.type === 'before')) {
try {

View File

@ -4,13 +4,13 @@
flex-grow: 1;
background: transparent;
border-bottom: 1px solid rgba(114, 118, 126, 0.3);
padding: 10px 5px;
min-height: 150px;
color: #b9bbbe;
margin-top: 10px;
margin-top: 20px;
padding-bottom: 20px;
.bd-card-header {
padding-bottom: 5px;
margin-bottom: 15px;
display: flex;
flex-grow: 0;
font-weight: 700;
@ -37,20 +37,15 @@
.bd-card-description {
flex-grow: 1;
overflow-y: auto;
max-height: 60px;
min-height: 60px;
color: #8a8c90;
font-size: 12px;
font-weight: 600;
padding: 5px;
border-radius: 8px;
margin-top: 5px;
margin-bottom: 5px;
}
.bd-card-footer {
display: flex;
flex-grow: 1;
align-items: flex-end;
.bd-card-extra {
@ -61,9 +56,11 @@
}
.bd-controls {
margin-left: 15px;
.bd-button-group {
.bd-button {
fill: #FFF;
fill: #fff;
width: 30px;
height: 30px;
}

View File

@ -3,6 +3,7 @@
.bd-online-ph {
display: flex;
flex-direction: column;
margin: 10% 0;
h3 {
color: #fff;

View File

@ -10,12 +10,12 @@
<template>
<Card :item="plugin">
<SettingSwitch v-if="plugin.type === 'plugin'" slot="toggle" :value="plugin.enabled" @input="togglePlugin" />
<SettingSwitch v-if="plugin.type === 'plugin'" slot="toggle" :value="plugin.enabled" @input="$emit('toggle-plugin')" />
<ButtonGroup slot="controls">
<Button v-tooltip="'Settings (shift + click to open settings without cloning the set)'" v-if="plugin.hasSettings" @click="e => showSettings(e.shiftKey)"><MiSettings size="18" /></Button>
<Button v-tooltip="'Reload'" @click="reloadPlugin"><MiRefresh size="18" /></Button>
<Button v-tooltip="'Settings (shift + click to open settings without cloning the set)'" v-if="plugin.hasSettings" @click="$emit('show-settings', $event.shiftKey)"><MiSettings size="18" /></Button>
<Button v-tooltip="'Reload'" @click="$emit('reload-plugin')"><MiRefresh size="18" /></Button>
<Button v-tooltip="'Edit'" @click="editPlugin"><MiPencil size="18" /></Button>
<Button v-tooltip="'Uninstall (shift + click to unload)'" @click="e => deletePlugin(e.shiftKey)" type="err"><MiDelete size="18" /></Button>
<Button v-tooltip="'Uninstall (shift + click to unload)'" @click="$emit('delete-plugin', $event.shiftKey)" type="err"><MiDelete size="18" /></Button>
</ButtonGroup>
</Card>
</template>
@ -28,9 +28,10 @@
import { Button, ButtonGroup, SettingSwitch, MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension } from '../common';
export default {
props: ['plugin', 'togglePlugin', 'reloadPlugin', 'deletePlugin', 'showSettings'],
props: ['plugin'],
components: {
Card, Button, ButtonGroup, SettingSwitch, MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension
Card, Button, ButtonGroup, SettingSwitch,
MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension
},
methods: {
editPlugin() {

View File

@ -23,7 +23,7 @@
<div class="bd-flex bd-flex-col bd-pluginsview">
<div v-if="local" class="bd-flex bd-flex-grow bd-flex-col bd-plugins-container bd-local-plugins">
<PluginCard v-for="plugin in localPlugins" :plugin="plugin" :key="plugin.id" :togglePlugin="() => togglePlugin(plugin)" :reloadPlugin="() => reloadPlugin(plugin)" :deletePlugin="unload => deletePlugin(plugin, unload)" :showSettings="dont_clone => showSettings(plugin, dont_clone)" />
<PluginCard v-for="plugin in localPlugins" :plugin="plugin" :key="plugin.id" :data-plugin-id="plugin.id" @toggle-plugin="togglePlugin(plugin)" @reload-plugin="reloadPlugin(plugin)" @delete-plugin="unload => deletePlugin(plugin, unload)" @show-settings="dont_clone => showSettings(plugin, dont_clone)" />
</div>
<div v-if="!local" class="bd-online-ph">
<h3>Coming Soon</h3>

View File

@ -10,15 +10,16 @@
<template>
<Card :item="theme">
<SettingSwitch slot="toggle" :value="theme.enabled" @input="toggleTheme" />
<SettingSwitch slot="toggle" :value="theme.enabled" @input="$emit('toggle-theme')" />
<ButtonGroup slot="controls">
<Button v-tooltip="'Settings (shift + click to open settings without cloning the set)'" v-if="theme.hasSettings" @click="e => showSettings(e.shiftKey)"><MiSettings size="18" /></Button>
<Button v-tooltip="'Recompile (shift + click to reload)'" @click="e => reloadTheme(e.shiftKey)"><MiRefresh size="18" /></Button>
<Button v-tooltip="'Settings (shift + click to open settings without cloning the set)'" v-if="theme.hasSettings" @click="$emit('show-settings', $event.shiftKey)"><MiSettings size="18" /></Button>
<Button v-tooltip="'Recompile (shift + click to reload)'" @click="$emit('reload-theme', $event.shiftKey)"><MiRefresh size="18" /></Button>
<Button v-tooltip="'Edit'" @click="editTheme"><MiPencil size="18" /></Button>
<Button v-tooltip="'Uninstall (shift + click to unload)'" @click="e => deleteTheme(e.shiftKey)" type="err"><MiDelete size="18" /></Button>
<Button v-tooltip="'Uninstall (shift + click to unload)'" @click="$emit('delete-theme', $event.shiftKey)" type="err"><MiDelete size="18" /></Button>
</ButtonGroup>
</Card>
</template>
<script>
// Imports
import { shell } from 'electron';
@ -26,9 +27,10 @@
import { Button, ButtonGroup, SettingSwitch, MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension } from '../common';
export default {
props: ['theme', 'toggleTheme', 'reloadTheme', 'deleteTheme', 'showSettings'],
props: ['theme'],
components: {
Card, Button, ButtonGroup, SettingSwitch, MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension
Card, Button, ButtonGroup, SettingSwitch,
MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension
},
methods: {
editTheme() {

View File

@ -23,7 +23,7 @@
<div class="bd-flex bd-flex-col bd-themesview">
<div v-if="local" class="bd-flex bd-flex-grow bd-flex-col bd-themes-container bd-local-themes">
<ThemeCard v-for="theme in localThemes" :theme="theme" :key="theme.id" :toggleTheme="() => toggleTheme(theme)" :reloadTheme="reload => reloadTheme(theme, reload)" :showSettings="dont_clone => showSettings(theme, dont_clone)" :deleteTheme="unload => deleteTheme(theme, unload)" />
<ThemeCard v-for="theme in localThemes" :theme="theme" :key="theme.id" :data-theme-id="theme.id" @toggle-theme="toggleTheme(theme)" @reload-theme="reload => reloadTheme(theme, reload)" @show-settings="dont_clone => showSettings(theme, dont_clone)" @delete-theme="unload => deleteTheme(theme, unload)" />
</div>
<div v-if="!local" class="bd-online-ph">
<h3>Coming Soon</h3>

View File

@ -70,13 +70,13 @@
}
},
created() {
this.modal.beforeClose = force => {
this.modal.on('close', force => {
if (this.changed && !force) {
this.warnclose = true;
setTimeout(() => this.warnclose = false, 400);
throw {message: 'Settings have been changed'};
}
};
});
this.modal.settings.on('settings-updated', this.cloneSettings);
this.cloneSettings();