Skip to content

Commit

Permalink
Update site styling and content
Browse files Browse the repository at this point in the history
  • Loading branch information
@Anto426
Anto426 committed Sep 24, 2024
1 parent 045dc16 commit 89a1dff
Show file tree
Hide file tree
Showing 4 changed files with 96 additions and 156 deletions.
90 changes: 54 additions & 36 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,47 +1,65 @@
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<!-- Meta -->
<meta charset="UTF-8">
<!-- Title and Icon -->
<link rel="icon" href="./src/multimedia/icon.ico" type="image/x-icon">
<title>Anto's site</title>
<!-- Bootstrap Css-->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<!-- Bootstrap Js -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<!-- Bootstrapicon -->
<meta name="author" content="Anto426">
<!-- Title -->
<title>Anto's Site</title>
<!-- Bootstrap-->
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
crossorigin="anonymous"
>
<!-- Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
<!-- Bootstrap Icons -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css">
<!-- Custom Js -->
<!-- Icon -->
<link rel="icon" href="./src/multimedia/icon.ico">
<!-- CSS -->
<link rel="stylesheet" href="./src/css/style.css">
<!-- JS -->
<script src="./src/js/index.js"></script>
<!-- Custom Css -->
<link rel="stylesheet" href="./src/css/index.css">
</head>
<!-- Body -->
<body class="bg-body anto-bg-gradient">
<div class="container-fluid d-flex justify-content-center align-items-center vh-100">
<div class="container-fluid container-fluid d-flex justify-content-center align-items-center" id="main-container">
<div class="text-center">
<img src="./src/multimedia/pfp.jpeg" class="img-fluid" id="logoimg">
<hr>
<h4 class="h4">アントネッロ</h4>
<h6 class="p">Anto426</h6>
</div>
<div class="text-center">
<hr>
<p class="h7">—͟͞͞💫】About Me:</p>
<p class="h7" id="aboutmefild">
</p>
<hr>
<p class="h7">—͟͞͞📱】Social:</p>
<a href="https://x.com/anto4_2_6" class="btn btn-outline-primary btn-sm m-1" target="_blank">
<i class="bi bi-x"></i>
Twitter
</a>
<a href="https://github.com/Anto426/" class="btn btn-outline-dark btn-sm m-1" target="_blank">
<i class="bi bi-github"></i>
GitHub
</a>
<body class="body anto-bg-gradient">
<div class="container-fluid d-flex flex-row justify-content-center align-items-center h-100 w-100">
<div class="container d-flex flex-column justify-content-start align-items-center" id="anto-prymarybox">
<div class="p-2 d-flex flex-column">
<div class="p-5 d-flex justify-content-center" id="anto-logocontainer">
<img src="./src/multimedia/pfp.jpeg" class="img-fluid" id="anto-logo">
<div class="container w-auto m-0">
<h3 class="h3">アントネッロ</h3>
<h4 class="h4">Anto426</h4>
<i class="bi bi-heartbreak-fill"></i>
<hr>
</div>
</div>
<div class="p-5 d-flex flex-column justify-content-center align-items-center">
<h4 class="h4">—͟͞͞💫】About Me:</h4>
<h6 class="p">
I'm a high school student who likes
programming 💻✨
</h6>
</div>
<div class="p-5 d-flex flex-column justify-content-center align-items-center">
<h4 class="h4 ">—͟͞͞📱】Social:</h4>
<div class="p-1 w-100">
<a href="https://x.com/anto4_2_6" class="btn btn-outline-primary btn-lg m-1 w-100" target="_blank">
<i class="bi bi-x w-100"></i>
Twitter
</a>
</div>
<div class="p-1 w-100">
<a href="https://github.com/Anto426/" class="btn btn-outline-dark btn-lg m-1 w-100" target="_blank">
<i class="bi bi-github"></i>
GitHub
</a>
</div>
</div>
</div>
</div>
</div>
Expand Down
42 changes: 0 additions & 42 deletions src/css/index.css
View file

This file was deleted.

42 changes: 42 additions & 0 deletions src/css/style.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
.anto-bg-gradient {
background: radial-gradient(circle, #63034efd, #9202d4, #940b76fd);
background-size: 300% 300%;
animation: animationbg 20s alternate infinite;
height: 100vh;
width: 100vw;
}

#anto-prymarybox {
background-color: rgb(255, 255, 255, 0.4);
height: 700px;
width: 1000px;
border-radius: 80px;
padding: 30px;
}

#anto-logo {
height: 120px;
width: 120px;
border-radius: 100px;
border: white 2px solid;
margin: 0, 0, 0, 0;
}

#anto-logocontainer {
height: auto;
width: auto;
align-items: center;
margin: 0, 0, 10px, 0;

}

@keyframes animationbg {
0% {
background-position: 0% 50%;
}

100% {
background-position: 100% 50%;
}

}
78 changes: 0 additions & 78 deletions src/js/index.js
View file
Original file line number Diff line number Diff line change
@@ -1,78 +0,0 @@
const rootStyles = getComputedStyle(document.documentElement);

const layoutroot = document.getElementById('layoutroot');


document.addEventListener("DOMContentLoaded", function () {
changertextinterval("I'm a high school student who like Information and Communications Technology 💻✨", 'aboutmefild');
});


function changetext(text, campo) {
for (let i = 0; i < text.length; i++) {
setTimeout(() => {
campo.innerHTML += text[i];
}, 50 * i);
}
setTimeout(() => {
campo.innerHTML = "";
}, 6000);
}

function changertextinterval(text, idtext) {
let campo = document.getElementById(idtext);
changetext(text, campo);
setInterval(() => {
changetext(text, campo);
}, 6000);
}







/*
const rootStyles = getComputedStyle(document.documentElement);
const layoutroot = document.getElementById('layoutroot');
document.addEventListener("DOMContentLoaded", function () {
let textchenger = new Textchenger()
textchenger.changertextinterval("I'm a high school student who likes Information and Communications Technology 💻✨", 'aboutfild')
});
class Textchenger {
constructor() {
this.timesinglechar = 4
}
changetext(text, campo) {
return new Promise(async (resolve) => {
for (let i = 0; i < text.length; i++) {
await setTimeout(() => {
campo.innerHTML += text[i];
}, this.timesinglechar)
}
resolve(0)
})
}
changertextinterval(text, idtext) {
let campo = document.getElementById(idtext);
this.changetext(text, campo)
.then(() => {
console.log(idtext)
})
}
}
*/

0 comments on commit 89a1dff

Please sign in to comment.