Notoric
/
Portfolio
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: Notoric:d558d176527c92c92b42ddcc5424d0f74417dcc3
Branches Tags
Notoric:main
..
compare: Notoric:793d45647eb60f7cd0405e479cb893cf8281a961
Branches Tags
Notoric:main

No commits in common. "d558d176527c92c92b42ddcc5424d0f74417dcc3" and "793d45647eb60f7cd0405e479cb893cf8281a961" have entirely different histories.
d558d17652 ... 793d45647e

4 changed files with 7 additions and 67 deletions
Show Stats Expand all files Collapse all files

1
CNAME
View File

@ -1 +0,0 @@
notoric.net

5
index.html
View File

@ -5,13 +5,12 @@
<link rel="stylesheet" type="text/css" href="styles/global.css"> <link rel="stylesheet" type="text/css" href="styles/global.css">
</head> </head>
<body> <body>
<svg id="top-shrtct" fill="#eee" height="50px" width="50px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 330 330" xml:space="preserve" transform="rotate(270)"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <path id="XMLID_27_" d="M15,180h263.787l-49.394,49.394c-5.858,5.857-5.858,15.355,0,21.213C232.322,253.535,236.161,255,240,255 s7.678-1.465,10.606-4.394l75-75c5.858-5.857,5.858-15.355,0-21.213l-75-75c-5.857-5.857-15.355-5.857-21.213,0 c-5.858,5.857-5.858,15.355,0,21.213L278.787,150H15c-8.284,0-15,6.716-15,15S6.716,180,15,180z"></path> </g></svg>
<img id="nav-btn" src="/assets/plus.svg"> <img id="nav-btn" src="/assets/plus.svg">
<div id="navbar"> <div id="navbar">
<p id="logo">[Notoric]</p> <p id="logo">[Notoric]</p>
<div id="nav"> <div id="nav">
<a href="#aboutme">About</a>
<a href="projects.html">Projects</a> <a href="projects.html">Projects</a>
<a href="about.html">About</a>
<a href="contact.html">Contact</a> <a href="contact.html">Contact</a>
</div> </div>
<div id="links"> <div id="links">
@ -39,7 +38,7 @@
<div id="aboutme"> <div id="aboutme">
<h1>About Me</h1> <h1>About Me</h1>
<div id="box-with-title"> <div id="box-with-title">
<p>I am a <em id=age>22</em> year old Computer Science graduate from De Montfort University. For as long as I can remember, I have had a desire to tinker and solve logical problems. As a child, I found myself playing with circuit kits and components all the time. I loved creating a circuit as the instructions told me, and then modifying it to add features or change how it worked. When I got my first laptop I was extatic. I began hosting game servers for my friends, tinkering around in the settings and troubleshooting crashes or installing mods. I wrote my first script in python at the age of 12 and have never looked back since.</p> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div> </div>
</div> </div>
</main> </main>

31
scripts/homepage.js
View File

@ -1,5 +1,4 @@
const navbtn = document.getElementById('nav-btn'); const navbtn = document.getElementById('nav-btn');
const topshrtct = document.getElementById('top-shrtct');
navbtn.addEventListener('click', () => { navbtn.addEventListener('click', () => {
const navbar = document.getElementById('navbar'); const navbar = document.getElementById('navbar');
@ -7,33 +6,3 @@ navbtn.addEventListener('click', () => {
navbtn.classList.toggle('expanded'); navbtn.classList.toggle('expanded');
}); });
window.addEventListener('scroll', () => {
if (window.scrollY > 100) {
topshrtct.classList.add('visible');
} else {
topshrtct.classList.remove('visible');
}
});
topshrtct.addEventListener('click', () => {
if (window.scrollY > 100) {
window.scrollTo({ top: 0, behavior: 'smooth' });
}
});
async function updateAge() {
setInterval(() => {
const birthdate = new Date('2002-02-12T07:35:00Z');
let age = Date.now() - birthdate.getTime();
age = age / 31556952000;
age = age.toFixed(9);
const ageElement = document.getElementById('age');
ageElement.textContent = age;
console.log('Hello, world!');
}, 50);
}
updateAge();

37
styles/global.css
View File

@ -1,5 +1,4 @@
@import url('https://fonts.googleapis.com/css2?family=Fira+Mono:wght@400;500;700&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Fira+Mono:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400&display=swap');
body { body {
background-color: #111; background-color: #111;
@ -14,26 +13,6 @@ body {
overflow-y: scroll; overflow-y: scroll;
} }
#top-shrtct {
position: fixed;
bottom: 30px;
right: 30px;
height: 50px;
width: 50px;
padding: 20px;
background-color: #0008;
border-radius: 50%;
opacity: 0;
transition: opacity 0.3s ease;
z-index: 10;
}
#top-shrtct.visible {
opacity: 1;
cursor: pointer;
backdrop-filter: blur(6px);
}
#nav-btn { #nav-btn {
display: none; display: none;
} }
@ -265,10 +244,10 @@ em {
&::before { &::before {
content: ""; content: "";
position: absolute; position: absolute;
top: calc(50% - 75vw); top: calc(50% - 55vw);
left: calc(50% - 75vw); left: calc(50% - 55vw);
height: 150vw; height: 110vw;
width: 150vw; width: 110vw;
z-index: 0; z-index: 0;
background-image: repeating-conic-gradient( background-image: repeating-conic-gradient(
#ff0050 0%, #ff0050 0%,
@ -285,8 +264,6 @@ em {
height: fit-content; height: fit-content;
margin: auto; margin: auto;
position: relative; position: relative;
font-family: "Barlow", sans-serif;
font-size: 18px;
} }
#aboutme h1 { #aboutme h1 {
@ -303,10 +280,6 @@ em {
z-index: 2; z-index: 2;
} }
#age {
font-family: "Fira Mono", monospace;
}
@media screen and (max-width: 1100px) { @media screen and (max-width: 1100px) {
#logo { #logo {
@ -445,4 +418,4 @@ em {
width: 500px; width: 500px;
height: 500px; height: 500px;
} }
} }