Refactor HTML to adjust background SVG size and position

bamcasa · Oct 14, 2024 · 5778cb8 · 5778cb8
1 parent 43f0058
commit 5778cb8
Showing 1 changed file with 8 additions and 2 deletions.
diff --git a/index.html b/index.html
@@ -66,12 +66,18 @@
     </header>
     <main>
         <section id="introduce">
-            <div style="position: absolute; top: -25%; left: 0; height: 148%; z-index: -1;">
-                <svg height="100%" viewBox="0 0 1440 1086" preserveAspectRatio="xMidYMid meet" fill="none"
+            <div style="position: absolute; top: -25%; left: 0; width: 100%; height: 100%; z-index: -1;">
+                <!-- <svg height="100%" viewBox="0 0 1440 1086" preserveAspectRatio="xMidYMid meet" fill="none"
                     xmlns="http://www.w3.org/2000/svg">
                     <path
                         d="M121.031 11.5739C-20.6278 -20.7702 -179.448 26.9467 -276.377 75.7385L-309 1019.58C-181.226 1079.91 121.031 1103.02 288.595 1050.91C434.697 1005.47 608.895 994.739 774.976 1063.74C941.057 1132.74 1184.67 1007.92 1364.42 1050.91C1655.06 1120.42 1729.94 940.694 1724.75 852.027V11.5739C1510.48 -30.594 1347.36 75.7385 1136.8 88.2365C926.228 100.734 910.658 11.5739 571.082 88.2365C333.68 141.832 289.522 50.0444 121.031 11.5739Z"
                         fill="white" stroke="#332C27" stroke-opacity="0.3" stroke-width="2" />
+                </svg> -->
+                <svg width="110%" height="148%" viewBox="0 0 4099 2965" preserveAspectRatio="none" fill="none"
+                    xmlns="http://www.w3.org/2000/svg">
+                    <path
+                        d="M815.028 29.8952C525.109 -58.491 200.07 71.904 1.69531 205.236L1.70015 2784.46C263.201 2949.31 815.028 3012.47 1157.96 2870.06C1456.97 2745.89 1813.48 2716.57 2153.38 2905.13C2493.28 3093.69 2991.87 2752.58 3359.73 2870.06C3954.55 3060.02 4107.81 2568.88 4097.19 2326.58V29.8952C3658.66 -85.3362 3324.83 205.236 2893.88 239.389C2462.94 273.542 2431.07 29.8952 1736.1 239.389C1250.23 385.849 1159.86 135.022 815.028 29.8952Z"
+                        fill="white" stroke="#332C27" stroke-opacity="0.3" stroke-width="2" />
                 </svg>
             </div>
             <div class="introduce-title">