ayo/blog
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: fold/unfold home message

Browse source
This commit is contained in:
Ayo 2023-05-21 20:26:17 +02:00
parent f400c76442
commit bcd4c267c5
1 changed files with 57 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

61
_layouts/home.html
View file

@ -9,41 +9,72 @@ layout: default
margin: 1em 0 2em;
color: black;
border-radius: 5px;
border: 5px dotted #ccc !important;
border: 3px dotted #ccc !important;
padding: 0.5em 1em;
"
>
<h2 style="font-weight: bold">Hello, fellow human!</h2>
<h2 style="font-weight: bold">
Hello, fellow human! Just a short message...
</h2>
<p>
Welcome. Like you, I have many areas of interests, and in this site you
Welcome! Like you, I have many areas of interests, and in this site you
will find posts on varying topics that are not always confined to my
professional life.
</p>
<p>
There really is no central theme here, and even the quality of writing may
change between posts. My only rule is that I put out words about stuff I
find helpful to talk about.
There really is no central theme on this blog, and even the quality of
writing may change between posts. My only rule here is that I put out
words about stuff I find helpful to talk about.
</p>
<!--p>
<button
class="read-more-message"
style="cursor: pointer; margin-bottom: 1em"
onclick="toggleMessage()"
>
Read the full message &rarr;
</button>
<script>
function toggleMessage() {
var x = document.getElementsByClassName("hide")[0];
var y = document.getElementsByClassName("read-more-message")[0];
if (x.style.display === "none") {
x.style.display = "block";
y.style.display = "none";
} else {
x.style.display = "none";
y.style.display = "block";
}
}
</script>
<div class="hide" style="display: none">
<p>
There may be some topics that pop up more than others.
<a href="/technology">Technology</a> posts are mostly about web
development, and may be more relatable to people who found me for my
development work. More opinionated <a href="/personal">personal</a> posts
are where I talk about stuff I find interesting and helpful to put out in
the open for their potential to help others as well. However, other topics
will most likely be included in the future and a lot of things may change
over time.
</p-->
development work. More opinionated
<a href="/personal">personal</a> posts are where I talk about stuff I
find interesting and helpful to put out in the open for their potential
to help others as well. However, other topics will most likely be
included in the future and a lot of things may change over time.
</p>
<p>
Thank you for the interest in reading. I look forward to any feedback or
even the possibility of collaboration. Hit me up about any topic you find
here! Below are my contact details.
even the possibility of collaboration. Hit me up about any topic you
find here! Below are my contact details.
</p>
<ul>
<li>email: <a href="mailto:ayo@ayco.io">ayo@ayco.io</a></li>
<li>chat: <a href="https://t.me/ayoayco">ayoayco @ Telegram</a></li>
</ul>
<p>~ <em>Ayo Ayco</em></p>
<button
class="read-less-message"
style="cursor: pointer"
onclick="toggleMessage()"
>
&larr; Show less...
</button>
</div>
</div>
{% if site.posts.size > 0 %}
<ul class="blog-home__list-items">