hardcoded a method to align pictures in accomplishments page, PLEASEE…

…E FIXX ITS SO BAD
dominrios · Sep 27, 2024 · 35e4b1b · 35e4b1b
1 parent 1bacf11
commit 35e4b1b
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 9 deletions.
diff --git a/assets/sass/custom.scss b/assets/sass/custom.scss
@@ -284,6 +284,42 @@ $breakpoints: (
   }
 }
 
+// Handling Accomplishments styles 
+
+.AccomplishmentsRight {
+  flex: 0 0 30%; /* Adjust width as needed */
+  position: relative;
+}
+
+.AccomplishmentsRight .AccomplishmentFig {
+  position: absolute; /* Easier hard coding */
+}
+
+// Accomplishments sidebar with pictures hard coded
+#giving-control-to-smbs { top: 4em; }
+#getting-intelligent-with-the-grid { top: 22em; }
+#supporting-connected-communities { top: 50em}
+#connecting-home-appliances { top: 138em; }
+#creating-a-buildings-living-laboratory { top: 90em; }
+
+.AccomplishmentFig {
+  @extend .SidebarFig;
+  img {
+    max-width: 100%;
+    height: auto;
+    display: block;
+    margin: 0 auto;
+
+    @media (max-width: 1440px) {
+      max-width: 90%;
+    }
+
+    @media (max-width: 1024px) {
+      max-width: 80%;
+    }
+  }
+}
+
 
 .SidebarFig h4{
   font-size: 1vw;
@@ -436,7 +472,8 @@ a.imageLink{
 
 header {
   p {
-      color: _palette(fg-light);
+      // color: _palette(fg-light);
+      color: rgb(66, 66, 66);
       font-size: 1em;
       position: relative;
       margin-top: -1.25em;

diff --git a/layouts/partials/sidebar/AccomplishmentsRight.html b/layouts/partials/sidebar/AccomplishmentsRight.html
@@ -1,17 +1,21 @@
-<section>
-    <figure class="SidebarFig">
-            <img src='{{absURL "images/AccomplishmentsImages/smb.png"}}' >
+<section class="AccomplishmentsRight">
+    <figure class="AccomplishmentFig" id="giving-control-to-smbs">
+        <img src='{{absURL "images/AccomplishmentsImages/smb.png"}}' alt="SMB Image">
     </figure>
 
-    <figure class="SidebarFig">
+    <figure class="AccomplishmentFig" id="getting-intelligent-with-the-grid">
         <img src='{{absURL "images/AccomplishmentsImages/ILC.png"}}' >
     </figure>
 
-    <figure class="SidebarFig" style="max-width: 90%;">
-        <img src='{{absURL "images/AccomplishmentsImages/EED_1787_FIG_HomesGraphicRev_v7_1600x1200 (1).png"}}' >
+    <figure class="AccomplishmentFig" id="supporting-connected-communities">
+        <img src='{{absURL "images/AccomplishmentsImages/supporting_connected_communites_brandon_jacoby.jpg"}}' >
     </figure>
 
-    <figure class="SidebarFig" style="max-width: 90%;">
+    <figure class="AccomplishmentFig" id="connecting-home-appliances" style="max-width: 90%;">
+        <img src='{{absURL "images/AccomplishmentsImages/EED_1787_FIG_HomesGraphicRev_v7_1600x1200 (1).png"}}' alt="Homes Graphic">
+    </figure>
+
+    <figure class="AccomplishmentFig" id="creating-a-buildings-living-laboratory" style="max-width: 90%;">
         <img src='{{absURL "images/AccomplishmentsImages/campus_2.png"}}' >
     </figure>
 </section>
diff --git a/resources/_gen/assets/scss/sass/main.scss_e95820d474fe7cf9c38afe1151187c97.content b/resources/_gen/assets/scss/sass/main.scss_e95820d474fe7cf9c38afe1151187c97.content
diff --git a/...images/AccomplishmentsImages/supporting_connected_communites_brandon_jacoby.jpg b/...images/AccomplishmentsImages/supporting_connected_communites_brandon_jacoby.jpg