diff options
| author | Andreas HABEGGER <andreas.habegger@bfh.ch> | 2023-11-19 20:51:42 +0100 |
|---|---|---|
| committer | Andreas HABEGGER <andreas.habegger@bfh.ch> | 2023-11-20 12:04:00 +0100 |
| commit | 34557ea3b82b4a73232f75021f22a3b591b8d3ae (patch) | |
| tree | 671188fc92703b2c74e7158e93af0d179c4d2c2d | |
| parent | bec647e75855893598a605c9a4c87ce4f8be76ef (diff) | |
| download | www-34557ea3b82b4a73232f75021f22a3b591b8d3ae.tar.gz www-34557ea3b82b4a73232f75021f22a3b591b8d3ae.tar.bz2 www-34557ea3b82b4a73232f75021f22a3b591b8d3ae.zip | |
UC: Switched to card elements for the partner panel; Imporvement of alignment.
| -rw-r--r-- | static/styles.css | 7 | ||||
| -rw-r--r-- | template/consortium.html.j2 | 57 |
2 files changed, 33 insertions, 31 deletions
diff --git a/static/styles.css b/static/styles.css index c26490f2..fcff74fd 100644 --- a/static/styles.css +++ b/static/styles.css @@ -268,4 +268,11 @@ ul.timeline > li:before { -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); +} + +.section-consortium .card-note { + overflow: hidden; + line-height: 1.5rem; + height: 4.5rem; + min-height: 4.5rem; }
\ No newline at end of file diff --git a/template/consortium.html.j2 b/template/consortium.html.j2 index 073e3dc7..58706d74 100644 --- a/template/consortium.html.j2 +++ b/template/consortium.html.j2 @@ -36,13 +36,13 @@ <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse_{{ loop.index }}" aria-expanded="false" aria-controls="collapse_{{ loop.index }}"> - Objective {{ loop.index }}: {{ objective['title'] }} + Objective {{ loop.index }}: {{ objective.title }} </button> </h2> <div id="collapse_{{ loop.index }}" class="accordion-collapse collapse" aria-labelledby="heading_{{ loop.index }}" data-bs-parent="#accordionObjectives"> <div class="accordion-body text-muted w-responsive"> - {{ objective['text'] }} + {{ objective.text }} </div> </div> </div> @@ -85,40 +85,35 @@ <!--Section: Content--> <section class="section-consortium justify-content-md-center text-center dark-grey-text "> - {% for partner in conf['partners'] %} + <div class="container"> - {% if loop.index0 % 2 == 0 %} - <!-- Grid row --> - <div class="row align-items-top"> - {% endif %} + <div class="row row-cols-1 row-cols-md-3 g-4"> + <!-- start --> - <!-- Grid column --> - <div class="col-lg-6"> - <div class="avatar mx-auto"> - <a href="{{ partner['url'] }}" target="_blank" rel="noopener noreferrer"> - <img src="{{ url(partner['logo']) }}" height="180" class="rounded-circle z-depth-3" - alt="{{ partner['id'] + ' avatar'}}"> - </a> + {% for partner in conf['partners'] %} + + <div class="col"> + <div class="card border-0 h-100"> + <a href="{{ partner.url }}" target="_blank" rel="noopener noreferrer"> + <img src="{{ url(partner.logo ) }}" height="180" class="card-header rounded-circle z-depth-3" + alt="{{ partner.id + ' avatar'}}"> + </a> + <div class="card-note grey-text text-muted mt-3">The team of {{ partner.name }} is represented by </div> + <div class="card-body h-100"> + <h5 class="card-title font-weight-bold grey-text">{{ partner.contact }} </h5> + <p class="card-text grey-text text-muted word-wrap"> {{ partner.role }} </p> + </div> + <div class="card-footer"> + <small class="text-body-secondary dark-grey-text text-muted word-wrap"><i> {{ partner.statement }} </i></small> + </div> </div> - <p class="grey-text text-muted mt-4 mb-2">The team of {{ partner['name']}} is represented by</p> - - <h5 class="font-weight-bold grey-text">{{ partner['contact'] }} </h5> - <p class="grey-text text-muted"> {{ partner['role'] }} </p> - <div class="divider"></div> - <p class="dark-grey-text text-muted"><i> - {{ partner['statement'] }} - </i></p> </div> - {% if not loop.index0 == 0 and loop.index % 2 == 0 %} - <!-- Grid row --> - </div> - <br> - {% endif %} - {% endfor %} - - </section> - <!--Section: Content--> + {% endfor %} + </div> + </div> + </section> + <!--Section: Content--> </div> </main> |