Clean up document links on task order view page

This commit is contained in:
Patrick Smith 2019-01-11 11:01:57 -05:00
parent f7a87308c7
commit b807d2c932
3 changed files with 21 additions and 43 deletions

View File

@ -63,4 +63,9 @@
&.icon-link--default {
@include icon-link-color($color-black-light, $color-gray-lightest);
}
&.icon-link--disabled {
opacity: 0.3;
pointer-events: none;
}
}

View File

@ -77,36 +77,13 @@
}
.task-order-document-link {
&.disabled {
color: $color-shadow;
.task-order-document-link__icon {
span {
@include icon-color($color-cool-blue-lighter);
}
}
}
.task-order-document-link__icon {
padding-top: 0.5rem;
span {
@include icon-color($color-blue);
}
}
.task-order-document-details {
.task-order-document-details__description {
font-style: italic;
}
.task-order-document-details__disabled_link {
@include icon-link;
cursor: unset;
&:hover {
background-color: unset;
color: $color-cool-blue-lighter;
}
color: $color-cool-blue-lighter;
}
.task-order-document-description {
padding-left: 3rem;
font-style: italic;
}
}

View File

@ -28,26 +28,22 @@
{% macro DocumentLink(title="", link_url="", description="") %}
{% set disabled = not link_url %}
<div class="task-order-document-link row {{ 'disabled' if disabled }}">
<div class="task-order-document-link__icon col">
<span>{{ Icon("download") }}</span>
</div>
<div class="task-order-document-details col">
{% if disabled %}
<div class="task-order-document-details__disabled_link">
<div class="task-order-document-link">
<div class="row">
<a href="{{ link_url }}" class="icon-link {{ 'icon-link--disabled' if disabled }}" aria-disabled="{{ 'true' if disabled else 'false' }}">
<div class="task-order-document-link__icon col">
<span>{{ Icon("download") }}</span>
</div>
<div class="task-order-document-title col">
{{ title }}
</div>
{% else %}
<a href="{{ link_url }}" class="icon-link">
{{ title }}
</a>
{% endif %}
{% if description %}
<div class="task-order-document-details__description">
{{ description }}
</div>
{% endif %}
</a>
</div>
{% if description %}
<div class="task-order-document-description">
{{ description }}
</div>
{% endif %}
</div>
{% endmacro %}