Apply style to "Add aproduct"

This commit is contained in:
Jay Trees 2022-01-13 14:15:43 +01:00
parent bcba8eaef0
commit 7ed71b290f
4 changed files with 48 additions and 107 deletions

View file

@ -1,82 +0,0 @@
:root {
--color-primary: blue;
--radius-default: 4px;
}
body {
margin: 0;
font-family: sans-serif;
font-size: 14pt;
background-color: #f4f4f4;
}
h1 {
margin-top: 0;
}
p {
font-size: inherit;
}
form {
display: inline-block;
}
section {
max-width: 80ch;
padding: 2rem;
margin: 1rem auto 0 auto;
background-color: #fff;
}
/**
* Buttons
*/
button,
.button,
input[type="submit"],
input[type="button"] {
padding: 0.4em 1.6em;
font-size: inherit;
cursor: pointer;
border: none;
border-radius: var(--radius-default);
}
.button.primary,
input[type="submit"] {
color: #fff;
background-color: var(--color-primary);
}
a.button {
text-decoration: none;
}
/**
* Inputs
*/
fieldset {
margin: 0 0 1em 0;
padding: 0;
border: none;
}
input[type="number"],
input[type="url"],
input[type="email"],
input[type="password"],
input[type="text"] {
width: 100%;
padding: 0.4em;
font-size: inherit;
border: 1px solid #f8f8f8;
}

View file

@ -1,11 +0,0 @@
main {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
section {
max-width: 768px;
}

View file

@ -65,6 +65,37 @@ class Page
<?php
}
public function navigation(): void {
?>
<div class="ui attached stackable menu">
<div class="ui container">
<a class="item">
<i class="home icon"></i> Home
</a>
<a class="item">
<i class="grid layout icon"></i> Browse
</a>
<a class="item">
<i class="mail icon"></i> Messages
</a>
<div class="ui simple dropdown item">
More
<i class="dropdown icon"></i>
<div class="menu">
<a class="item"><i class="edit icon"></i> Edit Profile</a>
<a class="item"><i class="globe icon"></i> Choose Language</a>
<a class="item"><i class="settings icon"></i> Account Settings</a>
</div>
</div>
<div class="right item">
<div class="ui input"><input type="text" placeholder="Search..."></div>
</div>
</div>
</div>
<div class="ui hidden divider"></div>
<?php
}
public function footer(): void
{
?>

View file

@ -27,25 +27,28 @@ $info = $embed->get($url);
$page = new page(__FILE__, 'Add a product');
$page->header();
$page->navigation();
?>
<main>
<section>
<h1>Add a product</h1>
<div class="ui container">
<div class="ui segment">
<h1 class="ui header">Add a product</h1>
<form method="post">
<fieldset>
<label>URL</label>
<input type="url" name="url" value="<?= $url ?>" />
</fieldset>
<form class="ui form" method="post">
<div class="field">
<label>URL</label>
<input type="url" name="url" value="<?= $url ?>" />
</div>
<fieldset>
<label>Wishlist</label>
<input type="number" name="wishlist" value="1" />
</fieldset>
<div class="field">
<label>Wishlist</label>
<input type="number" name="wishlist" value="1" />
</div>
<input type="submit" value="Add" />
</form>
</section>
<input class="ui button" type="submit" value="Add" />
</form>
</div>
</div>
</main>
<?php