liquid_feedback_frontend
diff static/style.css @ 19:00d1004545f1
Dynamic interface using XMLHttpRequests, and many other changes
Bugfixes:
- Only allow voting on admitted initiatives
- Repaired issue search
- Don't display delegations for closed issues on member page
- Don't show revoke link in initiative, when issue is already half_frozen
- Localization for voting JavaScript
- Display author of suggestions
Disclosure of voting data after voting is finished:
- Possibility to inspect every ballot including preferences
- Show number of voters preferring one initiative to another initiative
Interface behaviour changes:
- Reversed default order of drafts
- Default order of suggestions changed
- Show new drafts of initiatives only once per day in timeline
Accessibility:
- Barrier-free voting implemented
- POST links are now accessible without JavaScript
- Changed gray for unsatisfied supporters in bar graph to a lighter gray
Other interface improvements:
- Optical enhancements
- Dynamic interface using XMLHttpRequests
- Show usage terms in about section
- Show own membership in area listing
- Show uninformed supporters greyed out and marked with yellow question mark
- Warning box in non-admitted initiatives
- When voted, don't display voting notice and change label of voting link
- Show object counts in more tabulator heads
- Enlarged member statement input field
Miscellaneous:
- Code cleanup
- Added README file containing installation instructions
- Use new WebMCP function ui.filters{...} instead of own ui.filter and ui.order functions
Bugfixes:
- Only allow voting on admitted initiatives
- Repaired issue search
- Don't display delegations for closed issues on member page
- Don't show revoke link in initiative, when issue is already half_frozen
- Localization for voting JavaScript
- Display author of suggestions
Disclosure of voting data after voting is finished:
- Possibility to inspect every ballot including preferences
- Show number of voters preferring one initiative to another initiative
Interface behaviour changes:
- Reversed default order of drafts
- Default order of suggestions changed
- Show new drafts of initiatives only once per day in timeline
Accessibility:
- Barrier-free voting implemented
- POST links are now accessible without JavaScript
- Changed gray for unsatisfied supporters in bar graph to a lighter gray
Other interface improvements:
- Optical enhancements
- Dynamic interface using XMLHttpRequests
- Show usage terms in about section
- Show own membership in area listing
- Show uninformed supporters greyed out and marked with yellow question mark
- Warning box in non-admitted initiatives
- When voted, don't display voting notice and change label of voting link
- Show object counts in more tabulator heads
- Enlarged member statement input field
Miscellaneous:
- Code cleanup
- Added README file containing installation instructions
- Use new WebMCP function ui.filters{...} instead of own ui.filter and ui.order functions
| author | bsw/jbe | 
|---|---|
| date | Sat Feb 20 22:10:31 2010 +0100 (2010-02-20) | 
| parents | 559c6be0e1e9 | 
| children | b195682957dc | 
   line diff
