university/Imagine
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

feat: basic mobile layout

Browse source
This commit is contained in:
Orangerot 2024-12-06 04:07:43 +01:00
parent b5b7ca1f8b
commit 2a0bad598b
1 changed files with 49 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

51
index.html
View file

@ -9,8 +9,8 @@
<link rel="stylesheet" href="style.css">
<title>Imagine - Image Editor</title>
</head>
<body>
<div class="navbar columns is-mobile">
<body style="padding-top: 100vh">
<div class="navbar columns is-mobile is-fixed-top" style="z-index: -1">
<div class="column">
<div class="hero is-fullheight">
<div class="hero-body">
@ -88,5 +88,52 @@
</aside>
</div>
</div>
<div class="notification is-fullwidth is-hidden-desktop">
<button class="button is-primary">
Save Image
</button>
<button class="button is-secondary">
Share
</button>
<p class="menu-label">
Color Correction
</p>
<div class="field">
<label class="label">Brightness</label>
<div class="control">
<input type="range"
id="slider0"
class="slider is-fullwidth is-primary"
min="0" max="100" value="50" step="1">
</div>
</div>
<div class="field">
<label class="label">Saturation</label>
<div class="control">
<input type="range"
id="slider0"
class="slider is-fullwidth is-primary"
min="0" max="100" value="50" step="1">
</div>
</div>
<div class="field">
<label class="label">Contrast</label>
<div class="control">
<input type="range"
id="slider0"
class="slider is-fullwidth is-primary"
min="0" max="100" value="50" step="1">
</div>
</div>
<p class="menu-label">
Distortion
</p>
<p class="menu-label">
Blur and Sharpen
</p>
</div>
</body>
</html>