commit
18c71fe7da
|
@ -9,6 +9,45 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import ContentManager from './contentmanager';
|
import ContentManager from './contentmanager';
|
||||||
|
import { DOM } from 'ui';
|
||||||
|
import { FileUtils } from 'common';
|
||||||
|
|
||||||
|
class Theme {
|
||||||
|
|
||||||
|
constructor(themeInternals) {
|
||||||
|
this.__themeInternals = themeInternals;
|
||||||
|
this.enable = this.enable.bind(this);
|
||||||
|
this.disable = this.disable.bind(this);
|
||||||
|
}
|
||||||
|
|
||||||
|
get configs() { return this.__themeInternals.configs }
|
||||||
|
get info() { return this.__themeInternals.info }
|
||||||
|
get icon() { return this.info.icon }
|
||||||
|
get paths() { return this.__themeInternals.paths }
|
||||||
|
get main() { return this.__themeInternals.main }
|
||||||
|
get defaultConfig() { return this.configs.defaultConfig }
|
||||||
|
get userConfig() { return this.configs.userConfig }
|
||||||
|
get name() { return this.info.name }
|
||||||
|
get authors() { return this.info.authors }
|
||||||
|
get version() { return this.info.version }
|
||||||
|
get themePath() { return this.paths.contentPath }
|
||||||
|
get dirName() { return this.paths.dirName }
|
||||||
|
get enabled() { return this.userConfig.enabled }
|
||||||
|
get themeConfig() { return this.userConfig.config }
|
||||||
|
get css() { return this.__themeInternals.css }
|
||||||
|
get id() { return this.name.toLowerCase().replace(/\s+/g, '-') }
|
||||||
|
|
||||||
|
enable() {
|
||||||
|
this.userConfig.enabled = true;
|
||||||
|
DOM.injectTheme(this.css, this.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
disable() {
|
||||||
|
this.userConfig.enabled = false;
|
||||||
|
DOM.deleteTheme(this.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
export default class extends ContentManager {
|
export default class extends ContentManager {
|
||||||
|
|
||||||
|
@ -24,4 +63,32 @@ export default class extends ContentManager {
|
||||||
return this.loadAllContent;
|
return this.loadAllContent;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
static get loadContent() { return this.loadTheme }
|
||||||
|
static async loadTheme(paths, configs, info, main) {
|
||||||
|
try {
|
||||||
|
const css = await FileUtils.readFile(paths.mainPath);
|
||||||
|
const instance = new Theme({ configs, info, main, paths: { contentPath: paths.contentPath, dirName: paths.dirName }, css });
|
||||||
|
return instance;
|
||||||
|
} catch (err) {
|
||||||
|
throw err;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
static async loadPlugin(paths, configs, info, main) {
|
||||||
|
const plugin = window.require(paths.mainPath)(Plugin, {}, {});
|
||||||
|
const instance = new plugin({ configs, info, main, paths: { contentPath: paths.contentPath, dirName: paths.dirName } });
|
||||||
|
|
||||||
|
if (instance.enabled) instance.start();
|
||||||
|
return instance;
|
||||||
|
}
|
||||||
|
|
||||||
|
static enableTheme(theme) {
|
||||||
|
theme.enable();
|
||||||
|
}
|
||||||
|
|
||||||
|
static disableTheme(theme) {
|
||||||
|
theme.disable();
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
.bd-plugin-card {
|
.bd-card {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
|
@ -9,14 +9,14 @@
|
||||||
color: #b9bbbe;
|
color: #b9bbbe;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
|
|
||||||
.bd-plugin-header {
|
.bd-card-header {
|
||||||
padding-bottom: 5px;
|
padding-bottom: 5px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-grow: 0;
|
flex-grow: 0;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
.bd-plugin-icon {
|
.bd-card-icon {
|
||||||
width: 30px;
|
width: 30px;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
}
|
}
|
||||||
|
@ -30,12 +30,12 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.bd-plugin-body {
|
.bd-card-body {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
||||||
.bd-plugin-description {
|
.bd-card-description {
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
max-height: 60px;
|
max-height: 60px;
|
||||||
|
@ -48,12 +48,12 @@
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bd-plugin-footer {
|
.bd-card-footer {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
align-items: flex-end;
|
align-items: flex-end;
|
||||||
|
|
||||||
.bd-plugin-extra {
|
.bd-card-extra {
|
||||||
color: rgba(255, 255, 255, 0.15);
|
color: rgba(255, 255, 255, 0.15);
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
|
@ -1,6 +1,6 @@
|
||||||
@import './button.scss';
|
@import './button.scss';
|
||||||
@import './sidebarview.scss';
|
@import './sidebarview.scss';
|
||||||
@import './plugins.scss';
|
@import './plugins.scss';
|
||||||
@import './plugincard.scss';
|
@import './card.scss';
|
||||||
@import './tooltips.scss';
|
@import './tooltips.scss';
|
||||||
@import './plugin-settings-modal.scss';
|
@import './plugin-settings-modal.scss';
|
||||||
|
|
|
@ -49,6 +49,9 @@
|
||||||
<div v-if="activeContent('plugins') || animatingContent('plugins')" :class="{active: activeContent('plugins'), animating: animatingContent('plugins')}">
|
<div v-if="activeContent('plugins') || animatingContent('plugins')" :class="{active: activeContent('plugins'), animating: animatingContent('plugins')}">
|
||||||
<PluginsView />
|
<PluginsView />
|
||||||
</div>
|
</div>
|
||||||
|
<div v-if="activeContent('themes') || animatingContent('themes')" :class="{active: activeContent('themes'), animating: animatingContent('themes')}">
|
||||||
|
<ThemesView />
|
||||||
|
</div>
|
||||||
</ContentColumn>
|
</ContentColumn>
|
||||||
</SidebarView>
|
</SidebarView>
|
||||||
</div>
|
</div>
|
||||||
|
@ -58,7 +61,7 @@
|
||||||
import { shell } from 'electron';
|
import { shell } from 'electron';
|
||||||
import { Settings } from 'modules';
|
import { Settings } from 'modules';
|
||||||
import { SidebarView, Sidebar, SidebarItem, ContentColumn } from './sidebar';
|
import { SidebarView, Sidebar, SidebarItem, ContentColumn } from './sidebar';
|
||||||
import { CoreSettings, UISettings, EmoteSettings, CssEditorView, PluginsView } from './bd';
|
import { CoreSettings, UISettings, EmoteSettings, CssEditorView, PluginsView, ThemesView } from './bd';
|
||||||
import { SvgX, MiGithubCircle, MiWeb, MiClose, MiTwitterCircle } from './common';
|
import { SvgX, MiGithubCircle, MiWeb, MiClose, MiTwitterCircle } from './common';
|
||||||
|
|
||||||
// Constants
|
// Constants
|
||||||
|
@ -92,7 +95,7 @@
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
SidebarView, Sidebar, SidebarItem, ContentColumn,
|
SidebarView, Sidebar, SidebarItem, ContentColumn,
|
||||||
CoreSettings, UISettings, EmoteSettings, CssEditorView, PluginsView,
|
CoreSettings, UISettings, EmoteSettings, CssEditorView, PluginsView, ThemesView,
|
||||||
MiGithubCircle, MiWeb, MiClose, MiTwitterCircle
|
MiGithubCircle, MiWeb, MiClose, MiTwitterCircle
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
|
|
@ -0,0 +1,42 @@
|
||||||
|
/**
|
||||||
|
* BetterDiscord Card Component
|
||||||
|
* Copyright (c) 2015-present Jiiks/JsSucks - https://github.com/Jiiks / https://github.com/JsSucks
|
||||||
|
* All rights reserved.
|
||||||
|
* https://betterdiscord.net
|
||||||
|
*
|
||||||
|
* This source code is licensed under the MIT license found in the
|
||||||
|
* LICENSE file in the root directory of this source tree.
|
||||||
|
*/
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="bd-card">
|
||||||
|
<div class="bd-card-header">
|
||||||
|
<div class="bd-card-icon" :style="{backgroundImage: item.icon ? `url(${item.icon})` : null}">
|
||||||
|
<MiExtension v-if="!item.icon" :size="30" />
|
||||||
|
</div>
|
||||||
|
<span>{{item.name}}</span>
|
||||||
|
<div class="bd-flex-spacer" />
|
||||||
|
<slot name="toggle"/>
|
||||||
|
</div>
|
||||||
|
<div class="bd-card-body">
|
||||||
|
<div class="bd-card-description">{{item.description}}</div>
|
||||||
|
<div class="bd-card-footer">
|
||||||
|
<div class="bd-card-extra">v{{item.version}} by {{item.authors.join(', ').replace(/,(?!.*,)/gmi, ' and')}}</div>
|
||||||
|
<div class="bd-controls">
|
||||||
|
<slot name="controls"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
// Imports
|
||||||
|
import { MiExtension } from '../common';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
props: ['item'],
|
||||||
|
components: {
|
||||||
|
MiExtension
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
|
@ -9,45 +9,31 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="bd-plugin-card">
|
<Card :item="plugin">
|
||||||
<div class="bd-plugin-header">
|
<label slot="toggle" class="bd-switch-wrapper" @click="() => { togglePlugin(plugin); this.$forceUpdate(); }">
|
||||||
<div class="bd-plugin-icon" :style="{backgroundImage: plugin.icon ? `url(${plugin.icon})` : null}">
|
<input type="checkbox" class="bd-switch-checkbox" />
|
||||||
<MiExtension v-if="!plugin.icon" :size="30"/>
|
<div class="bd-switch" :class="{'bd-checked': plugin.enabled}" />
|
||||||
</div>
|
</label>
|
||||||
<span>{{plugin.name}}</span>
|
<ButtonGroup slot="controls">
|
||||||
<div class="bd-flex-spacer" />
|
<Button v-tooltip="'Settings'" v-if="plugin.hasSettings" :onClick="() => showSettings(plugin)">
|
||||||
<label class="bd-switch-wrapper" @click="() => { togglePlugin(plugin); this.$forceUpdate(); }">
|
<MiSettings size="18" />
|
||||||
<input type="checkbox" class="bd-switch-checkbox" />
|
</Button>
|
||||||
<div class="bd-switch" :class="{'bd-checked': plugin.enabled}" />
|
<Button v-tooltip="'Reload'" :onClick="() => reloadPlugin(plugin)">
|
||||||
</label>
|
<MiRefresh size="18" />
|
||||||
</div>
|
</Button>
|
||||||
<div class="bd-plugin-body">
|
<Button v-tooltip="'Edit'" :onClick="editPlugin">
|
||||||
<div class="bd-plugin-description">{{plugin.description}}</div>
|
<MiPencil size="18" />
|
||||||
<div class="bd-plugin-footer">
|
</Button>
|
||||||
<div class="bd-plugin-extra">v{{plugin.version}} by {{plugin.authors.join(', ').replace(/,(?!.*,)/gmi, ' and')}}</div>
|
<Button v-tooltip="'Uninstall'" type="err">
|
||||||
<div class="bd-controls">
|
<MiDelete size="18" />
|
||||||
<ButtonGroup>
|
</Button>
|
||||||
<Button v-tooltip="'Settings'" v-if="plugin.hasSettings" :onClick="() => showSettings(plugin)">
|
</ButtonGroup>
|
||||||
<MiSettings size="18"/>
|
</Card>
|
||||||
</Button>
|
|
||||||
<Button v-tooltip="'Reload'" :onClick="() => reloadPlugin(plugin)">
|
|
||||||
<MiRefresh size="18" />
|
|
||||||
</Button>
|
|
||||||
<Button v-tooltip="'Edit'" :onClick="editPlugin">
|
|
||||||
<MiPencil size="18" />
|
|
||||||
</Button>
|
|
||||||
<Button v-tooltip="'Uninstall'" type="err">
|
|
||||||
<MiDelete size="18" />
|
|
||||||
</Button>
|
|
||||||
</ButtonGroup>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
// Imports
|
// Imports
|
||||||
import { shell } from 'electron';
|
import { shell } from 'electron';
|
||||||
|
import Card from './Card.vue';
|
||||||
import { Button, ButtonGroup, SettingSwitch, MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension } from '../common';
|
import { Button, ButtonGroup, SettingSwitch, MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension } from '../common';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
@ -58,7 +44,7 @@
|
||||||
},
|
},
|
||||||
props: ['plugin', 'togglePlugin', 'reloadPlugin', 'showSettings'],
|
props: ['plugin', 'togglePlugin', 'reloadPlugin', 'showSettings'],
|
||||||
components: {
|
components: {
|
||||||
Button, ButtonGroup, SettingSwitch, MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension
|
Card, Button, ButtonGroup, SettingSwitch, MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
editPlugin() {
|
editPlugin() {
|
||||||
|
|
|
@ -0,0 +1,60 @@
|
||||||
|
/**
|
||||||
|
* BetterDiscord Theme Card Component
|
||||||
|
* Copyright (c) 2015-present Jiiks/JsSucks - https://github.com/Jiiks / https://github.com/JsSucks
|
||||||
|
* All rights reserved.
|
||||||
|
* https://betterdiscord.net
|
||||||
|
*
|
||||||
|
* This source code is licensed under the MIT license found in the
|
||||||
|
* LICENSE file in the root directory of this source tree.
|
||||||
|
*/
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Card :item="theme">
|
||||||
|
<label slot="toggle" class="bd-switch-wrapper" @click="() => { toggleTheme(theme); this.$forceUpdate(); }">
|
||||||
|
<input type="checkbox" class="bd-switch-checkbox" />
|
||||||
|
<div class="bd-switch" :class="{'bd-checked': theme.enabled}" />
|
||||||
|
</label>
|
||||||
|
<ButtonGroup slot="controls">
|
||||||
|
<Button v-tooltip="'Settings'" v-if="theme.hasSettings" :onClick="() => showSettings(theme)">
|
||||||
|
<MiSettings size="18" />
|
||||||
|
</Button>
|
||||||
|
<Button v-tooltip="'Reload'" :onClick="() => reloadTheme(theme)">
|
||||||
|
<MiRefresh size="18" />
|
||||||
|
</Button>
|
||||||
|
<Button v-tooltip="'Edit'" :onClick="editTheme">
|
||||||
|
<MiPencil size="18" />
|
||||||
|
</Button>
|
||||||
|
<Button v-tooltip="'Uninstall'" type="err">
|
||||||
|
<MiDelete size="18" />
|
||||||
|
</Button>
|
||||||
|
</ButtonGroup>
|
||||||
|
</Card>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
// Imports
|
||||||
|
import { shell } from 'electron';
|
||||||
|
import Card from './Card.vue';
|
||||||
|
import { Button, ButtonGroup, SettingSwitch, MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension } from '../common';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
settingsOpen: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
props: ['theme', 'toggleTheme', 'reloadTheme', 'showSettings'],
|
||||||
|
components: {
|
||||||
|
Card, Button, ButtonGroup, SettingSwitch, MiSettings, MiRefresh, MiPencil, MiDelete, MiExtension
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
editTheme() {
|
||||||
|
try {
|
||||||
|
shell.openItem(this.theme.themePath);
|
||||||
|
} catch (err) {
|
||||||
|
console.log(err);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
|
@ -0,0 +1,100 @@
|
||||||
|
/**
|
||||||
|
* BetterDiscord Themes View Component
|
||||||
|
* Copyright (c) 2015-present Jiiks/JsSucks - https://github.com/Jiiks / https://github.com/JsSucks
|
||||||
|
* All rights reserved.
|
||||||
|
* https://betterdiscord.net
|
||||||
|
*
|
||||||
|
* This source code is licensed under the MIT license found in the
|
||||||
|
* LICENSE file in the root directory of this source tree.
|
||||||
|
*/
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<SettingsWrapper headertext="Themes">
|
||||||
|
<div class="bd-flex bd-flex-col bd-themesView">
|
||||||
|
<div class="bd-flex bd-tabheader">
|
||||||
|
<div class="bd-flex-grow bd-button" :class="{'bd-active': local}" @click="showLocal">
|
||||||
|
<h3>Local</h3>
|
||||||
|
<div class="bd-material-button" @click="refreshLocal">
|
||||||
|
<MiRefresh />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="bd-flex-grow bd-button" :class="{'bd-active': !local}" @click="showOnline">
|
||||||
|
<h3>Online</h3>
|
||||||
|
<div class="bd-material-button">
|
||||||
|
<MiRefresh />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<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" :reloadTheme="reloadTheme" :showSettings="showSettings" />
|
||||||
|
</div>
|
||||||
|
<div v-if="!local" class="bd-spinner-container">
|
||||||
|
<div class="bd-spinner-2"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</SettingsWrapper>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// Imports
|
||||||
|
import { ThemeManager } from 'modules';
|
||||||
|
import { SettingsWrapper } from './';
|
||||||
|
import { MiRefresh } from '../common';
|
||||||
|
import ThemeCard from './ThemeCard.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
local: true,
|
||||||
|
settingsOpen: null,
|
||||||
|
localThemes: ThemeManager.localThemes
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
SettingsWrapper, ThemeCard,
|
||||||
|
MiRefresh
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
showLocal() {
|
||||||
|
this.local = true;
|
||||||
|
},
|
||||||
|
showOnline() {
|
||||||
|
this.local = false;
|
||||||
|
},
|
||||||
|
refreshLocal() {
|
||||||
|
(async () => {
|
||||||
|
await ThemeManager.refreshTheme();
|
||||||
|
})();
|
||||||
|
},
|
||||||
|
toggleTheme(theme) {
|
||||||
|
// TODO Display error if theme fails to enable/disable
|
||||||
|
try {
|
||||||
|
if (theme.enabled) {
|
||||||
|
ThemeManager.disableTheme(theme);
|
||||||
|
} else {
|
||||||
|
ThemeManager.enableTheme(theme);
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
console.log(err);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
reloadTheme(theme) {
|
||||||
|
(async () => {
|
||||||
|
try {
|
||||||
|
await ThemeManager.reloadTheme(theme);
|
||||||
|
this.$forceUpdate();
|
||||||
|
} catch (err) {
|
||||||
|
console.log(err);
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
},
|
||||||
|
showSettings(theme) {
|
||||||
|
this.settingsOpen = theme;
|
||||||
|
},
|
||||||
|
closeSettings() {
|
||||||
|
this.settingsOpen = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
|
@ -4,4 +4,5 @@ export { default as UISettings } from './UISettings.vue';
|
||||||
export { default as EmoteSettings } from './EmoteSettings.vue';
|
export { default as EmoteSettings } from './EmoteSettings.vue';
|
||||||
export { default as CssEditorView } from './CssEditor.vue';
|
export { default as CssEditorView } from './CssEditor.vue';
|
||||||
export { default as PluginsView } from './PluginsView.vue';
|
export { default as PluginsView } from './PluginsView.vue';
|
||||||
|
export { default as ThemesView } from './ThemesView.vue';
|
||||||
export { default as BdBadge } from './BdBadge.vue';
|
export { default as BdBadge } from './BdBadge.vue';
|
||||||
|
|
|
@ -0,0 +1,10 @@
|
||||||
|
{
|
||||||
|
"info": {
|
||||||
|
"name": "Example Theme 1",
|
||||||
|
"authors": [ "Jiiks" ],
|
||||||
|
"version": 1.0,
|
||||||
|
"description": "Example Theme 1 Description",
|
||||||
|
"icon": "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FscXVlXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjAwMCAyMDAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyMDAwIDIwMDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxnPjxwYXRoIGZpbGw9IiMzRTgyRTUiIGQ9Ik0xNDAyLjIsNjMxLjdjLTkuNy0zNTMuNC0yODYuMi00OTYtNjQyLjYtNDk2SDY4LjR2NzE0LjFsNDQyLDM5OFY0OTAuN2gyNTdjMjc0LjUsMCwyNzQuNSwzNDQuOSwwLDM0NC45SDU5Ny42djMyOS41aDE2OS44YzI3NC41LDAsMjc0LjUsMzQ0LjgsMCwzNDQuOGgtNjk5djM1NC45aDY5MS4yYzM1Ni4zLDAsNjMyLjgtMTQyLjYsNjQyLjYtNDk2YzAtMTYyLjYtNDQuNS0yODQuMS0xMjIuOS0zNjguNkMxMzU3LjcsOTE1LjgsMTQwMi4yLDc5NC4zLDE0MDIuMiw2MzEuN3oiLz48cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMTI2Mi41LDEzNS4yTDEyNjIuNSwxMzUuMmwtNzYuOCwwYzI2LjYsMTMuMyw1MS43LDI4LjEsNzUsNDQuM2M3MC43LDQ5LjEsMTI2LjEsMTExLjUsMTY0LjYsMTg1LjNjMzkuOSw3Ni42LDYxLjUsMTY1LjYsNjQuMywyNjQuNmwwLDEuMnYxLjJjMCwxNDEuMSwwLDU5Ni4xLDAsNzM3LjF2MS4ybDAsMS4yYy0yLjcsOTktMjQuMywxODgtNjQuMywyNjQuNmMtMzguNSw3My44LTkzLjgsMTM2LjItMTY0LjYsMTg1LjNjLTIyLjYsMTUuNy00Ni45LDMwLjEtNzIuNiw0My4xaDcyLjVjMzQ2LjIsMS45LDY3MS0xNzEuMiw2NzEtNTY3LjlWNzE2LjdDMTkzMy41LDMxMi4yLDE2MDguNywxMzUuMiwxMjYyLjUsMTM1LjJ6Ii8+PC9nPjwvc3ZnPg=="
|
||||||
|
},
|
||||||
|
"main": "index.css"
|
||||||
|
}
|
|
@ -0,0 +1,7 @@
|
||||||
|
div {
|
||||||
|
background: red;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
border: 1px solid brown;
|
||||||
|
}
|
Loading…
Reference in New Issue