mirror of
https://github.com/naturalcrit/homebrewery.git
synced 2026-01-13 19:32:45 +00:00
109 lines
2.7 KiB
Plaintext
109 lines
2.7 KiB
Plaintext
|
|
@import 'homebrewery/phb_style/phb.fonts.less';
|
|
.homePage{
|
|
position : relative;
|
|
.hero{
|
|
// .backgroundScrollAnimation();
|
|
height : 400px;
|
|
background-image : url('/assets/homebrew/pages/homePage/fantasy_background.jpg');
|
|
background-position : 1% 15%;
|
|
h1{
|
|
margin-top : 15%;
|
|
font-family : BookInsanity;
|
|
font-size : 3em;
|
|
font-weight : 800;
|
|
letter-spacing : 0.3em;
|
|
text-align : center;
|
|
}
|
|
}
|
|
.buttons{
|
|
padding : 30px;
|
|
background-image : url('/assets/homebrew/pages/homePage/dmg_bg.jpg');
|
|
text-align : center;
|
|
&>div{
|
|
//display : flex;
|
|
margin : 0 auto;
|
|
// justify-content : center;
|
|
}
|
|
p{
|
|
margin-bottom : 20px;
|
|
font-size : 0.8em;
|
|
}
|
|
a.button{
|
|
.animate(background-color);
|
|
position : relative;
|
|
display : block;
|
|
height : 60px;
|
|
max-width : 280px;
|
|
width : 100%;
|
|
margin : 15px;
|
|
padding : 20px 30px;
|
|
padding-left : 80px;
|
|
cursor : pointer;
|
|
background-color : fade(@red, 30%);
|
|
color : black;
|
|
text-align : left;
|
|
text-decoration : none;
|
|
//flex-grow : 0;
|
|
display: inline-block;
|
|
i{
|
|
position : absolute;
|
|
top : 15px;
|
|
left : 25px;
|
|
font-size : 2em;
|
|
//transform-style: preserve-3d;
|
|
transform: rotateY(0deg);
|
|
}
|
|
h3{
|
|
display : block;
|
|
margin-bottom : 3px;
|
|
font-size : 1.2em;
|
|
font-weight : 600;
|
|
letter-spacing : 0.2em;
|
|
}
|
|
p{
|
|
.fadeOutLeft();
|
|
.keep();
|
|
opacity : 0;
|
|
font-size : 0.8em;
|
|
}
|
|
&:hover{
|
|
background-color : fade(@red, 50%);
|
|
p{
|
|
.fadeInRight();
|
|
}
|
|
i{
|
|
transform: rotateY(360deg);
|
|
.animateAll(0.5s);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.topBrews{
|
|
background-image : url('/assets/homebrew/pages/homePage/phb_bg.jpg');
|
|
|
|
|
|
}
|
|
|
|
}
|
|
// .vendor(@property, @value) {
|
|
// -webkit-@{property}: @value;
|
|
// -khtml-@{property}: @value;
|
|
// -moz-@{property}: @value;
|
|
// @{property}: @value;
|
|
// }
|
|
// .backgroundScrollAnimation(){
|
|
// @top : -100px;
|
|
// .vendor(animation-iteration-count, infinite);
|
|
// .createAnimation(backgroundScroll, 60s, linear);
|
|
// .backgroundScrollKeyFrames(){
|
|
// 0% { background-position: 0 @top}
|
|
// 100% { background-position: -1200px @top}
|
|
// }
|
|
// @-webkit-keyframes backgroundScroll {.backgroundScrollKeyFrames();}
|
|
// @-moz-keyframes backgroundScroll {.backgroundScrollKeyFrames();}
|
|
// @-ms-keyframes backgroundScroll {.backgroundScrollKeyFrames();}
|
|
// @-o-keyframes backgroundScroll {.backgroundScrollKeyFrames();}
|
|
// @keyframes backgroundScroll {.backgroundScrollKeyFrames();}
|
|
// } |