Skip to content

Commit

Permalink
New matrix link and rename the text of librefm and lastfm
Browse files Browse the repository at this point in the history
  • Loading branch information
@nishimi-ya
nishimi-ya committed Dec 3, 2024
1 parent d2d5b7a commit eaefc32
Showing 1 changed file with 115 additions and 96 deletions.
211 changes: 115 additions & 96 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600&display=swap" rel="stylesheet">
<meta property="og:title" content="Nishimiya's Homepage" />
<meta property="og:description" content="Welcome aboard to Nishimiya's base station." />
<meta property="og:image" content="https://raw.githubusercontent.com/nishimi-ya/nishimi-ya.github.io/main/tenshi.png" />
<meta property="og:image"
content="https://raw.githubusercontent.com/nishimi-ya/nishimi-ya.github.io/main/tenshi.png" />
<meta name="author" content="Nishimiya" />
<meta name="keywords" content="libre, landing page, social, website" />
<meta property="og:url" content="https://nishimiya.my.id" />
Expand Down Expand Up @@ -47,7 +48,8 @@
max-width: 750px;
padding: 15px;
text-align: left;
margin-top: 50px; /* Space for fixed theme toggle */
margin-top: 50px;
/* Space for fixed theme toggle */
}

/* Headings */
Expand All @@ -58,7 +60,8 @@
word-wrap: break-word;
}

