🔖 2.1.1 (#11)

NMSCD · Jul 17, 2023 · e09e6a3 · e09e6a3
2 parents 5ae2b8d + 1fe56e7
commit e09e6a3
Show file tree

Hide file tree

Showing 9 changed files with 241 additions and 109 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "nmscd.web",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "scripts": {
     "build": "npm-run-all --sequential setup:* live:* sass:* template:*",
     "setup": "npm i && npm-run-all --sequential setup:* live:*",

diff --git a/template/data/projects.json b/template/data/projects.json
@@ -82,6 +82,17 @@
         }
       ]
     },
+    {
+      "title": "DDS-Archive",
+      "description": "A repository to archive DDS texture files of different nms versions.",
+      "imageUrl": "/assets/img/dds.png",
+      "links": [
+        {
+          "title": "View repository",
+          "url": "https://github.com/NMSCD/nms-dds"
+        }
+      ]
+    },
     {
       "title": "NMS Creature Builder",
       "description": "This is a tool to help people craft NMS creatures by allowing you to select the parts that can be used together.",
@@ -97,17 +108,6 @@
         }
       ]
     },
-    {
-      "title": "DDS-Archive",
-      "description": "A repository to archive DDS texture files of different nms versions.",
-      "imageUrl": "/assets/img/dds.png",
-      "links": [
-        {
-          "title": "View repository",
-          "url": "https://github.com/NMSCD/nms-dds"
-        }
-      ]
-    },
     {
       "title": "NMS - Expedition Alphabet",
       "description": "A secret No Man's Sky alphabet was teased with the Expedition releases. Once the Beachhead Expedition was released we were able to get most of the letters of the alphabet. This project displays all of the characters that we are pretty sure link up to the English Alphabet.",

diff --git a/template/handlebar/components/project.hbs b/template/handlebar/components/project.hbs
@@ -1,18 +1,18 @@
 <article class="row project-tile">
-    <div class="col-9">
+    <div class="col-9 text-column">
         <h3>{{title}}</h3>
         <p>{{{description}}}</p>
     </div>
     <div class="col-3 image-column noselect">
         <img src="{{imageUrl}}" alt="{{title}}" draggable="false">
     </div>
-    <div class="col-9">
+    <div class="col-9 links-column">
         <div class="links noselect">
             {{#each links}}
             <a href="{{urlref url}}" role="button" class="outline" title="{{title}}" target="_blank"
                 rel="noopener noreferrer">{{title}}</a>
             {{/each}}
         </div>
     </div>
-    <div class="col-3 image-column noselect"></div>
+    <div class="col-3 empty-column noselect"></div>
 </article>
diff --git a/template/scss/_members.scss b/template/scss/_members.scss
@@ -1,5 +1,3 @@
-$memberImgHeightInMobile: 4em;
-
 section.members {
     padding-top: 3em;
     padding-bottom: 2.5em;
@@ -10,22 +8,13 @@ section.members {
         text-align: left;
     }
 
-    .member-column {
-        max-width: 46%;
-    }
-
     .github-member {
         padding: 0;
         margin: 0;
         margin-left: -0.75em;
         margin-right: -0.75em;
         transition: transform 250ms ease-in-out;
 
-        @media screen and (max-width: 992px) {
-            margin-left: unset;
-            margin-right: unset;
-        }
-
         &:hover {
             transform: translateY(-0.5em);
             z-index: 10;
@@ -54,36 +43,4 @@ section.members {
             font-weight: 400;
         }
     }
-
-    @media screen and (max-width: 720px) {
-        .github-member {
-            a {
-                display: flex;
-                flex-direction: row;
-            }
-
-            img {
-                border-top-left-radius: var(--border-radius);
-                border-top-right-radius: unset;
-                border-bottom-left-radius: var(--border-radius);
-                border-bottom-right-radius: unset;
-                aspect-ratio: 1 / 1;
-                height: $memberImgHeightInMobile;
-                width: auto;
-            }
-
-            .name {
-                display: flex;
-                flex-direction: column;
-                justify-content: center;
-                padding-left: 0.5em;
-                width: 100%;
-
-                p {
-                    text-align: left;
-                    max-width: calc(100% - 0.5em);
-                }
-            }
-        }
-    }
 }
diff --git a/template/scss/_page.scss b/template/scss/_page.scss
@@ -79,15 +79,3 @@ footer {
         text-align: center;
     }
 }
-
-@media screen and (max-width: 992px) {
-    section,
-    footer {
-        text-align: center !important;
-
-        .heading,
-        .heading + span {
-            text-align: center !important;
-        }
-    }
-}
diff --git a/template/scss/_projects.scss b/template/scss/_projects.scss
@@ -7,52 +7,33 @@ section.projects {
         padding: 1em 1em;
         margin-top: 2em;
         margin-bottom: 0;
-        transition: box-shadow 250ms ease-in-out, transform 250ms ease-in-out;
+        transition:
+            box-shadow 250ms ease-in-out,
+            transform 250ms ease-in-out;
 
         &:hover {
             transform: translateY(-0.25em);
             box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.5);
-
-            @media screen and (min-width: 720px) {
-                img {
-                    filter: drop-shadow(0.25em 0.25em 0.5rem black);
-                    transform: translate(-0.125em, calc(-50% - 0.25em));
-                }
-            }
         }
 
         img {
             max-width: 33%;
             margin-bottom: 2em;
             border-radius: 1em;
-            transition: filter 250ms ease-in-out, transform 250ms ease-in-out;
+            transition:
+                filter 250ms ease-in-out,
+                transform 250ms ease-in-out;
             will-change: filter;
-
-            @media screen and (min-width: 720px) {
-                &:hover {
-                    filter: drop-shadow(0.5em 0.5em 0.5rem black);
-                    transform: translate(-0.25em, calc(-50% - 0.5em));
-                }
-            }
-        }
-
-        @media screen and (min-width: 720px) {
-            img {
-                position: absolute;
-                top: 50%;
-                right: 2em;
-                width: 21%;
-                transform: translateY(-50%);
-            }
         }
 
         .links {
             display: flex;
             flex-direction: row;
             justify-content: center;
+            flex-wrap: wrap;
 
             a[role="button"] {
-                margin: 0 1em;
+                margin: 0.25em 1em;
                 padding: 0.25em 0.5em;
             }
         }