Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2026-03-22 20:32:28 +01:00
Code Issues Packages Projects Releases Wiki Activity

moved metro slide animation out of vanilla into cerulean, and rejigged the home page a bit

Browse Source
This commit is contained in:
psychobunny
2013-09-18 16:56:34 -04:00
parent 0b0b06e8b9
commit a38ace0df9
3 changed files with 129 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
public/themes/cerulean/animations.less
View File

@@ -3434,3 +3434,72 @@
-o-animation-name: rollOut;
animation-name: rollOut;
}
@-webkit-keyframes scroll-2 /* Safari and Chrome */
{
0% {top: 0px;}
3% {top:-130px;}
25% {top: -130px;}
28% {top:-260px;}
50% {top: -260px;}
53% {top: -390px;};
75% {top: -390px;}
78% {top: -520px;}
100% {top: -520px;}
}
@keyframes scroll-2
{
0% {top: 0px;}
3% {top:-130px;}
25% {top: -130px;}
28% {top:-260px;}
50% {top: -260px;}
53% {top: -390px;};
75% {top: -390px;}
78% {top: -520px;}
100% {top: -520px;}
}
@-webkit-keyframes scroll-1 /* Safari and Chrome */
{
0% {top: 0px;}
3% {top:-130px;}
33% {top: -130px;}
36% {top: -260px;}
66% {top: -260px;}
69% {top: -390px;}
100% {top: -390px;}
}
@keyframes scroll-1
{
0% {top: 0px;}
3% {top:-130px;}
33% {top: -130px;}
36% {top: -260px;}
66% {top: -260px;}
69% {top: -390px;}
100% {top: -390px;}
}
@-webkit-keyframes scroll-0 /* Safari and Chrome */
{
0% {top: 0px;}
3% {top:-130px;}
50% {top: -130px;}
53% {top: -260px;}
100% {top: -260px;}
}
@keyframes scroll-0
{
0% {top: 0px;}
3% {top:-130px;}
50% {top: -130px;}
53% {top: -260px;}
100% {top: -260px;}
}

38
public/themes/cerulean/home.less
View File

@@ -3,15 +3,49 @@
.home {
h4 {
color: #555;
color: #fff;
padding-left: 10px;
}
.icon {
> div > div {
margin-top: -37px;
height: 150px;
.category-box {
.animated-long;
.pulse;
height: 130px;
}
border-radius: 0;
padding-top: 50px;
}
.badge {
position: absolute;
bottom: 15px;
right: 20px;
background: none;
}
.category-slider-2:hover {
position:relative;
-webkit-animation: scroll-2 10s ease-in 0.5s infinite normal;
animation: scroll-2 10s ease-in 0.5s infinite normal;/* Safari and Chrome: */
}
.category-slider-1:hover {
position:relative;
-webkit-animation: scroll-1 8s ease-in 0.5s infinite normal;
animation: scroll-1 8s ease-in 0.5s infinite normal;/* Safari and Chrome: */
}
.category-slider-0:hover {
position:relative;
-webkit-animation: scroll-0 6s ease-in 0.5s infinite normal;
animation: scroll-0 6s ease-in 0.5s infinite normal;/* Safari and Chrome: */
}
}

132
public/themes/vanilla/home.less
View File

@@ -18,8 +18,32 @@
.pointer;
margin-bottom: 10px;
overflow:hidden;
.category-box {
height:90px;
.post-preview {
padding-left:10px;
padding-right:10px;
text-align:left;
img {
width:60px;
height:60px;
padding-right:5px;
}
p {
overflow: hidden;
text-overflow:ellipsis;
height:60px;
}
}
}
}
}
@@ -89,111 +113,3 @@
}
}
.category-box {
height:90px;
.post-preview {
padding-left:10px;
padding-right:10px;
text-align:left;
img {
width:60px;
height:60px;
padding-right:5px;
}
p {
overflow: hidden;
text-overflow:ellipsis;
height:60px;
}
}
}
@-webkit-keyframes scroll-2 /* Safari and Chrome */
{
0% {top: 0px;}
3% {top:-90px;}
25% {top: -90px;}
28% {top:-180px;}
50% {top: -180px;}
53% {top: -270px;};
75% {top: -270px;}
78% {top: -360px;}
100% {top: -360px;}
}
@keyframes scroll-2
{
0% {top: 0px;}
3% {top:-90px;}
25% {top: -90px;}
28% {top:-180px;}
50% {top: -180px;}
53% {top: -270px;};
75% {top: -270px;}
78% {top: -360px;}
100% {top: -360px;}
}
@-webkit-keyframes scroll-1 /* Safari and Chrome */
{
0% {top: 0px;}
3% {top:-90px;}
33% {top: -90px;}
36% {top: -180px;}
66% {top: -180px;}
69% {top: -270px;}
100% {top: -270px;}
}
@keyframes scroll-1
{
0% {top: 0px;}
3% {top:-90px;}
33% {top: -90px;}
36% {top: -180px;}
66% {top: -180px;}
69% {top: -270px;}
100% {top: -270px;}
}
@-webkit-keyframes scroll-0 /* Safari and Chrome */
{
0% {top: 0px;}
3% {top:-90px;}
50% {top: -90px;}
53% {top: -180px;}
100% {top: -180px;}
}
@keyframes scroll-0
{
0% {top: 0px;}
3% {top:-90px;}
50% {top: -90px;}
53% {top: -180px;}
100% {top: -180px;}
}
.category-slider-2:hover {
position:relative;
-webkit-animation: scroll-2 10s ease-in 0.5s infinite normal;
animation: scroll-2 10s ease-in 0.5s infinite normal;/* Safari and Chrome: */
}
.category-slider-1:hover {
position:relative;
-webkit-animation: scroll-1 8s ease-in 0.5s infinite normal;
animation: scroll-1 8s ease-in 0.5s infinite normal;/* Safari and Chrome: */
}
.category-slider-0:hover {
position:relative;
-webkit-animation: scroll-0 6s ease-in 0.5s infinite normal;
animation: scroll-0 6s ease-in 0.5s infinite normal;/* Safari and Chrome: */
}