~mhall119/ubuntu-accomplishments-web/fix-description-width

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
{% extends "gallery/base.html" %}

{% load i18n %}
{% load paragraphs %}
{% load list_items %}

{% block page_name %}{% trans "Opportunity Details" %}{% endblock %}

{% block content %}

<div class="row-fluid" id="header">
  <h2>{{ data.accomplishment.title }}</h2>
  {% block trophyinfo %}{% endblock %}
</div>

<div class="row-fluid">
    <div id="accomplishment-wrapper" class="span8">
        <div id="accomplishment">
            <div id="accomplishment-badge" class="row-fluid">
                <div class="span2">
                    <img class="icon" src="{{ STATIC_URL }}images/trophies/{{ data.accomplishment.accomplishment.collection.descriptor }}/{{ data.accomplishment.accomplishment.icon.filename }}"/>
                </div>
                <div class="span5">
                  <h5>Trophy Information:</h5>
                  <ul class="none">
                      <li>{{ data.accomplishment.description }}</li>
                  </ul>
                </div>
                <div class="span5">
                  <h5>Getting Help:</h5>
                  <ul class="none">
                      <li>{{ data.accomplishment.helpres|safe }}</li>
                  </ul>
                </div>
            </div>

            <!-- TODO!
            <div id="accomplishment-conditions" class="span8">
              <ul class="none">
              <li><i class="icon-key icon-large"></i>This is locked. You need to complete <strong>Approved Ubuntu Member</strong> from <strong>Ubuntu Community</strong> first.</li>
              <li><i class="icon-trophy icon-large"></i>This accomplishment requires verification</li>
              </ul>
            </div>
            -->
        </div>

        <div class="row-fluid">
            <div id="accomplishment-info">
                {{ data.accomplishment.summary|paragraphs|safe }}
            </div>
        </div>

        <div class="row-fluid" id="accomplishment-more">
            <!-- any section inside accomplisments-more should be optional -->
            
            <div id="howto" class="row-fluid">
                <i class="icon-list"></i>
                <h3>How to achieve this trophy</h3>
                <ol>
                    {{ data.accomplishment.steps|list_items:"icon-pushpin"|safe }}
                </ol>
            </div>

            {% if data.accomplishment.tips or data.accomplishment.pitfalls %}
            <div id='tipspitfalls' class="row-fluid">
                {% if data.accomplishment.tips %}
                <div class="span6" id="tips">
                    <h3>Tips and Tricks:</h3>
                    <ul>
                        {{ data.accomplishment.tips|list_items:"icon-ok"|safe }}
                    </ul>
                </div>
                {% endif %}
                
                {% if data.accomplishment.pitfalls %}
                <div class="span6">
                    {% if data.accomplishment.tips %}
                    <div class="left" id="divider"> </div>
                    {% endif %}
                    <div id="pitfalls">
                        <h3>Pitfalls To Avoid:</h3>
                        <ul>
                            {{ data.accomplishment.pitfalls|list_items:"icon-remove"|safe }}
                        </ul>
                    </div>
                </div>
                {% endif %}
            </div>
            {% endif %}
            
            {% if data.accomplishment.links %}
            <div id="furtherreading" class="row-fluid">
                <h3>Further Reading</h3>
                <ul class="none link-list">
                    {{ data.accomplishment.links|urlize|list_items:"icon-external-link"|safe }}
                </ul>
            </div>
            {% endif %}
        </div>
    </div>

{% if data.recent_collectors %}
    <div class="span3 box box-collectors">
        <p class="title">Recent Collectors</p>
        <ul class="collectors">
          {% for collector in data.recent_collectors %}
          <li>
          <p class="name">{{ collector.profile.get_full_name }}</p>
          <p class="on-date">on {{ collector.trophy.date_accomplished }}</p>
          </li>
          {% endfor %}
        </ul>
    </div>
{% endif %}
</div>

{% endblock %}