Mercurial > libervia-templates
annotate default/static/ticket.css @ 84:b2ef34e602cf
base, js (websocket), css (main style): dynamic pages implementation, first draft:
this patch introduces the browser part of dynamic pages.
Dynamic pages work by establishing a websocket between server and the current page, if requested by server (which means that needed arguments are present in template).
Once the connection is established, the server can, for now, reload the page, append HTML elements, or receive arbitrary data (without reloading the page, in opposition to data post).
If connection can't be established, a popup will be displayed and connection will be retried many times after variable timeouts.
The browser will finally give up and display an alert to client if the number of retries is too high (20 for now).
| author | Goffi <goffi@goffi.org> |
|---|---|
| date | Wed, 03 Jan 2018 01:12:16 +0100 |
| parents | e99bd385774a |
| children | 042530200fe4 |
| rev | line source |
|---|---|
| 56 | 1 @import 'blog.css'; /* needed as blog/articles.html is included */ |
| 2 | |
| 3 .instructions { | |
| 4 font-style: italic; | |
| 5 text-align: center; | |
| 6 } | |
| 7 | |
| 8 .instructions span { | |
| 9 padding: 0.3em; | |
| 10 } | |
| 11 | |
|
74
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
12 ul.xmlui_list { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
13 list-style: none; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
14 display: flex; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
15 flex-direction: column; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
16 padding: 0; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
17 } |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
18 |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
19 .xmlui_list li { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
20 display: inline-flex; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
21 background: #eee; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
22 padding: 0.5em; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
23 margin: 0.5em 0; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
24 border: 1px solid silver; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
25 } |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
26 |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
27 .xmlui_list li:hover { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
28 background: yellow; |
| 56 | 29 } |
| 30 | |
|
74
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
31 .xmlui_list a { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
32 display: flex; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
33 width: 100%; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
34 text-decoration: none; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
35 color: inherit; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
36 } |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
37 |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
38 .xmlui_list a:visited { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
39 color: inherit; |
| 56 | 40 } |
| 41 | |
|
74
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
42 .tickets a.status_closed { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
43 text-decoration: line-through; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
44 color: grey; |
| 56 | 45 } |
| 46 | |
|
74
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
47 .xmlui_field__id { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
48 font-style: 1; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
49 padding-right: 1em; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
50 } |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
51 |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
52 .xmlui_field__title { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
53 padding-right: 1em; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
54 } |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
55 |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
56 .tickets a.severity_major .xmlui_field__title { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
57 font-weight: bold; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
58 color: red; |
| 56 | 59 } |
| 60 | |
| 61 .tickets tbody tr.severity_major .td_title a::before { | |
| 62 content: '⚠ '; | |
| 63 color: red; | |
| 64 } | |
| 65 | |
| 66 /* single ticket */ | |
| 67 | |
| 68 .ticket { | |
| 69 padding: 20px; | |
| 70 max-width: 500px; | |
| 71 margin: 0 auto; | |
| 72 } | |
| 73 | |
| 74 .view .xmlui_widget { | |
| 75 width: auto; | |
| 76 } | |
| 77 | |
|
63
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
78 .view div.xmlui_cont div.xmlui_cont { |
|
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
79 display: grid; |
|
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
80 grid-template-columns: min-content 1fr; |
|
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
81 } |
|
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
82 |
| 56 | 83 .view #label_wid_title, |
| 84 .view #label_wid_body, | |
| 85 .view #label_wid_id, | |
| 86 .view #label_wid_comments_uri, | |
| 87 .view #wid_comments_uri { | |
| 88 display: none | |
| 89 } | |
| 90 | |
|
63
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
91 .view .xmlui_label { |
| 64 | 92 padding-right: 2em; |
| 56 | 93 } |
| 94 | |
| 95 .view #wid_id { | |
| 96 margin: 0; | |
| 97 font-style: italic; | |
|
63
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
98 grid-column-start: 1; |
|
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
99 grid-column-end: 3; |
|
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
100 text-align: right; |
| 56 | 101 } |
| 102 | |
| 103 .view .xmlui_label { | |
| 104 font-weight: bold; | |
| 105 float: left; | |
| 106 color: #808080cc; | |
| 107 } | |
| 108 | |
| 109 .view #wid_title { | |
| 110 font-weight: bold; | |
| 111 display: block; | |
| 112 text-align: center; | |
|
63
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
113 grid-column-start: 1; |
|
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
114 grid-column-end: 3; |
| 56 | 115 } |
| 61 | 116 .view #wid_title::first-letter { |
| 56 | 117 text-transform: uppercase; |
| 118 } | |
| 119 | |
|
74
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
120 .view #wid_labels span, .xmlui_field__labels span { |
| 66 | 121 font-size: 0.8em; |
| 122 background: #eae3e3; | |
| 123 font-variant: small-caps; | |
| 124 border: 1px solid black; | |
| 125 border-radius: 0.5em; | |
| 126 padding: 0 2px; | |
| 56 | 127 white-space: nowrap; |
| 128 } | |
| 129 | |
| 130 .view #wid_labels span.value_work_in_progress { | |
| 131 background: yellow; | |
| 132 } | |
| 133 | |
| 134 .view #wid_type { | |
| 135 font-weight: bold; | |
| 136 } | |
| 137 | |
| 138 .view #wid_type span.value_bug::after { | |
| 139 content: ' 🐛'; | |
| 140 color: red; | |
| 141 } | |
| 142 | |
| 143 .view #wid_severity span.value_major { | |
| 144 font-weight: bold; | |
| 145 color: red; | |
| 146 } | |
| 147 | |
| 148 .view #wid_severity span.value_major::after { | |
| 149 content: '⚠ '; | |
| 150 } | |
| 151 | |
| 152 .view #wid_body { | |
| 153 white-space: pre-wrap; | |
| 154 max-height: 500px; | |
| 155 overflow: auto; | |
| 156 resize: both; | |
| 157 background-color: white; | |
| 158 padding: 5px; | |
| 159 text-align: justify; | |
| 160 border: 1px solid black; | |
| 161 border-radius: 5px; | |
|
63
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
162 grid-column-start: 1; |
|
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
163 grid-column-end: 3; |
|
a9ecc765214c
ticket(view): use CSS grid to display metadata, and put data next to labels
Goffi <goffi@goffi.org>
parents:
61
diff
changeset
|
164 display: block; |
| 56 | 165 } |
| 166 | |
| 167 .comment_post { | |
| 168 margin-top: 3em; | |
| 169 } | |
|
74
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
170 |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
171 @media (min-width: 800px) { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
172 ul.xmlui_list { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
173 padding: 0 2em; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
174 } |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
175 .xmlui_list li { |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
176 border-radius: 0.3em; |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
177 } |
|
e99bd385774a
ticket(overview): use list instead of table and display labels
Goffi <goffi@goffi.org>
parents:
66
diff
changeset
|
178 } |