Skip to content

Commit 36a2f42

Browse files
MartusskyMartussky
committed
Update documentation ecommerce design blocks - modals / popups
1 parent 4894840 commit 36a2f42

File tree

1 file changed

+54
-14
lines changed
  • en/tools/ecommerce/docs/design-blocks/modals

1 file changed

+54
-14
lines changed

‎en/tools/ecommerce/docs/design-blocks/modals/o.html

Lines changed: 54 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1425,7 +1425,7 @@ <h5 class="mb-0">Discount offer: <span class="font-weight-bold">10% off</span></
14251425
<div class="col-3">
14261426
<p></p>
14271427
<p class="text-center">
1428-
<i class="fas fa-gift fa-4x"></i>
1428+
<i class="fas fa-gift text-primary fa-4x"></i>
14291429
</p>
14301430
</div>
14311431
<div class="col-9">
@@ -1457,6 +1457,46 @@ <h2 class="mb-0">
14571457
<a href="" class="btn btn-primary mb-4" data-toggle="modal" data-target="#modalDiscount">Launch Modal</a>
14581458
</div>
14591459

1460+
<div class="modal-dialog modal-side modal-bottom-right " role="document">
1461+
<!--Content-->
1462+
<div class="modal-content">
1463+
<div class="modal-header py-4">
1464+
<h5 class="mb-0">Discount offer: <span class="font-weight-bold">10% off</span></h5>
1465+
<button type="button" class="close p-0 m-0" data-dismiss="modal" aria-label="Close">
1466+
<span aria-hidden="true">&times;</span>
1467+
</button>
1468+
</div>
1469+
<div class="modal-body py-4">
1470+
<div class="row">
1471+
<div class="col-3">
1472+
<p></p>
1473+
<p class="text-center">
1474+
<i class="fas fa-gift text-primary fa-4x"></i>
1475+
</p>
1476+
</div>
1477+
<div class="col-9">
1478+
<p>Sharing is caring. Therefore, from time to time we like to give our visitors small gifts. Today is
1479+
one of those days.</p>
1480+
<p>
1481+
<strong>Copy the following code and use it at the checkout. It's valid for
1482+
<u>one day</u>.</strong>
1483+
</p>
1484+
<h2 class="mb-0">
1485+
<span class="badge badge-primary">v52gs1</span>
1486+
</h2>
1487+
</div>
1488+
</div>
1489+
</div>
1490+
<div class="modal-footer d-flex justify-content-center py-4">
1491+
<a href="https://mdbootstrap.com/products/jquery-ui-kit/" class="btn btn-primary mr-2">Get it now
1492+
<i class="far fa-gem ml-1 white-text"></i>
1493+
</a>
1494+
<a type="button" class="btn btn-outline-primary waves-effect" data-dismiss="modal">No, thanks</a>
1495+
</div>
1496+
</div>
1497+
<!--/Content-->
1498+
</div>
1499+
14601500
</section>
14611501
<!--Section: Block Content-->
14621502

