Difference between revisions of "Team:SKLMT-China"

Line 93: Line 93:
 
nav.navbar.bootsnav ul.nav > li > a {
 
nav.navbar.bootsnav ul.nav > li > a {
 
     color: #fff;
 
     color: #fff;
 +
}
 +
 +
 +
@-webkit-keyframes animatedBackground {
 +
  0% {
 +
    background-position: 0 0;
 +
  }
 +
  50% {
 +
    background-position: 100% 100%;
 +
  }
 +
  100% {
 +
    background-position: 0 0;
 +
  }
 +
}
 +
 +
.index-banner {
 +
    background-size: 120% auto;
 +
    background-position: bottom;
 +
    -webkit-animation: animatedBackground 40s linear infinite;
 +
    animation: animatedBackground 40s linear infinite;
 +
}
 +
 +
.tiles {
 +
    display: flex;
 +
    flex-wrap: wrap;
 +
    border-top: 0;
 +
}
 +
 +
.tiles article {
 +
    display: flex;
 +
    height: 40vh;
 +
    max-height: 40em;
 +
    min-height: 25em;
 +
    overflow: hidden;
 +
    width: 40%;
 +
 +
    background-repeat: no-repeat;
 +
    background-position: center;
 +
    background-size: cover;
 +
}
 +
 +
.tiles article:nth-child(4n - 1), .tiles article:nth-child(4n - 2) {
 +
    width: 60%;
 +
}
 +
 +
.tiles article header {
 +
    padding: 1em 0 1em 5em;
 +
    margin: auto auto;
 +
    width: 100%;
 +
    display: inline-block;
 +
    vertical-align: middle;
 +
    position: relative;
 +
    z-index: 1;
 +
    transition: all 1s ease;
 +
 +
}
 +
 +
.tiles article a {
 +
    position: absolute;
 +
    width: 100%;
 +
    height: 100%;
 +
    z-index: 4;
 +
}
 +
 +
.tiles article header h2 {
 +
    color: #fff;
 +
    font-size: 3em;
 +
    transform: translateY(100px);
 +
    transition: all 1s ease;
 +
}
 +
 +
.tiles article header p {
 +
    color: #fff;
 +
    margin-top: 1em;
 +
    font-style: normal;
 +
    font-size: 1.4em;
 +
    opacity: 0;
 +
 +
    transition: all 1s ease;
 +
    transform: translateY(100px);
 +
}
 +
 +
.tiles article:hover header p {
 +
    transform: translateY(0);
 +
    opacity: 1;
 +
}
 +
 +
.tiles article:hover header h2 {
 +
    transform: translateY(0);
 +
    font-size: 3.5em;
 +
}
 +
 +
article:after {
 +
    position:absolute;
 +
    left: 0;
 +
    top:0;
 +
    display: block;
 +
    width:100%;
 +
    height: 100%;
 +
    background-color: rgba(0, 0, 0, 0.88);
 +
    content: attr(data-text);
 +
    transition:all 1s ease;
 +
    transform: translateY(0);
 +
}
 +
 +
article:hover:after{
 +
    transform: translateY(100%);
 
}
 
}
 
</style>
 
</style>
 
</html>
 
</html>

Revision as of 21:10, 17 October 2018

SKLMT

This is SKLMT-China SPEKING

Team

Here is SKLMT-China.

Project

Here is SKLMT-China.

InterLab

Here is SKLMT-China.

Parts

Here is SKLMT-China.

Model

Here is SKLMT-China.

Software

Here is SKLMT-China.

Human Practices

Here is SKLMT-China.

Notebook

Here is SKLMT-China.