NOJIRA | Updates. | [Ray]

index.html

@@ -23,7 +23,6 @@
              position: relative;
              overflow: hidden;
              text-align: right;
-             height: 200px;
              z-index: 1;
          }
 
@@ -69,11 +68,7 @@
             </div>
         </div>
 
-        <div class="games w-80 mt4">
-            <div class="avenir lh-copy ph4 pv2 bg-light-gray tc flex-column justify-center items-center i">
-                <p><span class="b">[games]</span> is my response to the mountain of "Top X Y games" lists on the Internet. There's no ranking to these games; the only criterion for inclusion is a question: "Does the game catch my eye?" <br /><br /> Maybe you'll find one that catches yours.</p>
-            </div>
-        </div>
+        <div class="games w-80 mt4"></div>
 
         <div class="mv4 pv2 w-80 bg-near-black near-white tc">
             <p class="f4 i avernir">"As a <a class="link pointer usn white dim" href="https://twitch.tv/DNOpls">wise man</a> once said... 'so many game, no many time'."</p>
@@ -82,6 +77,7 @@
         <script>
          (async (document, window) => {
              const PLACEHOLDER_IMAGE = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAA1JREFUGFdj+P///38ACfsD/QVDRcoAAAAASUVORK5CYII=';
+             const ITEM_HEIGHT = '200px';
 
              let lazyImageObserver;
              const isIntersectionObserverAvailable = 'IntersectionObserver' in window;
@@ -129,9 +125,10 @@
 
                  const preambleElem = document.createElement('div');
                  preambleElem.classList.add('avenir', 'lh-copy', 'ph4', 'pv2', 'bg-light-gray', 'tc', 'flex-column', 'justify-center', 'items-center', 'i');
+                 preambleElem.style.height = ITEM_HEIGHT;
 
                  const preambleTextElem = document.createElement('p');
-                 preambleTextElem.innerHTML = `<span class="b">[games]</span> is my response to the mountain of "Top X Y games" lists on the Internet. There's no ranking to these games; the only criterion for inclusion is a question: "Does the game catch my eye?" <br /><br /> Maybe you'll find one that catches yours.`;
+                 preambleTextElem.textContent = `Sometimes, you look at a game for a few seconds and you just know, man.`;
 
                  preambleElem.appendChild(preambleTextElem);
                  allGames.appendChild(preambleElem);
@@ -143,6 +140,7 @@
 
                      const entryElem = document.createElement('div');
                      entryElem.classList.add('image', 'ba', 'bw1', 'b--near-black', 'bg-light-gray', 'usn');
+                     entryElem.style.height = ITEM_HEIGHT;
 
                      const imageElem = document.createElement('img');
                      imageElem.alt = name;