Improve layout a bit.

WIP, because this is not ideal. But now it's readable at least.
This commit is contained in:
2018-06-16 17:12:53 +02:00
parent cf777571dc
commit 32714efeb9
2 changed files with 32 additions and 12 deletions
+13 -9
View File
@@ -1,12 +1,16 @@
{{#each proposals as |proposal|}}
<li data-proposal-id={{proposal.id}}>
<span class="category {{proposal.kind}}">♥ ({{proposal.kind}})</span>
<span class="recipient">{{proposal.contributor.name}}:</span>
<span class="description">{{proposal.description}}</span>
<span class="amount">{{proposal.amount}}</span><span class="symbol">₭S</span>
{{#unless proposal.isExecuted}}
<button {{action "confirm" proposal.id}}>+1</button>
{{/unless}}
<li data-proposal-id={{proposal.id}} title="{{proposal.description}}">
<p class="meta">
<span class="category {{proposal.kind}}">♥ ({{proposal.kind}})</span>
<span class="recipient">{{proposal.contributor.name}}:</span>
<span class="amount">{{proposal.amount}}</span><span class="symbol">₭S</span>
<span class="votes">({{proposal.votesCount}}/{{proposal.votesNeeded}} votes)</span>
{{#unless proposal.isExecuted}}
<button {{action "confirm" proposal.id}}>+1</button>
{{/unless}}
</p>
<p class="description">
<span class="description">{{proposal.description}}</span>
</p>
</li>
{{/each}}
+19 -3
View File
@@ -4,9 +4,8 @@ ul.proposal-list {
list-style: none;
li {
// display: block;
padding: 0 1.2rem;
line-height: 4.2rem;
display: block;
padding: 1rem 1.2rem;
background-color: rgba(255,255,255,0.1);
font-size: 1.2rem;
border-bottom: 1px solid rgba(255,255,255,0.2);
@@ -14,10 +13,27 @@ ul.proposal-list {
border-top: 1px solid rgba(255,255,255,0.2);
}
p {
margin: 0;
font-size: inherit;
line-height: 2rem;
&.meta {
margin-bottom: 0.5rem;
}
// &.description {
// line-height: 2rem;
// }
}
span {
font-size: inherit;
}
.description {
line-height: 1.4em;
}
.category {
color: $blue;
padding-right: 0.2rem;