Add deck.js slide deck with basic layout
[kai/lca12.git] / extensions / navigation / deck.navigation.scss
1 @mixin border-radius($r) {
2         -webkit-border-radius:$r;
3         -moz-border-radius:$r;
4         border-radius:$r;
5 }
6
7 .deck-container {
8         .deck-prev-link, .deck-next-link {
9                 display:none;
10                 position:absolute;
11                 z-index:3;
12                 top:50%;
13                 width:32px;
14                 height:32px;
15                 margin-top:-16px;
16                 font-size:20px;
17                 font-weight:bold;
18                 line-height:32px;
19                 vertical-align:middle;
20                 text-align:center;
21                 text-decoration:none;
22                 color:#fff;
23                 background:#888;
24
25                 .borderradius & {
26                         @include border-radius(16px);
27                 }
28
29                 &:hover, &:focus, &:active, &:visited {
30                         color:#fff;
31                 }
32         }
33
34         .deck-prev-link {
35                 left:8px;
36         }
37
38         .deck-next-link {
39                 right:8px;
40         }
41         
42         &:hover .deck-prev-link, &:hover .deck-next-link {
43                 display:block;
44
45                 &.deck-nav-disabled, .touch & {
46                         display:none;
47                 }
48         }
49 }
50
51
52 @media print {
53         .deck-prev-link, .deck-next-link {
54                 display:none !important;
55         }
56 }