blob: 0c91c7becc85a96da2d48ccd54e54e5fff615466 [file] [log] [blame]
Nils Diewalda944fab2015-04-08 21:02:04 +00001@charset "utf-8";
2@import "util";
3
4$border-size: 2px;
5
6#search {
7 position: relative;
8 margin-bottom: 44px;
9 overflow: visible;
10
11 &.match {
12 margin-top: 14pt;
13 }
14
15 ol {
16 width: auto;
17 overflow-x: hidden;
18 overflow-y: visible;
19 list-style-type: none;
20 margin: 0;
21 padding: 0;
22 text-indent: 0;
23 border: 1px solid $kwic-border;
24 font-size: 10pt;
25 > li {
26 border: {
27 style: solid;
28 color: $dark-orange;
29 width: 0;
30 }
31 &:not(.active):not(:target) {
32 width: 99999%;
33 margin-left: -49999.5%;
34 background-color: $kwic-line-noneven;
35 overflow-x: hidden;
36 overflow-y: visible;
37 white-space: no-wrap;
38 cursor: pointer;
39 padding: 5pt 0 6pt 0;
40 &:nth-of-type(even) {
41 background-color: $kwic-line-even;
42 }
43 .matchinfo {
44 display: none;
45 }
46 > div > div.snippet {
47 text-overflow: ellipsis;
48 text-indent: 0;
49 text-shadow: $light-shadow;
50 }
51 }
52 > div {
53 > div.snippet {
54 > span,
55 > mark {
56 white-space: no-wrap !important;
57 > span {
58 white-space: no-wrap !important;
59 }
60 color: #666;
61 }
62 > mark,
63 > span.match {
64 font-weight: bold;
65 /* text-shadow: $kwic-match-shadow; */
66 color: $kwic-match-color;
67 padding-left: 4pt;
68 padding-right: 2pt;
69 }
70 }
71 }
72 }
73
74 /* active view */
75 > li.active,
76 > li:target {
77 text-align: left;
78 width: auto;
79 cursor: normal;
80 white-space: wrap;
81 height: auto;
82 border-width: 2px;
Nils Diewald1c546922015-04-13 01:56:19 +000083 background-color: $dark-orange;
Nils Diewald0e6992a2015-04-14 20:13:52 +000084// @include light-noise;
Nils Diewalda944fab2015-04-08 21:02:04 +000085 position: relative;
86 > div {
87 min-height: 42pt;
88 > div.snippet {
Nils Diewald1c546922015-04-13 01:56:19 +000089 background-color: $light-orange;
90 > * {
91 background-color: transparent;
92 }
93 padding: {
94 top: 0;
95 right: 0;
96 bottom: 5pt;
97 left: 5pt;
98 };
99 margin: {
100 top: 0;
101 right: $right-match-distance; // 3em;
102 bottom: 0;
103 left: 0; // 5pt margin-top
104 }
Nils Diewalda944fab2015-04-08 21:02:04 +0000105 > span {
106 line-height: 1.4em;
107 width: auto;
108 &.context-left {
109 margin-left: 0;
110 display: inline;
111 overflow: visible;
112 text-align: left;
113 width: auto;
114 }
115 }
116 }
117 }
118 }
119
120 /* Actions */
121 > li {
122 ul.action {
123 display: none;
124 }
125
126 /* active actions */
127 &.active, &:target {
128 ul.action {
129 display: block;
130 }
131 }
132 &:not(.active):not(:target) p.ref {
133 display: none;
134 }
135 &.active p.ref,
136 &:target p.ref {
Nils Diewald1c546922015-04-13 01:56:19 +0000137// background-color: $dark-orange;
Nils Diewalda944fab2015-04-08 21:02:04 +0000138 color: white;
139 padding: 3pt 10pt;
140 padding-right: $right-match-distance;
141 margin: 0pt;
142 width: 100%;
143 bottom: 0;
144 z-index: 30;
145 }
146 }
147 }
148}
149
150ul.action {
Nils Diewald1c546922015-04-13 01:56:19 +0000151// background-color: $dark-orange;
Nils Diewalda944fab2015-04-08 21:02:04 +0000152 font-size: 12pt;
153 color: white;
154 text: {
155 shadow: none;
156 indent: 0;
157 }
158 margin: 0;
159 padding: 0;
160 z-index: 5;
161
162 list-style: {
163 type: none;
164 position: inline;
165 }
166 &.right {
167 position: absolute;
168 width: $right-match-distance;
169 float: right;
170 text-align: center;
171 padding: 0pt 3pt;
172 height: 100%;
173 right: 0;
174 top: 0;
175 li {
176 cursor: pointer;
177 color: white;
178 text-decoration: none;
179
180 > span {
181 @include blind;
182 }
183 &.close::after {
184 font-family: "FontAwesome";
Nils Diewald2488d052015-04-09 21:46:02 +0000185 content: $fa-close;
Nils Diewalda944fab2015-04-08 21:02:04 +0000186 }
187 &.info::after {
188 font-family: "FontAwesome";
Nils Diewald2488d052015-04-09 21:46:02 +0000189 content: $fa-info;
Nils Diewalda944fab2015-04-08 21:02:04 +0000190 }
191 }
192 }
193}
194
195/*
196ol.align-free > li:not(.active):not(:target) > div > div.snippet > span.left {
197 display: inline-block;
198 text-align: right;
199 width: 50.046%;
200}
201
202ol.align-free > li:not(.active):not(:target) > div > div.snippet > span.separator {
203 width: 0px;
204 height: 1em;
205 margin-bottom: -2px;
206 display: inline-block;
207 line-height: 100%;
208 border: 1px solid #009EE0;
209 margin-left: 2px;
210 margin-right: 2px;
211}
212
213ol.align-free > li > div > div.snippet > span.right {
214 text-align: left;
215}
216*/
217
218ol.align-left > li > div > div.snippet > span.context-left {
219 display: inline-block;
220 text-align: right;
221 width: 50.01%;
222}
223
224ol.align-right {
225 text-align: right;
226 > li:not(.active):not(:target) > div > div.snippet > span.context-right {
227 display: inline-block;
228 text-align: left;
229 width: 49.915%;
230 }
231}
232
233/**
234 * Highlights
235 */
236mark {
237 background-color: inherit;
238 color: inherit;
239}
240
241mark > mark,
242em,
243.level-0 {
244 border-bottom-width: 2px;
245 border-bottom-style: solid;
246 padding-bottom: 0px;
247 font-style: normal;
248}
249
250mark > mark > mark,
251em > em,
252.level-1 {
253 padding-bottom: 3px;
254}
255
256mark > mark > mark > mark,
257em > em > em,
258.level-2 {
259 padding-bottom: 6px;
260}
261
262li {
263 &:not(.active) mark > mark > mark > mark,
264 &:not(.active) em > em > em {
265 line-height: 180%;
266 }
267 &.active mark > mark > mark > mark,
268 &.active em > em > em {
269 line-height: 250%;
270 }
271}
272
273.class-1 { border-color: $kwic-highlight-1; }
274.class-2 { border-color: $kwic-highlight-2; }
275.class-3 { border-color: $kwic-highlight-3; }
276.class-4 { border-color: $kwic-highlight-4; }
277
278/*
279span.more:before {
280 content: "…";
281 padding-left: 2pt;
282 padding-right: 2pt;
283}
284*/
285
286div.snippet.startMore:before,
287div.snippet.endMore:after {
288 content: "…";
289 padding-left: 2pt;
290 padding-right: 2pt;
291}
292
293