Skip to content

Commit

Permalink
V3.0.0
Browse files Browse the repository at this point in the history
  • Loading branch information
@frs99
frs99 committed Aug 10, 2022
0 parents commit af2b615
Show file tree
Hide file tree
Showing 37 changed files with 1,070 additions and 0 deletions.
40 changes: 40 additions & 0 deletions 404.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ERROR</title>
<!-- CSS & FAVICON -->
<link href="../assets/css/error.css" rel="stylesheet" type="text/css">
<link href="../assets/img/favicon.ico" rel="icon" type="assets/img/png">
<script>
window.onload = function(){
document.body.style.backgroundImage = "url('../assets/img/background.jpg')";
};
</script>
<!--FONTS-->
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@600&display=swap" rel="stylesheet">
<!-- font-family: 'Nunito', sans-serif; -->

<!-- RESPONSIVE -->
<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- COLOR FOR HEADER BAR -->
<!-- Chrome, Firefox OS and Opera -->
<meta name="theme-color" content="#202020">
<!-- Windows Phone -->
<meta name="msapplication-navbutton-color" content="#202020">
<!-- iOS Safari -->
<meta name="apple-mobile-web-app-status-bar-style" content="#202020">
</head>
<body>
<main class="main-error">
<section>
<img src="../assets/img/404.png">
<a href="https://frscodes.github.io/">HOME</a>
</section>
</main>
<script src="../assets/js/script.js"></script>
</body>
</html>
3 changes: 3 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
Old version of the website
The version number is: V3
https://frscodes.github.io/
143 changes: 143 additions & 0 deletions aboutme.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,143 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>FrsCodes About me</title>

<!-- FOR LINK - CSS & FONT -->
<script src="https://kit.fontawesome.com/1a4bb73a43.js" crossorigin="anonymous"></script>
<link href="assets/img/favicon.ico" rel="icon" type="assets/img/png">
<link href="assets/css/header.css" rel="stylesheet" type="text/css">
<link href="assets/css/aboutme.css" rel="stylesheet" type="text/css">

<!-- RESPONSIVE -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="assets/css/media/media-home.css" rel="stylesheet" type="text/css">

<!--FONT-->
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@600&display=swap" rel="stylesheet">
<!-- font-family: 'Nunito', sans-serif; -->

<!-- COLOR FOR HEADER BAR -->
<!-- Chrome, Firefox OS and Opera -->
<meta name="theme-color" content="#202020">
<!-- Windows Phone -->
<meta name="msapplication-navbutton-color" content="#202020">
<!-- iOS Safari -->
<meta name="apple-mobile-web-app-status-bar-style" content="#202020">

</head>
<body>
<!--START HEADER-->
<header>
<section class="allforheader">
<!--LOGO FOR HEADER-->
<div class="name-logo">
<a href="index.html"><img src="assets/img/logo.png" alt="logo"></a>
</div>
<!--NAVBAR img for responsive-->
<div class="navbar">
<i class="fas fa-bars"></i>
<i class="fas fa-times close"></i>
</div>
<!--THE LIST-->
<div class="list">
<ul class="ullist">
<li class="lilist"><a class="lnklst" href="https://frscodes.github.io/index">Home</a></li>
<li class="lilist"><a class="lnklst" href="https://frscodes.github.io/soon">About Me</a></li>
<li class="lilist"><a class="lnklst" href="https://frscodes.github.io/soon">My Services</a></li>
<!-- BUTTON: ORDER NOW-->
<li class="lilist"><a class="orderbtn" href="https://frscodes.github.io/soon">Order Now</a></li>
</ul>
</div>
<!--BUTTON FOR ORDER-->
<div class="order">
<a class="btnorder" href="https://frscodes.github.io/soon">Order Now</a>
</div>
</section>
</header>
<!-- END HEADER -->
<!-- START MAIN -->
<main>
<!--START LIST-->
<section class="list_about">
<!-- list ABOUT ME -->
<a href="#">
<div class="boxtitle">
<div class="boximg">
<img src="assets/img/img-aboutme/man-user.png">
</div>
<div class="boxtxt">
<p>About me</p>
</div>
</div>
</a>

<!-- list RESUME -->
<a href="#">
<div class="boxtitle">
<div class="boximg">
<img src="assets/img/img-aboutme/resume-and-cv.png">
</div>
<div class="boxtxt">
<p>Resume</p>
</div>
</div>
</a>

