mirror of
https://github.com/open-goal/launcher.git
synced 2024-10-20 04:57:38 -04:00
basic side nav bar styling
This commit is contained in:
parent
5e34a940ee
commit
7398dfba7a
4
package-lock.json
generated
4
package-lock.json
generated
|
@ -1,12 +1,12 @@
|
|||
{
|
||||
"name": "launcher",
|
||||
"version": "1.0.0",
|
||||
"version": "0.0.1",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "launcher",
|
||||
"version": "1.0.0",
|
||||
"version": "0.0.1",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"electron-squirrel-startup": "^1.0.0"
|
||||
|
|
|
@ -54,4 +54,4 @@
|
|||
"@electron-forge/maker-zip": "^6.0.0-beta.63",
|
||||
"electron": "17.2.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
BIN
src/assets/images/header-logo.png
Normal file
BIN
src/assets/images/header-logo.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 104 KiB |
BIN
src/assets/images/icon.png
Normal file
BIN
src/assets/images/icon.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 28 KiB |
BIN
src/assets/images/jak-2.png
Normal file
BIN
src/assets/images/jak-2.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 514 KiB |
BIN
src/assets/images/jak-3.png
Normal file
BIN
src/assets/images/jak-3.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 569 KiB |
BIN
src/assets/images/jak-tpl.png
Normal file
BIN
src/assets/images/jak-tpl.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 483 KiB |
|
@ -1,7 +1,47 @@
|
|||
:root {
|
||||
--bg-blue: #1B202B;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica,
|
||||
Arial, sans-serif;
|
||||
margin: auto;
|
||||
max-width: 38rem;
|
||||
padding: 2rem;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
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%;
|
||||
}
|
|
@ -1,12 +1,52 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Hello World!</title>
|
||||
<link rel="stylesheet" href="index.css" />
|
||||
</head>
|
||||
<body>
|
||||
<h1>💖 Hello World!</h1>
|
||||
<p>Welcome to your Electron application.</p>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>OpenGOAL Launcher</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="index.css" />
|
||||
<script defer src="render.js"></script>
|
||||
</head>
|
||||
|
||||
<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
10
src/index.js
|
@ -10,15 +10,19 @@ if (require('electron-squirrel-startup')) {
|
|||
const createWindow = () => {
|
||||
// Create the browser window.
|
||||
const mainWindow = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
width: 1200,
|
||||
height: 800,
|
||||
resizable: false
|
||||
});
|
||||
|
||||
// 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.
|
||||
mainWindow.webContents.openDevTools();
|
||||
|
||||
// hide menubar
|
||||
mainWindow.setMenuBarVisibility(false);
|
||||
};
|
||||
|
||||
// This method will be called when Electron has finished
|
||||
|
|
0
src/render.js
Normal file
0
src/render.js
Normal file
Loading…
Reference in a new issue