Add deck.js slide deck with basic layout
[kai/lca12.git] / extensions / menu / deck.menu.scss
1 .deck-menu {
2         .slide {
3                 background:#eee;
4                 position:relative;
5                 left:0;
6                 top:0;
7                 visibility:visible;
8                 cursor:pointer;
9         }
10         
11         > .slide {
12                 .no-csstransforms & {
13                         float:left;
14                         width:22%;
15                         height:22%;
16                         min-height:0;
17                         margin:1%;
18                         font-size:0.22em;
19                         overflow:hidden;
20                         padding:0 0.5%;
21                 }
22                 
23                 .csstransforms & {
24                         -webkit-transform:scale(.22);
25                         -moz-transform:scale(.22);
26                         -o-transform:scale(.22);
27                         -ms-transform:scale(.22);
28                         transform:scale(.22);
29                         -webkit-transform-origin:0 0;
30                         -moz-transform-origin:0 0;
31                         -o-transform-origin:0 0;
32                         -ms-transform-origin:0 0;
33                         transform-origin:0 0;
34                         -webkit-box-sizing: border-box;
35                         -moz-box-sizing: border-box;
36                         box-sizing: border-box;
37                         width:100%;
38                         height:100%;
39                         overflow:hidden;
40                         padding:0 48px;
41                         margin:12px;
42                 }
43         }
44         
45         iframe, img, video {
46                 max-width:100%;
47         }
48         
49         .deck-current, .no-touch & .slide:hover {
50                 background:#ddf;
51         }
52         
53         &.deck-container:hover {
54                 .deck-prev-link, .deck-next-link {
55                         display:none;
56                 }
57         }
58 }