Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Side by Side Diff: pages/committee/members.tmpl

Issue 29471608: Issue 5043 - Update member page layout (Closed) Base URL: https://hg.adblockplus.org/web.acceptableads.com
Patch Set: Fixed regression Created July 17, 2017, 10:36 a.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View unified diff | Download patch
« no previous file with comments | « no previous file | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 title=Members | The Acceptable Ads Committee 1 title=Members | The Acceptable Ads Committee
2 description=A list of all Representatives and supporting Members that make up th e Acceptable Ads Committee. 2 description=A list of all Representatives and supporting Members that make up th e Acceptable Ads Committee.
3 parent=committee/index 3 parent=committee/index
4 custom=1 4 custom=1
5 5
6 {% block head %} 6 {% block head %}
7 <style> 7 <style>
8 @media(min-width: 768px) 8 @media(min-width: 768px)
9 { 9 {
10 #committee-structure 10 #committee-structure
11 { 11 {
12 padding-top: 25%; 12 padding-top: 25%;
13 margin: 0 auto; 13 margin: 0px auto;
14 max-width: 70%; 14 max-width: 70%;
15 } 15 }
16 } 16 }
17 17
18 .group-list h4 18 .group-list h4
19 { 19 {
20 margin-top: 40px; 20 margin-top: 40px;
21 padding: 8px 22px; 21 padding: 8px 22px;
22 background-color: #E1E1E1; 22 background-color: #E1E1E1;
23 } 23 }
24 24
25 .group-list dl 25 .group-list dl
26 { 26 {
27 margin: 22px; 27 margin: 22px;
28 } 28 }
29 29
30 .group-list dt 30 .group-list dt
31 { 31 {
32 margin: 32px 0 26px 0; 32 margin: 32px 0px 26px 0px;
33 color: #424242; 33 color: #424242;
34 text-transform: none; 34 text-transform: none;
35 } 35 }
36 36
37 .group-list dd 37 .group-list dd
38 { 38 {
39 margin: 0; 39 margin: 0px;
40 } 40 }
41 41
42 .member-list 42 .member-list
43 { 43 {
44 display: block; 44 display: block;
45 width: 100%; 45 width: 100%;
46 margin: 0; 46 margin: 0px;
47 overflow: auto; 47 overflow: auto;
48 } 48 }
49 49
50 .member-list li 50 .member-list li
51 { 51 {
52 width: 100%; 52 width: 100%;
53 float: left; 53 float: left;
54 padding-left: 0px; 54 padding-left: 0px;
55 margin-bottom: 1em; 55 margin-bottom: 1em;
56 } 56 }
(...skipping 17 matching lines...) Expand all
74 74
75 .member-list li:before 75 .member-list li:before
76 { 76 {
77 display: none; 77 display: none;
78 } 78 }
79 </style> 79 </style>
80 {% endblock %} 80 {% endblock %}
81 81
82 {% set coalitions = { 82 {% set coalitions = {
83 "for-profit": { 83 "for-profit": {
84 "title": "FOR-PROFIT COALITION", 84 "title": "For-Profit Coalition",
85 "description": "This Coalition consists of stakeholders that can be classifi ed as organizations primarily driven by generating profits. The following groups form the For-Profit Coalition: Advertisers, Ad-Tech Agencies, Advertising Agenc ies, and Publishers and Content Creators.", 85 "description": "This Coalition consists of stakeholders that can be classifi ed as organizations primarily driven by generating profits. The following groups form the For-Profit Coalition: Advertisers, Ad-Tech Agencies, Advertising Agenc ies, and Publishers and Content Creators.",
86 "groups": [ 86 "groups": [
87 "Advertisers", 87 "Advertisers",
88 "Ad Tech Agencies", 88 "Ad Tech Agencies",
89 "Advertising Agencies", 89 "Advertising Agencies",
90 "Publishers & Content Creators", 90 "Publishers & Content Creators",
91 ], 91 ],
92 }, 92 },
93 "expert": { 93 "expert": {
94 "title": "EXPERT COALITION", 94 "title": "Expert Coalition",
95 "description": "This Coalition consists of stakeholders who primarily focus on specific issues relevant to their area of expertise. These experts bring a un ique and objective perspective to the AAC. The following groups form the Expert Coalition: Creative Agents, Researchers and Academics and User Agents.", 95 "description": "This Coalition consists of stakeholders who primarily focus on specific issues relevant to their area of expertise. These experts bring a un ique and objective perspective to the AAC. The following groups form the Expert Coalition: Creative Agents, Researchers and Academics and User Agents.",
96 "groups": [ 96 "groups": [
97 "Creative Agents", 97 "Creative Agents",
98 "Researchers & Academics", 98 "Researchers & Academics",
99 "User Agents", 99 "User Agents",
100 ], 100 ],
101 }, 101 },
102 "user-advocate": { 102 "user-advocate": {
103 "title": "USER ADVOCATE COALITION", 103 "title": "User Advocate Coalition",
104 "description": "This Coalition consists of stakeholders that can be classifi ed as entities primarily driven by protecting the rights of online users. The fo llowing Member Groups form the User Advocate Coalition: Digital Rights Organizat ions and Individual Users.", 104 "description": "This Coalition consists of stakeholders that can be classifi ed as entities primarily driven by protecting the rights of online users. The fo llowing Member Groups form the User Advocate Coalition: Digital Rights Organizat ions and Individual Users.",
105 "groups": [ 105 "groups": [
106 "Digital Rights Organizations", 106 "Digital Rights Organizations",
107 "Users", 107 "Users",
108 ], 108 ],
109 }, 109 },
110 } %} 110 } %}
111 111
112 {% set members = [ 112 {% set members = [
113 { 113 {
(...skipping 278 matching lines...) Expand 10 before | Expand all | Expand 10 after
392 {% endif %} 392 {% endif %}
393 {% endfor %} 393 {% endfor %}
394 {% if (count | length) > 0 %} 394 {% if (count | length) > 0 %}
395 </ul> 395 </ul>
396 {% endif %} 396 {% endif %}
397 {% if position == "Member" or (count | length) < 1 %} 397 {% if position == "Member" or (count | length) < 1 %}
398 <p><a class="btn-primary" href="committee/apply">{{ "Apply" | translate("app ly-button", "button label") }}</a></p> 398 <p><a class="btn-primary" href="committee/apply">{{ "Apply" | translate("app ly-button", "button label") }}</a></p>
399 {% endif %} 399 {% endif %}
400 {% endmacro %} 400 {% endmacro %}
401 401
402 {% macro group_list(group) -%} 402 {% macro group_list(id, group) -%}
403 <section class="group-list"> 403 <section class="group-list">
404 <h4>{{ group | translate("group-name-heading", "heading") }}</h4> 404 <h4>{{ group | translate(id + "-heading", "heading") }}</h4>
405 <dl> 405 <dl>
406 <dt>{{ "Representative" | translate("representative-heading", "heading") } }</dt> 406 <dt>{{ "Representative" | translate("representative-heading", "heading") } }</dt>
407 <dd>{{ member_list(group, "Representative") }}</dd> 407 <dd>{{ member_list(group, "Representative") }}</dd>
408 </dl> 408 </dl>
409 <dl> 409 <dl>
410 <dt>{{ "Members" | translate("members-heading", "heading") }}</dt> 410 <dt>{{ "Members" | translate("members-heading", "heading") }}</dt>
411 <dd>{{ member_list(group, "Member") }}</dd> 411 <dd>{{ member_list(group, "Member") }}</dd>
412 </dl> 412 </dl>
413 </section> 413 </section>
414 {%- endmacro %} 414 {%- endmacro %}
415 415
416 {% macro coalition_section(id) -%} 416 {% macro coalition_section(id) -%}
417 <section class="section"> 417 <section class="section">
418 <h3 class="h2">{{ coalitions[id].title | translate("{{ id }}-heading", "head ing") }}</h3> 418 <h3 class="h2">{{ coalitions[id].title | translate("{{ id }}-heading", "head ing") }}</h3>
419 <p class="col-6">{{ coalitions[id].description | translate("{{ id }}-intro") }}</p> 419 <p class="col-6">{{ coalitions[id].description | translate("{{ id }}-intro") }}</p>
420 {% for group in coalitions[id].groups %} 420 {% for group in coalitions[id].groups %}
421 {{ group_list(group) }} 421 {{ group_list(id, group) }}
422 {% endfor %} 422 {% endfor %}
423 </section> 423 </section>
424 {% endmacro %} 424 {% endmacro %}
425 425
426 <section class="container"> 426 <section class="container">
427 <div class="row section"> 427 <div class="row section">
428 <div class="col-6"> 428 <div class="col-6">
429 <h1>{{ "Members" | translate("members-heading", "heading") }}</h1> 429 <h1>{{ "Members" | translate("members-heading", "heading") }}</h1>
430 <hr> 430 <hr>
431 <p>{{ "The Acceptable Ads Committee is divided into three Coalitions, with each faction consisting of several Members. Each group includes a Representativ e and multiple supporting Members." | translate("members-intro-2") }}</p> 431 <p>{{ "The Acceptable Ads Committee is divided into three Coalitions, with each faction consisting of several Members. Each group includes a Representativ e and multiple supporting Members." | translate("members-intro-1") }}</p>
432 <p>{{ "Below is a list of all current Representatives and supporting Membe rs, broken down by Coalition." | translate("members-intro-2") }}</p> 432 <p>{{ "Below is a list of all current Representatives and supporting Membe rs, broken down by Coalition." | translate("members-intro-2") }}</p>
433 </div> 433 </div>
434 <aside class="col-6"> 434 <aside class="col-6">
435 <img id="committee-structure" class="block" alt="{{ "Acceptable Ads Commit tee Structure" | translate("featured-image-alt", "Image alt text") }}" src="/img /png/blog/acceptable-ads-committee-structure.png" /> 435 <img id="committee-structure" class="block" alt="{{ "Acceptable Ads Commit tee Structure" | translate("featured-image-alt", "Image alt text") }}" src="/img /png/blog/acceptable-ads-committee-structure.png" />
436 </aside> 436 </aside>
437 </div> 437 </div>
438 </section> 438 </section>
439 439
440 <section> 440 <section>
441 441
442 <div class="bg-accent"> 442 <div class="bg-accent">
443 <h2 class="center h3 p-y-md m-a-md">{{ "Meet the Acceptable Ads Committee" | translate("committee-heading", "heading") }}</h2> 443 <h2 class="center h3 p-y-md m-a-md">{{ "Meet the Acceptable Ads Committee" | translate("committee-heading", "heading") }}</h2>
444 </div> 444 </div>
445 445
446 <div class="container"> 446 <div class="container">
447 {% for coalition in ["for-profit", "expert", "user-advocate"] %} 447 {% for coalition in ["for-profit", "expert", "user-advocate"] %}
448 {{ coalition_section(coalition) }} 448 {{ coalition_section(coalition) }}
449 {% endfor %} 449 {% endfor %}
450 </div> 450 </div>
451 451
452 </section> 452 </section>
OLDNEW
« no previous file with comments | « no previous file | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld