visual polish for backgrounds and featured images

assets/css/compiled/main.css

@@ -1960,6 +1960,10 @@ input[type="range"]:active::-webkit-slider-thumb {
   min-height:0px
 }
 
+.min-h-\[130px\] {
+  min-height:130px
+}
+
 .min-h-\[148px\] {
   min-height:148px
 }
@@ -2552,6 +2556,10 @@ input[type="range"]:active::-webkit-slider-thumb {
   --tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)
 }
 
+.from-60\% {
+  --tw-gradient-from-position:60%
+}
+
 .to-neutral {
   --tw-gradient-to:rgba(var(--color-neutral), 1) var(--tw-gradient-to-position)
 }
@@ -3066,6 +3074,10 @@ input[type="range"]:active::-webkit-slider-thumb {
   opacity:0.6
 }
 
+.opacity-65 {
+  opacity:0.65
+}
+
 .mix-blend-normal {
   mix-blend-mode:normal
 }

assets/img/background.svg

@@ -1 +1 @@
-<svg id='patternId' width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'><defs><pattern id='a' patternUnits='userSpaceOnUse' width='20' height='20' patternTransform='scale(5) rotate(0)'><rect x='0' y='0' width='100%' height='100%' fill='hsla(0,0%,100%,1)'/><path d='M0-10C-.011-4.49-4.485.03-10 .03-4.485.03-.011 4.49 0 10 .011 4.498 4.493.001 10-.01 4.493-.02.012-4.498 0-10zm0 20c-.011 5.51-4.485 10.03-10 10.03 5.515 0 9.989 4.46 10 9.97.011-5.502 4.493-9.999 10-10.01C4.493 19.98.012 15.502 0 10zm20-20C19.989-4.49 15.515.03 10 .03c5.515 0 9.989 4.46 10 9.97.011-5.502 4.493-9.999 10-10.01-5.507-.01-9.988-4.488-10-9.99zm0 20c-.011 5.51-4.485 10.03-10 10.03 5.515 0 9.989 4.46 10 9.97.011-5.502 4.493-9.999 10-10.01-5.507-.01-9.988-4.488-10-9.99z'  stroke-width='1' stroke='hsla(258.5,59.4%,59.4%,1)' fill='none'/><path d='M10 0C9.989 5.51 5.515 10.03 0 10.03c5.515 0 9.989 4.46 10 9.97.011-5.502 4.493-9.998 10-10.01-5.507-.01-9.988-4.488-10-9.99z'  stroke-width='1' stroke='hsla(339.6,82.2%,51.6%,1)' fill='none'/></pattern></defs><rect width='800%' height='800%' transform='translate(0,0)' fill='url(#a)'/></svg>
+<svg height="100%" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.dev/svgjs" viewBox="0 0 1800 2400"><rect width="1800" height="2400" fill="transparent"></rect><mask id="mask" mask-type="alpha" maskUnits="userSpaceOnUse"><rect transform="translate(0, 0)" width="1800" height="2400" fill="white"></rect></mask><svg><path transform="translate(0, 240) translate(30,30) rotate(90) translate(-30,-30)" fill="#ade8f4" fill-rule="evenodd" d="M59.5 11.218V7.74A59.602 59.602 0 0037.782.5H22.218A59.602 59.602 0 00.5 7.74v3.478C9.106 6.002 19.202 3 30 3c10.798 0 20.894 3.002 29.5 8.218zm0 8.408A49.775 49.775 0 0030 10 49.775 49.775 0 00.5 19.626v3.783A46.803 46.803 0 0130 13a46.803 46.803 0 0129.5 10.409v-3.783zm0 13.36C52.187 25.004 41.678 20 30 20S7.813 25.004.5 32.986v4.678C7.256 28.754 17.956 23 30 23s22.744 5.755 29.5 14.664v-4.678zm0 21.53C56.923 40.567 44.696 30 30 30S3.077 40.566.5 54.517V59.5h2.505C3.27 44.819 15.255 33 30 33c14.745 0 26.729 11.819 26.995 26.5H59.5v-4.983zM49.994 59.5C49.728 48.685 40.879 40 30 40c-10.878 0-19.729 8.685-19.994 19.5h3.001C13.272 50.342 20.778 43 30 43c9.222 0 16.728 7.342 16.993 16.5h3zm-10.006 0C39.728 54.21 35.355 50 30 50c-5.355 0-9.727 4.21-9.988 9.5h3.006a7 7 0 0113.964 0h3.006z" clip-rule="evenodd"></path></svg><svg><path transform="translate(0, 360) translate(30,30) rotate(180) translate(-30,-30)" fill="#023e8a" fill-rule="evenodd" d="M59.5 11.218V7.74A59.602 59.602 0 0037.782.5H22.218A59.602 59.602 0 00.5 7.74v3.478C9.106 6.002 19.202 3 30 3c10.798 0 20.894 3.002 29.5 8.218zm0 8.408A49.775 49.775 0 0030 10 49.775 49.775 0 00.5 19.626v3.783A46.803 46.803 0 0130 13a46.803 46.803 0 0129.5 10.409v-3.783zm0 13.36C52.187 25.004 41.678 20 30 20S7.813 25.004.5 32.986v4.678C7.256 28.754 17.956 23 30 23s22.744 5.755 29.5 14.664v-4.678zm0 21.53C56.923 40.567 44.696 30 30 30S3.077 40.566.5 54.517V59.5h2.505C3.27 44.819 15.255 33 30 33c14.745 0 26.729 11.819 26.995 26.5H59.5v-4.983zM49.994 59.5C49.728 48.685 40.879 40 30 40c-10.878 0-19.729 8.685-19.994 19.5h3.001C13.272 50.342 20.778 43 30 43c9.222 0 16.728 7.342 16.993 16.5h3zm-10.006 0C39.728 54.21 35.355 50 30 50c-5.355 0-9.727 4.21-9.988 9.5h3.006a7 7 0 0113.964 0h3.006z" clip-rule="evenodd"></path></svg><svg><path transform="translate(0, 720) translate(30,30) rotate(90) translate(-30,-30)" fill="#00b4d8" d="M11.122.5h-4.6A80.499 80.499 0 00.5 6.522v4.6A77.464 77.464 0 0111.122.5zM.5 29.168v-6.061A70.364 70.364 0 0123.107.5h6.06A67.297 67.297 0 00.5 29.168z"></path><path transform="translate(0, 720) translate(30,30) rotate(90) translate(-30,-30)" fill="#00b4d8" d="M3.002 59.5H.5v-7.282C3.985 25.305 25.305 3.985 52.218.5H59.5v2.502C28.416 3.27 3.27 28.417 3.002 59.5z"></path><path transform="translate(0, 720) translate(30,30) rotate(90) translate(-30,-30)" fill="#00b4d8" d="M13.003 59.5h-3c.266-27.218 22.28-49.23 49.497-49.498v3C33.94 13.27 13.269 33.94 13.003 59.5z"></path><path transform="translate(0, 720) translate(30,30) rotate(90) translate(-30,-30)" fill="#00b4d8" d="M23.003 59.5h-3C20.27 37.805 37.805 20.269 59.5 20.003v3c-20.038.266-36.231 16.46-36.497 36.497z"></path><path transform="translate(0, 720) translate(30,30) rotate(90) translate(-30,-30)" fill="#00b4d8" d="M33.005 59.5h-3c.263-16.172 13.323-29.232 29.495-29.496v3c-14.515.264-26.232 11.981-26.495 26.496z"></path><path transform="translate(0, 720) translate(30,30) rotate(90) translate(-30,-30)" fill="#00b4d8" d="M43.007 59.5h-3c.26-10.648 8.845-19.233 19.493-19.494v3.001c-8.992.26-16.233 7.502-16.493 16.493zM53.018 59.5h-3.006a10 10 0 019.488-9.488v3.006a7.001 7.001 0 00-6.482 6.482z"></path></svg><svg><path transform="translate(0, 1080) translate(30,30) rotate(90) translate(-30,-30)" fill="#023e8a" fill-rule="evenodd" d="M5.072.5H.83L.5.83v4.242L5.072.5zM.5 19.214v-4.242L14.972.5h4.242L.5 19.214zm0 14.142v-4.242L29.114.5h4.242L.5 33.356zM.5 47.5v-4.243L43.256.5H47.5L.5 47.499zM2.64 59.5H.5v-2.102L57.398.5H59.5v2.14L2.64 59.5zm14.143 0H12.54L59.5 12.54v4.243L16.783 59.5zm14.142 0h-4.242L59.5 26.683v4.242L30.925 59.5zm14.142 0h-4.242L59.5 40.825v4.242L45.067 59.5zm14.143 0h-4.243l4.533-4.533v4.243l-.29.29z" clip-rule="evenodd"></path></svg><svg><path transform="translate(0, 1140) translate(30,30) rotate(270) translate(-30,-30)" fill="#023e8a" d="M11.122.5h-4.6A80.499 80.499 0 00.5 6.522v4.6A77.464 77.464 0 0111.122.5zM.5 29.168v-6.061A70.364 70.364 0 0123.107.5h6.06A67.297 67.297 0 00.5 29.168z"></path><path transform="translate(0, 1140) translate(30,30) rotate(270) translate(-30,-30)" fill="#023e8a" d="M3.002 59.5H.5v-7.282C3.985 25.305 25.305 3.985 52.218.5H59.5v2.502C28.416 3.27 3.27 28.417 3.002 59.5z"></path><path transform="translate(0, 1140) translate(30,30) rotate(270) translate(-30,-30)" fill="#023e8a" d="M13.003 59.5h-3c.266-27.218 22.28-49.23 49.497-49.498v3C33.94 13.27 13.269 33.94 13.003 59.5z"></path><path transform="translate(0, 1140) translate(30,30) rotate(270) translate(-30,Line truncated

assets/img/featured.svg

@@ -1,17 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin:auto;background:#3b4368;display:block;z-index:1;position:relative" width="1582" height="1111" preserveAspectRatio="xMidYMid" viewBox="0 0 1582 1111">
-	<g transform="translate(791,555.5) scale(1,1) translate(-791,-555.5)"><style type="text/css">
-	  @keyframes ld-speed-dash {
-		0% { transform: translate(0,-2464.6958125499095px); }
-		100% { transform: translate(0,2464.6958125499095px); }
-	  }
-	  .ld.ld-speed-dash {
-		animation: ld-speed-dash 7.142857142857142s linear infinite;
-	  }
-	</style>
-	  <g transform="translate(791,555.5)">
-		<g style="transform:rotate(43deg)">
-		  <line x1="-676.6418026534932" x2="-676.6418026534932" y1="0" y2="-194.39540631204278" stroke="#93dbe9" stroke-width="0.6295285656579673" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.389502111141189s;animation-duration:7.142857142857142s"></line><line x1="43.51802855495919" x2="43.51802855495919" y1="0" y2="-479.7390564623147" stroke="#689cc5" stroke-width="9.295812828787726" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.877132071825148s;animation-duration:3.571428571428571s"></line><line x1="626.5923053314896" x2="626.5923053314896" y1="0" y2="-219.35083732211598" stroke="#93dbe9" stroke-width="5.934061429630836" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.802916019246382s;animation-duration:3.571428571428571s"></line><line x1="693.3887474602818" x2="693.3887474602818" y1="0" y2="-353.885017175175" stroke="#689cc5" stroke-width="1.5583327638463147" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.081751830546393s;animation-duration:3.571428571428571s"></line><line x1="-149.24401571712139" x2="-149.24401571712139" y1="0" y2="-501.46189003628007" stroke="#93dbe9" stroke-width="5.593648024254009" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.37301937730858s;animation-duration:7.142857142857142s"></line><line x1="-180.91803588468028" x2="-180.91803588468028" y1="0" y2="-387.92571359780965" stroke="#689cc5" stroke-width="6.655978640832191" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.5070117594809345s;animation-duration:3.571428571428571s"></line><line x1="-687.6191601478673" x2="-687.6191601478673" y1="0" y2="-187.8523342000605" stroke="#93dbe9" stroke-width="7.721637892706112" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.032287518246949s;animation-duration:3.571428571428571s"></line><line x1="775.1845302890896" x2="775.1845302890896" y1="0" y2="-322.29888221052033" stroke="#689cc5" stroke-width="3.5743946872648036" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.119777815086244s;animation-duration:3.571428571428571s"></line><line x1="-399.5718358470655" x2="-399.5718358470655" y1="0" y2="-436.95464507332787" stroke="#689cc5" stroke-width="9.523895265592476" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -6.759390587699631s;animation-duration:7.142857142857142s"></line><line x1="-321.34245367943464" x2="-321.34245367943464" y1="0" y2="-218.84668892843277" stroke="#93dbe9" stroke-width="7.939758452517274" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.769924882580759s;animation-duration:7.142857142857142s"></line><line x1="-409.3965203152943" x2="-409.3965203152943" y1="0" y2="-455.90206414934033" stroke="#689cc5" stroke-width="2.4661144958265786" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.737311627388115s;animation-duration:7.142857142857142s"></line><line x1="575.3953084259903" x2="575.3953084259903" y1="0" y2="-382.1379996245774" stroke="#93dbe9" stroke-width="3.7454059974933505" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.272291858293084s;animation-duration:3.571428571428571s"></line><line x1="758.12625813818" x2="758.12625813818" y1="0" y2="-216.46199481406128" stroke="#689cc5" stroke-width="6.458943945803399" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.288698802029718s;animation-duration:3.571428571428571s"></line><line x1="656.0718534685203" x2="656.0718534685203" y1="0" y2="-307.9598929199723" stroke="#689cc5" stroke-width="5.48210566809726" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.946043626672467s;animation-duration:3.571428571428571s"></line><line x1="-559.7478826337234" x2="-559.7478826337234" y1="0" y2="-241.52898616232395" stroke="#93dbe9" stroke-width="0.5905463289914558" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.0510103928085752s;animation-duration:3.571428571428571s"></line><line x1="642.1418391845447" x2="642.1418391845447" y1="0" y2="-177.2109608247487" stroke="#93dbe9" stroke-width="4.110729150021574" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.8691696862351168s;animation-duration:7.142857142857142s"></line><line x1="-616.8575036735665" x2="-616.8575036735665" y1="0" y2="-432.35227410997396" stroke="#689cc5" stroke-width="7.011129027079976" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.1068362774456575s;animation-duration:7.142857142857142s"></line><line x1="-70.2632544830263" x2="-70.2632544830263" y1="0" y2="-324.7323961941628" stroke="#689cc5" stroke-width="9.114233055075125" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.4703326641779286s;animation-duration:7.142857142857142s"></line><line x1="-176.8596432293476" x2="-176.8596432293476" y1="0" y2="-233.44418810Line truncated
-		</g>
-	  </g>
-	</g>
-	</svg>
+<svg height="100%" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.dev/svgjs" viewBox="0 0 600 600"><rect width="600" height="600" fill="transparent"></rect><mask id="mask" mask-type="alpha" maskUnits="userSpaceOnUse"><rect transform="translate(0, 0)" width="600" height="600" fill="white"></rect></mask><svg><path transform="translate(0, 0) translate(30,30) rotate(180) translate(-30,-30)" fill="#0077b6" fill-rule="evenodd" d="M5.072.5H.83L.5.83v4.242L5.072.5zM.5 19.214v-4.242L14.972.5h4.242L.5 19.214zm0 14.142v-4.242L29.114.5h4.242L.5 33.356zM.5 47.5v-4.243L43.256.5H47.5L.5 47.499zM2.64 59.5H.5v-2.102L57.398.5H59.5v2.14L2.64 59.5zm14.143 0H12.54L59.5 12.54v4.243L16.783 59.5zm14.142 0h-4.242L59.5 26.683v4.242L30.925 59.5zm14.142 0h-4.242L59.5 40.825v4.242L45.067 59.5zm14.143 0h-4.243l4.533-4.533v4.243l-.29.29z" clip-rule="evenodd"></path></svg><svg><path transform="translate(0, 60) translate(30,30) rotate(180) translate(-30,-30)" fill="#90e0ef" fill-rule="evenodd" d="M8.5.5h3v59h-3V.5zM18.5.5h3v59h-3V.5zM31.5.5h-3v59h3V.5zM38.5.5h3v59h-3V.5zM51.5.5h-3v59h3V.5z" clip-rule="evenodd"></path></svg><svg><path transform="translate(0, 120) translate(30,30) rotate(270) translate(-30,-30)" fill="#ade8f4" fill-rule="evenodd" d="M5.072.5H.83L.5.83v4.242L5.072.5zM.5 19.214v-4.242L14.972.5h4.242L.5 19.214zm0 14.142v-4.242L29.114.5h4.242L.5 33.356zM.5 47.5v-4.243L43.256.5H47.5L.5 47.499zM2.64 59.5H.5v-2.102L57.398.5H59.5v2.14L2.64 59.5zm14.143 0H12.54L59.5 12.54v4.243L16.783 59.5zm14.142 0h-4.242L59.5 26.683v4.242L30.925 59.5zm14.142 0h-4.242L59.5 40.825v4.242L45.067 59.5zm14.143 0h-4.243l4.533-4.533v4.243l-.29.29z" clip-rule="evenodd"></path></svg><svg><path transform="translate(0, 180) translate(30,30) rotate(0) translate(-30,-30)" fill="#023e8a" fill-rule="evenodd" d="M59.5 11.218V7.74A59.602 59.602 0 0037.782.5H22.218A59.602 59.602 0 00.5 7.74v3.478C9.106 6.002 19.202 3 30 3c10.798 0 20.894 3.002 29.5 8.218zm0 8.408A49.775 49.775 0 0030 10 49.775 49.775 0 00.5 19.626v3.783A46.803 46.803 0 0130 13a46.803 46.803 0 0129.5 10.409v-3.783zm0 13.36C52.187 25.004 41.678 20 30 20S7.813 25.004.5 32.986v4.678C7.256 28.754 17.956 23 30 23s22.744 5.755 29.5 14.664v-4.678zm0 21.53C56.923 40.567 44.696 30 30 30S3.077 40.566.5 54.517V59.5h2.505C3.27 44.819 15.255 33 30 33c14.745 0 26.729 11.819 26.995 26.5H59.5v-4.983zM49.994 59.5C49.728 48.685 40.879 40 30 40c-10.878 0-19.729 8.685-19.994 19.5h3.001C13.272 50.342 20.778 43 30 43c9.222 0 16.728 7.342 16.993 16.5h3zm-10.006 0C39.728 54.21 35.355 50 30 50c-5.355 0-9.727 4.21-9.988 9.5h3.006a7 7 0 0113.964 0h3.006z" clip-rule="evenodd"></path></svg><svg><path transform="translate(0, 240) translate(30,30) rotate(0) translate(-30,-30)" fill="#48cae4" fill-rule="evenodd" d="M8.5.5h3v59h-3V.5zM18.5.5h3v59h-3V.5zM31.5.5h-3v59h3V.5zM38.5.5h3v59h-3V.5zM51.5.5h-3v59h3V.5z" clip-rule="evenodd"></path></svg><svg><path transform="translate(0, 300) translate(30,30) rotate(270) translate(-30,-30)" fill="#03045e" d="M11.122.5h-4.6A80.499 80.499 0 00.5 6.522v4.6A77.464 77.464 0 0111.122.5zM.5 29.168v-6.061A70.364 70.364 0 0123.107.5h6.06A67.297 67.297 0 00.5 29.168z"></path><path transform="translate(0, 300) translate(30,30) rotate(270) translate(-30,-30)" fill="#03045e" d="M3.002 59.5H.5v-7.282C3.985 25.305 25.305 3.985 52.218.5H59.5v2.502C28.416 3.27 3.27 28.417 3.002 59.5z"></path><path transform="translate(0, 300) translate(30,30) rotate(270) translate(-30,-30)" fill="#03045e" d="M13.003 59.5h-3c.266-27.218 22.28-49.23 49.497-49.498v3C33.94 13.27 13.269 33.94 13.003 59.5z"></path><path transform="translate(0, 300) translate(30,30) rotate(270) translate(-30,-30)" fill="#03045e" d="M23.003 59.5h-3C20.27 37.805 37.805 20.269 59.5 20.003v3c-20.038.266-36.231 16.46-36.497 36.497z"></path><path transform="translate(0, 300) translate(30,30) rotate(270) translate(-30,-30)" fill="#03045e" d="M33.005 59.5h-3c.263-16.172 13.323-29.232 29.495-29.496v3c-14.515.264-26.232 11.981-26.495 26.496z"></path><path transform="translate(0, 300) translate(30,30) rotate(270) translate(-30,-30)" fill="#03045e" d="M43.007 59.5h-3c.26-10.648 8.845-19.233 19.493-19.494v3.001c-8.992.26-16.233 7.502-16.493 16.493zM53.018 59.5h-3.006a10 10 0 019.488-9.488v3.006a7.001 7.001 0 00-6.482 6.482z"></path></svg><svg><path transform="translate(0, 360) translate(30,30) rotate(0) translate(-30,-30)" fill="#023e8a" fill-rule="evenodd" d="M59.5 11.218V7.74A59.602 59.602 0 0037.782.5H22.218A59.602 59.602 0 00.5 7.74v3.478C9.106 6.002 19.202 3 30 3c10.798 0 20.894 3.002 29.5 8.218zm0 8.408A49.775 49.775 0 0030 10 49.775 49.775 0 00.5 19.626v3.783A46.803 46.803 0 0130 13a46.803 46.803 0 0129.5 10.409v-3.783zm0 13.36C52.187 25.004 41.678 20 30 20S7.813 25.004.5 32.986v4.678C7.256 28.754 17.956 23 30 23s22.744 5.755 29.5 14.664v-4.678zm0 21.53C56.923 40.567 44.696 30 30 30S3.077 40.566.5 54.517V59.5h2.505C3.27 44.819 15.255 33 30 33c14.745 0 26.729 11.819 26.995 26.5H59.5v-4.9Line truncated

assets/img/gradient.svg

@@ -1,17 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin:auto;background:rgba(NaN, NaN, NaN, 0);display:block;z-index:1;position:relative" width="1582" height="1111" preserveAspectRatio="xMidYMid" viewBox="0 0 1582 1111">
-	<g transform="translate(791,555.5) scale(1,1) translate(-791,-555.5)"><style type="text/css">
-	  @keyframes ld-speed-dash {
-		0% { transform: translate(0,-2464.6958125499095px); }
-		100% { transform: translate(0,2464.6958125499095px); }
-	  }
-	  .ld.ld-speed-dash {
-		animation: ld-speed-dash 7.142857142857142s linear infinite;
-	  }
-	</style>
-	  <g transform="translate(791,555.5)">
-		<g style="transform:rotate(43deg)">
-		  <line x1="257.5470693585687" x2="257.5470693585687" y1="0" y2="-466.00265205148384" stroke="#689cc5" stroke-width="0.13851424099622403" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.678072204374443s;animation-duration:7.142857142857142s"></line><line x1="-379.29581238232714" x2="-379.29581238232714" y1="0" y2="-403.1104808558905" stroke="#93dbe9" stroke-width="8.774605103307184" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.7402193813517286s;animation-duration:7.142857142857142s"></line><line x1="691.0288038403479" x2="691.0288038403479" y1="0" y2="-181.75501061996493" stroke="#93dbe9" stroke-width="9.153921055895587" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.8074687908257s;animation-duration:7.142857142857142s"></line><line x1="-463.1804970441312" x2="-463.1804970441312" y1="0" y2="-228.59736322364085" stroke="#689cc5" stroke-width="9.234275564789872" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.788229963010811s;animation-duration:3.571428571428571s"></line><line x1="-464.04538295320936" x2="-464.04538295320936" y1="0" y2="-519.9017794124818" stroke="#93dbe9" stroke-width="7.462034170716894" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -0.37207936677350334s;animation-duration:7.142857142857142s"></line><line x1="-487.593847951914" x2="-487.593847951914" y1="0" y2="-404.6563472681459" stroke="#689cc5" stroke-width="6.691909248099436" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -0.5656697681407783s;animation-duration:3.571428571428571s"></line><line x1="770.04343191477" x2="770.04343191477" y1="0" y2="-475.5238816860255" stroke="#689cc5" stroke-width="7.6374433539151285" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -6.807628686518848s;animation-duration:7.142857142857142s"></line><line x1="741.894772937468" x2="741.894772937468" y1="0" y2="-478.1736626778009" stroke="#93dbe9" stroke-width="1.6442643372630033" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.3812815750665934s;animation-duration:7.142857142857142s"></line><line x1="-355.8373723126413" x2="-355.8373723126413" y1="0" y2="-500.7374221621392" stroke="#689cc5" stroke-width="4.968370927286826" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.576249995556752s;animation-duration:7.142857142857142s"></line><line x1="650.5745774737413" x2="650.5745774737413" y1="0" y2="-249.2269408639838" stroke="#93dbe9" stroke-width="6.875128275392444" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -3.2987389353018766s;animation-duration:3.571428571428571s"></line><line x1="-447.38279325342063" x2="-447.38279325342063" y1="0" y2="-438.54757515486233" stroke="#93dbe9" stroke-width="0.32234732526751003" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.5873776828471255s;animation-duration:7.142857142857142s"></line><line x1="-773.1023969408594" x2="-773.1023969408594" y1="0" y2="-265.89694750164693" stroke="#93dbe9" stroke-width="2.028719891037894" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.2047623886485646s;animation-duration:7.142857142857142s"></line><line x1="609.2041654976148" x2="609.2041654976148" y1="0" y2="-245.65757561464068" stroke="#689cc5" stroke-width="3.5816433079046046" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.8137434167323923s;animation-duration:7.142857142857142s"></line><line x1="-666.3772521370174" x2="-666.3772521370174" y1="0" y2="-392.29504082671497" stroke="#689cc5" stroke-width="5.871298148124787" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -5.271461071819312s;animation-duration:7.142857142857142s"></line><line x1="192.43268395152504" x2="192.43268395152504" y1="0" y2="-414.1240069817346" stroke="#689cc5" stroke-width="4.846905698440716" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.6359555443076155s;animation-duration:7.142857142857142s"></line><line x1="464.00348454267845" x2="464.00348454267845" y1="0" y2="-209.20552478093458" stroke="#93dbe9" stroke-width="0.7741111459700352" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -1.5581082604518324s;animation-duration:3.571428571428571s"></line><line x1="126.33292424079058" x2="126.33292424079058" y1="0" y2="-314.7556419440714" stroke="#93dbe9" stroke-width="5.88704873215512" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -4.643995515676361s;animation-duration:3.571428571428571s"></line><line x1="-767.0931203837769" x2="-767.0931203837769" y1="0" y2="-191.8265145537367" stroke="#93dbe9" stroke-width="7.171909048483214" stroke-linecap="round" class="ld ld-speed-dash" style="animation-delay: -2.896526837915051s;animation-duration:3.571428571428571s"></line><line x1="-677.434057525354" x2="-677.434057525354" y1="0" y2="-174.830Line truncated
-		</g>
-	  </g>
-	</g>
-	</svg>

config/_default/params.toml

@@ -26,7 +26,7 @@ disableTextInHeader = false
 # smartTOCHideUnfocusedChildren = true
 
 [header]
-  layout = "basic" # valid options: basic, fixed, fixed-fill, fixed-fill-blur
+  layout = "basic" # valid options: basic, fixed, fixed-fill, fixed-gradient, fixed-fill-blur
 
 [footer]
   showMenu = true

exampleSite/config/_default/languages.en.toml

@@ -10,14 +10,14 @@ title = "Blowfish"
   dateFormat = "2 January 2006"
   logo = "img/blowfish_logo_transparent.png"
   # secondaryLogo = "PATH"
-  description = "A powerful, lightweight theme for Hugo built with Tailwind CSS."
+  description = "A powerful, lightweight theme for Hugo."
   # copyright = "Copy, _right?_ :thinking_face:"
 
 [author]
   name = "Blowfish"
   image = "img/blowfish_logo.png"
-  headline = "A powerful, lightweight theme for Hugo built with Tailwind CSS."
-  bio = "A powerful, lightweight theme for Hugo built with Tailwind CSS."
+  headline = "A powerful, lightweight theme for Hugo."
+  bio = "A powerful, lightweight theme for Hugo."
   links = [
     { x-twitter = "https://twitter.com/burufugu" },
     #{ mastodon = "https://masto.ai/@blowfish" },

exampleSite/config/_default/params.toml

@@ -18,15 +18,15 @@ mainSections = ["docs"]
 disableImageOptimization = false
 disableTextInHeader = false
 
-defaultBackgroundImage = "/img/gradient.svg"
-defaultFeaturedImage = "/img/ocean.jpg"
+defaultBackgroundImage = "/img/background.svg"
+defaultFeaturedImage = "/img/featured.svg"
 
 highlightCurrentMenuArea = true
 smartTOC = true
 smartTOCHideUnfocusedChildren = false
 
 [header]
-  layout = "fixed" # valid options: basic, fixed, fixed-fill, fixed-fill-blur
+  layout = "fixed-gradient" # valid options: basic, fixed, fixed-fill, fixed-gradient, fixed-fill-blur
 
 [footer]
   showMenu = true

exampleSite/content/_index.md

@@ -3,18 +3,12 @@ title: "Welcome to Blowfish! :tada:"
 description: "This page was built using the Blowfish theme for Hugo."
 ---
 
-Welcome to Blowfish, one of the most flexible and robust Hugo themes. It is designed to be simple, fast and content-focused. Learn more about how to install [here]({{< ref "docs/installation" >}}) or get started with our CLI using:
-
 ```node
 npx blowfish-tools
 ```  
 
 {{< youtubeLite id="SgXhGb-7QbU" label="Blowfish-tools demo" >}}
 
-<!--You can also find the complete theme documentation in [docs]({{< ref "docs" >}}). Blowfish is highly customizable and can be configured to fit your needs: from a static website to a blog. Checkout some [examples](/examples) and what some of our [users](/users) have been building.
-
-Explore the [shortcode list]({{< ref "docs/shortcodes" >}}) and [sample pages]({{< ref "samples" >}}) to get a feel for what Blowfish can do. If you like what you see, check out the project on <a target="_blank" href="https://github.com/nunocoracao/blowfish">Github</a> or read the [Installation guide]({{< ref "docs/installation" >}}) to get started.-->
-
 <div class="flex px-4 py-2 mb-8 text-base rounded-md bg-primary-100 dark:bg-primary-900">
   <span class="flex items-center ltr:pr-3 rtl:pl-3 text-primary-400">
     {{< icon "triangle-exclamation" >}}

exampleSite/content/docs/installation/featured.svg

@@ -0,0 +1 @@
+<svg id="canvas" height="100%" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.dev/svgjs" viewBox="0 0 540 420"><rect width="540" height="420" fill="transparent"></rect><mask id="mask" mask-type="alpha" maskUnits="userSpaceOnUse"><rect transform="translate(0, 0)" width="540" height="420" fill="white"></rect></mask><g name="doubleStripes" mask="url(#mask)" mix-blend-mode="multiply"><rect transform="translate(0, 0) rotate(90)" width="60" height="120" fill="none"></rect><path transform="translate(0, 0) rotate(90)" fill="#023e8a" d="M48.0004 120.462H52.0004L52.0004 0.461672L48.0004 0.461672L48.0004 120.462Z"></path><path transform="translate(0, 0) rotate(90)" fill="#023e8a" d="M38.0004 0.461671L38.0004 120.462H42.0004L42.0004 0.461671L38.0004 0.461671Z"></path><path transform="translate(0, 0) rotate(90)" fill="#023e8a" d="M28.0004 0.461671L32.0004 0.461671L32.0004 120.462H28.0004L28.0004 0.461671Z"></path><path transform="translate(0, 0) rotate(90)" fill="#023e8a" d="M18.0004 0.46167L18.0004 120.462H22.0004L22.0004 0.461671L18.0004 0.46167Z"></path><path transform="translate(0, 0) rotate(90)" fill="#023e8a" d="M8.00037 0.46167L8.00037 120.462H12.0004L12.0004 0.46167L8.00037 0.46167Z"></path></g><g name="doubleStripes" mask="url(#mask)" mix-blend-mode="multiply"><rect transform="translate(0, 60) rotate(90)" width="60" height="120" fill="none"></rect><path transform="translate(0, 60) rotate(90)" fill="#caf0f8" d="M48.0004 120.462H52.0004L52.0004 0.461672L48.0004 0.461672L48.0004 120.462Z"></path><path transform="translate(0, 60) rotate(90)" fill="#caf0f8" d="M38.0004 0.461671L38.0004 120.462H42.0004L42.0004 0.461671L38.0004 0.461671Z"></path><path transform="translate(0, 60) rotate(90)" fill="#caf0f8" d="M28.0004 0.461671L32.0004 0.461671L32.0004 120.462H28.0004L28.0004 0.461671Z"></path><path transform="translate(0, 60) rotate(90)" fill="#caf0f8" d="M18.0004 0.46167L18.0004 120.462H22.0004L22.0004 0.461671L18.0004 0.46167Z"></path><path transform="translate(0, 60) rotate(90)" fill="#caf0f8" d="M8.00037 0.46167L8.00037 120.462H12.0004L12.0004 0.46167L8.00037 0.46167Z"></path></g><g name="doubleStripes" mask="url(#mask)" mix-blend-mode="multiply"><rect transform="translate(0, 120) rotate(0)" width="60" height="120" fill="none"></rect><path transform="translate(0, 120) rotate(0)" fill="#023e8a" d="M48.0004 120.462H52.0004L52.0004 0.461672L48.0004 0.461672L48.0004 120.462Z"></path><path transform="translate(0, 120) rotate(0)" fill="#023e8a" d="M38.0004 0.461671L38.0004 120.462H42.0004L42.0004 0.461671L38.0004 0.461671Z"></path><path transform="translate(0, 120) rotate(0)" fill="#023e8a" d="M28.0004 0.461671L32.0004 0.461671L32.0004 120.462H28.0004L28.0004 0.461671Z"></path><path transform="translate(0, 120) rotate(0)" fill="#023e8a" d="M18.0004 0.46167L18.0004 120.462H22.0004L22.0004 0.461671L18.0004 0.46167Z"></path><path transform="translate(0, 120) rotate(0)" fill="#023e8a" d="M8.00037 0.46167L8.00037 120.462H12.0004L12.0004 0.46167L8.00037 0.46167Z"></path></g><g name="doubleStripes" mask="url(#mask)" mix-blend-mode="multiply"><rect transform="translate(0, 180) rotate(90)" width="60" height="120" fill="none"></rect><path transform="translate(0, 180) rotate(90)" fill="#0096c7" d="M48.0004 120.462H52.0004L52.0004 0.461672L48.0004 0.461672L48.0004 120.462Z"></path><path transform="translate(0, 180) rotate(90)" fill="#0096c7" d="M38.0004 0.461671L38.0004 120.462H42.0004L42.0004 0.461671L38.0004 0.461671Z"></path><path transform="translate(0, 180) rotate(90)" fill="#0096c7" d="M28.0004 0.461671L32.0004 0.461671L32.0004 120.462H28.0004L28.0004 0.461671Z"></path><path transform="translate(0, 180) rotate(90)" fill="#0096c7" d="M18.0004 0.46167L18.0004 120.462H22.0004L22.0004 0.461671L18.0004 0.46167Z"></path><path transform="translate(0, 180) rotate(90)" fill="#0096c7" d="M8.00037 0.46167L8.00037 120.462H12.0004L12.0004 0.46167L8.00037 0.46167Z"></path></g><g name="doubleStripes" mask="url(#mask)" mix-blend-mode="multiply"><rect transform="translate(0, 240) rotate(0)" width="60" height="120" fill="none"></rect><path transform="translate(0, 240) rotate(0)" fill="#90e0ef" d="M48.0004 120.462H52.0004L52.0004 0.461672L48.0004 0.461672L48.0004 120.462Z"></path><path transform="translate(0, 240) rotate(0)" fill="#90e0ef" d="M38.0004 0.461671L38.0004 120.462H42.0004L42.0004 0.461671L38.0004 0.461671Z"></path><path transform="translate(0, 240) rotate(0)" fill="#90e0ef" d="M28.0004 0.461671L32.0004 0.461671L32.0004 120.462H28.0004L28.0004 0.461671Z"></path><path transform="translate(0, 240) rotate(0)" fill="#90e0ef" d="M18.0004 0.46167L18.0004 120.462H22.0004L22.0004 0.461671L18.0004 0.46167Z"></path><path transform="translate(0, 240) rotate(0)" fill="#90e0ef" d="M8.00037 0.46167L8.00037 120.462H12.0004L12.0004 0.46167L8.00037 0.46167Z"></path></g><g name="doubleStripes" mask="url(#mask)" mix-blend-mode="multiply"><rect transform="translate(0, 300) rotate(90)Line truncated

exampleSite/content/docs/welcome/feature.svg

@@ -0,0 +1 @@
+<svg id="canvas" height="100%" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.dev/svgjs" viewBox="0 0 540 420"><rect width="540" height="420" fill="transparent"></rect><mask id="mask" mask-type="alpha" maskUnits="userSpaceOnUse"><rect transform="translate(0, 0)" width="540" height="420" fill="white"></rect></mask><svg><path transform="translate(0, 0) translate(30,30) rotate(0) translate(-30,-30)" fill="#90e0ef" d="M0 0h60v60H0z"></path><path transform="translate(0, 0) translate(30,30) rotate(0) translate(-30,-30)" fill="#023e8a" d="M0 0h60v30H0z"></path><path transform="translate(0, 0) translate(30,30) rotate(0) translate(-30,-30)" fill="#0096c7" d="M30 45c8.284 0 15-6.716 15-15H15c0 8.284 6.716 15 15 15z"></path><path transform="translate(0, 0) translate(30,30) rotate(0) translate(-30,-30)" fill="#03045e" d="M30 15c-8.284 0-15 6.716-15 15h30c0-8.284-6.716-15-15-15z"></path></svg><svg><path transform="translate(0, 60) translate(30,30) rotate(270) translate(-30,-30)" fill="#48cae4" d="M0 0h60v60H0z"></path><path transform="translate(0, 60) translate(30,30) rotate(270) translate(-30,-30)" fill="#00b4d8" d="M30.867 4h-1.734v19.415L24.108 4.662l-1.674.448 5.026 18.757L17.75 7.05l-1.5.867 9.708 16.815-13.73-13.73-1.226 1.226 13.73 13.73L7.917 16.25l-.867 1.5 16.816 9.709L5.11 22.433l-.448 1.675 18.755 5.025H4v1.734h19.417L4.662 35.892l.449 1.674 18.755-5.025L7.05 42.25l.867 1.5 16.815-9.708-13.73 13.73 1.226 1.226 13.73-13.73-9.708 16.815 1.5.867 9.71-16.815-5.026 18.755 1.674.448 5.025-18.755V56h1.734V36.581l5.026 18.757 1.674-.448-5.025-18.754 9.707 16.814 1.502-.867-9.709-16.815 13.73 13.73 1.226-1.226-13.73-13.73 16.816 9.709.866-1.502-16.816-9.708 18.756 5.025.448-1.674-18.755-5.025H56v-1.734H36.583l18.756-5.025-.449-1.674-18.756 5.025 16.816-9.708-.867-1.502-16.815 9.709 13.73-13.73-1.226-1.226-13.73 13.73 9.709-16.815-1.501-.867-9.71 16.816L37.567 5.11l-1.674-.448-5.025 18.755V4z"></path></svg><svg><path transform="translate(0, 120) translate(30,30) rotate(90) translate(-30,-30)" fill="#00b4d8" d="M0 0h60v60H0z"></path><path transform="translate(0, 120) translate(30,30) rotate(90) translate(-30,-30)" fill="#caf0f8" d="M0 0h60v30H0z"></path><path transform="translate(0, 120) translate(30,30) rotate(90) translate(-30,-30)" fill="#03045e" d="M30 45c8.284 0 15-6.716 15-15H15c0 8.284 6.716 15 15 15z"></path><path transform="translate(0, 120) translate(30,30) rotate(90) translate(-30,-30)" fill="#90e0ef" d="M30 15c-8.284 0-15 6.716-15 15h30c0-8.284-6.716-15-15-15z"></path></svg><svg><path transform="translate(0, 180) translate(30,30) rotate(90) translate(-30,-30)" fill="#00b4d8" d="M0 0h60v60H0z"></path><path transform="translate(0, 180) translate(30,30) rotate(90) translate(-30,-30)" fill="#03045e" d="M4 56h52L30 30 4 56z"></path><path transform="translate(0, 180) translate(30,30) rotate(90) translate(-30,-30)" fill="#ade8f4" d="M56 4H4l26 26L56 4z"></path></svg><svg><path transform="translate(0, 240) translate(30,30) rotate(0) translate(-30,-30)" fill="#0077b6" d="M0 0h60v60H0z"></path><path transform="translate(0, 240) translate(30,30) rotate(0) translate(-30,-30)" fill="#90e0ef" d="M30 49c8.284 0 15-6.716 15-15H15c0 8.284 6.716 15 15 15z"></path><circle transform="translate(0, 240) translate(30,30) rotate(0) translate(-30,-30)" cx="30" cy="21" r="9" fill="#03045e"></circle></svg><svg> <path transform="translate(0, 300)" fill="#023e8a" d="M0 0h60v60H0z"></path><path transform="translate(0, 300)" fill="#caf0f8" d="M49 29.5C49 32.74 43.439 42 30 42s-19-9.26-19-12.5S16.561 17 30 17s19 9.26 19 12.5z"></path><circle transform="translate(0, 300)" cx="30" cy="30" r="7" fill="#90e0ef"></circle></svg><svg><path transform="translate(0, 360)" fill="#00b4d8" d="M0 0h60v60H0z"></path><path transform="translate(0, 360)" fill="#023e8a" d="M30.867 4h-1.734v22.765L17.75 7.05l-1.5.867 11.382 19.715L7.917 16.25l-.867 1.502 19.715 11.382H4v1.734h22.766L7.05 42.249l.867 1.502 19.715-11.383L16.25 52.083l1.502.867 11.382-19.715V56h1.734V33.234L42.249 52.95l1.502-.867-11.383-19.715L52.083 43.75l.867-1.502-19.716-11.382H56v-1.734H33.234L52.95 17.751l-.867-1.502-19.715 11.383L43.75 7.917l-1.502-.867-11.382 19.716V4z"></path></svg><svg><path transform="translate(60, 0)" fill="#023e8a" d="M0 0h60v60H0z"></path><path transform="translate(60, 0)" fill="#00b4d8" d="M30.867 4h-1.734v22.765L17.75 7.05l-1.5.867 11.382 19.715L7.917 16.25l-.867 1.502 19.715 11.382H4v1.734h22.766L7.05 42.249l.867 1.502 19.715-11.383L16.25 52.083l1.502.867 11.382-19.715V56h1.734V33.234L42.249 52.95l1.502-.867-11.383-19.715L52.083 43.75l.867-1.502-19.716-11.382H56v-1.734H33.234L52.95 17.751l-.867-1.502-19.715 11.383L43.75 7.917l-1.502-.867-11.382 19.716V4z"></path></svg><svg><path transform="translate(60, 60) translate(30,30) rotate(270) translate(-30,-30)" fill="#0096c7" d="M0 0h60v60H0z"></path><path transform="translate(60, 60) translate(30,30) rotate(270) translate(-30,-30)" fill="#ade8f4Line truncated

layouts/partials/header/fixed-gradient.html

@@ -0,0 +1,15 @@
+<div class="min-h-[148px]"></div>
+<div class="fixed inset-x-0 min-h-[130px] opacity-65 pl-[24px] pr-[24px] bg-gradient-to-b from-neutral from-60% dark:from-neutral-800 to-transparent mix-blend-normal" style="z-index:80"></div>
+<div class="fixed inset-x-0 pl-[24px] pr-[24px]" style="z-index:100">
+  <div id="menu-blur" class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl shadow-2xl"></div>
+  <div class="relative max-w-[64rem] ml-auto mr-auto">
+    {{ partial "partials/header/basic.html" . }}
+  </div>
+</div>
+<script>
+  window.addEventListener('scroll', function (e) {
+    var scroll = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
+    var background_blur = document.getElementById('menu-blur');
+    background_blur.style.opacity = (scroll / 300);
+  });
+</script>