FEATURE #1518: add assets and views for static pages
This commit is contained in:
Michal Kváček
Binary file not shown.
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 49 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 47 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 937 B |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
+656
@@ -0,0 +1,656 @@
|
||||
.slide-in-down.mui-enter, .slide-in-left.mui-enter, .slide-in-up.mui-enter, .slide-in-right.mui-enter, .slide-out-down.mui-leave, .slide-out-right.mui-leave, .slide-out-up.mui-leave, .slide-out-left.mui-leave, .fade-in.mui-enter, .fade-out.mui-leave, .hinge-in-from-top.mui-enter, .hinge-in-from-right.mui-enter, .hinge-in-from-bottom.mui-enter, .hinge-in-from-left.mui-enter, .hinge-in-from-middle-x.mui-enter, .hinge-in-from-middle-y.mui-enter, .hinge-out-from-top.mui-leave, .hinge-out-from-right.mui-leave, .hinge-out-from-bottom.mui-leave, .hinge-out-from-left.mui-leave, .hinge-out-from-middle-x.mui-leave, .hinge-out-from-middle-y.mui-leave, .scale-in-up.mui-enter, .scale-in-down.mui-enter, .scale-out-up.mui-leave, .scale-out-down.mui-leave, .spin-in.mui-enter, .spin-out.mui-leave, .spin-in-ccw.mui-enter, .spin-out-ccw.mui-leave {
|
||||
transition-duration: 500ms;
|
||||
transition-timing-function: linear;
|
||||
}
|
||||
|
||||
.slide-in-down.mui-enter {
|
||||
-webkit-transform: translateY(-100%);
|
||||
transform: translateY(-100%);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.slide-in-down.mui-enter.mui-enter-active {
|
||||
-webkit-transform: translateY(0);
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.slide-in-left.mui-enter {
|
||||
-webkit-transform: translateX(-100%);
|
||||
transform: translateX(-100%);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.slide-in-left.mui-enter.mui-enter-active {
|
||||
-webkit-transform: translateX(0);
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.slide-in-up.mui-enter {
|
||||
-webkit-transform: translateY(100%);
|
||||
transform: translateY(100%);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.slide-in-up.mui-enter.mui-enter-active {
|
||||
-webkit-transform: translateY(0);
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.slide-in-right.mui-enter {
|
||||
-webkit-transform: translateX(100%);
|
||||
transform: translateX(100%);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.slide-in-right.mui-enter.mui-enter-active {
|
||||
-webkit-transform: translateX(0);
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.slide-out-down.mui-leave {
|
||||
-webkit-transform: translateY(0);
|
||||
transform: translateY(0);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.slide-out-down.mui-leave.mui-leave-active {
|
||||
-webkit-transform: translateY(-100%);
|
||||
transform: translateY(-100%);
|
||||
}
|
||||
|
||||
.slide-out-right.mui-leave {
|
||||
-webkit-transform: translateX(0);
|
||||
transform: translateX(0);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.slide-out-right.mui-leave.mui-leave-active {
|
||||
-webkit-transform: translateX(100%);
|
||||
transform: translateX(100%);
|
||||
}
|
||||
|
||||
.slide-out-up.mui-leave {
|
||||
-webkit-transform: translateY(0);
|
||||
transform: translateY(0);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.slide-out-up.mui-leave.mui-leave-active {
|
||||
-webkit-transform: translateY(-100%);
|
||||
transform: translateY(-100%);
|
||||
}
|
||||
|
||||
.slide-out-left.mui-leave {
|
||||
-webkit-transform: translateX(0);
|
||||
transform: translateX(0);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.slide-out-left.mui-leave.mui-leave-active {
|
||||
-webkit-transform: translateX(-100%);
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
.fade-in.mui-enter {
|
||||
opacity: 0;
|
||||
transition-property: opacity;
|
||||
}
|
||||
|
||||
.fade-in.mui-enter.mui-enter-active {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.fade-out.mui-leave {
|
||||
opacity: 1;
|
||||
transition-property: opacity;
|
||||
}
|
||||
|
||||
.fade-out.mui-leave.mui-leave-active {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-in-from-top.mui-enter {
|
||||
-webkit-transform: perspective(2000px) rotateX(-90deg);
|
||||
transform: perspective(2000px) rotateX(-90deg);
|
||||
-webkit-transform-origin: top;
|
||||
transform-origin: top;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-in-from-top.mui-enter.mui-enter-active {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-in-from-right.mui-enter {
|
||||
-webkit-transform: perspective(2000px) rotateY(-90deg);
|
||||
transform: perspective(2000px) rotateY(-90deg);
|
||||
-webkit-transform-origin: right;
|
||||
transform-origin: right;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-in-from-right.mui-enter.mui-enter-active {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-in-from-bottom.mui-enter {
|
||||
-webkit-transform: perspective(2000px) rotateX(90deg);
|
||||
transform: perspective(2000px) rotateX(90deg);
|
||||
-webkit-transform-origin: bottom;
|
||||
transform-origin: bottom;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-in-from-bottom.mui-enter.mui-enter-active {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-in-from-left.mui-enter {
|
||||
-webkit-transform: perspective(2000px) rotateY(90deg);
|
||||
transform: perspective(2000px) rotateY(90deg);
|
||||
-webkit-transform-origin: left;
|
||||
transform-origin: left;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-in-from-left.mui-enter.mui-enter-active {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-in-from-middle-x.mui-enter {
|
||||
-webkit-transform: perspective(2000px) rotateX(-90deg);
|
||||
transform: perspective(2000px) rotateX(-90deg);
|
||||
-webkit-transform-origin: center;
|
||||
transform-origin: center;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-in-from-middle-x.mui-enter.mui-enter-active {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-in-from-middle-y.mui-enter {
|
||||
-webkit-transform: perspective(2000px) rotateY(-90deg);
|
||||
transform: perspective(2000px) rotateY(-90deg);
|
||||
-webkit-transform-origin: center;
|
||||
transform-origin: center;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-in-from-middle-y.mui-enter.mui-enter-active {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-out-from-top.mui-leave {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
-webkit-transform-origin: top;
|
||||
transform-origin: top;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-out-from-top.mui-leave.mui-leave-active {
|
||||
-webkit-transform: perspective(2000px) rotateX(-90deg);
|
||||
transform: perspective(2000px) rotateX(-90deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-out-from-right.mui-leave {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
-webkit-transform-origin: right;
|
||||
transform-origin: right;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-out-from-right.mui-leave.mui-leave-active {
|
||||
-webkit-transform: perspective(2000px) rotateY(-90deg);
|
||||
transform: perspective(2000px) rotateY(-90deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-out-from-bottom.mui-leave {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
-webkit-transform-origin: bottom;
|
||||
transform-origin: bottom;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-out-from-bottom.mui-leave.mui-leave-active {
|
||||
-webkit-transform: perspective(2000px) rotateX(90deg);
|
||||
transform: perspective(2000px) rotateX(90deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-out-from-left.mui-leave {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
-webkit-transform-origin: left;
|
||||
transform-origin: left;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-out-from-left.mui-leave.mui-leave-active {
|
||||
-webkit-transform: perspective(2000px) rotateY(90deg);
|
||||
transform: perspective(2000px) rotateY(90deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-out-from-middle-x.mui-leave {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
-webkit-transform-origin: center;
|
||||
transform-origin: center;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-out-from-middle-x.mui-leave.mui-leave-active {
|
||||
-webkit-transform: perspective(2000px) rotateX(-90deg);
|
||||
transform: perspective(2000px) rotateX(-90deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hinge-out-from-middle-y.mui-leave {
|
||||
-webkit-transform: perspective(2000px) rotate(0deg);
|
||||
transform: perspective(2000px) rotate(0deg);
|
||||
-webkit-transform-origin: center;
|
||||
transform-origin: center;
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hinge-out-from-middle-y.mui-leave.mui-leave-active {
|
||||
-webkit-transform: perspective(2000px) rotateY(-90deg);
|
||||
transform: perspective(2000px) rotateY(-90deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.scale-in-up.mui-enter {
|
||||
-webkit-transform: scale(0.5);
|
||||
transform: scale(0.5);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.scale-in-up.mui-enter.mui-enter-active {
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.scale-in-down.mui-enter {
|
||||
-webkit-transform: scale(1.5);
|
||||
transform: scale(1.5);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.scale-in-down.mui-enter.mui-enter-active {
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.scale-out-up.mui-leave {
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.scale-out-up.mui-leave.mui-leave-active {
|
||||
-webkit-transform: scale(1.5);
|
||||
transform: scale(1.5);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.scale-out-down.mui-leave {
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.scale-out-down.mui-leave.mui-leave-active {
|
||||
-webkit-transform: scale(0.5);
|
||||
transform: scale(0.5);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.spin-in.mui-enter {
|
||||
-webkit-transform: rotate(-0.75turn);
|
||||
transform: rotate(-0.75turn);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.spin-in.mui-enter.mui-enter-active {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.spin-out.mui-leave {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.spin-out.mui-leave.mui-leave-active {
|
||||
-webkit-transform: rotate(0.75turn);
|
||||
transform: rotate(0.75turn);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.spin-in-ccw.mui-enter {
|
||||
-webkit-transform: rotate(0.75turn);
|
||||
transform: rotate(0.75turn);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.spin-in-ccw.mui-enter.mui-enter-active {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.spin-out-ccw.mui-leave {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
transition-property: -webkit-transform, opacity;
|
||||
transition-property: transform, opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.spin-out-ccw.mui-leave.mui-leave-active {
|
||||
-webkit-transform: rotate(-0.75turn);
|
||||
transform: rotate(-0.75turn);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.slow {
|
||||
transition-duration: 750ms !important;
|
||||
}
|
||||
|
||||
.fast {
|
||||
transition-duration: 250ms !important;
|
||||
}
|
||||
|
||||
.linear {
|
||||
transition-timing-function: linear !important;
|
||||
}
|
||||
|
||||
.ease {
|
||||
transition-timing-function: ease !important;
|
||||
}
|
||||
|
||||
.ease-in {
|
||||
transition-timing-function: ease-in !important;
|
||||
}
|
||||
|
||||
.ease-out {
|
||||
transition-timing-function: ease-out !important;
|
||||
}
|
||||
|
||||
.ease-in-out {
|
||||
transition-timing-function: ease-in-out !important;
|
||||
}
|
||||
|
||||
.bounce-in {
|
||||
transition-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important;
|
||||
}
|
||||
|
||||
.bounce-out {
|
||||
transition-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important;
|
||||
}
|
||||
|
||||
.bounce-in-out {
|
||||
transition-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important;
|
||||
}
|
||||
|
||||
.short-delay {
|
||||
transition-delay: 300ms !important;
|
||||
}
|
||||
|
||||
.long-delay {
|
||||
transition-delay: 700ms !important;
|
||||
}
|
||||
|
||||
.shake {
|
||||
-webkit-animation-name: shake-7;
|
||||
animation-name: shake-7;
|
||||
}
|
||||
|
||||
@-webkit-keyframes shake-7 {
|
||||
0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90% {
|
||||
-webkit-transform: translateX(7%);
|
||||
transform: translateX(7%);
|
||||
}
|
||||
5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95% {
|
||||
-webkit-transform: translateX(-7%);
|
||||
transform: translateX(-7%);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes shake-7 {
|
||||
0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90% {
|
||||
-webkit-transform: translateX(7%);
|
||||
transform: translateX(7%);
|
||||
}
|
||||
5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95% {
|
||||
-webkit-transform: translateX(-7%);
|
||||
transform: translateX(-7%);
|
||||
}
|
||||
}
|
||||
|
||||
.spin-cw {
|
||||
-webkit-animation-name: spin-cw-1turn;
|
||||
animation-name: spin-cw-1turn;
|
||||
}
|
||||
|
||||
@-webkit-keyframes spin-cw-1turn {
|
||||
0% {
|
||||
-webkit-transform: rotate(-1turn);
|
||||
transform: rotate(-1turn);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes spin-cw-1turn {
|
||||
0% {
|
||||
-webkit-transform: rotate(-1turn);
|
||||
transform: rotate(-1turn);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
}
|
||||
}
|
||||
|
||||
.spin-ccw {
|
||||
-webkit-animation-name: spin-cw-1turn;
|
||||
animation-name: spin-cw-1turn;
|
||||
}
|
||||
|
||||
@keyframes spin-cw-1turn {
|
||||
0% {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(1turn);
|
||||
transform: rotate(1turn);
|
||||
}
|
||||
}
|
||||
|
||||
.wiggle {
|
||||
-webkit-animation-name: wiggle-7deg;
|
||||
animation-name: wiggle-7deg;
|
||||
}
|
||||
|
||||
@-webkit-keyframes wiggle-7deg {
|
||||
40%, 50%, 60% {
|
||||
-webkit-transform: rotate(7deg);
|
||||
transform: rotate(7deg);
|
||||
}
|
||||
35%, 45%, 55%, 65% {
|
||||
-webkit-transform: rotate(-7deg);
|
||||
transform: rotate(-7deg);
|
||||
}
|
||||
0%, 30%, 70%, 100% {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes wiggle-7deg {
|
||||
40%, 50%, 60% {
|
||||
-webkit-transform: rotate(7deg);
|
||||
transform: rotate(7deg);
|
||||
}
|
||||
35%, 45%, 55%, 65% {
|
||||
-webkit-transform: rotate(-7deg);
|
||||
transform: rotate(-7deg);
|
||||
}
|
||||
0%, 30%, 70%, 100% {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
}
|
||||
}
|
||||
|
||||
.infinite {
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.slow {
|
||||
-webkit-animation-duration: 750ms !important;
|
||||
animation-duration: 750ms !important;
|
||||
}
|
||||
|
||||
.fast {
|
||||
-webkit-animation-duration: 250ms !important;
|
||||
animation-duration: 250ms !important;
|
||||
}
|
||||
|
||||
.linear {
|
||||
-webkit-animation-timing-function: linear !important;
|
||||
animation-timing-function: linear !important;
|
||||
}
|
||||
|
||||
.ease {
|
||||
-webkit-animation-timing-function: ease !important;
|
||||
animation-timing-function: ease !important;
|
||||
}
|
||||
|
||||
.ease-in {
|
||||
-webkit-animation-timing-function: ease-in !important;
|
||||
animation-timing-function: ease-in !important;
|
||||
}
|
||||
|
||||
.ease-out {
|
||||
-webkit-animation-timing-function: ease-out !important;
|
||||
animation-timing-function: ease-out !important;
|
||||
}
|
||||
|
||||
.ease-in-out {
|
||||
-webkit-animation-timing-function: ease-in-out !important;
|
||||
animation-timing-function: ease-in-out !important;
|
||||
}
|
||||
|
||||
.bounce-in {
|
||||
-webkit-animation-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important;
|
||||
animation-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important;
|
||||
}
|
||||
|
||||
.bounce-out {
|
||||
-webkit-animation-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important;
|
||||
animation-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important;
|
||||
}
|
||||
|
||||
.bounce-in-out {
|
||||
-webkit-animation-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important;
|
||||
animation-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important;
|
||||
}
|
||||
|
||||
.short-delay {
|
||||
-webkit-animation-delay: 300ms !important;
|
||||
animation-delay: 300ms !important;
|
||||
}
|
||||
|
||||
.long-delay {
|
||||
-webkit-animation-delay: 700ms !important;
|
||||
animation-delay: 700ms !important;
|
||||
}
|
||||
+133
@@ -0,0 +1,133 @@
|
||||
@font-face {font-family: "Lobster"; src: url(fonts/lobster_1_4.woff);}
|
||||
|
||||
body,h1,h2,h3,h4,h5,h6, * {font-family: 'Ubuntu', sans-serif; color: #414042;}
|
||||
a, a:link, a:hover {color: #46c1be; font-weight: 500;}
|
||||
a:hover {text-decoration: underline;}
|
||||
|
||||
.m-t-25 {margin-top: 25px;}
|
||||
.m-t-50 {margin-top: 50px;}
|
||||
.m-b-25 {margin-bottom: 25px;}
|
||||
.m-l-40 {margin-left: 40px;}
|
||||
.p-lr-15 {padding-left: 15px; padding-right: 15px;}
|
||||
.p-lr-0 {padding-left: 0; padding-right: 0;}
|
||||
.p-25 {padding: 25px !important;}
|
||||
.p-b-0 {padding-bottom: 0 !important;}
|
||||
.rounded {border-radius: 3px;}
|
||||
.large.rounded,.expanded.rounded {border-radius: 6px;}
|
||||
.button {padding: 0.4em 2.3em; font-size: 0.7rem;}
|
||||
.button.secondary {background-color: #4D4D4F;}
|
||||
.button.success {background-color: #46c1be;}
|
||||
.button.success:hover, .button.success:focus, .button.success:active, .button.success.active {background-color: #4D4D4F;}
|
||||
.button.large, .button.expanded {font-size:0.9rem; padding: 0.9em 2.4em; font-weight: 700; margin-bottom: 0;}
|
||||
.button.large.long {padding: 0.9em 4em;}
|
||||
.button.expanded.long {height: 3rem; padding: 1em 4em;}
|
||||
.w-t {color: #ffffff}
|
||||
.green-text {color: #46c1be !important;}
|
||||
.uppercase {text-transform: uppercase;}
|
||||
.bold {font-weight: 700;}
|
||||
|
||||
[type="text"], [type="password"], [type="date"], [type="datetime"], [type="datetime-local"], [type="month"], [type="week"], [type="email"],
|
||||
[type="number"], [type="search"], [type="tel"], [type="time"], [type="url"], [type="color"], textarea,
|
||||
[type="text"]:focus, [type="password"]:focus, [type="date"]:focus, [type="datetime"]:focus, [type="datetime-local"]:focus, [type="month"]:focus, [type="week"]:focus,
|
||||
[type="email"]:focus, [type="number"]:focus, [type="search"]:focus, [type="tel"]:focus, [type="time"]:focus, [type="url"]:focus, [type="color"]:focus, textarea:focus
|
||||
{
|
||||
border: 0; box-shadow: none; color: #46c1be; font-weight: 500; padding: 1rem; line-height: 2rem; height: 3rem;
|
||||
}
|
||||
textarea, textarea:focus {height: 120px;}
|
||||
[type="text"]:focus,[type="text"]:not(:empty), [type="password"]:focus, [type="date"]:focus, [type="datetime"]:focus, [type="datetime-local"]:focus, [type="month"]:focus, [type="week"]:focus,
|
||||
[type="email"]:focus, [type="number"]:focus, [type="search"]:focus, [type="tel"]:focus, [type="time"]:focus, [type="url"]:focus, [type="color"]:focus, textarea:focus {
|
||||
color: #414042;
|
||||
}
|
||||
|
||||
.top-bar {position: relative; top: 0; width: 100%;}
|
||||
.top-bar.homepage {position: absolute; top: 0; width: 100%;}
|
||||
.top-bar, .top-bar ul {background-color: transparent; z-index: 500;}
|
||||
|
||||
.menu > li:not(.menu-text) > a {font-weight: 700; text-transform:uppercase; color: #4D4D4F}
|
||||
.menu > li:not(.menu-text) > a.active {color: #46c1be}
|
||||
.top-bar-right {position: absolute; bottom: 5px; right: 0;}
|
||||
|
||||
.orbit.header {position: relative; z-index: 1;}
|
||||
.orbit.header .orbit-next, .orbit.header .orbit-previous { background-color: #ffffff; color: #4d4d4f; padding: 40px;}
|
||||
.orbit.header .orbit-next:hover, .orbit.header .orbit-previous:hover { background-color: #46c1be; color: #ffffff;}
|
||||
.orbit.header .orbit-next {border-top-left-radius: 50%; border-bottom-left-radius: 50%; right: -70px;}
|
||||
.orbit.header .orbit-next i {position: relative; left: -30px;}
|
||||
.orbit.header .orbit-previous {border-top-right-radius: 50%; border-bottom-right-radius: 50%; left: -70px;}
|
||||
.orbit.header .orbit-previous i {position: relative; left: 30px;}
|
||||
.orbit.header .orbit-slide {position: relative;}
|
||||
.orbit.header .orbit-slide:before {content: ''; position: absolute; top: 20%; width: 100%; display: block; height: 60%; background-color: rgba(77, 77, 79, 0.70); }
|
||||
.orbit.header .orbit-slide .img {width: 100%; height: 800px; background-size: cover; background-position: center center}
|
||||
.orbit.header .orbit-slide h2, .orbit.header .orbit-slide h3 {
|
||||
position: absolute; top: 0; color: #ffffff; font-family: Lobster, Helvetica, Arial, sans-serif;
|
||||
text-align: center; width: 100%;
|
||||
}
|
||||
.orbit.header .orbit-slide h2 {top: 35%; font-size: 5.2rem;}
|
||||
.orbit.header .orbit-slide h3 {top: calc(38% + 4.2rem); font-size: 3.5rem;}
|
||||
.orbit.header .orbit-bullets {position: absolute; margin: auto; width: 100%; top: 63%;}
|
||||
.orbit.header .orbit-bullets button {width: .95rem; height: .95rem; margin: .35rem; background-color: #ffffff;}
|
||||
.orbit.header .orbit-bullets button.is-active, .orbit-bullets button:hover {background-color: #f58020;}
|
||||
#chevron-down {position: absolute; z-index: 350; display: block; top: 75%; left: calc(50% - 12px); opacity: 0.6; color: #ffffff; cursor: pointer;}
|
||||
#chevron-down:hover {color: #f58020}
|
||||
|
||||
#content h2 {text-transform: uppercase; font-size: 1.5rem; font-weight: 400; text-align: center;}
|
||||
#content h3 {text-align: center; text-transform: uppercase; }
|
||||
#content h4 {font-size: 1.35rem;}
|
||||
hr {border-bottom: 0;width: 5%; margin: 0 auto; position: relative; top: -15px; display:inline-block; height: 1px; background-color: #46c1be}
|
||||
#content p {line-height: 1.3; font-size: 0.9rem;}
|
||||
#content p.small {font-size: .75rem;}
|
||||
|
||||
.grey-wrapper {background-color: #f1f1f1; padding: 50px 0; display: block;}
|
||||
.green-wrapper {background-color: #46c1be; padding: 50px 0; display: block;}
|
||||
.white-wrapper {background-color: #ffffff; padding: 50px 0; display: block;}
|
||||
.backgrounded {background-image: url(images/background_o_nás._white.jpg); background-size: cover; background-position: center center; }
|
||||
|
||||
.assortment-h5 {text-align: center; text-transform: uppercase; font-weight: 500; font-size: 1.1rem;}
|
||||
.assortment-p {font-size: 0.8rem; text-align: center; margin: 15px auto 10px;}
|
||||
.assortment-more-btn {color: #46c1be; text-transform: uppercase; font-style: italic; text-align: center; font-size: 0.85rem; width: 100%; display: inline-block; font-weight: 500;}
|
||||
img.thumbnail {border-radius: 50%; box-shadow: none; border-width: 2px; border-color: #ffffff;}
|
||||
img.thumbnail:focus, img.thumbnail:hover {box-shadow: none; border-color: #ffffff;}
|
||||
|
||||
.sale-image-holder>img {width: 100%; height: auto; border: 1px solid #414042;}
|
||||
.sale-image-holder {margin-bottom: 15px; position: relative; cursor: pointer;}
|
||||
.sale-item-data {display: block; opacity: 0; width: calc(100% - 0.9375rem * 2);height: 100%; position: absolute; top: 0; left: 0.9375rem; background-color: rgba(70, 193, 190, 0.7); color: #ffffff;}
|
||||
.sale-item-data * {color: #ffffff;}
|
||||
.sale-item-data h5 {text-transform: uppercase; font-size: 0.9rem; text-align: center; padding: 15px 10px 0 10px; font-weight: 700; margin-bottom: 0;}
|
||||
.sale-item-data p {margin: -5px auto 0; padding: 0 auto; text-align: center; font-size: 0.8rem;}
|
||||
.sale-item-data p.price {margin-top: 10px; font-weight: 700; font-size: 0.9rem;}
|
||||
|
||||
.gallery-image-holder>img {width: 100%; height: auto; border: 1px solid #414042;}
|
||||
.gallery-image-holder {margin-bottom: 15px; position: relative; cursor: pointer;}
|
||||
.gallery-item-data {display: block; opacity: 0; width: calc(100% - 0.9375rem * 2);height: 100%; position: absolute; top: 0; left: 0.9375rem; background-color: rgba(65, 64, 66, 0.71); color: #ffffff;}
|
||||
.gallery-item-data * {color: #ffffff;}
|
||||
.gallery-item-data h5 {text-transform: uppercase; font-size: 1.1rem; text-align: center; padding: 15px 10px 0 10px; font-weight: 700; margin-bottom: 0;}
|
||||
.gallery-item-data p {margin: 5px; padding: 0 auto; text-align: center; font-size: 0.8rem;}
|
||||
.gallery-item-data p.price {margin-top: 10px; font-weight: 700; font-size: 1.1rem;}
|
||||
|
||||
.white-wrapper h6 {color: #46c1be; text-transform: uppercase; font-size: 1.3rem;}
|
||||
.white-wrapper h6.lowercase {text-transform: none; font-size: 1.2rem;}
|
||||
|
||||
.design-ul-block li {list-style-image: url(images/bullet.png); margin: 15px 30px 25px 30px;}
|
||||
.design-ul-block li h6 {position: relative; top: -7px;}
|
||||
|
||||
.orbit.footer .orbit-next, .orbit.footer .orbit-previous { background-color: #46c1be; padding: 40px;}
|
||||
.orbit.footer .orbit-next:hover, .orbit.footer .orbit-previous:hover { background-color: #f58020;}
|
||||
.orbit.footer .fa {color: #ffffff;}
|
||||
.orbit.footer .orbit-next {border-top-left-radius: 50%; border-bottom-left-radius: 50%; right: -70px;}
|
||||
.orbit.footer .orbit-next i {position: relative; left: -30px;}
|
||||
.orbit.footer .orbit-previous {border-top-right-radius: 50%; border-bottom-right-radius: 50%; left: -70px;}
|
||||
.orbit.footer .orbit-previous i {position: relative; left: 30px;}
|
||||
.orbit.footer .orbit-slide {position: relative; height: 260px;}
|
||||
.orbit.footer .orbit-slide img {width: 100%; height: auto;}
|
||||
|
||||
.image-bullet {margin-right: 7px; position: relative; top: -3px;}
|
||||
.contact-p {margin-bottom: 0; padding-right: 50px; line-height: 1rem; font-weight: 300;}
|
||||
#content p.contact-p.green-text {color: #46c1be !important;}
|
||||
|
||||
footer {padding-top: 50px;}
|
||||
footer .menu {display: inline-block;}
|
||||
footer a {color: #414042; font-weight: 500;}
|
||||
footer a:hover {color: #46c1be;}
|
||||
.social-icons .fa-stack-2x {color: #46c1be;}
|
||||
.social-icons a:hover .fa-stack-2x {color: #414042;}
|
||||
.social-icons .fa.w-t {color: #ffffff;}
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
||||
!function(e,t){"function"==typeof define&&define.amd?define([],function(){return t()}):"object"==typeof exports?module.exports=t():e.whatInput=t()}(this,function(){"use strict";function e(e){clearTimeout(s),n(e),f=!0,s=setTimeout(function(){f=!1},1e3)}function t(e){f||n(e)}function n(e){var t=o(e),n=r(e),d=w[e.type];"pointer"===d&&(d=i(e)),p!==d&&(!y&&p&&"keyboard"===d&&"tab"!==v[t]&&m.indexOf(n.nodeName.toLowerCase())>=0||(p=d,a.setAttribute("data-whatinput",p),-1===h.indexOf(p)&&h.push(p))),"keyboard"===d&&u(t)}function o(e){return e.keyCode?e.keyCode:e.which}function r(e){return e.target||e.srcElement}function i(e){return"number"==typeof e.pointerType?b[e.pointerType]:e.pointerType}function u(e){-1===c.indexOf(v[e])&&v[e]&&c.push(v[e])}function d(e){var t=o(e),n=c.indexOf(v[t]);-1!==n&&c.splice(n,1)}var s,c=[],a=document.body,f=!1,p=null,m=["input","select","textarea"],y=a.hasAttribute("data-whatinput-formtyping"),w={keydown:"keyboard",mousedown:"mouse",mouseenter:"mouse",touchstart:"touch",pointerdown:"pointer",MSPointerDown:"pointer"},h=[],v={9:"tab",13:"enter",16:"shift",27:"esc",32:"space",37:"left",38:"up",39:"right",40:"down"},b={2:"touch",3:"touch",4:"mouse"};return function(){var n="mousedown";window.PointerEvent?n="pointerdown":window.MSPointerEvent&&(n="MSPointerDown"),a.addEventListener(n,t),a.addEventListener("mouseenter",t),"ontouchstart"in document.documentElement&&a.addEventListener("touchstart",e),a.addEventListener("keydown",t),a.addEventListener("keyup",d)}(),{ask:function(){return p},keys:function(){return c},types:function(){return h},set:n}});
|
||||
@@ -0,0 +1,461 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Custom Wristbands.cz</title>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
|
||||
<link href='https://fonts.googleapis.com/css?family=Ubuntu:400,300,500,700&subset=latin-ext,latin' rel='stylesheet' type='text/css'>
|
||||
<link href="@asset('foundation.min.css')" type="text/css" rel="stylesheet">
|
||||
<script src="@asset('vendor/jquery.min.js')" type="text/javascript"></script>
|
||||
<script src="@asset('foundation.min.js')" type="text/javascript"></script>
|
||||
<link href="@asset('layout.css')" type="text/css" rel="stylesheet">
|
||||
<link href="@asset('style.css')" type="text/css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="top-bar homepage">
|
||||
|
||||
<div class="top-bar-left">
|
||||
<ul class="menu">
|
||||
<li class="menu-text">
|
||||
<a href="/"><img src="@asset('images/cwbs_logo_medium.png')" alt="Custom Wristbands Logo"></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="top-bar-right">
|
||||
<ul class="menu">
|
||||
<li><a href="#" class="active">Home</a></li>
|
||||
<li><a href="#">Sortiment</a></li>
|
||||
<li><a href="#">Doprodej</a></li>
|
||||
<li><a href="#">Galerie</a></li>
|
||||
<li><a href="#">O nás</a></li>
|
||||
<li><a href="#">Kontakt</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="orbit header" role="region" aria-label="Favorite Space Pictures" data-orbit>
|
||||
<ul class="orbit-container">
|
||||
<button class="orbit-previous" aria-label="previous"><span class="show-for-sr">Previous Slide</span><i class="fa fa-fw fa-2x fa-chevron-left"></i></button>
|
||||
<button class="orbit-next" aria-label="next"><span class="show-for-sr">Next Slide</span><i class="fa fa-fw fa-2x fa-chevron-right"></i></button>
|
||||
<li class="orbit-slide is-active">
|
||||
<h2>Silikonové náramky 1</h2>
|
||||
<h3>všeho druhu</h3>
|
||||
<div class="img" style="background-image: url(@asset('images/Sabaton.jpg')) "></div>
|
||||
</li>
|
||||
<li class="orbit-slide">
|
||||
<h2>Silikonové náramky2</h2>
|
||||
<h3>všeho druhu</h3>
|
||||
<div class="img" style="background-image: url(@asset('images/background_o_nás.jpg'));"></div>
|
||||
</li>
|
||||
<li class="orbit-slide">
|
||||
<h2>Silikonové náramky3</h2>
|
||||
<h3>všeho druhu</h3>
|
||||
<div class="img" style="background-image: url(@asset('images/Sabaton.jpg'));"></div>
|
||||
</li>
|
||||
<li class="orbit-slide">
|
||||
<h2>Silikonové náramky4</h2>
|
||||
<h3>všeho druhu</h3>
|
||||
<div class="img" style="background-image: url(@asset('images/Sabaton.jpg'));"></div>
|
||||
</li>
|
||||
</ul>
|
||||
<nav class="orbit-bullets">
|
||||
<button class="is-active" data-slide="0"><span class="show-for-sr">First slide details.</span><span class="show-for-sr">Current Slide</span></button>
|
||||
<button data-slide="1"><span class="show-for-sr">Second slide details.</span></button>
|
||||
<button data-slide="2"><span class="show-for-sr">Third slide details.</span></button>
|
||||
<button data-slide="3"><span class="show-for-sr">Fourth slide details.</span></button>
|
||||
</nav>
|
||||
<i id="chevron-down" class="fa fa-2x fa-chevron-circle-down text-center white-text pointer" onclick="animateScroll()"></i>
|
||||
<script>
|
||||
|
||||
function animateScroll() {
|
||||
var body = $("html, body");
|
||||
body.stop().animate({scrollTop:$('#assortment').offset().top}, '200', 'swing');
|
||||
}
|
||||
|
||||
</script>
|
||||
</div>
|
||||
<div id="content">
|
||||
<div class="row column text-center m-t-25">
|
||||
<h2 id="assortment">Náš sortiment</h2>
|
||||
<hr>
|
||||
<p class="text-center">
|
||||
The city needs Bruce Wayne, your resources, your knowledge. It doesn't need your body or your life. That time is past.
|
||||
<br>
|
||||
Seven hundred twelve counts of extortion. Eight hundred and forty-nine counts of racketeering. Two hundred and forty-six counts of fraud. Eighty-seven counts of conspiracy murder.Five hundred and twenty-seven counts of obstruction of justice. How do the defendants plead?
|
||||
<br>
|
||||
You know how to fight six men. We can teach you how to engage 600.
|
||||
<br>
|
||||
You have inspired good. But you spat in the faces of Gotham's criminals. Didn't you think there might be casualties? Things always get worse before they get better.
|
||||
|
||||
</p>
|
||||
</div>
|
||||
<div class="row small-up-2 large-up-4">
|
||||
<div class="column">
|
||||
<img class="thumbnail" src="http://placehold.it/250x250">
|
||||
<h5 class="assortment-h5">Silikonové<br>náramky</h5>
|
||||
<p class="assortment-p">Lorem ipsum dolor<br>
|
||||
sit amet, consectetur<br>
|
||||
adipiscing elit,<br>
|
||||
sed do eiusmod<br>
|
||||
tempor incididunt<br>
|
||||
ut labore et dolore<br>
|
||||
magna aliqua.</p>
|
||||
<a href="#" class="assortment-more-btn text-center">- více zde -</a>
|
||||
</div>
|
||||
<div class="column">
|
||||
<img class="thumbnail" src="http://placehold.it/250x250">
|
||||
<h5 class="assortment-h5">Atypické<br>náramky</h5>
|
||||
<p class="assortment-p">Lorem ipsum dolor<br>
|
||||
sit amet, consectetur<br>
|
||||
adipiscing elit,<br>
|
||||
sed do eiusmod<br>
|
||||
tempor incididunt<br>
|
||||
ut labore et dolore<br>
|
||||
magna aliqua.</p>
|
||||
<a href="#" class="assortment-more-btn text-center">- více zde -</a>
|
||||
</div>
|
||||
<div class="column">
|
||||
<img class="thumbnail" src="http://placehold.it/250x250">
|
||||
<h5 class="assortment-h5">Papírové a látkové náramky</h5>
|
||||
<p class="assortment-p">Lorem ipsum dolor<br>
|
||||
sit amet, consectetur<br>
|
||||
adipiscing elit,<br>
|
||||
sed do eiusmod<br>
|
||||
tempor incididunt<br>
|
||||
ut labore et dolore<br>
|
||||
magna aliqua.</p>
|
||||
<a href="#" class="assortment-more-btn text-center">- více zde -</a>
|
||||
</div>
|
||||
<div class="column">
|
||||
<img class="thumbnail" src="http://placehold.it/250x250">
|
||||
<h5 class="assortment-h5">Silikonové<br>klíčenky</h5>
|
||||
<p class="assortment-p">Lorem ipsum dolor<br>
|
||||
sit amet, consectetur<br>
|
||||
adipiscing elit,<br>
|
||||
sed do eiusmod<br>
|
||||
tempor incididunt<br>
|
||||
ut labore et dolore<br>
|
||||
magna aliqua.</p>
|
||||
<a href="#" class="assortment-more-btn text-center">- více zde -</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grey-wrapper m-t-25 clearfix">
|
||||
<div class="row column" id="sale-images">
|
||||
<h2 class="m-b-25">Doprodej zboží</h2>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column medium-2 sale-image-holder">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
<div class="sale-item-data text-center">
|
||||
<h5>Název produktu</h5>
|
||||
<p>popis</p>
|
||||
<p>počet ks</p>
|
||||
<p class="price">cena: 39,-Kč/ks</p>
|
||||
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$('.sale-image-holder').mouseenter(function() {
|
||||
$(this).find('.sale-item-data').animate({opacity: 1}, 100, 'swing');
|
||||
}).mouseleave(function() {
|
||||
$(this).find('.sale-item-data').animate({opacity: 0}, 300, 'swing');
|
||||
})
|
||||
</script>
|
||||
</div>
|
||||
<div class="green-wrapper clearfix">
|
||||
<div class="row column text-center" id="questions">
|
||||
<h4 class="w-t">MÁTE DOTAZY? NEBO NÁM CHCETE ZASLAT RYCHLOU POPTÁVKU?</h4>
|
||||
<a href="#" class="button secondary m-t-25 large rounded">RYCHLÝ FORMULÁŘ</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="white-wrapper clearfix">
|
||||
<div class="row column" id="design">
|
||||
<div class="columns medium-7">
|
||||
<h6>Design a potisk</h6>
|
||||
<p>
|
||||
<strong><i>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
|
||||
incididunt ut labore et dolore magna aliqua, amet, consectetur adipiscing elit,
|
||||
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||
</i></strong>
|
||||
</p>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
||||
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
|
||||
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
|
||||
eu fugiat nulla pariatur.
|
||||
</p>
|
||||
</div>
|
||||
<div class="columns medium-5">
|
||||
<ul class="design-ul-block">
|
||||
<li>
|
||||
|
||||
<h6 class="lowercase">
|
||||
Proč si vybrat právě nás?
|
||||
</h6>
|
||||
<p class="small">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
|
||||
incididunt ut labore et dolore magna aliqua, amet, consectetur adipiscing elit,
|
||||
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<h6 class="lowercase">
|
||||
Jaký používáme materiál?
|
||||
</h6>
|
||||
<p class="small">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
|
||||
incididunt ut labore et dolore magna aliqua, amet, consectetur adipiscing elit,
|
||||
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="large">
|
||||
<div class="row column text-center">
|
||||
<h2 id="galerie">Galerie</h2>
|
||||
<hr>
|
||||
</div>
|
||||
<div class="orbit footer" role="region" aria-label="Favorite Space Pictures" data-orbit>
|
||||
<ul class="orbit-container text-center">
|
||||
<button class="orbit-previous" aria-label="previous"><span class="show-for-sr">Previous Slide</span><i class="fa fa-fw fa-2x fa-chevron-left"></i></button>
|
||||
<button class="orbit-next" aria-label="next"><span class="show-for-sr">Next Slide</span><i class="fa fa-fw fa-2x fa-chevron-right"></i></button>
|
||||
<li class="orbit-slide is-active row p-lr-15">
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">.
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
</li>
|
||||
<li class="orbit-slide row p-lr-15">
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">.
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
</li>
|
||||
<li class="orbit-slide row p-lr-15">
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">.
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
</li>
|
||||
<li class="orbit-slide row p-lr-15">
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">.
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
<div class="column medium-3">
|
||||
<img src=" http://placehold.it/250x250">
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer class="large">
|
||||
<div class="row text-center">
|
||||
<ul class="menu social-icons">
|
||||
<li>
|
||||
<a href="#" target="_blank">
|
||||
<span class="fa-stack fa-lg">
|
||||
<i class="fa fa-circle fa-stack-2x"></i>
|
||||
<i class="fa fa-facebook fa-stack-1x w-t"></i>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" target="_blank">
|
||||
<span class="fa-stack fa-lg">
|
||||
<i class="fa fa-circle fa-stack-2x"></i>
|
||||
<i class="fa fa fa-google-plus fa-stack-1x w-t"></i>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" target="_blank">
|
||||
<span class="fa-stack fa-lg">
|
||||
<i class="fa fa-circle fa-stack-2x"></i>
|
||||
<i class="fa fa-instagram fa-stack-1x w-t"></i>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" target="_blank">
|
||||
<span class="fa-stack fa-lg">
|
||||
<i class="fa fa-circle fa-stack-2x"></i>
|
||||
<i class="fa fa-pinterest-p fa-stack-1x w-t"></i>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<ul class="menu">
|
||||
<li><a href="#" class="active">Home</a></li>
|
||||
<li><a href="#">Sortiment</a></li>
|
||||
<li><a href="#">Doprodej</a></li>
|
||||
<li><a href="#">Galerie</a></li>
|
||||
<li><a href="#">O nás</a></li>
|
||||
<li><a href="#">Kontakt</a></li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<hr>
|
||||
<p>
|
||||
<a href="#">Název</a> -
|
||||
<a href="#">Adresa</a> -
|
||||
<a href="#">www.url.cz</a> -
|
||||
<a href="#">email@email</a> -
|
||||
<a href="#">00420147852369</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</footer>
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
$(document).foundation();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
@extendVisitor('visitor.layout')
|
||||
|
||||
@section('content')
|
||||
{!! $page->content !!}
|
||||
@endsection
|
||||
Reference in New Issue
Block a user