Style block list links

This commit is contained in:
Luis Cielak 2018-07-31 10:29:22 -04:00 committed by richard-dds
parent 1db88a8191
commit b4b99de7de
4 changed files with 45 additions and 43 deletions

View File

@ -54,14 +54,25 @@
.block-list {
@include block-list;
.icon-link {
margin: -$gap 0;
}
.icon-link {
&:first-child {
margin-left: -$gap;
}
&:last-child {
margin-right: -$gap;
}
}
}
.block-list__header {
@include block-list-header;
.block-list__header__link {
@include icon-link;
}
}
.block-list__title {

View File

@ -59,4 +59,8 @@
&.icon-link--large {
@include icon-link-large;
}
&.icon-link--danger {
@include icon-link-color($color-red, $color-red-lightest);
}
}

View File

@ -48,7 +48,7 @@
<div class='block-list project-list-item'>
<header class='block-list__header'>
<h2 class='block-list__title'>Code.mil</h2>
<a class="block-list__header__link icon-link icon-link--danger">revoke all access</a>
<a href="#" class="icon-link icon-link--danger">revoke all access</a>
</header>
<ul>
<li class='block-list__item project-list-item__environment'>
@ -56,7 +56,7 @@
Development
</span>
<div class='project-list-item__environment__actions'>
<span>no access</span><a href="#" class="icon-link">set role</a>
<span>no access </span><a href="#" class="icon-link">set role</a>
</div>
</li>
<li class='block-list__item project-list-item__environment'>

View File

@ -2,44 +2,31 @@
{% block workspace_content %}
{% if not projects %}
{% module EmptyState(
'There are currently no projects set up for this Workspace.',
actionLabel='Create a new Project',
actionHref='/project/new',
icon='cloud'
)%}
{% else %}
{% for project in projects %}
<div class='block-list project-list-item'>
<header class='block-list__header'>
<h2 class='block-list__title'>{{ project['name'] }} ({{ len(project['environments'])}} environments)</h2>
<a class='block-list__header__link' href='/workspaces/123456/projects/789/edit'>
{% module Icon('edit') %}
<span>edit</span>
</a>
</header>
<ul>
{% for environment in project['environments'] %}
<li class='block-list__item project-list-item__environment'>
<a href='/' target='_blank' rel='noopener noreferrer' class='project-list-item__environment__link'>
{% module Icon('link') %}
<span>{{ environment["name"]}}</span>
</a>
<div class='project-list-item__environment__members'>
<div class='label'>0</div>
<span>members</span>
</div>
</li>
{% end %}
</ul>
</div>
{% end %}
{% for project in projects %}
<div class='block-list project-list-item'>
<header class='block-list__header'>
<h2 class='block-list__title'>{{ project['name'] }} ({{ len(project['environments'])}} environments)</h2>
<a class='icon-link' href='/workspaces/123456/projects/789/edit'>
{% module Icon('edit') %}
<span>edit</span>
</a>
</header>
<ul>
{% for environment in project['environments'] %}
<li class='block-list__item project-list-item__environment'>
<a href='/' target='_blank' rel='noopener noreferrer' class='project-list-item__environment__link'>
{% module Icon('link') %}
<span>{{ environment["name"]}}</span>
</a>
<div class='project-list-item__environment__members'>
<div class='label'>0</div>
<span>members</span>
</div>
</li>
{% end %}
</ul>
</div>
{% end %}
{% end %}