Minor work on the buttons and some of the text.

This commit is contained in:
Alziratt 2019-02-13 13:15:56 -02:00
parent 50f3c4fc27
commit d8376b39ce
6 changed files with 33 additions and 20 deletions

View File

@ -14,7 +14,7 @@ var Debug = {
comms: true,
// showArDetectCanvas: true,
// flushStoredSettings: true,
flushStoredSettings: false,
flushStoredSettings: true,
playerDetectDebug: true,
periodic: true,
// videoRescan: true,

View File

@ -685,7 +685,7 @@ var ExtensionConf = {
}
},{
name: 'Enable automatic aspect ratio detection',
label: 'Enabled',
label: 'Enable',
cmd: [{
action: 'set-autoar-mode',
arg: ExtensionMode.Enabled,

View File

@ -9,7 +9,7 @@
<div class="flex flex-row flex-wrap">
<template v-for="action of siteActions">
<ShortcutButton v-if="action.cmd.length === 1 && action.cmd[0].action === 'set-extension-mode'"
class="flex button"
class="flex flex-grow button"
:class="{'setting-selected': getDefault('set-extension-mode') === action.cmd[0].arg}"
:label="(action.scopes[scope] && action.scopes[scope].label) ? action.scopes[scope].label : action.label"
:shortcut="parseShortcut(action)"
@ -25,11 +25,10 @@
class="w100"
>
<div class="label">Enable autodetection {{scope === 'site' ? 'for this site' : ''}}:</div>
<div class="warning"><small>Note: some sites implement restrictions that make autodetection a fair bit less reliable in Firefox and outright impossible in anything else.</small></div>
<div class="flex flex-row flex-wrap">
<template v-for="action of siteActions">
<ShortcutButton v-if="action.cmd.length === 1 && action.cmd[0].action === 'set-autoar-mode'"
class="flex button"
class="flex flex-grow button"
:class="{'setting-selected': getDefault('set-autoar-mode') === action.cmd[0].arg}"
:label="(action.scopes[scope] && action.scopes[scope].label) ? action.scopes[scope].label : action.label"
:shortcut="parseShortcut(action)"
@ -37,6 +36,7 @@
>
</ShortcutButton>
</template>
<div class="info"><small>Note: some sites implement restrictions that make autodetection a fair bit less reliable in Firefox and outright impossible in anything else.</small></div>
</div>
</div>
@ -46,7 +46,7 @@
<div class="flex flex-row flex-wrap">
<template v-for="action of siteActions">
<ShortcutButton v-if="action.cmd.length === 1 && action.cmd[0].action === 'set-stretch'"
class="flex b3 button"
class="flex b3 flex-grow button"
:class="{'setting-selected': getDefault('set-stretch') === action.cmd[0].arg}"
:label="(action.scopes[scope] && action.scopes[scope].label) ? action.scopes[scope].label : action.label"
:shortcut="parseShortcut(action)"
@ -62,7 +62,7 @@
<div class="flex flex-row flex-wrap">
<template v-for="action of settings.active.actions">
<ShortcutButton v-if="action.scopes[scope] && action.scopes[scope].show && action.cmd.length === 1 && action.cmd[0].action === 'set-alignment'"
class="flex b3 button"
class="flex b3 flex-grow button"
:class="{'setting-selected': getDefault('set-alignment') === action.cmd[0].arg}"
:label="(action.scopes[scope] && action.scopes[scope].label) ? action.scopes[scope].label : action.label"
:shortcut="parseShortcut(action)"
@ -78,7 +78,7 @@
<div class="flex flex-row flex-wrap">
<template v-for="action of settings.active.actions">
<ShortcutButton v-if="action.scopes[scope] && action.scopes[scope].show && action.cmd.length > 1"
class="flex b3 button"
class="flex b3 flex-grow button"
:label="(action.scopes[scope] && action.scopes[scope].label) ? action.scopes[scope].label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"

View File

@ -5,7 +5,7 @@
<div class="flex flex-row flex-wrap">
<template v-for="action of settings.active.actions">
<ShortcutButton v-if="action.scopes.page && action.scopes.page.show && action.cmd.length === 1 && action.cmd[0].action === 'set-ar'"
class="flex b3 button"
class="flex b3 flex-grow button"
:label="(action.scopes.page && action.scopes.page.label) ? action.scopes.page.label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"
@ -55,7 +55,7 @@
<div class="flex flex-row flex-wrap">
<template v-for="action of settings.active.actions">
<ShortcutButton v-if="action.scopes.page && action.scopes.page.show && action.cmd.length === 1 && action.cmd[0].action === 'set-stretch'"
class="flex b3 button"
class="flex b3 flex-grow button"
:label="(action.scopes.page && action.scopes.page.label) ? action.scopes.page.label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"

View File

@ -8,4 +8,6 @@ $input-background: #242424;
$page-background: #101010;
$background-primary: #101010;
$background-selected: #944918;
$background-selected: #944918;
$info-color: #e9bea3;

View File

@ -166,7 +166,7 @@ small {
/* COLORS */
.selected{
.selected {
color: #ffddaa !important;
background-color: #433221 !important;
}
@ -213,11 +213,11 @@ small {
}
.button {
/* display: inline-block; */
/*display: inline-block;*/
// padding-top: 8px;
// padding-bottom: 3px;
// padding-left: 20px;
// padding-right: 20px;
//padding-left: 5px;
//padding-right: 5px;
border: 1px solid #444;
margin-top: 3px;
margin-bottom: 3px;
@ -227,7 +227,7 @@ small {
.button:hover {
color: #fff;
background-color: #433221;
background-color: $primary-color;
}
@ -249,6 +249,20 @@ small {
padding-right: 10px;
}
.info {
color: $info-color;
padding-left: 35px;
float: right;
}
.info::before {
content: "";
display: inline-block;
font-weight: bold;
margin-left: -35px;
padding-right: 10px;
}
.experimental::after {
content: "Experimental";
background-color: #ffde12;
@ -259,7 +273,4 @@ small {
padding-left: 5px;
padding-right: 5px;
margin-left: 10px;
}
/* Ignore this comment */
}