homepage done

662a1c89 · benjamin.sitbon · 285233c3 · 662a1c89 · 662a1c89 · 662a1c89
Commit 662a1c89 authored 4 years ago by benjamin.sitbon
--- a/frontend/cart.html
+++ b/frontend/cart.html
@@ -18,7 +18,7 @@
    <nav>
       
        
-        <a href="shop.html" id="back">BACK TO SHOP</a>
+        <a href="shop.html" id="back">SHOP</a>
        <p id="fill">BAG</p>
        
    </nav>

--- a/frontend/img/Dym19R.jpg
+++ b/frontend/img/Dym19R.jpg
--- a/frontend/img/Pokemon-Legends-Arceus.jpg
+++ b/frontend/img/Pokemon-Legends-Arceus.jpg
--- a/frontend/img/pokemon-wallpaper-preview.jpg
+++ b/frontend/img/pokemon-wallpaper-preview.jpg
--- a/frontend/index.css
+++ b/frontend/index.css
+@font-face {
+    font-family: gb;
+    src: url(font/Arvo-Regular.ttf);
+}
+
+
+@font-face {
+    font-family: title;
+    src: url(font/LMS\ Pokemon\ Master\ Solid.ttf);
+}
+
+*{
+    margin:0;
+    padding: 0;
+    list-style: none;  
+    overflow-x: hidden;
+    font-family: gb;
+       
+}
+
+nav{
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    width: 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    
+}
+
+a{
+    text-decoration: none;
+}
+
+
+.fill {
+    
+    margin-right: 1vw;
+    margin-left: 1vw;
+    width: 10vw;
+    height: 2.75vw; 
+    margin-top: 6.5vh;
+    text-align: center;
+    font-size: 2.25vw;
+    font-family: gb;
+    background-color: rgb(255, 255, 255);
+    mix-blend-mode: screen;
+    overflow: hidden;
+    border-radius: 5px 5px;
+    backdrop-filter: blur(8px);
+    cursor: pointer;
+    transition: 0.75s ease-in;
+    color: rgb(53, 53, 53);
+}
+
+#fill {
+    border-radius: 20px 20px;
+    font-size: 5vw;
+    width: 35vw;
+    height: 6vw; 
+    margin-top: 2.5vh;
+}
+
+
+
+
+main {
+    width: 100%;
+    height: 100vh;
+    background-image:url(img/Dym19R.jpg);
+    background-position: center center;
+    background-size: cover;
+    background-repeat: no-repeat;
+    background-attachment: fixed;
+    background-origin: padding-box;
+    background-clip: border-box;
+    background-color: #ccc;
+
+}
+
+#desc {
+
+    position: relative;
+    top: 50%;
+    left: 50%;
+    width: 75%;
+    background-color: rgba(0, 0, 0, 0.597);
+    backdrop-filter: blur(20px);
+    border-radius: 10px;
+    transform: translate(-50%,-50%);
+    color: white;
+
+}
+
+#title{
+
+    font-size: 4vw;
+
+}
+
+#text{
+    margin-top: 2vh;
+    margin-bottom: 2vh;
+    font-size: 2vw;
+
+}
\ No newline at end of file
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -5,39 +5,32 @@
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

-    <link rel="stylesheet" href="style.css">
-    <link rel="stylesheet" href="menu.css">
-    <title>Pokeshop</title>
+    <link rel="stylesheet" href="index.css">
+    <title>Homepage</title>
 </head>
 <body>

    <nav>
-        <div class="shop">
-            <img src="img/player.svg" id="logo">
-        </div>
-        
-        <p id="fill">POKESHOP</p>
-        <div class="shop">
-
-            <a id="sac"></a>
-        </div>
-        
+            <a href="shop.html" class="fill" >SHOP</a>
+            <p id="fill" class="fill">HOMEPAGE</p>
+            <a href="price.html" class="fill">PRICES</a>

    </nav>

-    <main onscroll="scrollEffect()">
-
+    <main>

+        <div id="desc">
+            <p id="title">Description</p>
+            <p id= "text">
+                This website is a webshop where you can buy pokemons to play with on your switch. You 
+                can buy every pokemon from the official pokedex and chose their attacks and talents,
+                you can also have it in shiny if you want. 

-        <div class="search">
-            <input type="text" name="pokemon" id="poke" onkeyup="search()" placeholder="Search a Pokemon..">
-            
+            </p>

        </div>

-        <div class="tab" >
       
-        </div>


    </main>

--- a/frontend/menu.css
+++ b/frontend/menu.css
@@ -32,7 +32,6 @@ main {


 html {
-    font-size: 50%;
    box-sizing: border-box;
    scroll-behavior: smooth;
 }
@@ -61,10 +60,10 @@ nav {
    top: 0;
    left: 50%;
    width: 30vw;
-    height: 12vh; 
+    height: 6vw; 
    margin-top: 2.5vh;
    text-align: center;
-    font-size: 10vh;
+    font-size: 5vw;
    font-family: gb;
    transform: translateX(-50%);
    background-color: rgb(255, 255, 255);
@@ -143,9 +142,10 @@ nav {
    top: 0;
    left: 10%;
    width: 13vw;
-    height: 4vh; 
+    height: 1.75vw; 
    margin-top: 6.5vh;
    text-align: center;
+    
    font-size: 1.5vw;
    font-family: gb;
    transform: translateX(-50%);
@@ -161,8 +161,5 @@ nav {
 }

 #back:hover{
-
-
    color: rgb(0, 102, 255);
-
 }
\ No newline at end of file
--- a/frontend/select.html
+++ b/frontend/select.html
@@ -17,7 +17,7 @@

    <nav>
        <div class="shop">
-            <a href="shop.html" id="back">BACK TO SHOP</a>
+            <a href="shop.html" id="back">SHOP</a>
        </div>
        
        <p id="fill">POKESHOP</p>

--- a/frontend/shop.html
+++ b/frontend/shop.html
@@ -14,7 +14,7 @@

    <nav>
        <div class="shop">
-            <a href="shop.html" id="back">BACK TO MENU</a>
+            <a href="index.html" id="back">HOMEPAGE</a>
        </div>
        
        <p id="fill">POKESHOP</p>