Skip to content

Commit

Permalink
mise en place du nouveau loader sur la page page acceuil
Browse files Browse the repository at this point in the history
  • Loading branch information
@adelbonn
adelbonn committed Sep 30, 2024
1 parent d492037 commit aec4a1f
Show file tree
Hide file tree
Showing 8 changed files with 46 additions and 176 deletions.
2 changes: 1 addition & 1 deletion css/main.css
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

40 changes: 38 additions & 2 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,14 +23,50 @@
</head>

<body>
<div class="loader__anim--container">
<!--loader-->

<!--<div class="loader__anim--container">
<div class="loader__circle--anim">
<div class="loader__circle">
</div>
<h1 class="loader___text">OhMyFood</h1>
</div>
</div>
</div>-->

<!--loader tasse-->


<!--loader-->

<div class="loader__anim--container2">
<div class="ContainerloaderTasse">
<div class="cup">
<div class="bubble">
<div class="bubble2">
</div>
</div>
</div>

</div>
<span class="lettreloader">O</span>
<span class="lettreloader">h</span>
<span class="lettreloader">M</span>
<span class="lettreloader">y</span>
<span class="lettreloader">F</span>
<span class="lettreloader">o</span>
<span class="lettreloader">o</span>
<span class="lettreloader">d</span>
<span class="lettreloader dot">.</span>
<span class="lettreloader dot" >.</span>
<span class="lettreloader dot">.</span>
<div class="glass">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>


<div class="main-wrapper">

Expand Down
31 changes: 0 additions & 31 deletions restaurants/Lapalettedugout-menu.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,38 +22,7 @@

<body>

<!--loader-->

<div class="loader__anim--container2">
<div class="ContainerloaderTasse">
<div class="cup">
<div class="bubble">
<div class="bubble2">
</div>
</div>
</div>

</div>
<span class="lettreloader">O</span>
<span class="lettreloader">h</span>
<span class="lettreloader">M</span>
<span class="lettreloader">y</span>
<span class="lettreloader">F</span>
<span class="lettreloader">o</span>
<span class="lettreloader">o</span>
<span class="lettreloader">d</span>
<span class="lettreloader dot">.</span>
<span class="lettreloader dot" >.</span>
<span class="lettreloader dot">.</span>
<div class="glass">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>


<header>

<a href="../index.html">
Expand Down
33 changes: 0 additions & 33 deletions restaurants/alaFrancaise.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,39 +21,6 @@
</head>

<body>

<!--loader-->

<div class="loader__anim--container2">
<div class="ContainerloaderTasse">
<div class="cup">
<div class="bubble">
<div class="bubble2">
</div>
</div>
</div>

</div>
<span class="lettreloader">O</span>
<span class="lettreloader">h</span>
<span class="lettreloader">M</span>
<span class="lettreloader">y</span>
<span class="lettreloader">F</span>
<span class="lettreloader">o</span>
<span class="lettreloader">o</span>
<span class="lettreloader">d</span>
<span class="lettreloader dot">.</span>
<span class="lettreloader dot" >.</span>
<span class="lettreloader dot">.</span>
<div class="glass">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>




<header>
Expand Down
31 changes: 0 additions & 31 deletions restaurants/laNoteEnchantee-menu.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,37 +21,6 @@
</head>

<body>
<!--loader-->

<div class="loader__anim--container2">
<div class="ContainerloaderTasse">
<div class="cup">
<div class="bubble">
<div class="bubble2">
</div>
</div>
</div>

</div>
<span class="lettreloader">O</span>
<span class="lettreloader">h</span>
<span class="lettreloader">M</span>
<span class="lettreloader">y</span>
<span class="lettreloader">F</span>
<span class="lettreloader">o</span>
<span class="lettreloader">o</span>
<span class="lettreloader">d</span>
<span class="lettreloader dot">.</span>
<span class="lettreloader dot" >.</span>
<span class="lettreloader dot">.</span>
<div class="glass">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>



<header>
Expand Down
39 changes: 0 additions & 39 deletions restaurants/leDelicedesSens.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,45 +22,6 @@

<body>

<!--loader-->

<div class="loader__anim--container2">
<div class="ContainerloaderTasse">
<div class="cup">
<div class="bubble">
<div class="bubble2">
</div>
</div>
</div>

</div>
<span class="lettreloader">O</span>
<span class="lettreloader">h</span>
<span class="lettreloader">M</span>
<span class="lettreloader">y</span>
<span class="lettreloader">F</span>
<span class="lettreloader">o</span>
<span class="lettreloader">o</span>
<span class="lettreloader">d</span>
<span class="lettreloader dot">.</span>
<span class="lettreloader dot" >.</span>
<span class="lettreloader dot">.</span>
<div class="glass">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>











<header>
Expand Down
32 changes: 0 additions & 32 deletions restaurants/restaurants.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,38 +22,6 @@

<body>


<!--loader-->

<div class="loader__anim--container2">
<div class="ContainerloaderTasse">
<div class="cup">
<div class="bubble">
<div class="bubble2">
</div>
</div>
</div>

</div>
<span class="lettreloader">O</span>
<span class="lettreloader">h</span>
<span class="lettreloader">M</span>
<span class="lettreloader">y</span>
<span class="lettreloader">F</span>
<span class="lettreloader">o</span>
<span class="lettreloader">o</span>
<span class="lettreloader">d</span>
<span class="lettreloader dot">.</span>
<span class="lettreloader dot" >.</span>
<span class="lettreloader dot">.</span>
<div class="glass">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>

<header>

<a href="../index.html">
Expand Down
14 changes: 7 additions & 7 deletions sass/components/_animations.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
left:0;
right: 0;
bottom: 0;
width: 100%;
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
Expand Down Expand Up @@ -363,30 +363,30 @@ background-color: var.$color-grey;

@keyframes bubble {
0% {
//opacity: 0;

box-shadow: 4px -10px rgba(255, 255, 255, 0), 6px 0px rgba(255, 255, 255, 0), 8px -15px regba(255, 255, 255, 0), 12px 0px rgba(255, 255, 255, 0);
}
20% {
// opacity: 0.5;

box-shadow: 4px -20px rgba(255, 255, 255, 0), 8px -10px rgba(255, 255, 255, 0), 10px -30px rgba(255, 255, 255, 0.5), 15px -5px rgba(255, 255, 255, 0);
}
40% {
// opacity: 0.7;

box-shadow: 2px -40px rgba(255, 255, 255, 0.5), 8px -30px rgba(255, 255, 255, 0.4), 8px -60pw rgba(255, 255, 255, 0.5), 12px -15px rgba(255, 255, 255, 0.5);
}

60% {
// opacity: 1;

box-shadow: 4px -60px rgba(255, 255, 255, 0.5), 6px -50px rgba(255, 255, 255, 0.4), 10px -90px rgba(255, 255, 255, 0.5), 15px -25px rgba(255, 255, 255, 0.5);
}

80% {
// opacity: 0.2;

box-shadow: 2px, -80px, rgba(255, 255, 255, 0.5), 4px -70px rgba(255, 255, 255, .4), 8px -120px rgba(255, 255, 255, 0), 12px -35px rgba(255, 255, 255, 0.5);
}

100% {
// opacity: 0;

transform: translateY(-100px);
box-shadow: 4px -100px rgba(255, 255, 255, 0), 8px -90px rgba(255, 255, 255, 0), 10px -120px rgba(255, 255, 255, 0), 15px -45px rgba(255, 255, 255, 0);
}
Expand Down

0 comments on commit aec4a1f

Please sign in to comment.