Update Koneko integration
This commit is contained in:
210
resources/public/vendor/hover3d/style.css
vendored
Normal file
210
resources/public/vendor/hover3d/style.css
vendored
Normal file
@ -0,0 +1,210 @@
|
||||
* {
|
||||
box-sizing: border-box; }
|
||||
*:before, *:after {
|
||||
box-sizing: border-box; }
|
||||
|
||||
body {
|
||||
font-family: karla, sans-serif;
|
||||
line-height: 1.8;
|
||||
color: #666; }
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-family: Hind, sans-serif;
|
||||
color: #333;
|
||||
margin: 2em 0 1em; }
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #9999ff; }
|
||||
|
||||
.site-content {
|
||||
width: 990px;
|
||||
max-width: 100%;
|
||||
margin: 0 auto;
|
||||
padding: 100px 0; }
|
||||
.site-content:after {
|
||||
content: " ";
|
||||
display: block;
|
||||
clear: both; }
|
||||
|
||||
.section-title {
|
||||
text-align: center;
|
||||
text-transform: uppercase; }
|
||||
|
||||
.align-center {
|
||||
text-align: center; }
|
||||
.align-center h1 {
|
||||
margin-top: 0; }
|
||||
|
||||
.share {
|
||||
margin-bottom: 50px; }
|
||||
.share span, .share a, .share iframe {
|
||||
vertical-align: middle; }
|
||||
.share span span, .share a span, .share iframe span {
|
||||
vertical-align: middle !important;
|
||||
width: 130px !important; }
|
||||
|
||||
.demo {
|
||||
margin: 100px 0; }
|
||||
.demo h2 {
|
||||
margin-bottom: 10px;
|
||||
line-height: 1; }
|
||||
|
||||
.demo-1 {
|
||||
text-align: center; }
|
||||
|
||||
.demo-2 {
|
||||
text-align: left; }
|
||||
.demo-2 .section-title {
|
||||
text-align: left; }
|
||||
|
||||
.columns:after {
|
||||
content: " ";
|
||||
display: block;
|
||||
clear: both; }
|
||||
|
||||
.columns .column {
|
||||
width: 50%;
|
||||
float: left;
|
||||
min-height: 1px; }
|
||||
|
||||
.columns h2 {
|
||||
margin-bottom: 20px;
|
||||
line-height: 1; }
|
||||
|
||||
pre {
|
||||
background-color: #fbfbfb;
|
||||
padding: 10px; }
|
||||
|
||||
.project {
|
||||
width: 50%;
|
||||
float: left;
|
||||
padding: 15px; }
|
||||
.project-list:after {
|
||||
content: " ";
|
||||
display: block;
|
||||
clear: both; }
|
||||
.project__image {
|
||||
display: block;
|
||||
position: relative; }
|
||||
.project__image img {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
display: block; }
|
||||
.project__image:after {
|
||||
content: " ";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.4));
|
||||
transition: opacity .3s ease;
|
||||
opacity: 0; }
|
||||
.project__card {
|
||||
position: relative;
|
||||
transition: box-shadow .3s ease;
|
||||
box-shadow: 0 10px 30px transparent; }
|
||||
.project__card.hover-in {
|
||||
transition: -webkit-transform .2s ease-out;
|
||||
transition: transform .2s ease-out;
|
||||
transition: transform .2s ease-out, -webkit-transform .2s ease-out; }
|
||||
.project__card.hover-out {
|
||||
transition: -webkit-transform .2s ease-in;
|
||||
transition: transform .2s ease-in;
|
||||
transition: transform .2s ease-in, -webkit-transform .2s ease-in; }
|
||||
.project:hover .project__card {
|
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4); }
|
||||
.project:hover .project__image:after {
|
||||
opacity: 1; }
|
||||
.project:hover .project__detail {
|
||||
border-width: 10px;
|
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4); }
|
||||
.project:hover .project__title, .project:hover .project__category {
|
||||
-webkit-transform: translateY(0) scale(1);
|
||||
-ms-transform: translateY(0) scale(1);
|
||||
transform: translateY(0) scale(1);
|
||||
opacity: 1; }
|
||||
.project:hover .project__title {
|
||||
font-weight: 600;
|
||||
margin-bottom: 0;
|
||||
line-height: 1; }
|
||||
.project__detail {
|
||||
position: absolute;
|
||||
left: 30px;
|
||||
right: 30px;
|
||||
top: 30px;
|
||||
bottom: 30px;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-justify-content: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
-webkit-transform: translateZ(30px);
|
||||
transform: translateZ(30px);
|
||||
border: 0 solid #00BCD4;
|
||||
transition: border .4s ease; }
|
||||
.project__title {
|
||||
margin: 0 0 10px;
|
||||
font-size: 36px;
|
||||
font-weight: 700;
|
||||
transition: .4s ease;
|
||||
opacity: 0;
|
||||
-webkit-transform: translateY(40px) scale(0);
|
||||
-ms-transform: translateY(40px) scale(0);
|
||||
transform: translateY(40px) scale(0);
|
||||
will-change: transform; }
|
||||
.project__title a {
|
||||
color: white; }
|
||||
.project__category {
|
||||
opacity: 0;
|
||||
transition: .4s ease;
|
||||
transition-delay: .1s;
|
||||
-webkit-transform: translateY(40px) scale(0);
|
||||
-ms-transform: translateY(40px) scale(0);
|
||||
transform: translateY(40px) scale(0);
|
||||
will-change: transform; }
|
||||
.project__category a {
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
font-size: 1.3em; }
|
||||
|
||||
.movie {
|
||||
margin: 0 auto;
|
||||
width: 250px; }
|
||||
.movie-list:after {
|
||||
content: " ";
|
||||
display: block;
|
||||
clear: both; }
|
||||
.movie__card {
|
||||
position: relative;
|
||||
width: 250px;
|
||||
height: 370px;
|
||||
transition: .2s ease-out; }
|
||||
.movie [class*="layer"] {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-radius: 10px; }
|
||||
.movie .layer-1 {
|
||||
background-image: url(dist/images/deadpool-bg.png);
|
||||
background-size: cover; }
|
||||
.movie .layer-2 {
|
||||
background-image: url(dist/images/deadpool.png);
|
||||
background-size: cover;
|
||||
-webkit-transform: translateZ(30px);
|
||||
transform: translateZ(30px); }
|
||||
.movie .layer-3 {
|
||||
background-image: url(dist/images/deadpool-title.png);
|
||||
background-size: cover;
|
||||
-webkit-transform: translateZ(50px);
|
||||
transform: translateZ(50px); }
|
||||
.movie .shine {
|
||||
border-radius: 10px; }
|
||||
Reference in New Issue
Block a user