senak
/
senka-users-page
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
master
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'master'
${ noResults }
senka-users-page/index.html

166 lines
9.2 KiB
HTML
Raw Permalink Normal View History Unescape Escape

current status of senka's userpage
10 months ago
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport"
content="width=device-width,
initial-scale=1.0"/>
<title> Senka's user page</title>
<link rel="stylesheet" href="index style.css" />
</head>
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
<body id="body" class="body-font">
<!-- <div class="back">
</div> -->
<div class="buttons">
<button id="toggle-high-contrast">Contrast</button>
<button class="slider-container">
<label for="font-size-slider">Font Size</label>
<input type="range" id="font-size-slider" min="25" max="60" value="25" />
</button>
<button id="font-change">
<label for="font-change-2">Change Font</label>
</button>
</div>
<div class="display-text" id="display-text">
<div class="everything">
<div class="left">
<h1 id="title"> <span>Добродошли и добро Вас нашли</span> <br>Senka's User Page</h1>
<p id="intro">
Like many people in the creative industry I have a different cv and biography depending on the project I'm doing and the funding application I'm applying for.
But I generally have an interest in archives, media theory, storytelling and writing.
(Knowledge production, how do we learn collectivelly and the like...)<br>
Here I will ramble about and place the following: <br>
<ul id="intro">
<li>things I researched</li>
<li>little web experiments</li>
</ul>
current status of senka's userpage
10 months ago
</p>
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
<p>text text text text text text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text text exttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text textexttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text texttext text text text</p>
<!-- <button onClick="document.getElementById('map1').scrollIntoView({behavior: 'smooth'});">🡣</button> -->
</div>
<div class="right">
<img alt="A pack of bulls in autumn nature standing as if their posing for an indie rock band photo" src="important.jpg">
<img alt="A pack of bulls in autumn nature standing as if their posing for an indie rock band photo" src="important.jpg">
</div>
current status of senka's userpage
10 months ago
</div>
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
</div>
current status of senka's userpage
10 months ago
<script type="text/javascript">
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
// const canvas = document.getElementById("myCanvas"),
// ctx = canvas.getContext("2d"),
// image = new Image();
// // Wait for the sprite sheet to load
// image.onload = () => {
// Promise.all([
// // Cut out two sprites from the sprite sheet
// createImageBitmap(image, 0, 0, 432, 432),
// // createImageBitmap(image, 432, 0, 432, 432),
// ]).then((sprites) => {
// // Draw each sprite onto the canvas
// ctx.drawImage(sprites[0], 0, 0);
// // ctx.drawImage(sprites[1], 102, 32);
// // Create a linear gradient
// // The start gradient point is at x=20, y=0
// // The end gradient point is at x=220, y=0
// const gradient = ctx.createLinearGradient(20, 0, 220, 0);
// // Add three color stops
// gradient.addColorStop(0, "green");
// gradient.addColorStop(0.5, "cyan");
// gradient.addColorStop(1, "green");
// // Set the fill style and draw a rectangle
// ctx.fillStyle = gradient;
// ctx.fillRect(20, 20, 200, 100);
// });
// };
// // Load the sprite sheet from an image file
// image.src = "important.jpg";
// Change font size button
current status of senka's userpage
10 months ago
// Get the toggle button
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
var toggleButtonTwo = document.getElementById("font-change");
console.log("It's getting the body for the 2md time");
// Add a click event listener to the toggle button
toggleButtonTwo.addEventListener("click", function() {
// Get the body element
var body = document.getElementsByTagName("body")[0];
// var bodyFont = body.classList == "body-font"
// var highContrast = body.classList == "high-contrast"
// Toggle the "different-font" class on the body element
var bodyClasses = document.body.classList.value;
if (bodyClasses.includes("body-font")){
document.body.classList.remove("body-font");
document.body.classList.remove("third-font");
document.body.classList.add("different-font");
} else if (bodyClasses.includes("different-font")){
document.body.classList.remove("body-font");
document.body.classList.remove("different-font");
document.body.classList.add("third-font");
} else if (bodyClasses.includes("third-font")){
document.body.classList.remove("third-font");
document.body.classList.add("body-font");
document.body.classList.remove("different-font");
}
// if ( body.classList == "body-font" || body.classList == "body-font high-contrast"){
// body.classList.remove("body-font");
// body.classList.add("different-font");}
// else if(body.classList == "different-font" || body.classList == "different-font high-contrast"){
// body.classList.remove("different-font");
// body.classList.add("different-font-2");
// body.classList.remove("body-font");
// console.log("It worked!");
// } else{
// body.classList.remove("different-font-2");
// body.classList.add("body-font");
// }
// if ( body.classList == "body-font high-contrast"){
// body.classList.remove("body-font");
// body.classList.add("different-font");}
// else if(body.classList == "different-font high-contrast"){
// body.classList.remove("different-font")
// body.classList.add("different-font-2");
// console.log("It worked!")
// } else{
// body.classList.remove("different-font-2")
// body.classList.add("body-font");
// }
});
// Getting the toggle button
current status of senka's userpage
10 months ago
var toggleButton = document.getElementById("toggle-high-contrast");
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
// Added a click event listener to the toggle button
current status of senka's userpage
10 months ago
toggleButton.addEventListener("click", function() {
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
// Getting the body element
current status of senka's userpage
10 months ago
var body = document.getElementsByTagName("body")[0];
// Toggle the "high-contrast" class on the body element
body.classList.toggle("high-contrast");
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
body.classList.remove("back")
current status of senka's userpage
10 months ago
});
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
current status of senka's userpage
10 months ago
// Slider for font size
const fontSizeSlider = document.getElementById("font-size-slider");
const displayText = document.getElementById("display-text");
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
function changeSize(){
const fontSize = fontSizeSlider.value;
displayText.style.fontSize = `${fontSize}px`;
}
current status of senka's userpage
10 months ago
fontSizeSlider.addEventListener("input", () => {
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
changeSize();
current status of senka's userpage
10 months ago
});
added a page with an 8ball for strike ideas. the ideas are still rudimentary
10 months ago
changeSize();
current status of senka's userpage
10 months ago
</script>
<script src="https://issue.xpub.nl/23/quilt/quilt.js" data-cutFileName="false" data-cutFileName="false"></script>
<link rel="stylesheet" type="text/css" href="https://issue.xpub.nl/23/quilt/quilt.css">
</body>
</html>