Issue silverweed#3: Add screenshot-mode toggle button

No art
antler5 · Mar 20, 2023 · 7cc3fe5 · 7cc3fe5
1 parent 411f08a
commit 7cc3fe5
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/index.html b/index.html
@@ -13,6 +13,7 @@
     </div>
     <a href='https://github.com/silverweed/tiers' class='gh-link'>GitHub</a>
     <section class='main-content'>
+	<input id='screenshot-mode-input' type='checkbox'></input>
         <div class='tierlist'>
         </div>
         <div class='bottom-container'>
@@ -41,6 +42,11 @@
                     </label>
                     <input id='import-input' type='file' accept='.json' multiple/>
                 </div>
+                <div class='button'>
+                    <label for='screenshot-mode-input'>
+                        <img src='import.png' title='Screenshot Mode'/>
+                    </label>
+                </div>
             </div>
             <section class='images'></section>
         </div>

diff --git a/tiers.css b/tiers.css
@@ -36,10 +36,17 @@ body {
 
 .tierlist {
 	width: 80%;
-	height: 80vh;
 	overflow: scroll;
 }
 
+#screenshot-mode-input {
+	display: none;
+}
+
+input#screenshot-mode-input:not(:checked) + .tierlist {
+	height: 80vh;
+}
+
 .tierlist span {
 	min-width: 100px;
 	min-height: 100px;