mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-14 11:14:24 +00:00
Anim init
This commit is contained in:
Jeremy Thomas
parent
77c3aa5c98
commit
823a100d51
@ -10,13 +10,13 @@
|
||||
</p>
|
||||
<p class="subtitle is-6">Designed for <strong>mobile</strong> first</p>
|
||||
<figure class="bd-focus-icon">
|
||||
<span class="icon is-large">
|
||||
<span class="bd-focus-mobile icon is-large">
|
||||
<i class="fas fa-lg fa-mobile-alt"></i>
|
||||
</span>
|
||||
<span class="icon is-large">
|
||||
<span class="bd-focus-tablet icon is-large">
|
||||
<i class="fas fa-2x fa-tablet-alt"></i>
|
||||
</span>
|
||||
<span class="icon is-large">
|
||||
<span class="bd-focus-desktop icon is-large">
|
||||
<i class="fas fa-3x fa-desktop"></i>
|
||||
</span>
|
||||
</figure>
|
||||
@ -29,9 +29,15 @@
|
||||
<p class="subtitle is-6">
|
||||
Just import what you <strong>need</strong>
|
||||
</p>
|
||||
<figure class="bd-focus-icon">
|
||||
<span class="icon is-large">
|
||||
<i class="fas fa-3x fa-cubes"></i>
|
||||
<figure class="bd-focus-cubes bd-focus-icon">
|
||||
<span class="bd-focus-cube bd-focus-cube-1 icon is-large">
|
||||
<i class="fas fa-2x fa-cube"></i>
|
||||
</span>
|
||||
<span class="bd-focus-cube bd-focus-cube-2 icon is-large">
|
||||
<i class="fas fa-2x fa-cube"></i>
|
||||
</span>
|
||||
<span class="bd-focus-cube bd-focus-cube-3 icon is-large">
|
||||
<i class="fas fa-2x fa-cube"></i>
|
||||
</span>
|
||||
</figure>
|
||||
</a>
|
||||
@ -43,7 +49,7 @@
|
||||
<p class="subtitle is-6">
|
||||
Built with <strong>Flexbox</strong>
|
||||
</p>
|
||||
<figure class="bd-focus-icon">
|
||||
<figure class="bd-focus-css3 bd-focus-icon">
|
||||
<span class="icon is-large">
|
||||
<i class="fab fa-3x fa-css3"></i>
|
||||
</span>
|
||||
@ -57,7 +63,7 @@
|
||||
<p class="subtitle is-6">
|
||||
Open source on <strong>GitHub</strong>
|
||||
</p>
|
||||
<figure class="bd-focus-icon">
|
||||
<figure class="bd-focus-github bd-focus-icon">
|
||||
<span class="icon is-large">
|
||||
<i class="fab fa-3x fa-github-alt"></i>
|
||||
</span>
|
||||
|
||||
@ -45,6 +45,7 @@ $book-beige: #FFEDD7
|
||||
|
||||
.bd-book-content
|
||||
@extend %bd-box
|
||||
box-shadow: 0 3rem 3rem -1rem rgba($black, 0.2)
|
||||
max-width: 520px
|
||||
padding: 3rem
|
||||
|
||||
|
||||
130
docs/_sass/focus.sass
Normal file
130
docs/_sass/focus.sass
Normal file
@ -0,0 +1,130 @@
|
||||
@keyframes bdGrow
|
||||
from
|
||||
transform: scale(0)
|
||||
to
|
||||
transform: scale(1)
|
||||
|
||||
$cubic-dramatic: cubic-bezier(0, 0.75, 0.25, 1)
|
||||
$cubic-less-dramatic: cubic-bezier(0.14, 0.71, 0.29, 0.86)
|
||||
$cubic-magic: cubic-bezier(0.175, 0.885, 0.32, 1.275)
|
||||
|
||||
$delay: 250ms
|
||||
|
||||
%bd-focus-animation
|
||||
animation-duration: 500ms
|
||||
animation-fill-mode: both
|
||||
animation-timing-function: $cubic-less-dramatic
|
||||
transform-origin: center center
|
||||
|
||||
.bd-focus-mobile,
|
||||
.bd-focus-tablet,
|
||||
.bd-focus-desktop
|
||||
@extend %bd-focus-animation
|
||||
animation-name: bdGrow
|
||||
transform-origin: bottom center
|
||||
|
||||
.bd-focus-tablet
|
||||
animation-delay: $delay
|
||||
|
||||
.bd-focus-desktop
|
||||
animation-delay: $delay * 2
|
||||
|
||||
$cube-factor: 10px
|
||||
|
||||
@keyframes moveCube1
|
||||
0%
|
||||
transform: translate3d(0, (-5 * $cube-factor), 0)
|
||||
opacity: 0
|
||||
25%, 100%
|
||||
transform: translate3d(0, 0, 0)
|
||||
opacity: 1
|
||||
|
||||
@keyframes moveCube2
|
||||
0%
|
||||
transform: translate3d((-4 * $cube-factor), (3 * $cube-factor), 0)
|
||||
opacity: 0
|
||||
25%, 100%
|
||||
transform: translate3d(0, 0, 0)
|
||||
opacity: 1
|
||||
|
||||
@keyframes moveCube3
|
||||
0%
|
||||
transform: translate3d((4 * $cube-factor), (3 * $cube-factor), 0)
|
||||
opacity: 0
|
||||
25%, 100%
|
||||
transform: translate3d(0, 0, 0)
|
||||
opacity: 1
|
||||
|
||||
%bd-focus-animation-cube
|
||||
@extend %bd-focus-animation
|
||||
animation-iteration-count: infinite
|
||||
animation-direction: alternate
|
||||
animation-duration: 2000ms
|
||||
|
||||
.bd-focus-cube-1
|
||||
@extend %bd-focus-animation-cube
|
||||
animation-name: moveCube1
|
||||
|
||||
.bd-focus-cube-2
|
||||
@extend %bd-focus-animation-cube
|
||||
animation-name: moveCube2
|
||||
animation-delay: $delay
|
||||
|
||||
.bd-focus-cube-3
|
||||
@extend %bd-focus-animation-cube
|
||||
animation-name: moveCube3
|
||||
animation-delay: $delay * 2
|
||||
|
||||
@keyframes bdJellyGrow
|
||||
0%
|
||||
transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
3.4%
|
||||
transform: matrix3d(1.013, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
4.7%
|
||||
transform: matrix3d(1.018, 0, 0, 0, 0, 1.024, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
6.81%
|
||||
transform: matrix3d(1.026, 0, 0, 0, 0, 1.036, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
9.41%
|
||||
transform: matrix3d(1.035, 0, 0, 0, 0, 1.047, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
10.21%
|
||||
transform: matrix3d(1.038, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
13.61%
|
||||
transform: matrix3d(1.045, 0, 0, 0, 0, 1.053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
14.11%
|
||||
transform: matrix3d(1.046, 0, 0, 0, 0, 1.053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
17.52%
|
||||
transform: matrix3d(1.048, 0, 0, 0, 0, 1.05, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
18.72%
|
||||
transform: matrix3d(1.048, 0, 0, 0, 0, 1.047, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
21.32%
|
||||
transform: matrix3d(1.048, 0, 0, 0, 0, 1.043, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
24.32%
|
||||
transform: matrix3d(1.046, 0, 0, 0, 0, 1.038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
25.23%
|
||||
transform: matrix3d(1.045, 0, 0, 0, 0, 1.038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
29.03%
|
||||
transform: matrix3d(1.043, 0, 0, 0, 0, 1.036, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
29.93%
|
||||
transform: matrix3d(1.042, 0, 0, 0, 0, 1.036, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
35.54%
|
||||
transform: matrix3d(1.039, 0, 0, 0, 0, 1.038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
36.74%
|
||||
transform: matrix3d(1.039, 0, 0, 0, 0, 1.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
41.04%
|
||||
transform: matrix3d(1.038, 0, 0, 0, 0, 1.041, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
44.44%
|
||||
transform: matrix3d(1.039, 0, 0, 0, 0, 1.041, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
52.15%
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
59.86%
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
63.26%
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
75.28%
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
85.49%
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
90.69%
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
100%
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
|
||||
@ -156,24 +156,45 @@
|
||||
.title
|
||||
color: $link
|
||||
|
||||
.bd-focus-icon
|
||||
.fa-mobile-alt
|
||||
color: $purple
|
||||
margin-right: -20px
|
||||
.fa-tablet-alt
|
||||
color: $red
|
||||
margin-left: -20px
|
||||
.fa-desktop
|
||||
color: $orange
|
||||
margin-left: -20px
|
||||
position: relative
|
||||
top: 2px
|
||||
.fa-cubes
|
||||
color: $green
|
||||
.fa-css3
|
||||
color: $blue
|
||||
.fa-github-alt
|
||||
color: $github
|
||||
.bd-focus-mobile
|
||||
color: $purple
|
||||
margin-right: -20px
|
||||
|
||||
.bd-focus-tablet
|
||||
color: $red
|
||||
|
||||
.bd-focus-desktop
|
||||
color: $orange
|
||||
position: relative
|
||||
top: 2px
|
||||
|
||||
.bd-focus-cubes
|
||||
position: relative
|
||||
height: 3rem
|
||||
margin: 0 auto
|
||||
width: 3rem
|
||||
|
||||
.bd-focus-cube
|
||||
color: $green
|
||||
position: absolute
|
||||
|
||||
.bd-focus-cube-1
|
||||
left: 0
|
||||
top: 0
|
||||
|
||||
.bd-focus-cube-2
|
||||
left: -1rem
|
||||
top: 23px
|
||||
|
||||
.bd-focus-cube-3
|
||||
left: 1rem
|
||||
top: 23px
|
||||
|
||||
.bd-focus-css3
|
||||
color: $blue
|
||||
|
||||
.bd-focus-github
|
||||
color: $github
|
||||
|
||||
// Intro
|
||||
|
||||
|
||||
@ -1,21 +0,0 @@
|
||||
html.route-index
|
||||
.title.is-2,
|
||||
.title.is-3
|
||||
position: relative
|
||||
a
|
||||
color: $text-strong
|
||||
position: relative
|
||||
a:hover
|
||||
color: $blue
|
||||
.hero .title.is-2 a
|
||||
color: $white
|
||||
.hero .title.is-2 a:hover
|
||||
color: $white
|
||||
.hero.is-primary a.column,
|
||||
.hero.is-primary a.column:hover
|
||||
color: $white
|
||||
.hero.is-primary a.column:hover .title strong
|
||||
border-bottom: 1px solid
|
||||
@media screen and (max-width: 979px)
|
||||
.title.is-2 a
|
||||
padding-left: 0
|
||||
@ -36,7 +36,7 @@ $navbar-item-img-max-height: none
|
||||
%bd-box
|
||||
background-color: $white
|
||||
border-radius: $radius-large
|
||||
box-shadow: 0 1.5rem 1.5rem -1.25rem rgba($black, 0.1)
|
||||
box-shadow: 0 1.5rem 1.5rem -1.25rem rgba($black, 0.05)
|
||||
display: block
|
||||
|
||||
=selection($current-selector: false)
|
||||
@ -62,7 +62,6 @@ $navbar-item-img-max-height: none
|
||||
@import "./_sass/example"
|
||||
@import "./_sass/callout"
|
||||
@import "./_sass/bsa"
|
||||
// @import "./_sass/route"
|
||||
@import "./_sass/twitter"
|
||||
@import "./_sass/expo"
|
||||
@import "./_sass/love"
|
||||
@ -72,3 +71,4 @@ $navbar-item-img-max-height: none
|
||||
@import "./_sass/sponsors"
|
||||
@import "./_sass/book"
|
||||
@import "./_sass/native"
|
||||
@import "./_sass/focus"
|
||||
|
||||
@ -9604,7 +9604,7 @@ label.panel-block:hover {
|
||||
.bd-footer-support, .bd-footer-star, .bd-book-content {
|
||||
background-color: white;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 1.5rem 1.5rem -1.25rem rgba(10, 10, 10, 0.1);
|
||||
box-shadow: 0 1.5rem 1.5rem -1.25rem rgba(10, 10, 10, 0.05);
|
||||
display: block;
|
||||
}
|
||||
|
||||
@ -10512,32 +10512,53 @@ svg {
|
||||
color: #3273dc;
|
||||
}
|
||||
|
||||
.bd-focus-icon .fa-mobile-alt {
|
||||
.bd-focus-mobile {
|
||||
color: #b86bff;
|
||||
margin-right: -20px;
|
||||
}
|
||||
|
||||
.bd-focus-icon .fa-tablet-alt {
|
||||
.bd-focus-tablet {
|
||||
color: #ff3860;
|
||||
margin-left: -20px;
|
||||
}
|
||||
|
||||
.bd-focus-icon .fa-desktop {
|
||||
.bd-focus-desktop {
|
||||
color: #ff470f;
|
||||
margin-left: -20px;
|
||||
position: relative;
|
||||
top: 2px;
|
||||
}
|
||||
|
||||
.bd-focus-icon .fa-cubes {
|
||||
color: #23d160;
|
||||
.bd-focus-cubes {
|
||||
position: relative;
|
||||
height: 3rem;
|
||||
margin: 0 auto;
|
||||
width: 3rem;
|
||||
}
|
||||
|
||||
.bd-focus-icon .fa-css3 {
|
||||
.bd-focus-cube {
|
||||
color: #23d160;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.bd-focus-cube-1 {
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.bd-focus-cube-2 {
|
||||
left: -1rem;
|
||||
top: 23px;
|
||||
}
|
||||
|
||||
.bd-focus-cube-3 {
|
||||
left: 1rem;
|
||||
top: 23px;
|
||||
}
|
||||
|
||||
.bd-focus-css3 {
|
||||
color: #3273dc;
|
||||
}
|
||||
|
||||
.bd-focus-icon .fa-github-alt {
|
||||
.bd-focus-github {
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
@ -12814,6 +12835,7 @@ svg {
|
||||
}
|
||||
|
||||
.bd-book-content {
|
||||
box-shadow: 0 3rem 3rem -1rem rgba(10, 10, 10, 0.2);
|
||||
max-width: 520px;
|
||||
padding: 3rem;
|
||||
}
|
||||
@ -13073,3 +13095,170 @@ svg {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bdGrow {
|
||||
from {
|
||||
transform: scale(0);
|
||||
}
|
||||
to {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.bd-focus-mobile,
|
||||
.bd-focus-tablet,
|
||||
.bd-focus-desktop, .bd-focus-cube-1, .bd-focus-cube-2, .bd-focus-cube-3 {
|
||||
animation-duration: 500ms;
|
||||
animation-fill-mode: both;
|
||||
animation-timing-function: cubic-bezier(0.14, 0.71, 0.29, 0.86);
|
||||
transform-origin: center center;
|
||||
}
|
||||
|
||||
.bd-focus-mobile,
|
||||
.bd-focus-tablet,
|
||||
.bd-focus-desktop {
|
||||
animation-name: bdGrow;
|
||||
transform-origin: bottom center;
|
||||
}
|
||||
|
||||
.bd-focus-tablet {
|
||||
animation-delay: 250ms;
|
||||
}
|
||||
|
||||
.bd-focus-desktop {
|
||||
animation-delay: 500ms;
|
||||
}
|
||||
|
||||
@keyframes moveCube1 {
|
||||
0% {
|
||||
transform: translate3d(0, -50px, 0);
|
||||
opacity: 0;
|
||||
}
|
||||
25%, 100% {
|
||||
transform: translate3d(0, 0, 0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes moveCube2 {
|
||||
0% {
|
||||
transform: translate3d(-40px, 30px, 0);
|
||||
opacity: 0;
|
||||
}
|
||||
25%, 100% {
|
||||
transform: translate3d(0, 0, 0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes moveCube3 {
|
||||
0% {
|
||||
transform: translate3d(40px, 30px, 0);
|
||||
opacity: 0;
|
||||
}
|
||||
25%, 100% {
|
||||
transform: translate3d(0, 0, 0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.bd-focus-cube-1, .bd-focus-cube-2, .bd-focus-cube-3 {
|
||||
animation-iteration-count: infinite;
|
||||
animation-direction: alternate;
|
||||
animation-duration: 2000ms;
|
||||
}
|
||||
|
||||
.bd-focus-cube-1 {
|
||||
animation-name: moveCube1;
|
||||
}
|
||||
|
||||
.bd-focus-cube-2 {
|
||||
animation-name: moveCube2;
|
||||
animation-delay: 250ms;
|
||||
}
|
||||
|
||||
.bd-focus-cube-3 {
|
||||
animation-name: moveCube3;
|
||||
animation-delay: 500ms;
|
||||
}
|
||||
|
||||
@keyframes bdJellyGrow {
|
||||
0% {
|
||||
transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
3.4% {
|
||||
transform: matrix3d(1.013, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
4.7% {
|
||||
transform: matrix3d(1.018, 0, 0, 0, 0, 1.024, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
6.81% {
|
||||
transform: matrix3d(1.026, 0, 0, 0, 0, 1.036, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
9.41% {
|
||||
transform: matrix3d(1.035, 0, 0, 0, 0, 1.047, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
10.21% {
|
||||
transform: matrix3d(1.038, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
13.61% {
|
||||
transform: matrix3d(1.045, 0, 0, 0, 0, 1.053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
14.11% {
|
||||
transform: matrix3d(1.046, 0, 0, 0, 0, 1.053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
17.52% {
|
||||
transform: matrix3d(1.048, 0, 0, 0, 0, 1.05, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
18.72% {
|
||||
transform: matrix3d(1.048, 0, 0, 0, 0, 1.047, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
21.32% {
|
||||
transform: matrix3d(1.048, 0, 0, 0, 0, 1.043, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
24.32% {
|
||||
transform: matrix3d(1.046, 0, 0, 0, 0, 1.038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
25.23% {
|
||||
transform: matrix3d(1.045, 0, 0, 0, 0, 1.038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
29.03% {
|
||||
transform: matrix3d(1.043, 0, 0, 0, 0, 1.036, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
29.93% {
|
||||
transform: matrix3d(1.042, 0, 0, 0, 0, 1.036, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
35.54% {
|
||||
transform: matrix3d(1.039, 0, 0, 0, 0, 1.038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
36.74% {
|
||||
transform: matrix3d(1.039, 0, 0, 0, 0, 1.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
41.04% {
|
||||
transform: matrix3d(1.038, 0, 0, 0, 0, 1.041, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
44.44% {
|
||||
transform: matrix3d(1.039, 0, 0, 0, 0, 1.041, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
52.15% {
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
59.86% {
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
63.26% {
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
75.28% {
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
85.49% {
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
90.69% {
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
100% {
|
||||
transform: matrix3d(1.04, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
}
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
<!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/hK8ONv4wcbA" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe> -->
|
||||
<!-- <iframe width="420" height="345" src="https://www.youtube.com/embed/tgbNymZ7vqY"></iframe> -->
|
||||
{% include global/navbar.html %}
|
||||
{% include footer/main.html %}
|
||||
{% include index/focus.html %}
|
||||
<!-- {% include test/from-to.html %} -->
|
||||
<!-- {% include test/features.html %} -->
|
||||
<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user