Fix button location and make things dynamic
This commit is contained in:
parent
5fa0a645c1
commit
5df23fb56a
1 changed files with 13 additions and 13 deletions
|
|
@ -1,18 +1,19 @@
|
|||
{% load cms_tags %}
|
||||
<style>
|
||||
.head-wrapper {
|
||||
display: table;
|
||||
width: 100%;
|
||||
height: 95vh;
|
||||
text-align: center;
|
||||
background-color: #000;
|
||||
}
|
||||
display: table;
|
||||
width: 100%;
|
||||
height: 85vh;
|
||||
text-align: center;
|
||||
background-color: #{{instance.header_background_color}};
|
||||
}
|
||||
.head-slide {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
color: #fff;
|
||||
font-size: 85px;
|
||||
}
|
||||
position: relative;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.head-slide .btn-trans {
|
||||
padding: 8px 15px;
|
||||
|
|
@ -22,9 +23,10 @@
|
|||
}
|
||||
}
|
||||
.head-slide .btn-trans {
|
||||
align-self: flex-end;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
position: absolute;
|
||||
bottom: 15%;
|
||||
right: 5%;
|
||||
font-size: 0.2em;
|
||||
}
|
||||
</style>
|
||||
<div>
|
||||
|
|
@ -32,9 +34,7 @@
|
|||
<div class="head-slide">
|
||||
{{ instance.header_text }}
|
||||
{% if product_url %}
|
||||
<div class="container-fluid">
|
||||
<a class="btn btn-trans page-scroll url" href="{{product_url}}">Get the deal</a>
|
||||
</div>
|
||||
<a class="btn btn-trans page-scroll url" href="{{product_url}}">{{instance.buy_button_text}}</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue