Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
@vougioukakis
vougioukakis authored Apr 1, 2024
1 parent 5b7e739 commit edbbe81
Show file tree
Hide file tree
Showing 2 changed files with 82 additions and 38 deletions.
43 changes: 25 additions & 18 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,27 +43,45 @@

<!-- left panel -->
<div class="contents" id="my-card">
<div class="home card">
<div class="home card" id="my-card-inner">
<div class="info">
<div>
<h1 id="name-text" style="margin-top: 0px; margin-bottom: 0px; color: #d1ecf8;">Nikos Vougioukakis</h1>
</div>
<p style="display: flex; flex-direction: column; justify-content: center; margin: 0; align-items: center;">
Mathematics student at &nbsp;
<p style="justify-content: center; margin: 0; align-items: center;">
Mathematics student at
<a class="link" href="http://math.uoc.gr/en/index.html" target="_blank">University of Crete</a>
</p>
<img class="uoc" src="src/Logo.png">



</div>

<div class="header">
<div class="nav">
<nav>
<ul id="nav-list">
<li><a class="current nav" id="homeNav" onclick="loadContent('home')">Home</a></li>
<li><a class="not-current nav" id="eduNav" onclick="loadContent('education')">Education</a></li>
<!--<li><a href="#" class="not-current" id="projNav">Projects</a></li>
<li><a href="#" class="not-current">Learning</a></li>-->
</ul>
</nav>
</div>
</div>

<footer class="footer">

<div class="buttons-div">
<a href="https://www.linkedin.com/in/nikolaos-vougioukakis-66a2b7256/" style="background-color: #0077b5;" target="_blank" class="buttons"><i class="fab fa-linkedin"></i></a>
<a href="https://github.com/vougioukakis" class="buttons" target="_blank"><i class="fab fa-github"></i></a>
<a class="buttons" style="background-color: #C71610; cursor: pointer;" onclick="toggleMail();"><i class="fab fa-google"></i></a>
</div>


</div>
<div id="mailBox" style="display: none; "><p style="font-size: 14px;">Gmail: vougioukakis99 (at) gmail (dot) com</p></div>
</div>

<footer class="footer">
<p style="font-size: 10px;">Nikolaos Vougioukakis 2024</p>
<p style="font-size: 10px;">Background designed by Freepik</p>
</footer>
Expand All @@ -76,18 +94,7 @@ <h1 id="name-text" style="margin-top: 0px; margin-bottom: 0px; color: #d1ecf8;">
<!-- right -->

<div class="contents-flexbox" id="right">
<div class="header">
<div class="nav">
<nav>
<ul>
<li><a class="current nav" id="homeNav" onclick="loadContent('home')">Home</a></li>
<li><a class="not-current nav" id="eduNav" onclick="loadContent('education')">Education</a></li>
<!--<li><a href="#" class="not-current" id="projNav">Projects</a></li>
<li><a href="#" class="not-current">Learning</a></li>-->
</ul>
</nav>
</div>
</div>



<div class="contents-x2" id="mainContent">
Expand Down
77 changes: 57 additions & 20 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -111,46 +111,53 @@ body::-webkit-scrollbar {
text-align: center;
bottom: 0;
width: 100%;
height: 2.5rem; /* footer height */
padding-top: 1rem;
height: 6rem; /* footer height */
/*! padding-top: 1rem; */
margin-top: auto;
padding-bottom: 10px;
padding-bottom: 24px;
}


/*------- HEADER - NAVBAR --------*/
.header {
color: #fff;
padding: 10px;
padding-top: 2vh;
margin-bottom: 2vh;
display: block;
/*! padding-top: 2vh; */
/*! margin-bottom: 2vh; */
display: flex;
text-align: right;
/*box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5), inset 0px 20px 20px 3px rgba(255, 255, 255, 0.08)*/
flex-direction: column;
/*! border-top: 2px solid #0b182283; */
}

nav ul {

list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
text-align: center;
}

nav ul li {
display: inline;
margin-right: 20px;
/*! margin-right: 20px; */
margin-block: 0.2em;
}

