working but hacky
This commit is contained in:
parent
4e11110c95
commit
9469de72fe
12
account.html
12
account.html
@ -11,13 +11,19 @@
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<header>
|
||||||
<h1>tronnet</h1>
|
<div id="logo">
|
||||||
<hr>
|
<p style="font-size: xxx-large; margin: 0px;">tronnet</p>
|
||||||
<nav>
|
</div>
|
||||||
|
<div id="hr1"><hr></div>
|
||||||
|
<div id="hr2"><hr></div>
|
||||||
|
<nav id="nav">
|
||||||
<a href="index.html">Instances</a>
|
<a href="index.html">Instances</a>
|
||||||
<a href="account.html" aria-current="true">Account</a>
|
<a href="account.html" aria-current="true">Account</a>
|
||||||
<a href="login.html">Logout</a>
|
<a href="login.html">Logout</a>
|
||||||
</nav>
|
</nav>
|
||||||
|
<div id="title">
|
||||||
|
<h1>Account</h1>
|
||||||
|
</div>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<table id="resource-table">
|
<table id="resource-table">
|
||||||
|
17
config.html
17
config.html
@ -12,16 +12,23 @@
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<header>
|
||||||
<h1>tronnet</h1>
|
<div id="logo">
|
||||||
<hr>
|
<p style="font-size: xxx-large; margin: 0px;">tronnet</p>
|
||||||
<nav>
|
</div>
|
||||||
|
<div id="title">
|
||||||
|
<h1>Instances</h1>
|
||||||
|
<p style="font-size: xxx-large;">/</p>
|
||||||
|
<h2 id="name"></h2>
|
||||||
|
</div>
|
||||||
|
<div id="hr1"><hr></div>
|
||||||
|
<div id="hr2"><hr></div>
|
||||||
|
<nav id="nav">
|
||||||
<a href="index.html" aria-current="true">Instances</a>
|
<a href="index.html" aria-current="true">Instances</a>
|
||||||
<a href="account.html">Account</a>
|
<a href="account.html">Account</a>
|
||||||
<a href="login.html">Logout</a>
|
<a href="login.html">Logout</a>
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<h3 id="name"></h3>
|
|
||||||
<div class="center-div">
|
<div class="center-div">
|
||||||
<form>
|
<form>
|
||||||
<fieldset>
|
<fieldset>
|
||||||
|
@ -18,10 +18,11 @@
|
|||||||
body {
|
body {
|
||||||
display: grid;
|
display: grid;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
grid-template-rows: auto 1fr auto;
|
grid-template-rows: auto auto 1fr auto;
|
||||||
grid-template-columns: auto 1fr;
|
grid-template-columns: auto 1fr;
|
||||||
grid-template-areas:
|
grid-template-areas:
|
||||||
"logo title"
|
"logo title"
|
||||||
|
"hr1 hr2"
|
||||||
"nav main"
|
"nav main"
|
||||||
"footer main"
|
"footer main"
|
||||||
;
|
;
|
||||||
@ -34,17 +35,57 @@ header {
|
|||||||
|
|
||||||
#logo {
|
#logo {
|
||||||
grid-area: logo;
|
grid-area: logo;
|
||||||
|
padding: 20px;
|
||||||
|
padding-bottom: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#hr1 {
|
||||||
|
grid-area: hr1;
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
padding-left: 20px;
|
||||||
|
padding-right: 20px;
|
||||||
|
background-color: var(--accent-bkg-color);
|
||||||
|
color: var(--accent-txt-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
#hr1 hr {
|
||||||
|
height: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#hr2 {
|
||||||
|
grid-area: hr2;
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
padding-left: 20px;
|
||||||
|
padding-right: 20px;
|
||||||
|
background-color: var(--content-bkg-color);
|
||||||
|
color: var(--content-txt-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
#hr2 hr {
|
||||||
|
height: 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#nav {
|
#nav {
|
||||||
grid-area: nav;
|
grid-area: nav;
|
||||||
|
padding: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#title {
|
#title {
|
||||||
grid-area: title;
|
grid-area: title;
|
||||||
|
padding: 20px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
align-items: end;
|
||||||
}
|
}
|
||||||
|
|
||||||
#logo, #nav, footer {
|
#title * {
|
||||||
|
margin: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#logo, #nav, #hr1, footer {
|
||||||
background-color: var(--accent-bkg-color);
|
background-color: var(--accent-bkg-color);
|
||||||
color: var(--accent-txt-color);
|
color: var(--accent-txt-color);
|
||||||
}
|
}
|
||||||
@ -53,6 +94,8 @@ main {
|
|||||||
grid-area: main;
|
grid-area: main;
|
||||||
background-color: var(--content-bkg-color);
|
background-color: var(--content-bkg-color);
|
||||||
color: var(--content-txt-color);
|
color: var(--content-txt-color);
|
||||||
|
padding-left: 20px;
|
||||||
|
padding-right: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
@ -95,16 +138,12 @@ nav a:hover:before {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, h2, h3, p {
|
|
||||||
font-family: monospace;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
font-size: xxx-large;
|
font-size: xxx-large;
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
font-size: xx-large;
|
font-size: xxx-large;
|
||||||
}
|
}
|
||||||
|
|
||||||
h3 {
|
h3 {
|
||||||
|
12
index.html
12
index.html
@ -26,13 +26,19 @@
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<header>
|
||||||
<img id="logo" src="logo.webp">
|
<div id="logo">
|
||||||
|
<p style="font-size: xxx-large; margin: 0px;">tronnet</p>
|
||||||
|
</div>
|
||||||
|
<div id="title">
|
||||||
|
<h1>Instances</h1>
|
||||||
|
</div>
|
||||||
|
<div id="hr1"><hr></div>
|
||||||
|
<div id="hr2"><hr></div>
|
||||||
<nav id="nav">
|
<nav id="nav">
|
||||||
<a href="index.html" aria-current="true">Instances</a>
|
<a href="index.html" aria-current="true">Instances</a>
|
||||||
<a href="account.html">Account</a>
|
<a href="account.html">Account</a>
|
||||||
<a href="login.html">Logout</a>
|
<a href="login.html">Logout</a>
|
||||||
</nav>
|
</nav>
|
||||||
<h1 id="title">Instances</h1>
|
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<div id="instance-container">
|
<div id="instance-container">
|
||||||
|
16
login.html
16
login.html
@ -12,11 +12,19 @@
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<header>
|
||||||
<h1>tronnet</h1>
|
<div id="logo">
|
||||||
<hr>
|
<p style="font-size: xxx-large; margin: 0px;">tronnet</p>
|
||||||
<nav>
|
</div>
|
||||||
|
<div id="title">
|
||||||
|
<h1>Instances</h1>
|
||||||
|
<p style="font-size: xxx-large;">/</p>
|
||||||
|
<h2 id="name"></h2>
|
||||||
|
</div>
|
||||||
|
<div id="hr1"><hr></div>
|
||||||
|
<div id="hr2"><hr></div>
|
||||||
|
<nav id="nav">
|
||||||
<a href="login.html" aria-current="true">Login</a>
|
<a href="login.html" aria-current="true">Login</a>
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<form style="margin-left: auto; margin-right: auto;">
|
<form style="margin-left: auto; margin-right: auto;">
|
||||||
|
Loading…
Reference in New Issue
Block a user