1/**
2 * This file provides styles for the search results page (?do=search)
3 * and the AJAX search popup.
4 */
5
6/* general
7********************************************************************/
8
9/* search hit in normal text */
10.dokuwiki .search_hit {
11    color: @ini_text;
12    background-color: __highlight__;
13}
14
15/* "nothing found" at search + media */
16.dokuwiki div.nothing {
17    margin-bottom: 1.4em;
18}
19
20/* search results page
21********************************************************************/
22
23/*____________ advanced search form ____________*/
24.dokuwiki .search-results-form fieldset.search-form {
25    width: 100%;
26    margin: 1em 0;
27
28    input[name="q"] {
29        width: 50%;
30    }
31
32    button.toggleAssistant {
33        float: right;
34    }
35
36    .advancedOptions {
37        padding: 1em 0;
38
39        > div {
40            display: inline-block;
41            position: relative;
42            margin: 0 0.5em;
43        }
44
45        div.toggle {
46            // default closed toggle state
47            div.current {
48                cursor: pointer;
49                max-width: 10em;
50                white-space: nowrap;
51                overflow: hidden;
52                text-overflow: ellipsis;
53
54                &::after {
55                    content: '▼';
56                    font-size: smaller;
57                    color: @ini_text_alt;
58                }
59            }
60            div.changed {
61                font-weight: bold;
62            }
63            ul {
64                display: none;
65                position: absolute;
66                border: 1px solid @ini_border;
67                background-color: @ini_background;
68                padding: 0.25em 0.5em;
69                text-align: left;
70                min-width: 10em;
71                max-width: 15em;
72                max-height: 50vh;
73                overflow: auto;
74                z-index: 100;
75                li {
76                    margin: 0.25em 0;
77                    list-style: none;
78
79                    a {
80                        display: block;
81                    }
82                }
83            }
84
85            // open toggle state
86            &.open {
87                div.current::after {
88                    content: '▲';
89                }
90
91                ul {
92                    display: block;
93                }
94            }
95        }
96    }
97}
98
99[dir=rtl] .search-results-form fieldset.search-form .advancedOptions {
100    div.toggle ul {
101        text-align: right;
102    }
103}
104
105
106/*____________ matching pagenames ____________*/
107
108.dokuwiki div.search_quickresult {
109    margin-bottom: 1.4em;
110
111    ul {
112        padding: 0;
113
114        li {
115            float: left;
116            width: 12em;
117            margin: 0 1.5em;
118        }
119    }
120}
121
122[dir=rtl] .dokuwiki div.search_quickresult ul li {
123    float: right;
124}
125
126/*____________ search results ____________*/
127
128.dokuwiki dl.search_results {
129    margin-bottom: 1.2em;
130
131    /* search heading */
132    dt {
133        font-weight: normal;
134        margin-bottom: .2em;
135    }
136
137    /* last modified line */
138    dd.meta {
139        margin: 0 0 .2em 0;
140    }
141
142    /* search snippet */
143    dd.snippet {
144        color: @ini_text_alt;
145        background-color: inherit;
146        margin: 0 0 1.2em 0;
147
148        /* search hit in search results */
149        strong.search_hit {
150            font-weight: normal;
151            /* color is set in general */
152        }
153
154        /* ellipsis separating snippets */
155        .search_sep {
156            color: @ini_text;
157            background-color: inherit;
158        }
159    }
160}
161
162/* AJAX quicksearch popup
163********************************************************************/
164
165.dokuwiki form.search {
166    div.no {
167        position: relative;
168    }
169
170    /* .JSpopup */
171    div.ajax_qsearch {
172        position: absolute;
173        top: 0;
174        left: -13.5em; /* -( width of #qsearch__in + padding of .ajax_qsearch + a bit more ) */
175        width: 12em;
176        padding: 0.5em;
177        font-size: .9em;
178        z-index: 20;
179        text-align: left;
180        display: none;
181
182        strong {
183            display: block;
184            margin-bottom: .3em;
185        }
186
187        ul {
188            margin: 0 !important;
189            padding: 0 !important;
190
191            li {
192                margin: 0;
193                padding: 0;
194                display: block !important;
195            }
196        }
197    }
198}
199
200[dir=rtl] .dokuwiki form.search div.ajax_qsearch {
201    left: auto;
202    right: -13.5em;
203    text-align: right;
204}
205