Archive/opengoal-launcher
1
0
Fork 0
mirror of https://github.com/open-goal/launcher.git synced 2024-10-20 04:57:38 -04:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

basic side nav bar styling

Browse source
This commit is contained in:
trippjoe 2022-03-27 13:53:10 -04:00
parent 5e34a940ee
commit 7398dfba7a
11 changed files with 103 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
package-lock.json generated
View file

@ -1,12 +1,12 @@
{ {
"name": "launcher", "name": "launcher",
"version": "1.0.0", "version": "0.0.1",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "launcher", "name": "launcher",
"version": "1.0.0", "version": "0.0.1",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"electron-squirrel-startup": "^1.0.0" "electron-squirrel-startup": "^1.0.0"

2
package.json
View file

@ -54,4 +54,4 @@
"@electron-forge/maker-zip": "^6.0.0-beta.63", "@electron-forge/maker-zip": "^6.0.0-beta.63",
"electron": "17.2.0" "electron": "17.2.0"
} }
} }

BIN
src/assets/images/header-logo.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 104 KiB

BIN
src/assets/images/icon.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 28 KiB

BIN
src/assets/images/jak-2.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 514 KiB

BIN
src/assets/images/jak-3.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 569 KiB

BIN
src/assets/images/jak-tpl.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 483 KiB

46
src/index.css
View file

@ -1,7 +1,47 @@
:root {
--bg-blue: #1B202B;
}
body { body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica,
Arial, sans-serif; Arial, sans-serif;
margin: auto; margin: 0;
max-width: 38rem; padding: 0;
padding: 2rem; background: var(--bg-blue);
overflow: hidden;
} }
.container{
padding: 0;
max-width: 100vw;
}
header{
background: var(--bg-blue);
border-bottom: 2px solid lightgray;
padding: 1rem;
}
.logo {
width: 25%;
}
nav {
display: flex;
flex-direction: column;
min-height: 100vh;
background: var(--bg-blue);
border-right: 1px solid lightgray;
padding: 1rem;
gap: 1rem;
}
.nav-link {
display: flex;
justify-content: center;
/* padding: 1rem; */
}
.nav-img {
width: 80%;
}

60
src/index.html
View file

@ -1,12 +1,52 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head>
<meta charset="UTF-8" /> <head>
<title>Hello World!</title> <meta charset="UTF-8" />
<link rel="stylesheet" href="index.css" /> <title>OpenGOAL Launcher</title>
</head> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
<body> integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<h1>💖 Hello World!</h1> <link rel="stylesheet" href="index.css" />
<p>Welcome to your Electron application.</p> <script defer src="render.js"></script>
</body> </head>
</html>
<body>
<div class="container">
<header>
<img src="./assets/images/header-logo.png" class="logo" alt="OpenGOAL Logo">
</header>
<div class="row">
<nav class="col">
<a class="nav-link active" aria-current="page" href="#" data-bs-toggle="tooltip" data-bs-placement="right"
title="Jak & Daxter: The Precursor Legacy">
<img src="./assets/images/jak-tpl.png" class="nav-img">
</a>
<a class="nav-link" aria-current="page" href="#" data-bs-toggle="tooltip" data-bs-placement="right"
title="Jak 2">
<img src="./assets/images/jak-2.png" class="nav-img">
</a>
<a class="nav-link" aria-current="page" href="#" data-bs-toggle="tooltip" data-bs-placement="right"
title="Jak 3">
<img src="./assets/images/jak-3.png" class="nav-img">
</a>
<a class="nav-link" aria-current="page" href="#" data-bs-toggle="tooltip" data-bs-placement="right"
title="Settings">
<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" fill="white" class="bi bi-sliders"
viewBox="0 0 16 16">
<path fill-rule="evenodd"
d="M11.5 2a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zM9.05 3a2.5 2.5 0 0 1 4.9 0H16v1h-2.05a2.5 2.5 0 0 1-4.9 0H0V3h9.05zM4.5 7a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zM2.05 8a2.5 2.5 0 0 1 4.9 0H16v1H6.95a2.5 2.5 0 0 1-4.9 0H0V8h2.05zm9.45 4a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zm-2.45 1a2.5 2.5 0 0 1 4.9 0H16v1h-2.05a2.5 2.5 0 0 1-4.9 0H0v-1h9.05z" />
</svg>
</a>
</nav>
<div class="col-10">
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous">
</script>
</body>
</html>

10
src/index.js
View file

@ -10,15 +10,19 @@ if (require('electron-squirrel-startup')) {
const createWindow = () => { const createWindow = () => {
// Create the browser window. // Create the browser window.
const mainWindow = new BrowserWindow({ const mainWindow = new BrowserWindow({
width: 800, width: 1200,
height: 600, height: 800,
resizable: false
}); });
// and load the index.html of the app. // and load the index.html of the app.
mainWindow.loadFile(path.join(__dirname, 'index.html')); mainWindow.loadFile(path.join(__dirname, '/index.html'));
// Open the DevTools. // Open the DevTools.
mainWindow.webContents.openDevTools(); mainWindow.webContents.openDevTools();
// hide menubar
mainWindow.setMenuBarVisibility(false);
}; };
// This method will be called when Electron has finished // This method will be called when Electron has finished

0
src/render.js Normal file
View file