Compare commits
No commits in common. "beb2b942d61df6a31553be8926f72e23acc94f52" and "eeeb7be3471668171a57ebe624ad208cffc966f9" have entirely different histories.
beb2b942d6
...
eeeb7be347
13 changed files with 76 additions and 433 deletions
6
.gitignore
vendored
6
.gitignore
vendored
|
|
@ -1,6 +0,0 @@
|
|||
*.png
|
||||
*.mp3
|
||||
*.jpg
|
||||
*.gif
|
||||
*.webm
|
||||
*.webp
|
||||
|
|
@ -1,5 +1,11 @@
|
|||
body, html{
|
||||
font-family: CustomFont, sans-serif; /* Use the custom font as the fallback */
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
@font-face {
|
||||
font-family: CustomFont;
|
||||
|
|
|
|||
|
|
@ -1,136 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="icon" href="../../static/site/favicon.png" type="image/x-icon">
|
||||
<link rel="stylesheet" href="../../default_style.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<title>Friends</title>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<audio autoplay="" loop="" src="./1999_wildfire_Justice_Der.mp3"></audio>
|
||||
<div class="grid-container">
|
||||
<!-- Stars -->
|
||||
<img class="star2" src="star.png" style="grid-column: 6 / span 1; grid-row: 15 / span 1;">
|
||||
<img class="star1" src="star.png" style="grid-column: 3 / span 1; grid-row: 19 / span 1;">
|
||||
<img class="star3" src="star.png" style="grid-column: 4 / span 1; grid-row: 7 / span 1;">
|
||||
<img class="star2" src="star.png" style="grid-column: 7 / span 1; grid-row: 16 / span 1;">
|
||||
<img class="star1" src="star.png" style="grid-column: 4 / span 1; grid-row: 5 / span 1;">
|
||||
<img class="star3" src="star.png" style="grid-column: 6 / span 1; grid-row: 9 / span 1;">
|
||||
<img class="star2" src="star.png" style="grid-column: 5 / span 1; grid-row: 8 / span 1;">
|
||||
<img class="star1" src="star.png" style="grid-column: 6 / span 1; grid-row: 13 / span 1;">
|
||||
<img class="star3" src="star.png" style="grid-column: 4 / span 1; grid-row: 11 / span 1;">
|
||||
<img class="star2" src="star.png" style="grid-column: 3 / span 1; grid-row: 12 / span 1;">
|
||||
<img class="star1" src="star.png" style="grid-column: 2 / span 1; grid-row: 20 / span 1;">
|
||||
<img class="star3" src="star.png" style="grid-column: 6 / span 1; grid-row: 3 / span 1;">
|
||||
<img class="star2" src="star.png" style="grid-column: 7 / span 1; grid-row: 18 / span 1;">
|
||||
<img class="star1" src="star.png" style="grid-column: 5 / span 1; grid-row: 17 / span 1;">
|
||||
<img class="star3" src="star.png" style="grid-column: 4 / span 1; grid-row: 14 / span 1;">
|
||||
<img class="star2" src="star.png" style="grid-column: 2 / span 1; grid-row: 10 / span 1;">
|
||||
<img class="star1" src="star.png" style="grid-column: 3 / span 1; grid-row: 6 / span 1;">
|
||||
<img class="star3" src="star.png" style="grid-column: 5 / span 1; grid-row: 4 / span 1;">
|
||||
<img class="star2" src="star.png" style="grid-column: 2 / span 1; grid-row: 2 / span 1;">
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- Friends -->
|
||||
<a href="https://grumbulon.xyz/" class="friend" target="_blank" style="grid-column: 4; grid-row: 12;">
|
||||
<img src="pfp/grumb.png">
|
||||
<h1 class="caption">Grumbulon</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://samtherapy.xyz/" class="friend" target="_blank" style="grid-column: 4; grid-row: 3;">
|
||||
<img src="pfp/sam.png">
|
||||
<h1 class="caption">Sam</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://theoryware.net/" class="friend" target="_blank" style="grid-column: 3; grid-row: 4;">
|
||||
<img src="pfp/theorytoe.png">
|
||||
<h1 class="caption">Theory Toe</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://weebles.husbandoism.life/" class="friend" target="_blank" style="grid-column: 6; grid-row: 6;">
|
||||
<img src="pfp/weeble.gif">
|
||||
<h1 class="caption">Weeble</h1>
|
||||
</a>
|
||||
|
||||
|
||||
<a href="https://misako.neocities.org/" class="friend" target="_blank" style="grid-column: 3; grid-row: 6;">
|
||||
<img src="pfp/Kerokeronim.webp">
|
||||
<h1 class="caption">Kerokeronim</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://tengu.space/" class="friend" target="_blank" style="grid-column: 7; grid-row: 5;">
|
||||
<img src="pfp/DeviousTengu.webp">
|
||||
<h1 class="caption">Devious Tengu</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://reisen.church/" class="friend" target="_blank" style="grid-column: 6; grid-row: 8;">
|
||||
<img src="pfp/nai.png">
|
||||
<h1 class="caption">NaiJi</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://yomuchan.neocities.org/" class="friend" target="_blank" style="grid-column: 5; grid-row: 5;">
|
||||
<img src="pfp/yomuchan.png">
|
||||
<h1 class="caption">Yomuchan</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://fluoridewastelands.neocities.org/" class="friend" target="_blank" style="grid-column: 7; grid-row: 3;">
|
||||
<img src="pfp/joe.jpg">
|
||||
<h1 class="caption">Joe</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://comfyboy.club/" class="friend" target="_blank" style="grid-column: 5; grid-row: 10;">
|
||||
<img src="pfp/vril.png">
|
||||
<h1 class="caption">Vril</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://lunarised.com/" class="friend" target="_blank" style="grid-column: 2; grid-row: 5;">
|
||||
<img src="pfp/Lunarised.png">
|
||||
<h1 class="caption">Lunarised</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://about.munir.tokyo/" class="friend" target="_blank" style="grid-column: 6; grid-row: 13;">
|
||||
<img src="pfp/munir.webp">
|
||||
<h1 class="caption">Munir</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://ericaftereric.top/" class="friend" target="_blank" style="grid-column: 3; grid-row: 15;">
|
||||
<img src="pfp/eric_zhang.webp">
|
||||
<h1 class="caption">Eric Zhang</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://cooking.boymoder.biz/" class="friend" target="_blank" style="grid-column: 3; grid-row: 9;">
|
||||
<img src="pfp/paula.png">
|
||||
<h1 class="caption">Paula</h1>
|
||||
</a>
|
||||
<a href="https://www.robinwils.com/" class="friend" target="_blank" style="grid-column: 2; grid-row: 7;">
|
||||
<img src="pfp/robin_wils.webp">
|
||||
<h1 class="caption">Robin Wils</h1>
|
||||
</a>
|
||||
|
||||
<a href="https://anonicus.neocities.org/" class="friend" target="_blank" style="grid-column: 4; grid-row: 7;">
|
||||
<img src="pfp/anonicus.webp">
|
||||
<h1 class="caption">Anonicus</h1>
|
||||
</a>
|
||||
|
||||
<!-- <a href="https://example.com" class="friend" target="_blank" style="grid-column: 3; grid-row: 4;">
|
||||
<img src="pfp/vertka.png" >
|
||||
<h1 class="caption">Vertka</h1>
|
||||
</a> -->
|
||||
|
||||
<!-- <a href="" class="friend" target="_blank" style="grid-column: 4; grid-row: 7;">
|
||||
<img src="pfp/">
|
||||
<h1 class="caption">Example</h1>
|
||||
</a>-->
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,91 +0,0 @@
|
|||
body {
|
||||
background-color: black;
|
||||
color: white;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(8, 1fr); /* Create 8 columns of equal width */
|
||||
gap: 10px; /* Adjust the gap between grid items */
|
||||
width: 100%; /* Set the width to 100% of the viewport width */
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
.friend img {
|
||||
transition: transform 0.3s ease;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
margin: 0 auto;
|
||||
|
||||
}
|
||||
.friend img:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.caption {
|
||||
display: none; /* Initially hide the caption */
|
||||
text-align: center;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
text-shadow: -1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black, 1px 1px 0 black; /* Add a black outline */
|
||||
}
|
||||
|
||||
.friend:hover .caption {
|
||||
display: block; /* Display the caption when hovering over the image */
|
||||
}
|
||||
|
||||
.friend {
|
||||
text-align: center;
|
||||
animation: wiggle 0.5s ease-in-out infinite alternate; /* Make the image wiggle side to side */
|
||||
|
||||
}
|
||||
|
||||
|
||||
@keyframes wiggle {
|
||||
from {
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
to {
|
||||
transform: translateX(5px);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Stars */
|
||||
.star1 {
|
||||
width: 50px; /* Adjust the size of your star image */
|
||||
height: 50px; /* Adjust the size of your star image */
|
||||
background-image: url('star.png'); /* Replace 'star.png' with the path to your star image */
|
||||
background-size: cover;
|
||||
animation: rotateStar 5s linear infinite; /* Adjust animation duration and timing function as needed */
|
||||
}
|
||||
|
||||
.star2 {
|
||||
width: 50px; /* Adjust the size of your star image */
|
||||
height: 50px; /* Adjust the size of your star image */
|
||||
background-image: url('star.png'); /* Replace 'star.png' with the path to your star image */
|
||||
background-size: cover;
|
||||
animation: rotateStar 7s linear infinite; /* Adjust animation duration and timing function as needed */
|
||||
}
|
||||
.star3 {
|
||||
width: 50px; /* Adjust the size of your star image */
|
||||
height: 50px; /* Adjust the size of your star image */
|
||||
background-image: url('star.png'); /* Replace 'star.png' with the path to your star image */
|
||||
background-size: cover;
|
||||
animation: rotateStar 10s linear infinite; /* Adjust animation duration and timing function as needed */
|
||||
}
|
||||
|
||||
@keyframes rotateStar {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
|
@ -6,34 +6,24 @@
|
|||
<title>Home??</title>
|
||||
<link rel="icon" href="../static/site/favicon.png" type="image/x-icon">
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
<link rel="stylesheet" href="../default_style.css">
|
||||
</head>
|
||||
<body>
|
||||
<audio autoplay="" loop="" src="./Mi Casa Tu Casa [SWgIDXR8xR0].mp3"></audio>
|
||||
<div id="main">
|
||||
<div id="title">
|
||||
<div>
|
||||
<img src="../static/site/logo.png" id="melon">
|
||||
</div>
|
||||
<div>
|
||||
<h1>Pick something?</h1>
|
||||
</div>
|
||||
|
||||
<img src="start.png" alt="">
|
||||
<div id="menu">
|
||||
<div id="image-container">
|
||||
<img src="empty.png" id="large-image">
|
||||
</div>
|
||||
<div id="menu">
|
||||
<div id="image-container">
|
||||
<img src="empty.png" id="large-image">
|
||||
</div>
|
||||
<div id="seeds">
|
||||
<a href="./art/" class="seed" id="art"><img src="seed.png"></a>
|
||||
<a href="./shrine/" class="seed" id="shrine"><img src="seed.png"></a>
|
||||
<a href="./friends/" class="seed" id="friends"><img src="seed.png"></a>
|
||||
<a href="./stuff/" class="seed" id="stuff"><img src="seed.png"></a>
|
||||
</div>
|
||||
<div>
|
||||
<a href="./art/index.html" class="seed" id="art"><img src="seed.png"></a>
|
||||
<a href="./shrine/index.html" class="seed" id="shrine"><img src="seed.png"></a>
|
||||
<a href="./friends/index.html" class="seed" id="friends"><img src="seed.png"></a>
|
||||
<a href="./stuff/index.html" class="seed" id="stuff"><img src="seed.png"></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
const menuItems = document.querySelectorAll('.seed');
|
||||
<script>const menuItems = document.querySelectorAll('.seed');
|
||||
const largeImage = document.getElementById('large-image');
|
||||
const imageContainer = document.getElementById('image-container');
|
||||
|
||||
|
|
|
|||
|
|
@ -1,9 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
|
||||
|
||||
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Shrine</title>
|
||||
|
|
@ -12,34 +9,16 @@
|
|||
<link rel="icon" href="../../static/site/favicon.png" type="image/x-icon">
|
||||
</head>
|
||||
<body>
|
||||
<div class="grid-container">
|
||||
<div id="aphrodite2">
|
||||
<a href="ai/"><img src="aphrodite.png" id="aphrodite"></a>
|
||||
</div>
|
||||
<div id="eyes">
|
||||
|
||||
<a href="/Akarin" class="eye">
|
||||
<h1>Akarin</h1>
|
||||
<img src="./eyes/Akarin.png" alt="Akarin">
|
||||
</a>
|
||||
<a href="/Kokomin" class="eye">
|
||||
<img src="./eyes/Kokomin.png" alt="Kokomin">
|
||||
<h1>Kokomin</h1>
|
||||
|
||||
</a>
|
||||
<a href="./Frieren" class="eye">
|
||||
<h1>Frieren</h1>
|
||||
<img src="./eyes/Frieren.png" alt="Frieren">
|
||||
</a>
|
||||
<a href="./Pleroma-tan" class="eye">
|
||||
<img src="./eyes/Pleroma-tan.png" alt="Pleroma-tan">
|
||||
<h1>Pleroma-tan</h1>
|
||||
</a>
|
||||
<a href="./Yuki" class="eye">
|
||||
<h1>Yuki</h1>
|
||||
<img src="./eyes/Yuki.png" alt="Yuki">
|
||||
</a>
|
||||
|
||||
<div id="menu">
|
||||
<div id="aphrodite">
|
||||
<a href="ai/index.html"><img src="aphrodite.jpg" ></a>
|
||||
</div>
|
||||
<div>
|
||||
<h1>Akarin</h1>
|
||||
<h1>Kokomin</h1>
|
||||
<h1>Frieren</h1>
|
||||
<h1>Pleroma-tan</h1>
|
||||
<h1>Yuki</h1>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -1,50 +1,22 @@
|
|||
|
||||
body, html {
|
||||
overflow: hidden;
|
||||
margin: 1%;
|
||||
overflow: hidden; /* Prevents scrollbar from appearing */
|
||||
}
|
||||
#menu {
|
||||
width: 1300px; /* Sets the width of the div to 80% of the viewport */
|
||||
max-width: 80%; /* Ensures the div does not exceed 80% of the viewport width */
|
||||
margin: 0 auto; /* Centers the div horizontally */
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
#eyes {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
float: left;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: 40% 60%;
|
||||
grid-template-rows: 100vh;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
#aphrodite{
|
||||
|
||||
max-width: 100%; /* Ensures the image doesn't exceed its container's width */
|
||||
max-height: 80vh;
|
||||
height: auto; /* Maintains the aspect ratio of the image */
|
||||
#menu img {
|
||||
max-height: 50%;
|
||||
max-width: 50%;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
object-fit: contain;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
/* Eye class */
|
||||
.eye{
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.eye ~ a{
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
|
@ -1,18 +1,19 @@
|
|||
body, html {
|
||||
max-height: 100vh;
|
||||
max-width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow: hidden; /* Prevents scrollbar from appearing */
|
||||
}
|
||||
body {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#main{
|
||||
max-height: 100vh;
|
||||
max-width: 100%;
|
||||
|
||||
}
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
|
||||
#menu {
|
||||
width: 800px;
|
||||
height: 400px;
|
||||
|
||||
|
||||
|
||||
|
|
@ -22,17 +23,11 @@ body, html {
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
max-width: 100%;
|
||||
max-height: 70vh;
|
||||
height: auto;
|
||||
transition: transform 0.3s, scale 0.3s;
|
||||
|
||||
}
|
||||
#title{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
max-height: 30vh;
|
||||
}
|
||||
|
||||
p{
|
||||
color: dodgerblue;
|
||||
align-self: center;
|
||||
|
|
@ -48,8 +43,8 @@ p{
|
|||
justify-content: flex-start;
|
||||
}
|
||||
.seed {
|
||||
display: flex;
|
||||
|
||||
display: block;
|
||||
margin-bottom: 90px; /* Adjust the spacing between seeds as needed */
|
||||
}
|
||||
.seed img {
|
||||
transition: transform 0.3s ease;
|
||||
|
|
@ -57,25 +52,7 @@ p{
|
|||
.seed img:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
#seeds{
|
||||
height: 60vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#image-container {
|
||||
transition: opacity 0.5s ease; /* Fade transition */
|
||||
}
|
||||
|
||||
|
||||
@keyframes wiggle {
|
||||
0% { transform: rotate(0deg); }
|
||||
25% { transform: rotate(10deg); }
|
||||
50% { transform: rotate(-10deg); }
|
||||
75% { transform: rotate(10deg); }
|
||||
100% { transform: rotate(0deg); }
|
||||
}
|
||||
|
||||
#melon {
|
||||
animation: wiggle 2s ease infinite; /* Adjust duration and timing function for desired effect */
|
||||
}
|
||||
15
index.html
15
index.html
|
|
@ -8,17 +8,8 @@
|
|||
<link rel="stylesheet" href="styles.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="main">
|
||||
<div class="logo">
|
||||
<a href="home/">
|
||||
<img src="./static/site/logo.png" id="melon">
|
||||
</a>
|
||||
</div>
|
||||
<div id="text">
|
||||
<img src="ai_laptop_crying.png.webp">
|
||||
<h1>Um... e-excuse me... T-this website... uses music a lot, so... um... please remember to turn autoplay on!</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="home/">
|
||||
<img src="./static/site/logo.png" class="logo">
|
||||
</a>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
13
script.js
13
script.js
|
|
@ -1,13 +0,0 @@
|
|||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const background = document.querySelector('.background');
|
||||
const numLogos = 50; // Adjust the number of falling logos as needed
|
||||
|
||||
for (let i = 0; i < numLogos; i++) {
|
||||
const logo = document.createElement('div');
|
||||
logo.classList.add('falling-logo');
|
||||
logo.style.left = Math.random() * 100 + '%';
|
||||
logo.style.setProperty('--duration', (Math.random() * 5 + 3) + 's');
|
||||
background.appendChild(logo);
|
||||
}
|
||||
});
|
||||
|
||||
Binary file not shown.
Binary file not shown.
56
styles.css
56
styles.css
|
|
@ -1,47 +1,21 @@
|
|||
body, html {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
#main{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow: hidden; /* Prevents scrollbar from appearing */
|
||||
}
|
||||
|
||||
.logo img {
|
||||
transition: transform 0.5s ease-in-out;
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#text {
|
||||
opacity: 0;
|
||||
transition: opacity 0.5s ease-in-out;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 50vw;
|
||||
.logo {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
transition: transform 0.3s, scale 0.3s;
|
||||
}
|
||||
|
||||
#main:hover .logo img {
|
||||
transform: scale(1.5) rotate(360deg);
|
||||
}
|
||||
|
||||
#main:hover #text {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
|
||||
|
||||
body, html{
|
||||
font-family: CustomFont, sans-serif; /* Use the custom font as the fallback */
|
||||
}
|
||||
@font-face {
|
||||
font-family: CustomFont;
|
||||
src: url('static/fonts/c1-kenangan.regular.otf') format('truetype');
|
||||
.logo:hover {
|
||||
transform: scale(1.5) rotate(360deg); /* Rotates the logo 360 degrees */
|
||||
}
|
||||
Loading…
Add table
Reference in a new issue