mirror of
https://github.com/JannisX11/blockbench.git
synced 2024-11-27 04:21:46 +08:00
Add classes to improve theming
This commit is contained in:
parent
1167eb7544
commit
5963f624f2
@ -298,8 +298,7 @@
|
||||
<div id="right_bar" class="sidebar"></div>
|
||||
|
||||
<div id="center">
|
||||
<ul id="toast_notification_list">
|
||||
</ul>
|
||||
<ul id="toast_notification_list"></ul>
|
||||
|
||||
<div id="top_slot"></div>
|
||||
<div id="preview">
|
||||
|
@ -732,7 +732,7 @@ ipcRenderer.on('update-available', (event, arg) => {
|
||||
})
|
||||
|
||||
} else {
|
||||
addStartScreenSection({
|
||||
addStartScreenSection('update_notification', {
|
||||
color: 'var(--color-back)',
|
||||
graphic: {type: 'icon', icon: 'update'},
|
||||
text: [
|
||||
|
@ -36,7 +36,7 @@ function addStartScreenSection(id, data) {
|
||||
data = id;
|
||||
id = '';
|
||||
}
|
||||
var obj = $(Interface.createElement('section', {id}))
|
||||
var obj = $(Interface.createElement('section', {class: 'start_screen_section', section_id: id}))
|
||||
if (typeof data.graphic === 'object') {
|
||||
var left = $('<div class="start_screen_left graphic"></div>')
|
||||
obj.append(left)
|
||||
@ -140,9 +140,9 @@ function addStartScreenSection(id, data) {
|
||||
if (data.last) {
|
||||
$('#start_screen > content').append(obj);
|
||||
} else if (data.insert_after) {
|
||||
$('#start_screen > content').find(`#${data.insert_after}`).after(obj);
|
||||
$('#start_screen > content').find(`.start_screen_section[section_id="${data.insert_after}"]`).after(obj);
|
||||
} else if (data.insert_before) {
|
||||
$('#start_screen > content').find(`#${data.insert_before}`).before(obj);
|
||||
$('#start_screen > content').find(`.start_screen_section[section_id="${data.insert_before}"]`).before(obj);
|
||||
} else {
|
||||
$('#start_screen > content').prepend(obj);
|
||||
}
|
||||
@ -375,7 +375,7 @@ onVueSetup(async function() {
|
||||
template: `
|
||||
<div id="start_screen">
|
||||
<content>
|
||||
<section id="splash_screen" v-if="show_splash_screen">
|
||||
<section id="splash_screen" v-if="show_splash_screen" section_id="splash_screen">
|
||||
<div class="splash_art_slideshow_image" :style="{backgroundImage: getBackground(slideshow[slideshow_selected].source)}">
|
||||
<p v-if="slideshow[slideshow_selected].description" class="start_screen_graphic_description" v-html="pureMarked(slideshow[slideshow_selected].description)"></p>
|
||||
</div>
|
||||
@ -387,7 +387,7 @@ onVueSetup(async function() {
|
||||
<i class="material-icons start_screen_close_button" @click="show_splash_screen = false">clear</i>
|
||||
</section>
|
||||
|
||||
<section id="start_files">
|
||||
<section id="start_files" section_id="start_files">
|
||||
|
||||
<div class="start_screen_left" v-if="!(selected_format_id && mobile_layout)">
|
||||
<h2>${tl('mode.start.new')}</h2>
|
||||
@ -581,7 +581,7 @@ ModelLoader.loaders = {};
|
||||
let twitter_ad;
|
||||
if (Blockbench.startup_count < 20 && Blockbench.startup_count % 5 === 4) {
|
||||
twitter_ad = true;
|
||||
addStartScreenSection({
|
||||
addStartScreenSection('twitter_link', {
|
||||
color: '#1da1f2',
|
||||
text_color: '#ffffff',
|
||||
graphic: {type: 'icon', icon: 'fab.fa-twitter'},
|
||||
@ -594,7 +594,7 @@ ModelLoader.loaders = {};
|
||||
}
|
||||
//Discord
|
||||
if (Blockbench.startup_count < 6 && !twitter_ad) {
|
||||
addStartScreenSection({
|
||||
addStartScreenSection('discord_link', {
|
||||
color: '#5865F2',
|
||||
text_color: '#ffffff',
|
||||
graphic: {type: 'icon', icon: 'fab.fa-discord'},
|
||||
@ -666,7 +666,7 @@ ModelLoader.loaders = {};
|
||||
}
|
||||
},
|
||||
template: `
|
||||
<section id="quick_setup">
|
||||
<section id="quick_setup" section_id="quick_setup" class="start_screen_section">
|
||||
<i class="material-icons start_screen_close_button" @click="close()">clear</i>
|
||||
<h2>${tl('mode.start.quick_setup')}</h2>
|
||||
|
||||
|
@ -1267,8 +1267,8 @@ BARS.defineActions(function() {
|
||||
<div :class="{open: tab == 'installed'}" @click="setTab('installed')">${tl('dialog.plugins.installed')}</div>
|
||||
<div :class="{open: tab == 'available'}" @click="setTab('available')">${tl('dialog.plugins.available')}</div>
|
||||
</div>
|
||||
<ul class="list" id="plugin_list" ref="plugin_list">
|
||||
<li v-for="plugin in viewed_plugins" :plugin="plugin.id" :class="{plugin: true, testing: plugin.fromFile, selected: plugin == selected_plugin, disabled_plugin: plugin.disabled, incompatible: plugin.isInstallable() !== true}" @click="selectPlugin(plugin)" @contextmenu="selectPlugin(plugin); plugin.showContextMenu($event)">
|
||||
<ul class="list" :class="{paginated_list: pages.length > 1}" id="plugin_list" ref="plugin_list">
|
||||
<li v-for="plugin in viewed_plugins" :plugin="plugin.id" :class="{plugin: true, testing: plugin.fromFile, selected: plugin == selected_plugin, disabled_plugin: plugin.disabled, installed_plugin: plugin.installed, incompatible: plugin.isInstallable() !== true}" @click="selectPlugin(plugin)" @contextmenu="selectPlugin(plugin); plugin.showContextMenu($event)">
|
||||
<div>
|
||||
<div class="plugin_icon_area">
|
||||
<img v-if="plugin.hasImageIcon()" :src="plugin.getIcon()" width="48" height="48px" />
|
||||
@ -1292,7 +1292,7 @@ BARS.defineActions(function() {
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div id="plugin_browser_page" v-if="selected_plugin">
|
||||
<div id="plugin_browser_page" v-if="selected_plugin" :class="{plugin_disabled: selected_plugin.disabled, plugin_installed: selected_plugin.installed}">
|
||||
<div v-if="isMobile" @click="selectPlugin(null);" class="plugin_browser_back_button">
|
||||
<i class="material-icons icon">arrow_back_ios</i>
|
||||
${tl('generic.navigate_back')}</div>
|
||||
|
Loading…
Reference in New Issue
Block a user