nav a {
text-decoration: none;
color: #fff;
font-weight: bold;
font-size: 28px;
font-size: 1.5em;
}

nav {
margin: 0 auto;
display: block;
display: flex;
flex-direction: column;
}

.current {
Expand All @@ -159,6 +166,8 @@ nav {
border-bottom-style: solid;
transition: color .2s;
transition: border-bottom-style .2s;
-webkit-transition: color .2s;
-webkit-transition: border-bottom-style .2s;

}

Expand All @@ -167,6 +176,8 @@ nav {
border-bottom-style: none;
transition: color .2s;
transition: border-bottom-style .2s;
-webkit-transition: color .2s;
-webkit-transition: border-bottom-style .2s;
}

.not-current:hover{
Expand Down Expand Up @@ -203,6 +214,7 @@ nav {
position: fixed;
height: 98vh;
width: 64vw;
/*! margin-top: 1em; */
}


Expand All @@ -222,6 +234,7 @@ nav {
display: flex;
flex-direction: row;
gap: 10px;
padding-top: 1em;
}

.card{ /* general card class */
Expand Down Expand Up @@ -260,6 +273,7 @@ nav {
display: flex;
flex-direction: column;
padding: 1em;
/*! border-bottom: 2px solid #4CB9E7; */
}

#my-card{ /* left panel of screen card */
Expand All @@ -272,7 +286,7 @@ nav {

/* scrollbar fix*/

-ms-overflow-style: none; /* IE and Edge */
/* IE and Edge */
scrollbar-width: none; /* Firefox */
}
/* Hide scrollbar for Chrome, Safari and Opera */
Expand Down Expand Up @@ -325,7 +339,7 @@ p{
margin-right: 1px;
color: #d1ecf8;
}#name-text { /* seems to overflow at larger zooms */
font-size: 34px;
font-size: 1.7em;
padding-bottom: 8px;
}

Expand Down Expand Up @@ -368,7 +382,7 @@ nav {
.uoc {
width: 50px;
margin: 0 auto;
margin-top: 10px;
margin-block: 10px;
}


Expand Down Expand Up @@ -437,7 +451,7 @@ a.fill-div {
/*------- BUTTONS -------*/

.buttons-div{
padding-block: 20px;
padding-block: 0;
}
.buttons{
display: inline-block;
Expand All @@ -447,22 +461,20 @@ a.fill-div {
/*border-radius: 5px;*/
box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.3);
transition: box-shadow .2s;
padding: 8px 16px;
/*! padding: 8px 16px; */
margin: 0px;
margin-top: 10px;
margin-bottom: 10px;
padding-inline: 26px;


padding: 3% 8%;
}

.buttons:hover {
box-shadow: 0 5px 12px 0px rgba(0,0,0,.5);
}




#bg {
height: screen;
overflow: hidden;
Expand All @@ -487,7 +499,7 @@ a.fill-div {
}
.buttons{
display: inline-block;
padding-inline: 26px;
/*! padding-inline: 26px; */
}

.profile img{
Expand All @@ -511,8 +523,9 @@ a.fill-div {
body{
overflow-y: scroll;
overflow-x:hidden ;
background-image: none; /* vertical variant for the bg */
background-image: none;
background-color: #174f7d;
padding-bottom: 26px;
}
#content-wrap{
flex-direction: column;
Expand All @@ -532,14 +545,38 @@ a.fill-div {
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.35);
}

#my-card-inner{
padding: 0px;
}

.nav{
margin: 0 auto;
}

.nav ul li{
margin-inline: 10px;
}

#nav-list{
flex-direction: row;
}

.nav a{
font-size: 1em;
}

.current{
border-bottom-width: 0;
}

.header {
background-image: url('src/blue-wavy-background-blur.webp');
position: fixed;
width: 100%;
display: flex;
bottom: 0;
flex-direction: row;
padding-right: 0vw;
padding:10px;
margin: 0 auto;
}

Expand Down

0 comments on commit edbbe81

Please sign in to comment.