<!-- list PORTFOLIO -->
<a href="#">
<div class="boxtitle">
<div class="boximg">
<img src="assets/img/img-aboutme/suitcase.png">
</div>
<div class="boxtxt">
<p>Portfolio</p>
</div>
</div>
</a>

<!-- list SERVICE -->
<a href="#">
<div class="boxtitle">
<div class="boximg">
<img src="assets/img/img-aboutme/customer.png">
</div>
<div class="boxtxt">
<p>Service</p>
</div>
</div>
</a>

<!--LIST CONTACT-->
<a href="#">
<div class="boxtitle">
<div class="boximg">
<img src="assets/img/img-aboutme/contact.png">
</div>
<div class="boxtxt">
<p>Contact</p>
</div>
</div>
</a>
<div id="respoclick">
<img src="assets/img/icons/right-arrow.png">
</div>
</section>
<section class="info_about">
<!-- BOX ABOUT ME -->
<section class="box_aboutme">
<div class="myinfo">
<h1 class="myname">FrsCodes</h1>
<p class="whtim">Full stack web developer<br>
and (UX / UI) with info security</p>
</div>
<div class="backaboutme">
<img src="assets/img/logo_aboutme.png">
</div>
</section>
</section>
</main>
<script src="assets/js/script.js"></script>
</body>
</html>
155 changes: 155 additions & 0 deletions assets/css/aboutme.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,155 @@
@charset "utf-8";
*{
font-family: 'Nunito', sans-serif;
padding: 0px;
margin: 0px;
box-sizing: border-box;
text-decoration: none;
list-style: none;
-webkit-tap-highlight-color:transparent;
}

/* SCROLLBAR */
::-webkit-scrollbar {
width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
background: #F1FAEE;
}

/* Handle */
::-webkit-scrollbar-thumb {
background: #202020;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: #303030;
}

/**********************/
img {
pointer-events: none;
}
a{
user-select: none;
}
/* MAIN */
main{
position: relative;
margin:0 auto;
width:100%;
background-color: #F1FAEE;
}
/* list */
main .list_about{
/*background-color:#131313;*/
height:370px;
position: fixed;
top:0;
bottom:0;
margin: auto;
left:40px;
border-radius:10px;
padding:5px;
width:69px;
z-index:100;
}
/************/
main .list_about .boxtitle{
display:flex;
align-items: center;
background-color:#131313;
padding:5px;
border-radius:10px;
/*width:150px;*/
width:60px;
overflow: hidden;
margin:10px 0;
transition: width 0.2s;
} main .list_about .boxtitle:hover{width:150px;background-color: #202020;}
main .list_about .boxtitle:hover p{display:block;}
main .list_about .boxtitle:hover .boxtxt{background-color: #202020;}
main .list_about .boxtitle p{
height:22px;
color:#ffffff;
margin-left:8px;
display: none;
} main .list_about .boxtitle p:hover{color: #d6d6d6;}

main .list_about .boxtitle .boximg{
width: 50px;
min-width:50px;
height: 50px;
position: relative;
border-radius: 10px;
transition:background-color 0.3s;
} /*main .list_about .boxtitle .boximg:hover{background-color: #303030;}*/
main .list_about .boxtitle .boxtxt{
padding: 14px 0;
width: 90px;
min-width:90px;
background-color:#131313;
}
main .list_about .boxtitle .boximg img{
position: absolute;
top:0; bottom:0; left:0; right:0; margin:auto;
width:30px;
}
main .list_about #respoclick{
background-color:#131313;
position: relative;
height:50px;
width:30px;
left: 100%;
top: -97%;
}
main .list_about #respoclick img{
width:25px;
position: absolute;
top: 0;
bottom: 0;
margin: auto;
}
/****** END *******/

/* ALL BOX FOR INFO */
main .info_about{
width:100%;
max-width:1920px;
margin:0 auto;
overflow: hidden;
position: relative;
}
main .info_about .backaboutme{
/*position: absolute;
right:-70px;
top:100px;*/
margin-left:12%;
width: 1000px;
margin-top:95px;
}
main .info_about .backaboutme img{
width:960px;
}
main .info_about .box_aboutme{
width:65%;
max-width:1920px;
margin:0 auto;
padding:60px 0;
}
main .info_about .box_aboutme .myinfo{
position: absolute;
margin-top:35px;
}
main .info_about .box_aboutme .myinfo h1{
font-size:90px;
font-weight: bold;
color: #32383f;
}
main .info_about .box_aboutme .myinfo p{
font-size:23px;
color: #45505b;
}
Loading

0 comments on commit af2b615

Please sign in to comment.