Changed some stuff back to "normal"

This commit is contained in:
Sagi Dayan 2020-05-08 19:52:24 -04:00
parent 9a6e6226b8
commit c1788470a3
3 changed files with 90 additions and 16 deletions

View file

@ -7101,15 +7101,43 @@ label.panel-block {
background-color: #fafafa; background-color: #fafafa;
padding: 3rem 1.5rem 6rem; } padding: 3rem 1.5rem 6rem; }
nav.navbar { html {
padding-left: 5rem; scroll-behavior: smooth; }
padding-right: 5rem; }
.hero-bg { .hero-bg {
background-image: url("/images/clouds-bg.svg"); background-image: url("/images/clouds-bg.svg");
background-size: cover; background-size: cover;
background-color: #fff; } background-color: #fff; }
.scroll-down-indicator {
position: absolute;
bottom: 25px;
left: 50%;
animation: bounce 1.5s;
animation-delay: 1s;
animation-iteration-count: 2;
transform: translate(-50%, 0); }
@keyframes bounce {
0%, 20%, 53%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(-50%, 0, 0);
transform: translate3d(-50%, 0, 0); }
40%, 43% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(-50%, -30px, 0);
transform: translate3d(-50%, -30px, 0); }
70% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(-50%, -15px, 0);
transform: translate3d(-50%, -15px, 0); }
90% {
-webkit-transform: translate3d(-50%, -4px, 0);
transform: translate3d(-50%, -4px, 0); } }
.landing-featue-image { .landing-featue-image {
max-height: 180px !important; max-height: 180px !important;
width: auto; width: auto;

View file

@ -5,9 +5,12 @@
@import './mixins.scss'; @import './mixins.scss';
@import "../../node_modules/bulma/bulma.sass"; @import "../../node_modules/bulma/bulma.sass";
// @import '../../node_modules/animate.css/source/_base.css'; // @import '../../node_modules/animate.css/source/_base.css';
nav.navbar { // nav.navbar {
padding-left: 5rem; // padding-left: 5rem;
padding-right: 5rem; // padding-right: 5rem;
// }
html{
scroll-behavior: smooth;
} }
.hero-bg{ .hero-bg{
// @include pattern(#c0ebfa, #7FD7F5); // @include pattern(#c0ebfa, #7FD7F5);
@ -21,6 +24,41 @@ nav.navbar {
// background-position: ; // background-position: ;
// background-repeat: no-repeat; // background-repeat: no-repeat;
} }
.scroll-down-indicator{
position: absolute;
bottom: 25px;
left: 50%;
animation: bounce 1.5s;
animation-delay: 1s;
animation-iteration-count: 2;
transform: translate(-50%,0);
}
@keyframes bounce {
0%, 20%, 53%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-webkit-transform: translate3d(-50%,0,0);
transform: translate3d(-50%,0,0);
}
40%, 43% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(-50%, -30px, 0);
transform: translate3d(-50%, -30px, 0);
}
70% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(-50%, -15px, 0);
transform: translate3d(-50%, -15px, 0);
}
90% {
-webkit-transform: translate3d(-50%,-4px,0); transform: translate3d(-50%,-4px,0);
}
}
.landing-featue-image{ .landing-featue-image{
max-height: 180px !important; max-height: 180px !important;
width: auto; width: auto;

View file

@ -1,7 +1,7 @@
@layout('layouts.landing') @layout('layouts.landing')
@section('page-title') @section('page-title')
Seepur | Our Time together A safe and fun way to spend time with far away loved ones
@endsection @endsection
@section('hero') @section('hero')
<section class="hero is-large hero-bg"> <section class="hero is-large hero-bg">
@ -31,11 +31,16 @@ Seepur | Our Time together
</div> </div>
</div> </div>
</div> </div>
<div class="scroll-down-indicator">
<a href="#info" class="button is-rounded is-outlined">
<i class="fa fa-fw fa-arrow-down"></i>
</a>
</div>
</section> </section>
@endsection @endsection
@section('content') @section('content')
<section class="section m-b-diego"> <section class="section" id="info">
<div class="container has-text-centered"> <div class="container has-text-centered">
<h1 class="title is-1">Being far, but never apart</h1> <h1 class="title is-1">Being far, but never apart</h1>
<h3 class="subtitle is-3">Not just a video call</h3> <h3 class="subtitle is-3">Not just a video call</h3>
@ -49,7 +54,7 @@ Seepur | Our Time together
</div> </div>
</section> </section>
{{-- 3 Important feature bloks --}} {{-- 3 Important feature bloks --}}
<section class="section m-b-diego"> <section class="section">
<div class="columns"> <div class="columns">
<div class="column is-flex"> <div class="column is-flex">
<div class="message has-text-centered p-lg is-info"> <div class="message has-text-centered p-lg is-info">
@ -96,9 +101,9 @@ Seepur | Our Time together
</div> </div>
</section> </section>
<section class="section m-b-diego"> <section class="section">
<div class="columns"> <div class="columns">
<div class="column"> <div class="column p-md">
<div class="title">Be There</div> <div class="title">Be There</div>
<p> <p>
Make an actual impact on the child by creating shared memories. You will be surprised how engaged and comunicative a little child could be during active sessions. Make an actual impact on the child by creating shared memories. You will be surprised how engaged and comunicative a little child could be during active sessions.
@ -106,8 +111,8 @@ Seepur | Our Time together
</p> </p>
{{-- <a href="#" class="button m-t-md">More...</a> --}} {{-- <a href="#" class="button m-t-md">More...</a> --}}
</div> </div>
<div class="column is-two-thirds"> <div class="column is-half">
<figure class="image m-l-diego m-r-diego p-l-diego p-r-diego"> <figure class="image">
<img src="/images/be-there.svg" alt="" srcset=""> <img src="/images/be-there.svg" alt="" srcset="">
</figure> </figure>
{{-- <small><a href="https://www.freepik.com/free-photos-vectors/health">Health vector created by freepik - www.freepik.com</a></small> --}} {{-- <small><a href="https://www.freepik.com/free-photos-vectors/health">Health vector created by freepik - www.freepik.com</a></small> --}}
@ -117,17 +122,20 @@ Seepur | Our Time together
<section class="section"> <section class="section">
<div class="columns"> <div class="columns">
<div class="column is-two-thirds"> <div class="column is-half">
<figure class="image m-l-diego m-r-diego p-l-diego p-r-diego"> <figure class="image">
<img src="/images/build.svg" alt="" srcset=""> <img src="/images/build.svg" alt="" srcset="">
</figure> </figure>
{{-- <small><a href="https://www.freepik.com/free-photos-vectors/health">Health vector created by freepik - www.freepik.com</a></small> --}} {{-- <small><a href="https://www.freepik.com/free-photos-vectors/health">Health vector created by freepik - www.freepik.com</a></small> --}}
</div> </div>
<div class="column"> <div class="column p-md">
<div class="title">Yours</div> <div class="title">Yours</div>
<p> <p>
Seepur is all about you and the child. You can upload your own books and read together, create puzzles with your own photos and more! Seepur is all about you and the child. You can upload your own books and read together, create puzzles with your own photos and more!
</p> </p>
<p>
Your creations is yours, only available for sessions where you are a part of. So yes, Make interesting stuff, upload better books becuse the child will be picky!
</p>
{{-- <a href="#" class="button m-t-md">More...</a> --}} {{-- <a href="#" class="button m-t-md">More...</a> --}}
</div> </div>
</div> </div>