h2, h3 {
h2,
h3 {
font-weight: 600;
font-size: clamp(1em, 3vw, 1.2em);
margin-top: 1em;
Expand Down Expand Up @@ -143,12 +146,15 @@
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
padding: 10px 0;
scrollbar-width: none; /* Firefox */
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none;
/* Firefox */
-ms-overflow-style: none;
/* IE and Edge */
}

.rss-feed-container::-webkit-scrollbar {
display: none; /* Chrome, Safari, Opera */
display: none;
/* Chrome, Safari, Opera */
}

.rss-feed-item {
Expand Down Expand Up @@ -232,21 +238,24 @@
/* Updated Media Queries */
@media (min-width: 768px) {
.rss-feed-item {
flex: 0 0 45%; /* Show two items on tablets */
flex: 0 0 45%;
/* Show two items on tablets */
}
}

@media (min-width: 1024px) {
.rss-feed-item {
flex: 0 0 30%; /* Show three items on desktop */
flex: 0 0 30%;
/* Show three items on desktop */
}
}

/* Touch indicator for mobile */
@media (max-width: 767px) {
.rss-feed-container::after {
content: '';
flex: 0 0 10px; /* Creates space at the end to indicate more content */
flex: 0 0 10px;
/* Creates space at the end to indicate more content */
}
}
</style>
Expand All @@ -260,9 +269,11 @@
<!-- Main Container -->
<div class="container">
<h1># Welcome!</h1>
<p>Hello~ I'm <strong><a href="https://nishimiya.my.id/" class="h-card" style="color: pink;" rel="me">Nishimiya</a></strong>, and this is my base station on the web.</p>
<p>Hello~ I'm <strong><a href="https://nishimiya.my.id/" class="h-card" style="color: pink;"
rel="me">Nishimiya</a></strong>, and this is my base station on the web.</p>

<p>In my free time, I write <a href="http://blog.nishimiya.my.id">blog post</a> about technologies, art; decentralisation and promoting free software.</p>
<p>In my free time, I write <a href="http://blog.nishimiya.my.id">blog post</a> about technologies, art;
decentralisation and promoting free software.</p>

<p><a href="https://trakteer.id/nishi.miya/tip">Donate</a></p>

Expand All @@ -271,43 +282,51 @@ <h2>## Social links and stuff</h2>
<ul>
<li>Bluesky: <a href="https://bsky.app/profile/nishimiya.my.id">@nishimiya.my.id</a></li>
<li>GitHub: <a href="https://github.com/nishimi-ya">nishimi-ya</a></li>
<li>Libre.fm: <a href="https://libre.fm/user/nishimiya">nishimiya</a> · <a href="https://www.last.fm/user/nishi-miya">Last.fm</a></li>
<li>Blog: <a href="https://blog.nishimiya.my.id/">blog.nishimiya.my.id</a> · <a href="https://blog.nishimiya.my.id/index.xml">RSS</a></li>
<li>LibreFM: <a href="https://libre.fm/user/nishimiya">nishimiya</a> · <a
href="https://www.last.fm/user/nishi-miya">LastFM</a></li>
<li>Blog: <a href="https://blog.nishimiya.my.id/">blog.nishimiya.my.id</a> · <a
href="https://blog.nishimiya.my.id/index.xml">RSS</a></li>
<li>Mastodon: <a rel="me" href="https://layer8.space/@nishimiya">@[email protected]</a></li>
<li>Soulseek: @nishi26</li>
<li>Email: <a href="mailto:[email protected]">[email protected]</a></li>
<li>Matrix: @nishimiya:matrix.org</a></li>
<li>Matrix: <a href="https://matrix.to/#/#nishimiya:matrix.org" </a>nishimiya:matrix.org</li>
</ul>

<h2>## Projects</h2>

<h3>### Linux</h3>
<ul>
<li><strong>Hyprland Dotfiles</strong><br>Personal dots collection for hyprland.<br>
<a href="https://github.com/nishimi-ya/hyprland-dotfiles">Repository</a>
<a href="https://github.com/nishimi-ya/hyprland-dotfiles">Repository</a>
</li>
<li><strong>Hyprland Bootstrap</strong><br>Automated installer bootstrap to install my personal dotfiles without hassle.<br>
<a href="https://github.com/nishimi-ya/hyprland-bootstrap/blob/main/LICENSE">UNLICENSE</a> · <a href="https://github.com/nishimi-ya/hyprland-bootstrap">Repository</a>
<li><strong>Hyprland Bootstrap</strong><br>Automated installer bootstrap to install my personal dotfiles without
hassle.<br>
<a href="https://github.com/nishimi-ya/hyprland-bootstrap/blob/main/LICENSE">UNLICENSE</a> · <a
href="https://github.com/nishimi-ya/hyprland-bootstrap">Repository</a>
</li>
</ul>

<h3>### Web</h3>
<ul>
<li>
<strong>Shinosawa Hiro Tribute</strong><br>Simple website tribute for Shinosawa Hiro from Hatsuboshi Gakuen<br>
<a href="https://github.com/nishimi-ya/hiro-shinosawa">Repository</a> · <a href="http://nishimiya.my.id/hiro-shinosawa/">Preview</a>
<a href="https://github.com/nishimi-ya/hiro-shinosawa">Repository</a> · <a
href="http://nishimiya.my.id/hiro-shinosawa/">Preview</a>
</li>
<li>
<strong>Tilde</strong><br>Start page to simplify access and search.<br>
<a href="https://github.com/nishimi-ya/hyprland-bootstrap/blob/main/LICENSE">UNLICENSE</a> · <a href="https://github.com/nishimi-ya/tilde">Repository</a> · <a href="http://tilde.nishimiya.my.id/">Preview</a>
<a href="https://github.com/nishimi-ya/hyprland-bootstrap/blob/main/LICENSE">UNLICENSE</a> · <a
href="https://github.com/nishimi-ya/tilde">Repository</a> · <a
href="http://tilde.nishimiya.my.id/">Preview</a>
</li>
</ul>

<h3>### Misc</h3>
<ul>
<li>
<strong>MPD BlueSky Bot</strong><br>A bot that post current song using MPD to bluesky<br>
<a href="https://github.com/nishimi-ya/mpd-bsky-bot/blob/main/LICENSE">UNLICENSE</a> · <a href="https://github.com/nishimi-ya/mpd-bsky-bot">Repository</a>
<a href="https://github.com/nishimi-ya/mpd-bsky-bot/blob/main/LICENSE">UNLICENSE</a> · <a
href="https://github.com/nishimi-ya/mpd-bsky-bot">Repository</a>
</li>
</ul>

Expand All @@ -317,85 +336,85 @@ <h2>## Recent Blog Posts</h2>
</div>

<script>
// Theme Toggle Function
function toggleTheme() {
document.body.classList.toggle("light-mode");
const themeToggleButton = document.querySelector('.theme-toggle');
if (document.body.classList.contains("light-mode")) {
themeToggleButton.textContent = "Dark Mode";
themeToggleButton.classList.remove("light");
} else {
themeToggleButton.textContent = "Light Mode";
themeToggleButton.classList.add("light");
}
}

// Truncate Titles Function
function truncateTitles() {
const titles = document.querySelectorAll('.rss-feed-item h3');
titles.forEach(function(title) {
const words = title.textContent.split(' ');
if (words.length > 6) {
const truncatedTitle = words.slice(0, 6).join(' ') + '...';
title.textContent = truncatedTitle;
}
});
}

// Fetch the RSS feed XML and display titles and content
async function loadRSSFeed() {
try {
const response = await fetch('https://blog.nishimiya.my.id/index.xml');
const xmlText = await response.text();

const parser = new DOMParser();
const xmlDoc = parser.parseFromString(xmlText, "text/xml");

const items = xmlDoc.getElementsByTagName("item");
const rssContainer = document.getElementById("rss-feed");
rssContainer.innerHTML = '';

for (let i = 0; i < Math.min(items.length, 5); i++) {
const titleElement = items[i].getElementsByTagName("title")[0];
const titleText = titleElement.textContent;
const pubDateElement = items[i].getElementsByTagName("pubDate")[0];
const pubDateText = new Date(pubDateElement.textContent).toLocaleDateString('en-US', { weekday: 'long', year: 'numeric', month: 'short', day: 'numeric' });

const linkElement = items[i].getElementsByTagName("link")[0];
const linkUrl = linkElement.textContent;

const rssItem = document.createElement("div");
rssItem.className = "rss-feed-item";

const linkTag = document.createElement("a");
linkTag.href = linkUrl;
linkTag.target = "_blank";
linkTag.innerHTML = `
// Theme Toggle Function
function toggleTheme() {
document.body.classList.toggle("light-mode");
const themeToggleButton = document.querySelector('.theme-toggle');
if (document.body.classList.contains("light-mode")) {
themeToggleButton.textContent = "Dark Mode";
themeToggleButton.classList.remove("light");
} else {
themeToggleButton.textContent = "Light Mode";
themeToggleButton.classList.add("light");
}
}

// Truncate Titles Function
function truncateTitles() {
const titles = document.querySelectorAll('.rss-feed-item h3');
titles.forEach(function (title) {
const words = title.textContent.split(' ');
if (words.length > 6) {
const truncatedTitle = words.slice(0, 6).join(' ') + '...';
title.textContent = truncatedTitle;
}
});
}

// Fetch the RSS feed XML and display titles and content
async function loadRSSFeed() {
try {
const response = await fetch('https://blog.nishimiya.my.id/index.xml');
const xmlText = await response.text();

const parser = new DOMParser();
const xmlDoc = parser.parseFromString(xmlText, "text/xml");

const items = xmlDoc.getElementsByTagName("item");
const rssContainer = document.getElementById("rss-feed");
rssContainer.innerHTML = '';

for (let i = 0; i < Math.min(items.length, 5); i++) {
const titleElement = items[i].getElementsByTagName("title")[0];
const titleText = titleElement.textContent;
const pubDateElement = items[i].getElementsByTagName("pubDate")[0];
const pubDateText = new Date(pubDateElement.textContent).toLocaleDateString('en-US', {weekday: 'long', year: 'numeric', month: 'short', day: 'numeric'});

const linkElement = items[i].getElementsByTagName("link")[0];
const linkUrl = linkElement.textContent;

const rssItem = document.createElement("div");
rssItem.className = "rss-feed-item";

const linkTag = document.createElement("a");
linkTag.href = linkUrl;
linkTag.target = "_blank";
linkTag.innerHTML = `
<h3>${titleText}</h3>
<p>${pubDateText}</p>
`;
rssItem.appendChild(linkTag);
rssContainer.appendChild(rssItem);
}
} catch (error) {
console.error("Failed to load RSS feed:", error);
}
}

// Load RSS feed on page load
loadRSSFeed().then(function() {
truncateTitles();
});

// Smooth horizontal scrolling for desktop
document.addEventListener('wheel', function(event) {
const rssContainer = document.getElementById("rss-feed");
if (rssContainer.contains(event.target)) {
event.preventDefault();
rssContainer.scrollLeft += event.deltaY;
}
}, { passive: false });
rssItem.appendChild(linkTag);
rssContainer.appendChild(rssItem);
}
} catch (error) {
console.error("Failed to load RSS feed:", error);
}
}

// Load RSS feed on page load
loadRSSFeed().then(function () {
truncateTitles();
});

// Smooth horizontal scrolling for desktop
document.addEventListener('wheel', function (event) {
const rssContainer = document.getElementById("rss-feed");
if (rssContainer.contains(event.target)) {
event.preventDefault();
rssContainer.scrollLeft += event.deltaY;
}
}, {passive: false});
</script>
</body>

</html>
</html>

0 comments on commit eaefc32

Please sign in to comment.