r0r-5chach/CSY1018-assignment-1
r0r-5chach
/
CSY1018-assignment-1
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added tooltips above acronyms

This commit is contained in:
jpez 2022-03-09 16:34:28 +00:00
parent 14d49cacd6
commit 898003bccd
3 changed files with 49 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
home/index.css
View File

@ -124,6 +124,8 @@
display: block;
}
main > h1 {
main {
color: #E5E5E5;
}
font-size: larger;
}

28
home/index.html
View File

@ -14,19 +14,35 @@
</head>
<body>
<header class="title-card">
<a class="shownav menubutton" href="#clicked"></a>
<a class="link" href="./index.html"><h1>J-Pez Development</h1></a>
<a class="nav link" href="./index.html"><h1>J-Pez Development</h1></a>
</header>
<nav class="navigation">
<a class="link" id="port" href="../portfolio/portfolio.html"><h2>Portfolio</h2></a>
<a class="link" id="blog" href="../blog/blog.html"><h2>Blog</h2></a>
<a class="link" id="contact" href="../contact/contact.html"><h2>Contact</h2></a>
<a class="nav link" id="port" href="../portfolio/portfolio.html"><h2>Portfolio</h2></a>
<a class="nav link" id="blog" href="../blog/blog.html"><h2>Blog</h2></a>
<a class="nav link" id="contact" href="../contact/contact.html"><h2>Contact</h2></a>
</nav>
<main>
<h1>Welcome to my little corner of the Internet :)</h1>
<p id="intro">You might be wondering who I am and what I do. In which case, you are in luck.
This website was created by Joshua Perry (me) to showcase a little about myself, the accomplishments, and the projects I have completed
along the way.
</p>
<p id="past">
My interest in technology came at a young age, where I would frequently disassemble things around the house to see how they would work.
Throughout my life I continued to tinker and study in my own time never satisfied until I understood the inner-workings of anything thrown at me.
As I got older, I gained the opportunity to study Computing at secondary school where I had my first exposure to Python, <span class="moreInfo">HTML<span class="extraInfo" id="html">HyperText Markup Language</span></span>, <span class="moreInfo">CSS<span class="extraInfo" id="css">Cascading Style Sheet</span></span>, and <span class="moreInfo">JS<span class="extraInfo" id="js">JavaScript</span></span>.
This was also when I started to look at the theory behind the technology as I learned about boolean logic, binaray mathematics, and flowcharting.
I would go on to strengthen this knowledge at 6th Form learning C#, and <span class="moreInfo">SQL<span class="extraInfo" id="sql">Structured Query Language</span></span> alongside relational database theory, CPU and Memory architecture, technological legislation, and more.
</p>
<p id="present">
Currently, I study at the University of Northampton studying Software Engineering. This has given me knowledge in requirements engineering, design, Java, neworking concepts so far.
This website was originally created for my CSY1018 assignment on <span class="moreInfo">UoN's<span class="extraInfo"id="uon">Universirty of Northampton</span></span> BSc Computing(Software Engineering) course. However, I have continued to maintain and improve it to act as a direct, interactable testament to what I can achieve.
</p>
<p id="code">
All the source code for this site is available on <a class="link" href="https://github.com/jpez-development/CSY1018_assignment_1/" target="_blank" rel="noopener noreferrer">GitHub</a> so that those of you that are interested can see how it works too.
</p>
</main>
<aside class="bio">

24
style/main.css
View File

@ -51,6 +51,10 @@ main {
}
.link {
color: #e5e5e5;
}
.nav.link {
margin: 0;
opacity: 90%;
font-family: headers;
@ -66,7 +70,7 @@ main {
}
.link:hover {
nav > .link:hover {
border-bottom: 0.5em solid #32cd32;
}
@ -91,6 +95,24 @@ main {
border-bottom-right-radius: 10em;
}
.moreInfo {
position: relative;
}
.moreInfo:hover .extraInfo {
display:inline-block;
}
.extraInfo {
white-space: nowrap;
margin-top: -1.2em;
margin-left: -2em;
background-color: #000000;
color: #e5e5e5;
display: none;
z-index: 1000;
position: absolute;
}
@font-face {
font-family: headers;