build: updated webui to v1.1.0; style: fixed home "open settings" button; style: updated updateAvailable notification; style: changed default theme to dark; bump: tailwindcss to 1.9
This commit is contained in:
Roberto Tonino
parent
be5eb52446
commit
34102101bd
6
package-lock.json
generated
6
package-lock.json
generated
@ -5326,9 +5326,9 @@
|
||||
}
|
||||
},
|
||||
"tailwindcss": {
|
||||
"version": "1.8.12",
|
||||
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-1.8.12.tgz",
|
||||
"integrity": "sha512-VChYp+4SduP8hHFAmf75P5Yf0qNQi3oSSnpEMKkC6kWW/9K+SizRgbmllqLJLnTZq+eM3TDwvn1jWXvvg+dfDA==",
|
||||
"version": "1.9.1",
|
||||
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-1.9.1.tgz",
|
||||
"integrity": "sha512-3faxlyPlcWN8AoNEIVQFNsDcrdXS/D9nOGtdknrXvZp4D4E3AGPO2KRPiGG69B2ZUO0V6RvYiW91L2/n9QnBxg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@fullhuman/postcss-purgecss": "^2.1.2",
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "deemix-webui",
|
||||
"version": "1.0.0",
|
||||
"version": "1.1.0",
|
||||
"homepage": "https://codeberg.org/RemixDev/deemix-webui/src/master/README.md",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
@ -44,7 +44,7 @@
|
||||
"rollup-plugin-terser": "^6.1.0",
|
||||
"rollup-plugin-vue": "^4.2.0",
|
||||
"sass": "^1.26.8",
|
||||
"tailwindcss": "^1.8.12",
|
||||
"tailwindcss": "^1.9.1",
|
||||
"vue-template-compiler": "^2.6.12"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" dir="ltr" data-theme="light">
|
||||
<html lang="en" dir="ltr" data-theme="dark">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -13,6 +13,11 @@
|
||||
>
|
||||
<i class="material-icons side_icon">{{ link.icon }}</i>
|
||||
<span class="main_tablinks_text">{{ $t(link.label) }}</span>
|
||||
<span
|
||||
v-if="link.name === 'about' && updateAvailable"
|
||||
id="update-notification"
|
||||
class="bg-red-600 w-3 h-3 rounded-full"
|
||||
></span>
|
||||
</router-link>
|
||||
|
||||
<span id="theme_selector" class="main_tablinks" role="link" aria-label="theme selector">
|
||||
@ -61,6 +66,12 @@
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
#update-notification {
|
||||
position: absolute;
|
||||
left: 30px;
|
||||
top: 12px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
@ -73,6 +84,7 @@ export default {
|
||||
activeTheme: 'light',
|
||||
themes: ['purple', 'dark', 'light'],
|
||||
activeTablink: 'home',
|
||||
updateAvailable: false,
|
||||
links: [
|
||||
{
|
||||
id: 'main_home_tablink',
|
||||
@ -146,7 +158,7 @@ export default {
|
||||
})
|
||||
|
||||
/* === Current theme handling === */
|
||||
this.activeTheme = localStorage.getItem('selectedTheme') || 'light'
|
||||
this.activeTheme = localStorage.getItem('selectedTheme') || 'dark'
|
||||
|
||||
this.$router.afterEach((to, from) => {
|
||||
const linkInSidebar = this.links.find(link => link.routerName === to.name)
|
||||
@ -157,13 +169,8 @@ export default {
|
||||
})
|
||||
|
||||
/* === Add update notification near info === */
|
||||
updateNotification = document.createElement('span')
|
||||
updateNotification.id = "update-notification"
|
||||
updateNotification.className = "hide"
|
||||
document.getElementById("main_about_tablink").append(updateNotification)
|
||||
|
||||
socket.on('updateAvailable', function() {
|
||||
document.getElementById("update-notification").classList.remove("hide")
|
||||
socket.on('updateAvailable', () => {
|
||||
this.updateAvailable = true
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -208,20 +208,23 @@ import ethereum from '@/assets/ethereum.svg'
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
data: () => ({
|
||||
data() {
|
||||
return {
|
||||
paypal,
|
||||
ethereum,
|
||||
current: null,
|
||||
latest: null,
|
||||
updateAvailable: false,
|
||||
deemixVersion: null
|
||||
}),
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['getAboutInfo'])
|
||||
},
|
||||
methods: {
|
||||
initUpdate(data) {
|
||||
const { currentCommit, latestCommit, updateAvailable, deemixVersion } = data
|
||||
|
||||
this.current = currentCommit
|
||||
this.latest = latestCommit
|
||||
this.updateAvailable = updateAvailable
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
|
||||
<section class="home_section" ref="notLogged" v-if="!isLoggedIn">
|
||||
<p id="home_not_logged_text">{{ $t('home.needTologin') }}</p>
|
||||
<router-link tag="button" name="button" :to="{ name: 'Settings' }">
|
||||
<router-link tag="button" name="button" :to="{ name: 'Settings' }" class="btn btn-primary">
|
||||
{{ $t('home.openSettings') }}
|
||||
</router-link>
|
||||
</section>
|
||||
|
||||
@ -99,15 +99,8 @@ $sidebar-delay: 75ms;
|
||||
}
|
||||
|
||||
/* Update Notification */
|
||||
#main_about_tablink { position:relative; }
|
||||
#update-notification {
|
||||
background-color: red;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 6px;
|
||||
position: absolute;
|
||||
left: 30px;
|
||||
top: 12px;
|
||||
#main_about_tablink {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* Theme selector */
|
||||
|
||||
Loading…
Reference in New Issue
Block a user