create editor page

This commit is contained in:
Michi 2024-11-10 15:00:07 +01:00
parent ff474095cf
commit 0d95e29afb
2 changed files with 296 additions and 0 deletions

83
editor/index.html Normal file
View file

@ -0,0 +1,83 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Cl1ck Gu1de Editor</title>
<meta name="mobile-web-app-title" content="Cl1ck Gu1de Editor">
<meta name="apple-mobile-web-app-title" content="Cl1ck Gu1de Editor">
<meta charset="UTF-8">
<meta name="description" content="Cl1ck Gu1de Editor">
<meta name="author" content="Michi von Ah">
<meta name="robots" content="noindex">
<meta http-equiv="expires" content="43200">
<link id="favicon" rel="icon" type="image/png" href="../logo/logo-invert-quadratisch.png">
<link rel="shortcut icon" type="image/png" href="../logo/logo-invert-quadratisch.png">
<link rel="apple-touch-icon" href="../logo/logo-invert-quadratisch.png">
<link rel="apple-touch-icon" sizes="152x152" href="../logo/logo-invert-quadratisch.png">
<link rel="apple-touch-icon" sizes="180x180" href="../logo/logo-invert-quadratisch.png">
<link rel="apple-touch-icon" sizes="167x167" href="../logo/logo-invert-quadratisch.png">
<link rel="stylesheet" type="text/css" href="editor.css"/>
<script src="editor.js" defer></script>
</head>
<body>
<div class="content">
<div class="nav">
<img id="logo" class="logo" src="../logo/logo-invert.png" alt="Logo">
</div>
<div class="toolList editor">
<button class="toolBtn">
<span class="material-symbols-outlined">upload_file</span>
<p>Import</p>
</button>
<button class="toolBtn">
<span class="material-symbols-outlined">download</span>
<p>Export</p>
</button>
<button class="toolBtn">
<span class="material-symbols-outlined">share</span>
<p>Share link</p>
</button>
</div>
<div class="stepsContainer">
<div class="guideSettings">
<div>
<h1>Guide Title</h1>
<p>Description</p>
<p>Author</p>
</div>
</div>
<div class="step">
<div>
<h2>Step Name</h2>
<p>Description</p>
</div>
<div>
<img src="../logo/mockup-viewer-editor.jpg">
</div>
</div>
<div class="step">
<div>
<h2>Step Name</h2>
<p>Description</p>
</div>
<div>
<img src="../logo/mockup-viewer-editor.jpg">
</div>
</div>
<div class="step">
<div>
<h2>Step Name</h2>
<p>Description</p>
</div>
<div>
<img src="../logo/mockup-viewer-editor.jpg">
</div>
</div>
</div>
<div class="guideTools editor">
<button><span class="material-symbols-outlined">add</span>Add step</button>
</div>
</div>
</body>
</html>