1.1 --- a/static/style.css Tue Feb 02 00:31:06 2010 +0100 1.2 +++ b/static/style.css Sat Feb 20 22:10:31 2010 +0100 1.3 @@ -4,11 +4,16 @@ 1.4 1.5 body, th, td { 1.6 font-family: sans-serif; 1.7 + font-size: 15px; 1.8 font-size: 14px; 1.9 padding: 0; 1.10 margin: 0; 1.11 } 1.12 1.13 +.area_list { 1.14 + line-height: 170%; 1.15 +} 1.16 + 1.17 body, a { 1.18 color: #000; 1.19 } 1.20 @@ -54,7 +59,7 @@ 1.21 } 1.22 1.23 a { 1.24 - vertical-align: middle; 1.25 + xvertical-align: middle; 1.26 } 1.27 1.28 h1 { 1.29 @@ -104,6 +109,8 @@ 1.30 background-color: #444; 1.31 color: #fff; 1.32 font-size: 75%; 1.33 + line-height: 140%; 1.34 + margin-bottom: 1.8ex; 1.35 } 1.36 1.37 .topbar a { 1.38 @@ -137,11 +144,16 @@ 1.39 } 1.40 1.41 .searchbox { 1.42 - padding: 0.5ex 1em 0ex 1em; 1.43 + margin: 0; 1.44 + padding: 0.1ex 1em 0ex 1em; 1.45 float: right; 1.46 line-height: 250%; 1.47 } 1.48 1.49 +.searchbox form { 1.50 + float: left; 1.51 +} 1.52 + 1.53 .searchbox div { 1.54 display: inline; 1.55 } 1.56 @@ -162,7 +174,6 @@ 1.57 1.58 .searchbox input[type=submit] { 1.59 font-size: 100%; 1.60 - width: 2.5em; 1.61 } 1.62 1.63 /************************************************************************* 1.64 @@ -264,6 +275,7 @@ 1.65 .voting_requested { 1.66 float: left; 1.67 position: relative; 1.68 + z-index: 1; 1.69 } 1.70 1.71 .interest img, 1.72 @@ -284,6 +296,11 @@ 1.73 border: 1px solid #b96; 1.74 } 1.75 1.76 +.interest .head_autoreject { 1.77 + background-color: #fdd; 1.78 + border: 1px solid #b77; 1.79 +} 1.80 + 1.81 .slot_support .head_supporter { 1.82 background-color: #dfc; 1.83 border: 1px solid #8b8; 1.84 @@ -299,6 +316,23 @@ 1.85 border: 1px solid #88b; 1.86 } 1.87 1.88 +.delegation .change_delegation { 1.89 + margin-bottom: 2ex; 1.90 +} 1.91 + 1.92 +.delegation .change_delegation a { 1.93 + display: inline; 1.94 + float: none; 1.95 + padding: 1ex; 1.96 +} 1.97 + 1.98 +.delegation .delegation_participation { 1.99 + margin-left: 20.5em; 1.100 + margin-top: 3ex; 1.101 + font-style: italic; 1.102 + font-size: 80%; 1.103 +} 1.104 + 1.105 .voting_requested .head_active { 1.106 background-color: #fdd; 1.107 border: 1px solid #b77; 1.108 @@ -322,7 +356,7 @@ 1.109 background-color: #fff; 1.110 border: 1px solid #999; 1.111 padding: 1em; 1.112 - width: 25em; 1.113 + width: 35em; 1.114 } 1.115 1.116 .vote_info .delegation_arrow { 1.117 @@ -365,7 +399,6 @@ 1.118 1.119 1.120 .sub_title div { 1.121 - border-top: 1px solid #444; 1.122 padding-top: 1ex; 1.123 margin-top: 1ex; 1.124 font-weight: bold; 1.125 @@ -415,27 +448,81 @@ 1.126 padding: 1ex 1ex 1ex 1ex; 1.127 } 1.128 1.129 +.web10 .ui_tabs_accordeon_head { 1.130 + margin-bottom: 1ex; 1.131 +} 1.132 + 1.133 +.web20 .ui_tabs_accordeon_head { 1.134 + font-size: 80%; 1.135 + font-weight: bold; 1.136 + display: block; 1.137 + background: #eee; 1.138 + border: 1px solid #bbb; 1.139 + color: #000; 1.140 + padding: 0.75ex; 1.141 + margin-top: 2ex; 1.142 + cursor: pointer; 1.143 +} 1.144 + 1.145 +.web20 .ui_tabs_accordeon_head img { 1.146 + vertical-align: middle; 1.147 + margin-right: 0.5em; 1.148 +} 1.149 + 1.150 +.web20 .ui_tabs_accordeon_head .bargraph { 1.151 + margin-right: 0.5em; 1.152 +} 1.153 + 1.154 +.web20 .ui_tabs_accordeon_content { 1.155 + border: 1px solid #aaa; 1.156 + border-top: none; 1.157 + padding: 2ex 1em 2ex 1em; 1.158 + margin-bottom: 3ex; 1.159 +} 1.160 + 1.161 +.web20 .issue_initiative_list .ui_tabs_accordeon_head { 1.162 + background-color: #e5e5ff; 1.163 +} 1.164 + 1.165 +.web20 .issue_initiative_list .ui_tabs_accordeon_head, 1.166 +.web20 .issue_initiative_list .ui_tabs_accordeon_content { 1.167 + border-color: #aad; 1.168 +} 1.169 + 1.170 +.web20 .issue_initiative_list .ui_tabs_accordeon_content .ui_tabs_accordeon_content { 1.171 + border-color: #bbb; 1.172 + border-width: 1px; 1.173 +} 1.174 + 1.175 +.web20 .issue_initiative_list .ui_tabs_accordeon_content .ui_tabs_accordeon_head { 1.176 + background-color: #eee; 1.177 + border: 1px solid #bbb; 1.178 +} 1.179 + 1.180 +.web20 .issue_initiative_list .ui_tabs_accordeon_head a { 1.181 + font-size: 125%; 1.182 +} 1.183 + 1.184 + 1.185 + 1.186 /************************************************************************* 1.187 - * ui.filter 1.188 - * ui.order 1.189 + * ui.filters 1.190 */ 1.191 1.192 -.ui_filter_head, 1.193 -.ui_order_head { 1.194 +.ui_filter_closed_head, 1.195 +.ui_filter_head { 1.196 color: #777; 1.197 margin-top: 1ex; 1.198 margin-bottom: 1.5ex; 1.199 font-size: 75%; 1.200 } 1.201 1.202 -.ui_filter_head a, 1.203 -.ui_order_head a { 1.204 +.ui_filter_head a { 1.205 color: #777; 1.206 padding: 0.5ex; 1.207 } 1.208 1.209 -.ui_filter_head a.active, 1.210 -.ui_order_head a.active { 1.211 +.ui_filter_head a.active { 1.212 color: #fff; 1.213 background-color: #777; 1.214 padding: 0.5ex; 1.215 @@ -462,7 +549,11 @@ 1.216 */ 1.217 1.218 .bargraph { 1.219 - width: 101px; 1.220 + width: 103px; 1.221 +} 1.222 + 1.223 +.bargraph50 { 1.224 + width: 52px; 1.225 } 1.226 1.227 .bargraph div { 1.228 @@ -627,6 +718,7 @@ 1.229 background-color: #fff; 1.230 left: 5em; 1.231 top: 5ex; 1.232 +z-index: 2; 1.233 } 1.234 1.235 .hidden_inline_form a { 1.236 @@ -673,7 +765,8 @@ 1.237 padding: 0.3ex 0.5em 0.3ex 0.5em; 1.238 } 1.239 1.240 -.suggestion_my_opinion a { 1.241 +.suggestion_my_opinion a, 1.242 +.suggestion_my_opinion span { 1.243 white-space: nowrap; 1.244 padding-left: 0.2ex !important; 1.245 padding-right: 0.2ex !important; 1.246 @@ -737,7 +830,7 @@ 1.247 1.248 .member_thumb { 1.249 text-decoration: none; 1.250 - width: 18em; 1.251 + width: 15.5em; 1.252 height: 48px; 1.253 display: block; 1.254 float: left; 1.255 @@ -781,13 +874,15 @@ 1.256 } 1.257 1.258 .member_thumb .flags { 1.259 - float: right; 1.260 + text-align: right; 1.261 font-size: 75%; 1.262 } 1.263 1.264 -.member_thumb .flags a{ 1.265 +.member_thumb .flags a, 1.266 +.member_thumb .flags img { 1.267 position: static; 1.268 float: right; 1.269 + margin-left: 0.5em; 1.270 } 1.271 1.272 1.273 @@ -795,12 +890,14 @@ 1.274 float: right; 1.275 } 1.276 1.277 -.member_thumb.not_accepted { 1.278 +.member_thumb.not_accepted, 1.279 +.member_thumb.not_informed { 1.280 opacity: 0.5; 1.281 } 1.282 1.283 +.member_statement, 1.284 .draft_content, 1.285 -.member_statement { 1.286 +.suggestion_content { 1.287 background-color: #eee; 1.288 border: 1px solid #ccc; 1.289 padding-left: 1ex; 1.290 @@ -842,14 +939,27 @@ 1.291 margin-right: 0.7em; 1.292 } 1.293 1.294 +.admitted_info { 1.295 + background-color: #dfd; 1.296 + padding: 1ex; 1.297 + margin-bottom: 2ex; 1.298 +} 1.299 + 1.300 +.not_admitted_info, 1.301 +.revoked_info { 1.302 + background-color: #fdd; 1.303 + padding: 1ex; 1.304 + margin-bottom: 2ex; 1.305 +} 1.306 + 1.307 .draft_updated_info, 1.308 .voting_active_info, 1.309 -.revoked_info, 1.310 .initiator_invite_info, 1.311 .motd { 1.312 background-color: #fec; 1.313 - border: 2px solid #b96; 1.314 + border: 1px solid #b96; 1.315 padding: 1ex; 1.316 + margin-bottom: 2ex; 1.317 } 1.318 1.319 .suggestion_fulfilled { 1.320 @@ -934,6 +1044,17 @@ 1.321 background-color: #fec; 1.322 } 1.323 1.324 +.heading { 1.325 + font-size: 120%; 1.326 + font-weight: bold; 1.327 + margin-top: 2ex; 1.328 + margin-bottom: 1ex; 1.329 +} 1.330 + 1.331 +.heading.first { 1.332 + margin-top: 0; 1.333 +} 1.334 + 1.335 /************************************************************************* 1.336 * Voting 1.337 */ 1.338 @@ -974,16 +1095,20 @@ 1.339 border: 1px black solid; 1.340 margin: 1ex; 1.341 padding: 0.5ex; 1.342 +} 1.343 +#voting .voting_form_active .movable { 1.344 cursor: pointer; 1.345 } 1.346 -#voting .clickable { 1.347 +#voting .voting_form_active .clickable { 1.348 cursor: auto; 1.349 } 1.350 -#voting a.clickable { 1.351 +#voting .voting_form_active a.clickable { 1.352 cursor: pointer; 1.353 } 1.354 1.355 #voting .grabber { 1.356 vertical-align: middle; 1.357 cursor: move; 1.358 -} 1.359 \ No newline at end of file 1.360 +} 1.361 + 1.362 +