mirror of
https://github.com/hnasheralneam/hnasheralneam.github.io.git
synced 2024-11-07 08:05:54 -05:00
Working on Second Page.
This commit is contained in:
parent
bc06e793cd
commit
e8e7702e98
3 changed files with 40 additions and 7 deletions
14
index.html
14
index.html
|
@ -17,14 +17,20 @@
|
||||||
Hi! I'm Squirrel!
|
Hi! I'm Squirrel!
|
||||||
</h1>
|
</h1>
|
||||||
<br><br>
|
<br><br>
|
||||||
<p class="about-me">I am not a web developer, but I do spend a lot time programming. I like CSS transitions and I think everyone should use them. I know HTML, CSS, JavaScript, and Electron, and am currently in the process of learing React and Node. Linux is my faviorite OS (I use Kubuntu, looking into Deepin). You can see my GitHub account <a href="https://github.com/Squirrel-314">here</a>, and check out all the organizations I am in alone. Like my repositories? Please put up issues for any mistakes, and if you have a suggestion, also make an issue. No, I didn't mean it that way, it's just eaisier for me to see.</p>
|
<p class="about-me">I am not a web developer, but I do spend a lot of time programming. I like CSS transitions and I think everyone should use them. I know HTML, CSS, JavaScript, and Electron, and am currently in the process of learing React and Node. Linux is my faviorite OS (I use Kubuntu, looking into Deepin). You can see my GitHub account <a class="hover-link" href="https://github.com/Squirrel-314">here</a>, and check out all the organizations I am in alone. Like my repositories? Please put up issues for any mistakes, and if you have a suggestion, also make an issue. No, I didn't mean it that way, it's just eaisier for me to see.</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="next" onclick="part2()">
|
<div class="next" onclick="document.location = '#vegetable-dash'">
|
||||||
<span class="arrow">⟶</span>
|
<span class="arrow">⟶</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- Vegetable Dash -->
|
||||||
<div class="block" id="vegetable-dash">
|
<div class="block" id="vegetable-dash">
|
||||||
hi
|
<!-- <div class="last" onclick="part1()">
|
||||||
|
<span class="arrow">⟵</span>
|
||||||
|
</div> -->
|
||||||
|
<!-- <div class="next" onclick="part3()">
|
||||||
|
<span class="arrow">⟶</span>
|
||||||
|
</div> -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
@ -34,7 +40,7 @@
|
||||||
<br>
|
<br>
|
||||||
<img class="display-image-light" src="Images/cheese.png" alt="">
|
<img class="display-image-light" src="Images/cheese.png" alt="">
|
||||||
<h2>Vegetable Dash!</h2>
|
<h2>Vegetable Dash!</h2>
|
||||||
<h4>My all new farming game! Uses JavaScript, and plenty of high quality MS Paint images!</h4>
|
<h4>My all new farming game! Uses JavaScript, and plenty of high quality MS Paint images! Plant and harvest various vegetables, while discovering new ones! Trade with merchants in the market! (Feature on its way)</h4>
|
||||||
<p>You can play it <a href="https://squirrel-314.github.io/vegetable-dash/Game/index.html">here</a>, and you can find the GitHub repository <a href="https://github.com/Squirrel-314/vegetable-dash">here</a>.</p>
|
<p>You can play it <a href="https://squirrel-314.github.io/vegetable-dash/Game/index.html">here</a>, and you can find the GitHub repository <a href="https://github.com/Squirrel-314/vegetable-dash">here</a>.</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="project" id="glish-translate">
|
<div class="project" id="glish-translate">
|
||||||
|
|
4
main.js
4
main.js
|
@ -1,3 +1 @@
|
||||||
function part2() {
|
// document.getElementById("vegetable-dash").scrollIntoView();
|
||||||
document.getElementById("vegetable-dash").scrollIntoView();
|
|
||||||
}
|
|
||||||
|
|
29
styles.css
29
styles.css
|
@ -43,10 +43,32 @@ Common Classes
|
||||||
font-weight: 900;
|
font-weight: 900;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.last {
|
||||||
|
height: 80px;
|
||||||
|
width: 80px;
|
||||||
|
background-color: #fff;
|
||||||
|
color: aquamarine;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 50px;
|
||||||
|
left: 50px;
|
||||||
|
box-shadow: 0 0 8px #262626;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 250%;
|
||||||
|
border-radius: 50%;
|
||||||
|
transition: 0.8s;
|
||||||
|
font-weight: 900;
|
||||||
|
}
|
||||||
|
|
||||||
.next:hover {
|
.next:hover {
|
||||||
transform: rotate(720deg);
|
transform: rotate(720deg);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.last:hover {
|
||||||
|
transform: rotate(720deg);
|
||||||
|
}
|
||||||
|
|
||||||
.arrow {
|
.arrow {
|
||||||
animation: nudge 3s linear infinite;
|
animation: nudge 3s linear infinite;
|
||||||
transition: .2s;
|
transition: .2s;
|
||||||
|
@ -74,6 +96,10 @@ Common Classes
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Links */
|
||||||
|
|
||||||
|
/* Should have nice hover that shows some content from link */
|
||||||
|
|
||||||
/*==================================================
|
/*==================================================
|
||||||
Landing
|
Landing
|
||||||
==================================================*/
|
==================================================*/
|
||||||
|
@ -164,6 +190,9 @@ Landing
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*==================================================
|
||||||
|
Vegetable Dash
|
||||||
|
==================================================
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue