forked from sagi/seepur
Changed some stuff back to "normal"
This commit is contained in:
parent
9a6e6226b8
commit
c1788470a3
3 changed files with 90 additions and 16 deletions
|
@ -7101,15 +7101,43 @@ label.panel-block {
|
|||
background-color: #fafafa;
|
||||
padding: 3rem 1.5rem 6rem; }
|
||||
|
||||
nav.navbar {
|
||||
padding-left: 5rem;
|
||||
padding-right: 5rem; }
|
||||
html {
|
||||
scroll-behavior: smooth; }
|
||||
|
||||
.hero-bg {
|
||||
background-image: url("/images/clouds-bg.svg");
|
||||
background-size: cover;
|
||||
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 {
|
||||
max-height: 180px !important;
|
||||
width: auto;
|
||||
|
|
|
@ -5,9 +5,12 @@
|
|||
@import './mixins.scss';
|
||||
@import "../../node_modules/bulma/bulma.sass";
|
||||
// @import '../../node_modules/animate.css/source/_base.css';
|
||||
nav.navbar {
|
||||
padding-left: 5rem;
|
||||
padding-right: 5rem;
|
||||
// nav.navbar {
|
||||
// padding-left: 5rem;
|
||||
// padding-right: 5rem;
|
||||
// }
|
||||
html{
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
.hero-bg{
|
||||
// @include pattern(#c0ebfa, #7FD7F5);
|
||||
|
@ -21,6 +24,41 @@ nav.navbar {
|
|||
// background-position: ;
|
||||
// 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{
|
||||
max-height: 180px !important;
|
||||
width: auto;
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
@layout('layouts.landing')
|
||||
|
||||
@section('page-title')
|
||||
Seepur | Our Time together
|
||||
A safe and fun way to spend time with far away loved ones
|
||||
@endsection
|
||||
@section('hero')
|
||||
<section class="hero is-large hero-bg">
|
||||
|
@ -31,11 +31,16 @@ Seepur | Our Time together
|
|||
</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>
|
||||
@endsection
|
||||
@section('content')
|
||||
|
||||
<section class="section m-b-diego">
|
||||
<section class="section" id="info">
|
||||
<div class="container has-text-centered">
|
||||
<h1 class="title is-1">Being far, but never apart</h1>
|
||||
<h3 class="subtitle is-3">Not just a video call</h3>
|
||||
|
@ -49,7 +54,7 @@ Seepur | Our Time together
|
|||
</div>
|
||||
</section>
|
||||
{{-- 3 Important feature bloks --}}
|
||||
<section class="section m-b-diego">
|
||||
<section class="section">
|
||||
<div class="columns">
|
||||
<div class="column is-flex">
|
||||
<div class="message has-text-centered p-lg is-info">
|
||||
|
@ -96,9 +101,9 @@ Seepur | Our Time together
|
|||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section m-b-diego">
|
||||
<section class="section">
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<div class="column p-md">
|
||||
<div class="title">Be There</div>
|
||||
<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.
|
||||
|
@ -106,8 +111,8 @@ Seepur | Our Time together
|
|||
</p>
|
||||
{{-- <a href="#" class="button m-t-md">More...</a> --}}
|
||||
</div>
|
||||
<div class="column is-two-thirds">
|
||||
<figure class="image m-l-diego m-r-diego p-l-diego p-r-diego">
|
||||
<div class="column is-half">
|
||||
<figure class="image">
|
||||
<img src="/images/be-there.svg" alt="" srcset="">
|
||||
</figure>
|
||||
{{-- <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">
|
||||
<div class="columns">
|
||||
<div class="column is-two-thirds">
|
||||
<figure class="image m-l-diego m-r-diego p-l-diego p-r-diego">
|
||||
<div class="column is-half">
|
||||
<figure class="image">
|
||||
<img src="/images/build.svg" alt="" srcset="">
|
||||
</figure>
|
||||
{{-- <small><a href="https://www.freepik.com/free-photos-vectors/health">Health vector created by freepik - www.freepik.com</a></small> --}}
|
||||
</div>
|
||||
<div class="column">
|
||||
<div class="column p-md">
|
||||
<div class="title">Yours</div>
|
||||
<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!
|
||||
</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> --}}
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue