yuzu-emu/liftinstall
1
0
Fork 0
mirror of https://github.com/yuzu-emu/liftinstall.git synced 2024-11-22 07:25:37 +01:00
Code Issues Packages Projects Releases Wiki Activity

Clean up positioning of buttons

Browse Source
This commit is contained in:
James 2018-09-19 12:22:40 +10:00
parent 9f32113f6b
commit 47f1c1aa38
4 changed files with 100 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
static/css/main.css
View File

@ -36,6 +36,7 @@ pre {
.has-padding {
padding: 2rem;
position: relative;
}
.clickable-box {
@ -45,3 +46,30 @@ pre {
.clickable-box label {
pointer-events: none;
}
.is-max-height {
height: 100%;
}
.is-bottom-floating {
position: absolute;
bottom: 0;
}
.is-right-floating {
position: absolute;
right: 0;
}
.has-padding .is-right-floating {
right: 1rem;
}
.is-left-floating {
position: absolute;
left: 0;
}
.has-padding .is-left-floating {
left: 1rem;
}

21
static/index.html
View File

@ -13,23 +13,26 @@
<link rel="stylesheet" href="/css/bulma.min.css" type="text/css">
<link rel="stylesheet" href="/css/main.css" type="text/css">
</head>
<body>
<div id="app">
<section class="section">
<div class="container">
<div class="columns">
<body class="is-max-height">
<div id="app" class="is-max-height">
<section class="section is-max-height">
<div class="container is-max-height">
<div class="columns is-max-height">
<div class="column is-one-third has-padding" v-if="!metadata.is_launcher">
<img src="/logo.png" width="60%" />
<h1 class="subtitle" v-if="!metadata.preexisting_install">
<br />
<br />
<h2 class="subtitle" v-if="!metadata.preexisting_install">
Welcome to the {{ attrs.name }} installer!
</h1>
</h2>
<h2 class="subtitle" v-if="!metadata.preexisting_install">
We will have you up and running in just a few moments.
</h2>
<h1 class="subtitle" v-if="metadata.preexisting_install">
<h2 class="subtitle" v-if="metadata.preexisting_install">
Welcome to the {{ attrs.name }} maintenance tool.
</h1>
</h2>
</div>
<router-view></router-view>

43
static/js/main.js
View File

@ -1,29 +1,32 @@
// Overwrite loggers with the logging backend
window.onerror = function(msg, url, line) {
window.external.invoke(JSON.stringify({
Log: {
kind: "error",
msg: msg + " @ " + url + ":" + line
}
}));
};
// Borrowed from http://tobyho.com/2012/07/27/taking-over-console-log/
function intercept(method){
console[method] = function(){
var message = Array.prototype.slice.apply(arguments).join(' ');
if (window.external !== undefined && window.external.invoke !== undefined) {
window.onerror = function(msg, url, line) {
old_onerror(msg, url, line);
window.external.invoke(JSON.stringify({
Log: {
kind: method,
msg: message
kind: "error",
msg: msg + " @ " + url + ":" + line
}
}));
}
}
};
var methods = ['log', 'warn', 'error'];
for (var i = 0; i < methods.length; i++) {
intercept(methods[i]);
// Borrowed from http://tobyho.com/2012/07/27/taking-over-console-log/
function intercept(method){
console[method] = function(){
var message = Array.prototype.slice.apply(arguments).join(' ');
window.external.invoke(JSON.stringify({
Log: {
kind: method,
msg: message
}
}));
}
}
var methods = ['log', 'warn', 'error'];
for (var i = 0; i < methods.length; i++) {
intercept(methods[i]);
}
}
// Disable F5

53
static/js/views.js
View File

@ -96,7 +96,7 @@ const DownloadConfig = {
const SelectPackages = {
template: `
<div class="column has-padding">
<h4 class="subtitle">Select your preferred settings:</h4>
<h4 class="subtitle">Select which packages you want to install:</h4>
<!-- Build options -->
<div class="tile is-ancestor">
@ -129,16 +129,29 @@ const SelectPackages = {
</div>
</div>
<div class="is-pulled-right">
<a class="button is-dark" v-if="!$root.$data.metadata.preexisting_install && !advanced"
v-on:click="advanced = true">Advanced...</a>
<a class="button is-dark" v-if="!$root.$data.metadata.preexisting_install"
v-on:click="install">Install</a>
<a class="button is-dark" v-if="$root.$data.metadata.preexisting_install"
v-on:click="install">Modify</a>
<div class="is-right-floating is-bottom-floating">
<div class="field is-grouped">
<p class="control">
<a class="button is-medium" v-if="!$root.$data.metadata.preexisting_install && !advanced"
v-on:click="advanced = true">Advanced...</a>
</p>
<p class="control">
<a class="button is-dark is-medium" v-if="!$root.$data.metadata.preexisting_install"
v-on:click="install">Install</a>
</p>
<p class="control">
<a class="button is-dark is-medium" v-if="$root.$data.metadata.preexisting_install"
v-on:click="install">Modify</a>
</p>
</div>
</div>
<div class="field is-grouped is-left-floating is-bottom-floating">
<p class="control">
<a class="button is-medium" v-if="$root.$data.metadata.preexisting_install"
v-on:click="go_back">Back</a>
</p>
</div>
<a class="button is-pulled-left" v-if="$root.$data.metadata.preexisting_install"
v-on:click="go_back">Back</a>
</div>
`,
data: function() {
@ -268,7 +281,11 @@ const ErrorView = {
<pre>{{ msg }}</pre>
<a class="button is-primary is-pulled-right" v-if="remaining" v-on:click="go_back">Back</a>
<div class="field is-grouped is-right-floating is-bottom-floating">
<p class="control">
<a class="button is-primary is-medium" v-if="remaining" v-on:click="go_back">Back</a>
</p>
</div>
</div>
`,
data: function() {
@ -301,7 +318,11 @@ const CompleteView = {
<h4 class="subtitle">{{ $root.$data.attrs.name }} has been uninstalled.</h4>
</div>
<a class="button is-dark is-pulled-right" v-on:click="exit">Exit</a>
<div class="field is-grouped is-right-floating is-bottom-floating">
<p class="control">
<a class="button is-dark is-medium" v-on:click="exit">Exit</a>
</p>
</div>
</div>
`,
data: function() {
@ -322,19 +343,19 @@ const ModifyView = {
<div class="column has-padding">
<h4 class="subtitle">Choose an option:</h4>
<div class="field is-grouped">
<div class="field is-grouped is-bottom-floating">
<p class="control">
<a class="button is-link" v-on:click="update">
<a class="button is-link is-medium" v-on:click="update">
Update
</a>
</p>
<p class="control">
<a class="button" v-on:click="modify_packages">
<a class="button is-medium" v-on:click="modify_packages">
Modify
</a>
</p>
<p class="control">
<a class="button is-danger" v-on:click="prepare_uninstall">
<a class="button is-danger is-medium" v-on:click="prepare_uninstall">
Uninstall
</a>
</p>