diff --git a/source/_patterns/01-molecules/02-candidate-card/candidate-card.mustache b/source/_patterns/01-molecules/02-candidate-card/candidate-card.mustache index 48f33814381827bc6a61f6ab2155ac546b5d1fa4..883b6809be6bf48cabe04d31c3c3ab475971e5b7 100644 --- a/source/_patterns/01-molecules/02-candidate-card/candidate-card.mustache +++ b/source/_patterns/01-molecules/02-candidate-card/candidate-card.mustache @@ -7,14 +7,14 @@ </div> <div class="candidate-card__bio"> <h1 class="head-heavy-xs"><a href="#" data-href="{{ link.templates-candidate-detail }}">{{ person.first }} {{ person.last }}</a></h1> - <div class="font-light mb-4">{{ person.email }}</div> + <a href="#" class="block font-light mb-4">{{ person.email }}</a> <h2 class="head-allcaps-4xs md:head-allcaps-3xs">{{ person.occupation }}</h2> </div> <div class="candidate-card__affiliation"> <div>{{ person.age }} let</div> <div> {{> atoms-basic-avatar(classes: "w-6 mr-2") }} - <span class="font-bold font-condensed">{{ person.party }}</span> + <a href="#" class="font-bold font-condensed">{{ person.party }}</a> </div> </div> <div class="card__body candidate-card__social"> diff --git a/source/css/atoms/list.pcss b/source/css/atoms/list.pcss index f82a4ed57c7d230fc44c4cb460e8995c10bcd979..a4c182a6a9280eee35427e9fde3cba86cef42487 100644 --- a/source/css/atoms/list.pcss +++ b/source/css/atoms/list.pcss @@ -20,7 +20,7 @@ content: "\e919"; font-size: .5em; font-weight: 600; - margin-top: .5em; + margin-top: .7em; } } @@ -41,8 +41,9 @@ } } -.unordered-list--dense { - @apply row-gap-2; +.unordered-list--dense, +.content-block ul { + @apply row-gap-0; } .unordered-list--linked { diff --git a/source/css/molecules/article-card.pcss b/source/css/molecules/article-card.pcss index 70dc64edb4261e1d111b2bb869f5808bcd45cec3..524f738a62b902f542f9f33e8cd395337bc731eb 100644 --- a/source/css/molecules/article-card.pcss +++ b/source/css/molecules/article-card.pcss @@ -13,17 +13,19 @@ &:before { @apply absolute block top-0 left-0 bottom-0 right-0 pointer-events-none; content: ""; - background: linear-gradient(to bottom, rgba(0,0,0,0) 40%, rgba(0,0,0,.8)); + background: linear-gradient(to bottom, rgba(0,0,0,0) 70%, rgba(0,0,0,.8)); } } .article-card-cover__details { /* padding shall be kept in sync with general card */ - @apply absolute left-0 bottom-0 p-4; + /* No pointer events to make full article cover clickable */ + @apply absolute left-0 bottom-0 p-4 pointer-events-none; } .article-card-sharing { - @apply mb-4 transition duration-200 opacity-0; + /* Turn on pointer events to make sharer clickable */ + @apply mb-4 transition duration-200 opacity-0 pointer-events-auto; } .article-card:hover .article-card-sharing { @@ -31,7 +33,7 @@ } .article-card-meta { - @apply text-sm text-white text-opacity-85; + @apply text-sm text-white; } .article-card-meta__item:not(:first-child) {