@@ -1486,7 +1526,7 @@ <h5 class="mb-0">Discount offer: <span class="font-weight-bold">10% off</span></
14861526
<div class="col-3">
14871527
<p></p>
14881528
<p class="text-center">
1489-
<i class="fas fa-gift fa-4x"></i>
1529+
<i class="fas fa-gift text-primary fa-4x"></i>
14901530
</p>
14911531
</div>
14921532
<div class="col-9">
@@ -1554,7 +1594,7 @@ <h2 class="section-heading mb-4">
15541594
<!--Content-->
15551595
<div class="modal-content">
15561596
<div class="modal-header py-4">
1557-
<h5 class="card-title m-0">Product in the cart</h5>
1597+
<h5 class="modal-title mx-auto m-0">Product in the cart</h5>
15581598
<button type="button" class="close p-0 m-0" data-dismiss="modal" aria-label="Close">
15591599
<span aria-hidden="true">&times;</span>
15601600
</button>
@@ -1564,7 +1604,7 @@ <h5 class="card-title m-0">Product in the cart</h5>
15641604
<div class="row">
15651605
<div class="col-3">
15661606
<p></p>
1567-
<p class="text-center"><i class="fas fa-shopping-cart fa-4x"></i></p>
1607+
<p class="text-center"><i class="fas fa-shopping-cart text-primary fa-4x"></i></p>
15681608
</div>
15691609
<div class="col-9">
15701610
<p>Do you need more time to make a purchase decision?</p>
@@ -1593,7 +1633,7 @@ <h5 class="card-title m-0">Product in the cart</h5>
15931633
<!--Content-->
15941634
<div class="modal-content">
15951635
<div class="modal-header py-4">
1596-
<h5 class="card-title m-0">Product in the cart</h5>
1636+
<h5 class="modal-title mx-auto m-0">Product in the cart</h5>
15971637
<button type="button" class="close p-0 m-0" data-dismiss="modal" aria-label="Close">
15981638
<span aria-hidden="true">&times;</span>
15991639
</button>
@@ -1603,7 +1643,7 @@ <h5 class="card-title m-0">Product in the cart</h5>
16031643
<div class="row">
16041644
<div class="col-3">
16051645
<p></p>
1606-
<p class="text-center"><i class="fas fa-shopping-cart fa-4x"></i></p>
1646+
<p class="text-center"><i class="fas fa-shopping-cart text-primary fa-4x"></i></p>
16071647
</div>
16081648
<div class="col-9">
16091649
<p>Do you need more time to make a purchase decision?</p>
@@ -1637,7 +1677,7 @@ <h5 class="card-title m-0">Product in the cart</h5>
16371677
<!--Content-->
16381678
<div class="modal-content">
16391679
<div class="modal-header py-4">
1640-
<h5 class="card-title m-0">Product in the cart</h5>
1680+
<h5 class="modal-title mx-auto m-0">Product in the cart</h5>
16411681
<button type="button" class="close p-0 m-0" data-dismiss="modal" aria-label="Close">
16421682
<span aria-hidden="true">&times;</span>
16431683
</button>
@@ -1647,7 +1687,7 @@ <h5 class="card-title m-0">Product in the cart</h5>
16471687
<div class="row">
16481688
<div class="col-3">
16491689
<p></p>
1650-
<p class="text-center"><i class="fas fa-shopping-cart fa-4x"></i></p>
1690+
<p class="text-center"><i class="fas fa-shopping-cart text-primary fa-4x"></i></p>
16511691
</div>
16521692
<div class="col-9">
16531693
<p>Do you need more time to make a purchase decision?</p>
@@ -1708,14 +1748,14 @@ <h2 class="section-heading mb-4">
17081748
<div class="modal-dialog modal-full-height modal-right" role="document">
17091749
<div class="modal-content">
17101750
<div class="modal-header py-4">
1711-
<h5 class="card-title m-0">>Feedback request</h5>
1751+
<h5 class="modal-title mx-auto m-0">Feedback request</h5>
17121752
<button type="button" class="close p-0 m-0" data-dismiss="modal" aria-label="Close">
17131753
<span aria-hidden="true">&times;</span>
17141754
</button>
17151755
</div>
17161756
<div class="modal-body">
17171757
<div class="text-center">
1718-
<i class="far fa-file-alt fa-4x mb-3 animated rotateIn"></i>
1758+
<i class="far fa-file-alt fa-4x mb-3 text-primary animated rotateIn"></i>
17191759
<p>
17201760
<strong>Your opinion matters</strong>
17211761
</p>
@@ -1777,14 +1817,14 @@ <h5 class="card-title m-0">>Feedback request</h5>
17771817
<!--Content-->
17781818
<div class="modal-content">
17791819
<div class="modal-header py-4">
1780-
<h5 class="card-title m-0">>Feedback request</h5>
1820+
<h5 class="modal-title mx-auto m-0">Feedback request</h5>
17811821
<button type="button" class="close p-0 m-0" data-dismiss="modal" aria-label="Close">
17821822
<span aria-hidden="true">&times;</span>
17831823
</button>
17841824
</div>
17851825
<div class="modal-body">
17861826
<div class="text-center">
1787-
<i class="far fa-file-alt fa-4x mb-3 animated rotateIn"></i>
1827+
<i class="far fa-file-alt fa-4x mb-3 text-primary animated rotateIn"></i>
17881828
<p>
17891829
<strong>Your opinion matters</strong>
17901830
</p>
@@ -1852,14 +1892,14 @@ <h5 class="card-title m-0">>Feedback request</h5>
18521892
<div class="modal-dialog modal-full-height modal-right" role="document">
18531893
<div class="modal-content">
18541894
<div class="modal-header py-4">
1855-
<h5 class="card-title m-0">>Feedback request</h5>
1895+
<h5 class="modal-title mx-auto m-0">Feedback request</h5>
18561896
<button type="button" class="close p-0 m-0" data-dismiss="modal" aria-label="Close">
18571897
<span aria-hidden="true">&times;</span>
18581898
</button>
18591899
</div>
18601900
<div class="modal-body">
18611901
<div class="text-center">
1862-
<i class="far fa-file-alt fa-4x mb-3 animated rotateIn"></i>
1902+
<i class="far fa-file-alt fa-4x mb-3 text-primary animated rotateIn"></i>
18631903
<p>
18641904
<strong>Your opinion matters</strong>
18651905
</p>

0 commit comments

Comments
 (0)