purplebored/purplebored.pl
1
0
Fork 1
Code Issues Pull Requests Actions Activity

Added new files

Browse Source
This commit is contained in:
Alek Nikovich
2024-07-27 00:25:21 +02:00
parent 2603d13c5c
commit 391c330de5
131 changed files with 1888 additions and 2824 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
oldprojects/cat/favicon.png Normal file → Executable file
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 265 B

After

Width:  |  Height:  |  Size: 265 B

34
oldprojects/cat/index.html Normal file → Executable file
View File

@@ -1,18 +1,18 @@
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="style.css">
<link rel="icon" href="favicon.png" type="image/png">
<meta charset="UTF-8">
<title>Кот</title>
</head>
<body>
<h1>Random Cat Pictures</h1>
<img id="cat-img" src="" alt="Random cat picture">
<button onclick="getCat()">Get Random Cat Picture</button>
<script src="script.js"></script>
<footer>
<a href="https://codeberg.org/PurpleBored/cat-pics">View Source Code</a>
</footer>
</body>
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="style.css">
<link rel="icon" href="favicon.png" type="image/png">
<meta charset="UTF-8">
<title>Кот</title>
</head>
<body>
<h1>Random Cat Pictures</h1>
<img id="cat-img" src="" alt="Random cat picture">
<button onclick="getCat()">Get Random Cat Picture</button>
<script src="script.js"></script>
<footer>
<a href="https://codeberg.org/PurpleBored/cat-pics">View Source Code</a>
</footer>
</body>
</html>

21
oldprojects/cat/info.html
View File

@@ -1,21 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>=Info=</title>
<link rel="stylesheet" href="/style.css">
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" href="favicon.ico" type="image/x-icon">
</head>
<body>
<div class="content-blog"> <!--Yes i am reusing my CSS everywhere-->
<a href="https://purplebored.pl/">Return to main site.</a></br>===INFO===
So yeah this was my First API project that i did. It's very simple (and ugly). It uses thecatapi. I have nothing more to say about this lol
<center><img src="/oldprojects/cat/screenshot.jpg" alt="A screenshot from the website."></center>
<center>Screenshot from the project ^^</center>
</div>
<footer>
<a class="clean">Purplebored &copy; 2023-2024 </a> | <a href="https://codeberg.org/Purplebored" target="_blank">My Codeberg</a> | <a href="https://github.com/PurpleBored" target="_blank">My Github</a> | <a href="/contact.html/" target="_blank">Contact Me</a> | </pre>
</footer>>
</body>
</html>

0
oldprojects/cat/screenshot.jpg Normal file → Executable file
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 42 KiB

After

Width:  |  Height:  |  Size: 42 KiB

24
oldprojects/cat/script.js Normal file → Executable file
View File

@@ -1,13 +1,13 @@
function getCat() {
fetch('https://api.thecatapi.com/v1/images/search')
.then(response => response.json())
.then(data => {
let catImg = document.getElementById('cat-img');
catImg.src = data[0].url;
catImg.width = 400;
catImg.height = 400;
})
.catch(error => {
console.error('Error fetching cat picture', error);
});
function getCat() {
fetch('https://api.thecatapi.com/v1/images/search')
.then(response => response.json())
.then(data => {
let catImg = document.getElementById('cat-img');
catImg.src = data[0].url;
catImg.width = 400;
catImg.height = 400;
})
.catch(error => {
console.error('Error fetching cat picture', error);
});
}

94
oldprojects/cat/style.css Normal file → Executable file
View File

@@ -1,48 +1,48 @@
body {
display: flex;
flex-direction: column;
align-items: center;
font-family: Arial, sans-serif;
background-color: #F3E3E3;
height: 100%;
}
h1 {
margin-top: 50px;
}
#cat-img {
margin-top: 50px;
border-radius: 10px;
box-shadow: 5px 5px 10px #aaa;
}
button {
margin-top: 20px;
padding: 10px 20px;
border: none;
border-radius: 10px;
background-color: #f1c40f;
font-size: 16px;
font-weight: bold;
cursor: pointer;
box-shadow: 5px 5px 10px #aaa;
}
button:hover {
background-color: #f7dc6f;
}
footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: #333;
color: #fff;
text-align: center;
}
footer a {
color: #fff;
body {
display: flex;
flex-direction: column;
align-items: center;
font-family: Arial, sans-serif;
background-color: #F3E3E3;
height: 100%;
}
h1 {
margin-top: 50px;
}
#cat-img {
margin-top: 50px;
border-radius: 10px;
box-shadow: 5px 5px 10px #aaa;
}
button {
margin-top: 20px;
padding: 10px 20px;
border: none;
border-radius: 10px;
background-color: #f1c40f;
font-size: 16px;
font-weight: bold;
cursor: pointer;
box-shadow: 5px 5px 10px #aaa;
}
button:hover {
background-color: #f7dc6f;
}
footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: #333;
color: #fff;
text-align: center;
}
footer a {
color: #fff;
}