pk/atst
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add sticky header to App settings page

Browse Source
This commit is contained in:
leigh-mil 2019-09-05 17:32:01 -04:00
parent 7c7624f25e
commit 5dbbe8d127
3 changed files with 26 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
styles/components/_sticky_cta.scss
View File

@ -4,7 +4,6 @@
z-index: 10; z-index: 10;
@include media($medium-screen) { @include media($medium-screen) {
margin-left: -$gap * 5;
margin-right: -$gap * 5; margin-right: -$gap * 5;
} }
@ -53,4 +52,10 @@
} }
} }
} }
&-return-link {
padding-top: 1.6rem;
font-size: $small-font-size;
font-weight: $font-bold;
}
} }

19
templates/components/sticky_cta.html
View File

@ -1,12 +1,23 @@
{% macro StickyCTA(text) -%} {% from 'components/icon.html' import Icon %}
{% macro StickyCTA(text, return_link_url=None, return_link_text=None) -%}
<div class="sticky-cta" v-sticky='{ "stickyBitStickyOffset": 76 }'> <div class="sticky-cta" v-sticky='{ "stickyBitStickyOffset": 76 }'>
<div class="sticky-cta-container"> <div class="sticky-cta-container">
<div class="sticky-cta-text"> <div class="sticky-cta-text">
{% if return_link_url and return_link_text %}
<div class="sticky-cta-return-link">
<a href="{{ return_link_url }}">
{{ Icon('caret_left', classes="icon--tiny icon--blue") }} {{ return_link_text}}
</a>
</div>
{% endif %}
<h3>{{ text }}</h3> <h3>{{ text }}</h3>
</div> </div>
<div class="sticky-cta-buttons"> {% if caller %}
{{ caller() }} <div class="sticky-cta-buttons">
</div> {{ caller() }}
</div>
{% endif %}
</div> </div>
</div> </div>
{%- endmacro %} {%- endmacro %}

10
templates/portfolios/applications/base.html
View File

@ -1,11 +1,11 @@
{% extends "portfolios/base.html" %} {% extends "portfolios/base.html" %}
{% from "components/sticky_cta.html" import StickyCTA %}
{% block portfolio_header %} {% block portfolio_header %}
<div class='portfolio-header'> {% if application %}
<div class='portfolio-header__name'> {{ StickyCTA(text=application.name, return_link_url=url_for('applications.portfolio_applications', portfolio_id=application.portfolio_id), return_link_text="BACK TO APPLICATIONS") }}
{{ secondary_breadcrumb }} {% endif %}
</div>
</div>
{% endblock %} {% endblock %}
{% block portfolio_content %} {% block portfolio_content %}