image

_layouts/default.html

@@ -32,59 +32,6 @@
                 </clipPath>
             </defs>
         </svg>
-        <div id="sider-outer" class="design-1">
-            <div id="sider">
-                <h2>Welcome</h2>
-                <div id="sider-cats">
-                    <!--<input type="checkbox" id="i_1" class="hidden" />
-                    <label for="i_1">Category 1</label>
-                    <div>
-                        <a href="#">This is a link</a><br>
-                        <a href="#">Another link</a>
-                    </div><br>
-                    <input type="checkbox" id="i_2" class="hidden" />
-                    <label for="i_2">Category 2</label>
-                    <div>
-                        <a href="#">Third link, new category</a><br>
-                        <a href="#">Links.</a>
-                    </div>-->
-                    <!--
-                    <div><a href="/about">About Us</a></div>
-                    <div><a href="/contact">Contact Us</a></div>
-                    <br>
-                    <div><a href="/services">Services</a></div>
-                    <div><a href="/membership">Membership</a></div>
-                    <div><a href="/volunteer">Volunteer</a></div>
-                    <div><a href="/events">Events</a></div>
-                    <div><a href="/charities">Charities</a></div>-->
-                    <!--
-Intro to Judaism
-Humanism
-Jewish Culture & History
-
-Kashrut
-Membership
-Events
-
-Others:
-About us
-Contact us -->
-                <div><a href="{{ site.baseurl }}/about">About Us</a></div>
-                <div><a href="{{ site.baseurl }}/intro-to-judaism">Intro to Judaism</a></div>
-                <div><a href="{{ site.baseurl }}/humanism">Humanism</a></div>
-                <div><a href="{{ site.baseurl }}/jewish-history-culture">Jewish Culture & History</a></div>
-                <input type="checkbox" id="i_1" class="hidden" />
-                <label for="i_1">Kashrut</label>
-                <div>
-                    <a href="https://www.instagram.com/kosherkuwait">@kosherkuwait</a><br>
-                    <a href="https://www.instagram.com/kosheriraq1">@kosheriraq1</a>
-                </div>
-                <div><a href="{{ site.baseurl }}/membership">Membership</a></div>
-                <div><a href="{{ site.baseurl }}/contact">Contact Us</a></div>
-                </div>
-                <!--<img src="/res/arrow-none.svg" onclick="toggle_sidebar()" />-->
-            </div>
-        </div>
         <div id="outer">
             <div id="header">
                 <div id="head-marker" class="scrolly"></div>
@@ -160,6 +107,59 @@ Contact us -->
                 © 2023 Avraham Society. All rights reserved. Website by <a href="https://swaous.asuscomm.com">Tyler Clarke</a>.
             </div>
         </div>
+        <div id="sider-outer" class="design-1">
+            <div id="sider">
+                <h2>Welcome</h2>
+                <div id="sider-cats">
+                    <!--<input type="checkbox" id="i_1" class="hidden" />
+                            <label for="i_1">Category 1</label>
+                            <div>
+                                <a href="#">This is a link</a><br>
+                                <a href="#">Another link</a>
+                            </div><br>
+                            <input type="checkbox" id="i_2" class="hidden" />
+                            <label for="i_2">Category 2</label>
+                            <div>
+                                <a href="#">Third link, new category</a><br>
+                                <a href="#">Links.</a>
+                            </div>-->
+                    <!--
+                            <div><a href="/about">About Us</a></div>
+                            <div><a href="/contact">Contact Us</a></div>
+                            <br>
+                            <div><a href="/services">Services</a></div>
+                            <div><a href="/membership">Membership</a></div>
+                            <div><a href="/volunteer">Volunteer</a></div>
+                            <div><a href="/events">Events</a></div>
+                            <div><a href="/charities">Charities</a></div>-->
+                    <!--
+        Intro to Judaism
+        Humanism
+        Jewish Culture & History
+        
+        Kashrut
+        Membership
+        Events
+        
+        Others:
+        About us
+        Contact us -->
+                    <div><a href="{{ site.baseurl }}/about">About Us</a></div>
+                    <div><a href="{{ site.baseurl }}/intro-to-judaism">Intro to Judaism</a></div>
+                    <div><a href="{{ site.baseurl }}/humanism">Humanism</a></div>
+                    <div><a href="{{ site.baseurl }}/jewish-history-culture">Jewish Culture & History</a></div>
+                    <input type="checkbox" id="i_1" class="hidden" />
+                    <label for="i_1">Kashrut</label>
+                    <div>
+                        <a href="https://www.instagram.com/kosherkuwait">@kosherkuwait</a><br>
+                        <a href="https://www.instagram.com/kosheriraq1">@kosheriraq1</a>
+                    </div>
+                    <div><a href="{{ site.baseurl }}/membership">Membership</a></div>
+                    <div><a href="{{ site.baseurl }}/contact">Contact Us</a></div>
+                </div>
+                <!--<img src="/res/arrow-none.svg" onclick="toggle_sidebar()" />-->
+            </div>
+        </div>
         <script src="{{ site.baseurl }}/main.js"></script>
     </body>
 </html>

index.html

@@ -2,9 +2,7 @@
 layout: default
 title: Home
 ---
-<p>
-    <i>When I get the image from abraxus it'll go here</i>
-</p>
+<img class="wide" src="{{ site.baseurl }}/res/Avraham_Society.png">
 <p>
     Welcome to the Avraham Society! If you are looking for the Jewish Humanist voice of the MENA region then you came to the
     right place! We are the home of future leaders who want to make a change in the world. We are an opportunity for all

main.css

@@ -196,6 +196,7 @@ body:not(.sidebar-opened) > #sider-outer > #sider {
     overflow: hidden;
     padding: 0;
     margin: 0;
+    display: none;
 }
 
 body:not(.sidebar-opened) > #sider-outer > #sider > img {
@@ -505,6 +506,15 @@ h1 {
     overflow: hidden;
 }
 
+#content > .wide {
+    margin: 0px;
+    width: 100%;
+}
+
+#content {
+    min-height: 50vh;
+}
+
 #content > p > .overlay {
     position: absolute;
     top: 50%;

main.js

@@ -1,3 +1,19 @@
+var startX = 0;
+
+window.ontouchstart = (evt) => {
+    startX = evt.touches[0].clientX;
+}
+
+window.ontouchmove = (evt) => {
+    var difX = evt.touches[0].clientX - startX;
+    if (difX > 100) {
+        document.body.classList.add("sidebar-opened");
+    }
+    if (difX < -100) {
+        document.body.classList.remove("sidebar-opened");
+    }
+}
+
 function clamp(min, val, max) {
     if (val < min) {
         val = min;