Dev log 1 just dropped, anyway, hey, I made this to show you the process of this page! First things first, what am I using? Jekyll, worse mistake of my life, please send help. Just kidding Anyway, this means I make a simple post using a markdown file which I can share here for this post, you can also see all the posts and edits at the Github page repo, so I can’t just go modifying things to hide something bad I might of said, but that doesn’t mean I won’t edit pages, I may fix mistakes and shiz and (if I remember) I will note the edit at the bottom of the page

Now how did I make the site look like this with the funky wave?

I’ll give you the code, I needn’t mention my suffering it was very very painful

window.addEventListener("load", (event) => {
	var wave1 = Snap.select('#wave1')
	var to1 = function () {
		wave1.animate({ d: "M0,96L13.3,85.3C26.7,75,53,53,80,80C106.7,107,133,181,160,218.7C186.7,256,213,256,240,213.3C266.7,171,293,85,320,48C346.7,11,373,21,400,58.7C426.7,96,453,160,480,192C506.7,224,533,224,560,208C586.7,192,613,160,640,154.7C666.7,149,693,171,720,197.3C746.7,224,773,256,800,234.7C826.7,213,853,139,880,112C906.7,85,933,107,960,101.3C986.7,96,1013,64,1040,90.7C1066.7,117,1093,203,1120,218.7C1146.7,235,1173,181,1200,176C1226.7,171,1253,213,1280,224C1306.7,235,1333,213,1360,197.3C1386.7,181,1413,171,1427,165.3L1440,160L1440,320L1426.7,320C1413.3,320,1387,320,1360,320C1333.3,320,1307,320,1280,320C1253.3,320,1227,320,1200,320C1173.3,320,1147,320,1120,320C1093.3,320,1067,320,1040,320C1013.3,320,987,320,960,320C933.3,320,907,320,880,320C853.3,320,827,320,800,320C773.3,320,747,320,720,320C693.3,320,667,320,640,320C613.3,320,587,320,560,320C533.3,320,507,320,480,320C453.3,320,427,320,400,320C373.3,320,347,320,320,320C293.3,320,267,320,240,320C213.3,320,187,320,160,320C133.3,320,107,320,80,320C53.3,320,27,320,13,320L0,320Z" }, 5000, mina.bounce, to2)
	}
	var to2 = function () {
		wave1.animate({ d: "M0,32L13.3,80C26.7,128,53,224,80,266.7C106.7,309,133,299,160,288C186.7,277,213,267,240,229.3C266.7,192,293,128,320,112C346.7,96,373,128,400,117.3C426.7,107,453,53,480,74.7C506.7,96,533,192,560,240C586.7,288,613,288,640,272C666.7,256,693,224,720,186.7C746.7,149,773,107,800,101.3C826.7,96,853,128,880,122.7C906.7,117,933,75,960,64C986.7,53,1013,75,1040,117.3C1066.7,160,1093,224,1120,256C1146.7,288,1173,288,1200,282.7C1226.7,277,1253,267,1280,256C1306.7,245,1333,235,1360,197.3C1386.7,160,1413,96,1427,64L1440,32L1440,320L1426.7,320C1413.3,320,1387,320,1360,320C1333.3,320,1307,320,1280,320C1253.3,320,1227,320,1200,320C1173.3,320,1147,320,1120,320C1093.3,320,1067,320,1040,320C1013.3,320,987,320,960,320C933.3,320,907,320,880,320C853.3,320,827,320,800,320C773.3,320,747,320,720,320C693.3,320,667,320,640,320C613.3,320,587,320,560,320C533.3,320,507,320,480,320C453.3,320,427,320,400,320C373.3,320,347,320,320,320C293.3,320,267,320,240,320C213.3,320,187,320,160,320C133.3,320,107,320,80,320C53.3,320,27,320,13,320L0,320Z" }, 5000, mina.bounce, to3)
	}
	var to3 = function () {
		wave1.animate({ d: "M0,192L13.3,170.7C26.7,149,53,107,80,90.7C106.7,75,133,85,160,112C186.7,139,213,181,240,202.7C266.7,224,293,224,320,208C346.7,192,373,160,400,154.7C426.7,149,453,171,480,154.7C506.7,139,533,85,560,106.7C586.7,128,613,224,640,266.7C666.7,309,693,299,720,256C746.7,213,773,139,800,112C826.7,85,853,107,880,138.7C906.7,171,933,213,960,208C986.7,203,1013,149,1040,133.3C1066.7,117,1093,139,1120,170.7C1146.7,203,1173,245,1200,229.3C1226.7,213,1253,139,1280,96C1306.7,53,1333,43,1360,64C1386.7,85,1413,139,1427,165.3L1440,192L1440,320L1426.7,320C1413.3,320,1387,320,1360,320C1333.3,320,1307,320,1280,320C1253.3,320,1227,320,1200,320C1173.3,320,1147,320,1120,320C1093.3,320,1067,320,1040,320C1013.3,320,987,320,960,320C933.3,320,907,320,880,320C853.3,320,827,320,800,320C773.3,320,747,320,720,320C693.3,320,667,320,640,320C613.3,320,587,320,560,320C533.3,320,507,320,480,320C453.3,320,427,320,400,320C373.3,320,347,320,320,320C293.3,320,267,320,240,320C213.3,320,187,320,160,320C133.3,320,107,320,80,320C53.3,320,27,320,13,320L0,320Z" }, 5000, mina.bounce, to1)
	}
	to1()
})

I know it doesn’t look like a lot, but the Snap thingy, uh, you see that onload event? Yeah it needed that.

Another thing, getting highlight.js support, you see, I had all the languages I want, but oddly, most of them could not register. Little known fact, don’t use an old version of highlight.js with new versions of the languages. But as you can see above, it’s working just fine now that I updated highlight.js

Now this

{% for tag in site.catagoreys %}
  <h3>{{ tag | escape }}</h3>
  <ul>
    {%- for post in site.posts -%}
      {%- if post.cat == tag -%}
        <li><a href="{{ post.url }}">{{ post.title }} - {{ post.date | date: "%d/%m/%Y" }}</a></li>
      {%- endif -%}
    {%- endfor -%}
  </ul>
{% endfor %}

was my bane for 2 hours, turns out, you can’t use the tags property in your _config.yml, it will just embed pages, why it does that I will never know, changed it to site.catagoreys and it was perfectly fine.

Anyway thanks for reading, take care!

Edit: removed last edit as that is no longer the edit, added {% raw %} to fix liquid formatting


<
Previous Post
The page is up
>
Next Post
QNick