75 lines
1.8 KiB
Svelte
75 lines
1.8 KiB
Svelte
<script lang="ts">
|
|
import {instances, loading, navMargin, themecolor} from './global'
|
|
import {InstallVanilla, LaunchInstance, GetInstances, InstallForge, InstallQuilt, InstallFabric, CheckUpdate} from '../wailsjs/go/main/InstanceManager.js'
|
|
import {GetVersions} from '../wailsjs/go/main/App.js'
|
|
import {onMount, createEventDispatcher} from 'svelte'
|
|
|
|
var r = document.querySelector('main');
|
|
const dispatch = createEventDispatcher()
|
|
|
|
function changetheme(color){
|
|
$themecolor = color;
|
|
dispatch('change-theme');
|
|
}
|
|
|
|
function changethemeback(){
|
|
dispatch('change-theme-back');
|
|
}
|
|
|
|
|
|
</script>
|
|
<main>
|
|
<div class="container">
|
|
<button id="green" class="theme-button" on:click={() => changetheme('green')}>Green</button>
|
|
<button id="purple" class="theme-button" on:click={() => changetheme('purple')}>Purple</button>
|
|
<button id="pink" class="theme-button" on:click={() => changetheme('#ba2abf')}>Pink</button>
|
|
|
|
</div>
|
|
|
|
</main>
|
|
<style>
|
|
* {
|
|
box-sizing: border-box;
|
|
font-family: sans-serif;
|
|
--text-primary: #b6b6b6;
|
|
--text-secondary: #ececec;
|
|
--bg-primary: #23232e;
|
|
--bg-secondary: #141418;
|
|
|
|
}
|
|
.container{
|
|
display: flex;
|
|
justify-content: center;
|
|
margin: 3rem;
|
|
}
|
|
.theme-button{
|
|
background-color: var(--accent-color);
|
|
margin: 1rem;
|
|
color: var(--text-primary);
|
|
font-size: large;
|
|
border-radius: 4px;
|
|
border-style: solid;
|
|
width: 4rem;
|
|
justify-content: center;
|
|
height: 4rem;
|
|
transition: 100ms;
|
|
}
|
|
.theme-button:hover{
|
|
color: var(--text-secondary);
|
|
}
|
|
.theme-button:active{
|
|
opacity: 0.6;
|
|
}
|
|
#green{
|
|
background-color: green;
|
|
border-color: green;
|
|
}
|
|
#purple{
|
|
background-color: purple;
|
|
border-color: purple;
|
|
}
|
|
#pink{
|
|
background-color: #ba2abf;
|
|
border-color: #ba2abf;
|
|
}
|
|
</style> |