Skip to content

Commit

Permalink
More updates
Browse files Browse the repository at this point in the history
  • Loading branch information
@nayakrujul
nayakrujul committed Sep 8, 2024
1 parent c094a8a commit f11678b
Show file tree
Hide file tree
Showing 21 changed files with 155 additions and 61 deletions.
109 changes: 95 additions & 14 deletions homepage.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,10 @@ h1#heading {
text-align: center;
vertical-align: middle;
display: flex;
}

h1#heading img#image {
display: inline;
width: 80%;
margin: auto;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: 100px;
}

h2.subheading {
Expand All @@ -32,6 +30,7 @@ h2.subheading {
font-size: 3rem;
padding-top: 15vh;
padding-bottom: 5vh;
scroll-margin: -20px;
}

div#header {
Expand All @@ -41,6 +40,54 @@ div#header {
height: 4rem;
background-color: rgba(255, 255, 255, 0.0);
z-index: 1000;

img#menu {
content: url("./menu-light.svg");
position: absolute;
left: 20px;
top: 15px;
height: calc(100% - 30px);
cursor: pointer;
}

img#logo {
height: 100%;
}

img#src {
content: url("./src-light.svg");
position: absolute;
right: 20px;
top: 15px;
height: calc(100% - 30px);
}

ul#menu-dropdown {
position: fixed;
left: 20px;
top: 3rem;
text-align: left;
font-size: 20px;
max-height: 0;
transition: max-height 0.5s ease-out;
overflow: hidden;
list-style: none;
padding: 0px;
background-color: inherit;

li {
margin: 10px 0px;
}

a:hover {
text-decoration: underline;
}
}

ul#menu-dropdown.show {
max-height: 200px;
transition: max-height 0.5s ease-in;
}
}

ul#header-list {
Expand All @@ -58,18 +105,32 @@ ul#header-list li {

ul.list {
display: flex;
flex-direction: column;
/* flex-direction: column; */
list-style: none;
text-align: center;
vertical-align: top;
padding-left: 0;
flex-wrap: wrap;
}

ul.list li {
display: inline-block;
display: flex;
margin: 2vw;
border: 2px solid black;
border-radius: 20px;
transition: background-color 200ms;
flex: 1 0 34%;
}

ul.list li a {
width: 100%;
padding: 5vw;
}

ul.list li:hover {
background-color: #eeeeee;
}

ul li strong.ul-header {
font-size: 2rem;
}
Expand All @@ -88,20 +149,22 @@ div#contact {
}

@media (max-width: 800px) {
div#header {
display: none;
ul.list li {
flex: 1 0 51%;
}
}

a {
color: inherit;
text-decoration: none;
font-style: italic;
}

