Mercurial > hg > Papers > 2019 > anatofuz-thesis

comparison presen/fig/tgraph/assets/idrviewer.css @ 77:2327c951dfb9

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
update
author anatofuz <anatofuz@cr.ie.u-ryukyu.ac.jp>
date Mon, 18 Feb 2019 19:46:14 +0900
parents
children
comparison
equal deleted inserted replaced
76:582b97946af6 77:2327c951dfb9
1 /* IDRViewer - v1.8.2 */
2
3 /* Layout Styles */
4 .page {
5 display:block;
6 overflow: hidden;
7 background-color: white;
8 }
9
10 .page-inner {
11 -webkit-transform-origin: top left;
12 -ms-transform-origin: top left;
13 transform-origin: top left;
14 }
15
16 #idrviewer {
17 overflow: auto;
18 line-height: 0;
19 margin: 0;
20 padding: 0;
21 -webkit-overflow-scrolling: touch;
22 }
23
24 #overlay {
25 width: 100%;
26 height: 100%;
27 position: absolute;
28 z-index: 10;
29 visibility: hidden;
30 }
31
32 #overlay.panning {
33 visibility: visible;
34 cursor: all-scroll;
35 cursor: -moz-grab;
36 cursor: -webkit-grab;
37 cursor: grab;
38 }
39
40 #overlay.panning.mousedown {
41 cursor: all-scroll;
42 cursor: -moz-grabbing;
43 cursor: -webkit-grabbing;
44 cursor: grabbing;
45 }
46
47 /* Presentation Layout */
48 .layout-presentation .page {
49 visibility: hidden;
50 position: absolute;
51 }
52 .layout-presentation .page.current {
53 visibility: visible !important;
54 z-index: 1; /* Fix selection in IE/Edge */
55 }
56
57 /* Continuous Layout */
58 .layout-continuous .page {
59 margin: 0 auto 10px;
60 }
61 .layout-continuous .page:last-child {
62 margin: 0 auto 0;
63 }
64
65 /* Continuous_Horizontal Layout */
66 #idrviewer.layout-continuous_horizontal {
67 overflow: hidden;
68
69 /*-webkit-scroll-snap-type: mandatory;*/
70 /*-webkit-scroll-snap-points-x: repeat(100%);*/
71 }
72
73 .layout-continuous_horizontal .page {
74 display: inline-block;
75 transform: translate3d(0, 0, 0);
76 }
77
78 /* Magazine Layout */
79 .layout-magazine .page {
80 visibility: hidden;
81 position: absolute;
82 }
83 .layout-magazine .page.current {
84 visibility: visible !important;
85 z-index: 1; /* Fix selection in IE/Edge */
86 }
87
88
89
90 /* Slide Transition */
91 .layout-presentation.transition-slide .page {
92 -webkit-transition: opacity 0.2s, -webkit-transform 0.4s;
93 transition: opacity 0.2s, transform 0.4s;
94 opacity: 0;
95 visibility: visible !important;
96 }
97 .layout-presentation.transition-slide .page.current {
98 visibility: visible !important;
99 opacity: 1;
100 }
101 .layout-presentation.transition-slide .page.after {
102 visibility: visible !important;
103 -webkit-transform: translateX(130%);
104 transform: translateX(130%);
105 -webkit-transition-delay: 0.1s, 0s;
106 transition-delay: 0.1s, 0s;
107 }
108 .layout-presentation.transition-slide .page.before {
109 visibility: visible !important;
110 -webkit-transform: translateX(-130%);
111 transform: translateX(-130%);
112 -webkit-transition-delay: 0.1s, 0s;
113 transition-delay: 0.1s, 0s;
114 }
115
116 /* Fade Transition */
117 .layout-presentation.transition-fade .page {
118 -webkit-transition: visibility 0.5s, opacity 0.5s;
119 transition: visibility 0.5s, opacity 0.5s;
120 opacity: 1;
121 }
122 .layout-presentation.transition-fade .page.prev,
123 .layout-presentation.transition-fade .page.next {
124 opacity: 0;
125 z-index: 2;
126 }
127
128 /* Flip Transition */
129 .layout-presentation.transition-flip > div > div {
130 -webkit-transform-style: preserve-3d;
131 transform-style: preserve-3d;
132 -webkit-perspective: 1000px;
133 perspective: 1000px;
134 }
135 .layout-presentation.transition-flip .page {
136 -webkit-transition: -webkit-transform 0.5s;
137 transition: transform 0.5s;
138 -webkit-backface-visibility: hidden;
139 backface-visibility: hidden;
140 }
141 .layout-presentation.transition-flip .page.before {
142 -webkit-transform: rotateY(-180deg);
143 transform: rotateY(-180deg);
144 }
145 .layout-presentation.transition-flip .page.after {
146 -webkit-transform: rotateY(180deg);
147 transform: rotateY(180deg);
148 }
149 .layout-presentation.transition-flip .next,
150 .layout-presentation.transition-flip .prev {
151 visibility: visible;
152 }
153
154 /* Throw Transition */
155 .layout-presentation.transition-throw .page {
156 opacity: 0;
157 -webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
158 transition: transform 0.5s, opacity 0.5s;
159 -webkit-transition-timing-function: ease-out;
160 transition-timing-function: ease-out;
161 }
162 .layout-presentation.transition-throw .page.current {
163 visibility: visible !important;
164 z-index: 3;
165 opacity: 1;
166 }
167 .layout-presentation.transition-throw .page.prev {
168 visibility: visible !important;
169 opacity: 0;
170 z-index: 4;
171 }
172 .layout-presentation.transition-throw .page.prev:nth-child(even) {
173 -webkit-transform: translate(100%, -100%) rotate(240deg);
174 transform: translate(100%, -100%) rotate(240deg);
175 }
176 .layout-presentation.transition-throw .page.prev:nth-child(odd) {
177 -webkit-transform: translate(-100%, -100%) rotate(-240deg);
178 transform: translate(-100%, -100%) rotate(-240deg);
179 }
180 .layout-presentation.transition-throw .page.next {
181 visibility: visible !important;
182 -webkit-transform: none;
183 transform: none;
184 opacity: 1;
185 z-index: 2;
186 }
187
188 /* Magazine Transition */
189 .layout-magazine.transition-magazine > div > div {
190 -webkit-transform-style: preserve-3d;
191 transform-style: preserve-3d;
192 -webkit-perspective: 3000px;
193 perspective: 3000px;
194 }
195 .layout-magazine.transition-magazine .page {
196 -webkit-transition: -webkit-transform 0.5s;
197 transition: transform 0.5s;
198 -webkit-backface-visibility: hidden;
199 backface-visibility: hidden;
200 }
201 .layout-magazine.transition-magazine .page:nth-child(odd) {
202 -webkit-transform-origin: left top 0;
203 transform-origin: left top 0;
204 }
205 .layout-magazine.transition-magazine .page:nth-child(even) {
206 -webkit-transform-origin: right top 0;
207 transform-origin: right top 0;
208 }
209 .layout-magazine.transition-magazine .page.current,
210 .layout-magazine.transition-magazine .page.prev:nth-child(even),
211 .layout-magazine.transition-magazine .page.next:nth-child(odd),
212 .layout-magazine.transition-magazine .page.before:nth-child(even),
213 .layout-magazine.transition-magazine .page.after:nth-child(odd) {
214 -webkit-transform: none !important;
215 transform: none !important;
216 }
217
218 .layout-magazine.transition-magazine .page.before:nth-child(odd),
219 .layout-magazine.transition-magazine .page.prev:nth-child(odd) {
220 -webkit-transform: rotateY(-180deg);
221 transform: rotateY(-180deg);
222 z-index: 3;
223 }
224
225 .layout-magazine.transition-magazine .page.after:nth-child(even),
226 .layout-magazine.transition-magazine .page.next:nth-child(even) {
227 -webkit-transform: rotateY(180deg);
228 transform: rotateY(180deg);
229 z-index: 3;
230 }
231
232 .layout-magazine.transition-magazine .page.prev,
233 .layout-magazine.transition-magazine .page.next {
234 visibility: visible;
235 }
236 .layout-magazine.transition-magazine .page.current {
237 z-index: 2;
238 }