butter/butter-kanglam-ui
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

modal for "continue with confidence"

Browse source
This commit is contained in:
John Hess 2024-06-07 18:04:39 -05:00
parent 9062b4e1a2
commit 5476cf39e9
11 changed files with 77 additions and 166 deletions
Download patch file Download diff file Expand all files Collapse all files

3
_includes/fancybutton.html
View file

@ -1,4 +1,5 @@
<a class="btn-main btn-slim" href="{{ include.href }}">
<a class="btn-main btn-slim" href="{{ include.href }}" data-micromodal-trigger="{{ include.modal }}" %}
>
<div class="btn-split">
<div class="btn-logo">
<img class="btn-android" src="{{ site.baseurl}}/assets/images/btr-android.svg">

42
_includes/modal.html
View file

@ -1,42 +0,0 @@
<div class="modal micromodal-slide" id="product-modal" aria-hidden="true">
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="product-modal-title">
<header class="modal__header">
<button class="modal__close" aria-label="Close modal" data-micromodal-close></button>
</header>
<main class="modal__content" id="product-modal-content">
<div class="modal__content__header">
<div class="header__logo">
<img src="{{ site.baseurl }}{{ page_data.modal.butter_app_logo }}" alt="{% t modal.butter_app_logo_alt %}" />
</div>
<div class="header__text">
<h2 class="modal__title ls-40" id="product-modal-title">{% t modal.title %}</h2>
<ul class="info__list">
{% for item in site.translations[site.lang].modal.info_list %}
<li>{{ item }}</li>
{% endfor %}
</ul>
</div>
<div class="header__btn">
<a class="btn-main" href="{{ site.baseurl }}{{ page_data.modal.button_url }}">{% t modal.button_text %}</a>
</div>
</div>
<div class="modal__content__description">
<p class="content-text ls-40">{% t modal.text %}</p>
</div>
<div class="modal__content__slider">
<div class="screens-slider">
{% for slide in page_data.modal.slider_list %}
<div class="slider-item">
<img src="{{ site.baseurl }}{{ slide }}" alt="slider image" />
</div>
{% endfor %}
</div>
</div>
</main>
<footer class="modal__footer">
<p class="ls-40">{% t modal.warning %}</p>
</footer>
</div>
</div>
</div>

32
_includes/sideload.html Normal file
View file

@ -0,0 +1,32 @@
<div class="modal micromodal-slide" id="product-modal" aria-hidden="true">
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="product-modal-title">
<main class="modal__content" id="product-modal-content">
<div class="modal__content__header">
<div class="header__text">
<h2 class="modal__title ls-40" id="product-modal-title">Continue With Confidence</h2>
</div>
</div>
<div class="modal__content__description">
<p class="modal__text ls-40">
Downloading apps from unknown sources can expose your device to malicious software. For this
reason, your phone will warn against it.
</p>
<p class="modal__text ls-40">
The Butter App Store and the apps in it are checked for malware before they are shared. Consider
it a safe source.
</p>
</div>
<a class="modal__close" aria-label="Close modal" data-micromodal-close>
Go Back
</a>
<hr style="color: #00000033">
<a class="modal__close modal__continue"
onclick="MicroModal.close(); window.location='{{ site.baseurl }}/assets/download/butter.apk'"
aria-label="Download App Store">
Continue to Download
</a>
</main>
</div>
</div>
</div>