a:hover {
filter: brightness(1.2);
text-decoration: underline;
.img-link img {
transition: filter 0.2s;
}

.img-link img:hover {
filter: brightness(0.8);
}

.wave {
Expand Down Expand Up @@ -138,6 +201,24 @@ a:hover {
}
}

@keyframes dropdown {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}

@keyframes lheight {
0% {
line-height: 0px;
}
100% {
line-height: normal;
}
}

.noselect {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
Expand Down
16 changes: 12 additions & 4 deletions homepage.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,6 @@ const hx = window.innerHeight * 0.95;
const hy = window.innerHeight * 1.1;

function scrolled() {
if (window.innerWidth <= 800) {
return;
}
let px = window.scrollY;
if (px >= hx) {
let a = Math.min((px - hx) / (hy - hx), 1);
Expand All @@ -15,13 +12,24 @@ function scrolled() {
let g = 65 + 146 * (1 - a);
let b = 102 + 109 * (1 - a);
div.style.color = `rgb(${r}, ${g}, ${b})`;
document.getElementById("src").style.content = `url("./src-dark.svg")`;
document.getElementById("menu").style.content = `url("./menu-dark.svg")`;
} else {
div.style.backgroundColor = `rgba(255, 255, 255, 0.0)`;
div.style.color = `lightgray`;
document.getElementById("src").style.content = `url("./src-light.svg")`;
document.getElementById("menu").style.content = `url("./menu-light.svg")`;
}
}

document.addEventListener("scroll", scrolled);
window.addEventListener("resize", scrolled);

scrolled();
scrolled();

function open_menu() {
let lst = document.getElementById("menu-dropdown");
lst.classList.toggle("show");
}

document.getElementById("menu").addEventListener("click", open_menu);
87 changes: 44 additions & 43 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,16 +17,19 @@
<body>

<div id="header">
<ul id="header-list">
<li><a href="#heading">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#python">Python Projects</a></li>
<li><a href="#websites">Websites</a></li>
<span class="img-link"><img id="menu" alt="Menu" /></span>
<ul id="menu-dropdown">
<li class="menu-link"><a href="#heading">Home</a></li>
<li class="menu-link"><a href="#about">About</a></li>
<li class="menu-link"><a href="#python">Python Projects</a></li>
<li class="menu-link"><a href="#websites">Websites</a></li>
</ul>
<a href="#top" class="img-link"><img id="logo" src="./logos-new/square.png" alt="Rujul Nayak" /></a>
<a href="https://github.com/nayakrujul/nayakrujul.github.io/" target="_blank" class="img-link"><img id="src" alt="GitHub" /></a>
</div>

<h1 id="heading">
<img id="image" src="./logos/square.png" alt="Rujul Nayak" />
Rujul Nayak
</h1>

<h2 id="about" class="subheading">About</h2>
Expand All @@ -42,61 +45,59 @@ <h2 id="about" class="subheading">About</h2>
<h2 id="python" class="subheading">Python Projects</h2>

<ul class="list">
<li>
<strong class="ul-header"><a href="https://thunno2.rujulnayak.com/run/">Thunno 2</a></strong> <br />
<a href="https://github.com/Thunno/Thunno2"><img src="./thunno_logo.svg" class="ul-image" /></a>
<p class="ul-description">Thunno 2 is a very concise code-golfing programming language that I made in 2023. It has 21 stars on GitHub and over 25,000 downloads on PyPI.</p>
</li>
<li>
<strong class="ul-header"><a href="https://misc.rujulnayak.com/Balance-Equation/">Balance Equation</a></strong> <br />
<a href="https://github.com/nayakrujul/balance-equation"><img src="./balance_equation.svg" class="ul-image" /></a>
<li><a href="https://github.com/Thunno/Thunno2">
<strong class="ul-header">Thunno 2</strong> <br />
<img src="./thunno_logo.svg" class="ul-image" />
<p class="ul-description">Thunno 2 is a very concise code-golfing programming language that I made in 2023. It has 21 stars on GitHub and over 33,000 downloads on PyPI.</p>
</a></li>
<li><a href="https://github.com/nayakrujul/balance-equation">
<strong class="ul-header">Balance Equation</strong> <br />
<img src="./balance_equation.svg" class="ul-image" />
<p class="ul-description">Balance Equation is a library that I wrote in 2022 to help me with my Chemistry homework. Given a chemical reaction equation, it will balance it using brute-force.</p>
</li>
</a></li>
</ul>

<ul class="list">
<li>
<strong class="ul-header"><a href="https://github.com/nayakrujul/plot-on-the-go">Plot On The Go</a></strong> <br />
<a href="https://github.com/nayakrujul/plot-on-the-go"><img src="./plot_on_the_go.svg" class="ul-image" /></a>
<li><a href="https://github.com/nayakrujul/plot-on-the-go">
<strong class="ul-header">Plot On The Go</strong> <br />
<img src="./plot_on_the_go.svg" class="ul-image" />
<p class="ul-description">Plot On The Go is a Python library which I created in 2022. It plots a graph while the data is being created so you don't have to wait for all the results to come in.</p>
</li>
<li>
<strong class="ul-header"><a href="https://github.com/nayakrujul/python-scripts">Python Scripts</a></strong> <br />
<a href="https://github.com/nayakrujul/python-scripts"><img src="./python_scripts.svg" class="ul-image" /></a>
</a></li>
<li><a href="https://github.com/nayakrujul/python-scripts">
<strong class="ul-header">Python Scripts</strong> <br />
<img src="./python_scripts.svg" class="ul-image" />
<p class="ul-description">Python Scripts is a collection of Python programs that I wrote between 2019 and 2022. It includes all sorts of programs, from image manipulation to games.</p>
</li>
</a></li>
</ul>

<h2 id="websites" class="subheading">Websites</h2>

<ul class="list">
<li>
<strong class="ul-header"><a href="https://cs.rujulnayak.com/">Computer Science Revision</a></strong> <br />
<a href="https://github.com/nayakrujul/CompSci"><img src="./csr.svg" class="ul-image" /></a>
<p class="ul-description">Computer Science Revision is a revision guide I created in 2024 to help GCSE Computer Science students.</p>
</li>
<li>
<strong class="ul-header"><a href="https://vtp6.rujulnayak.com/">VTP6</a></strong> <br />
<a href="https://github.com/vtp6/vtp6.github.io"><img src="./vtp6.svg" class="ul-image" /></a>
<p class="ul-description">VTP6 is an online platform that I created in 2023 to help language students learn vocabulary.</p>
</li>
<li><a href="https://cs.rujulnayak.com/">
<strong class="ul-header">CS.RN</strong> <br />
<img src="./csr.svg" class="ul-image" />
<p class="ul-description">Computer Science Revision is a revision guide I created in 2024 to help GCSE and A Level Computer Science students.</p>
</a></li>
<li><a href="https://vtp6.rujulnayak.com/">
<strong class="ul-header">VTP6</strong> <br />
<img src="./vtp6.svg" class="ul-image" />
<p class="ul-description">Vocabulary Testing Program 6 is an online platform that I created in 2023 to help language students learn vocabulary.</p>
</a></li>
</ul>

<ul class="list">
<li>
<strong class="ul-header"><a href="https://flashcards.rujulnayak.com/">Flashcards</a></strong> <br />
<a href="https://github.com/flashcards7/flashcards7.github.io"><img src="./flashcards.svg" class="ul-image" /></a>
<li><a href="https://flashcards.rujulnayak.com/">
<strong class="ul-header">Flashcards</strong> <br />
<img src="./flashcards.svg" class="ul-image" />
<p class="ul-description">Flashcards is a website that I created in 2023. It contains activities for Maths, Biology, and Physics.</p>
</li>
<li>
<strong class="ul-header"><a href="https://misc.rujulnayak.com/">Miscellaneous</a></strong> <br />
<a href="https://github.com/nayakrujul/misc"><img src="./old-logos/icon-black.png" class="ul-image" /></a>
</a></li>
<li><a href="https://misc.rujulnayak.com/">
<strong class="ul-header">Miscellaneous</strong> <br />
<img src="./logos/icon-black.png" class="ul-image" />
<p class="ul-description">The Miscellaneous site contains some other HTML projects that I have made, starting from 2024.</p>
</li>
</a></li>
</ul>

<!-- <div id="contact" data-aidaform-widget="form-2019-12" data-url="https://thethonnu.aidaform.com/free-basic-contact-form" data-width="100%" data-height="500px" data-do-resize></div><script>(function(){var r,d=document,gt=d.getElementById,cr=d.createElement,tg=d.getElementsByTagName,id="aidaform-embed";if(!gt.call(d,id)){r=cr.call(d,"script");r.id=id;r.src="https://embed.aidaform.com/embed.js";(d.head || tg.call(d,"head")[0]).appendChild(r);}})()</script> -->

<script src="./homepage.js"></script>

</body>
Expand Down
0 logos/square.png → logos-new/square.png
View file
File renamed without changes
0 old-logos/icon-black.png → logos/icon-black.png
View file
File renamed without changes
0 old-logos/icon-colour.png → logos/icon-colour.png
View file
File renamed without changes
0 old-logos/icon-white.png → logos/icon-white.png
View file
File renamed without changes
0 old-logos/logo-black-transparent.png → logos/logo-black-transparent.png
View file
File renamed without changes
0 old-logos/logo-black.png → logos/logo-black.png
View file
File renamed without changes
0 old-logos/logo-black.svg → logos/logo-black.svg
View file
File renamed without changes
0 old-logos/logo-colour-transparent.png → logos/logo-colour-transparent.png
View file
File renamed without changes
0 old-logos/logo-colour.png → logos/logo-colour.png
View file
File renamed without changes
0 old-logos/logo-colour.svg → logos/logo-colour.svg
View file
File renamed without changes
0 old-logos/logo-no-background.svg → logos/logo-no-background.svg
View file
File renamed without changes
0 old-logos/logo-white-transparent.png → logos/logo-white-transparent.png
View file
File renamed without changes
0 old-logos/logo-white.png → logos/logo-white.png
View file
File renamed without changes
0 old-logos/logo-white.svg → logos/logo-white.svg
View file
File renamed without changes
1 change: 1 addition & 0 deletions menu-dark.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions menu-light.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions src-dark.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions src-light.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit f11678b

Please sign in to comment.