infrastructure/devfund-donation-box
0
1
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

UI: Devfund-donation-box Web Assets v2 upgrade #1

Merged
Márton Lente merged 26 commits from ui/web-assets-v2-upgrade into main 2024-11-04 12:49:39 +01:00
Conversation 0 Commits 26 Files Changed 18 +24 -24
4 changed files with 24 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 7050073dcf - Show all commits

10
dist/donation-box-message.html vendored
View File

@ -49,9 +49,9 @@
<div class="fade h-0 js-tabbed-panel mb-0 row"> <div class="fade h-0 js-tabbed-panel mb-0 row">
<!-- Class 'd-none' is used to hide column while keeping JavaScript coupled with donation-box.html --> <!-- Class 'd-none' is used to hide column while keeping JavaScript coupled with donation-box.html -->
<div class="col-lg-6 col-12 d-none"> <div class="col-lg-6 col-12 d-none">
<h2 class="mb-5">Become a <strong class="js-monthly-level">Gold</strong> member</h2> <h2 class="mb-4">Become a <strong class="js-monthly-level">Gold</strong> member</h2>
<div class="col-12 d-flex flex-wrap"> <div class="col-12 d-flex flex-wrap">
<div class="d-flex img-badges mb-5 w-100 w-sm-auto"> <div class="d-flex img-badges mb-4 w-100 w-sm-auto">
<img alt="" class="img-badge me-3" src="https://fund.blender.org/static/img/badge_devfund_30th_birthday.png?v=1.0.10"> <img alt="" class="img-badge me-3" src="https://fund.blender.org/static/img/badge_devfund_30th_birthday.png?v=1.0.10">
<div class="position-relative"> <div class="position-relative">
<img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10"> <img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10">
@ -87,7 +87,7 @@
</p> </p>
</div> </div>
<div class="col-lg-6 col-12"> <div class="col-lg-6 col-12">
<div class="btn-row btn-row-fluid btn-row-grid mb-5"> <div class="btn-row btn-row-fluid btn-row-grid mb-4">
<button class="btn btn-lg btn-link js-btn-monthly-select"> <button class="btn btn-lg btn-link js-btn-monthly-select">
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">5</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">5</span>
</button> </button>
@ -115,7 +115,7 @@
<div class="fade js-tabbed-panel mb-0 row show"> <div class="fade js-tabbed-panel mb-0 row show">
<!-- Class 'd-none' is used to hide column while keeping JavaScript coupled with donation-box.html --> <!-- Class 'd-none' is used to hide column while keeping JavaScript coupled with donation-box.html -->
<div class="col-lg-6 col-12 d-none"> <div class="col-lg-6 col-12 d-none">
<h2 class="mb-5">Donate, just <strong>once</strong></h2> <h2 class="mb-4">Donate, just <strong>once</strong></h2>
<div class="col-12 d-flex"> <div class="col-12 d-flex">
<div class="d-flex img-badges"> <div class="d-flex img-badges">
<img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_30th_birthday.png?v=1.0.10"> <img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_30th_birthday.png?v=1.0.10">
@ -140,7 +140,7 @@
</p> </p>
</div> </div>
<div class="col-lg-6 col-12"> <div class="col-lg-6 col-12">
<div class="btn-row btn-row-fluid btn-row-grid mb-5"> <div class="btn-row btn-row-fluid btn-row-grid mb-4">
<button class="btn btn-lg btn-link js-btn-one-time-select"> <button class="btn btn-lg btn-link js-btn-one-time-select">
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">5</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">5</span>
</button> </button>

14
dist/donation-box.html vendored
View File

@ -30,12 +30,12 @@
</style> </style>
<div class="dfdb smaller"> <div class="dfdb smaller">
<div class="box js-donation-box"> <div class="box js-donation-box">
<div class="btn-row btn-row-tabbed mb-5 rounded"> <div class="btn-row btn-row-tabbed mb-4 rounded">
<button class="btn btn-lg btn-tabbed js-btn-tabbed">Monthly</button> <button class="btn btn-lg btn-tabbed js-btn-tabbed">Monthly</button>
<button class="active btn btn-lg btn-tabbed js-btn-tabbed">One-time</button> <button class="active btn btn-lg btn-tabbed js-btn-tabbed">One-time</button>
</div> </div>
<div class="fade h-0 js-tabbed-panel"> <div class="fade h-0 js-tabbed-panel">
<div class="btn-row btn-row-fluid btn-row-grid mb-5"> <div class="btn-row btn-row-fluid btn-row-grid mb-4">
<button class="btn btn-lg btn-link js-btn-monthly-select"> <button class="btn btn-lg btn-link js-btn-monthly-select">
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">5</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">5</span>
</button> </button>
@ -55,10 +55,10 @@
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">250</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">250</span>
</button> </button>
</div> </div>
<h2 class="mb-5">Become a <strong class="js-monthly-level">Gold</strong> member</h2> <h2 class="mb-4">Become a <strong class="js-monthly-level">Gold</strong> member</h2>
<div class="mb-5 row"> <div class="mb-4 row">
<div class="col-12 d-flex flex-wrap"> <div class="col-12 d-flex flex-wrap">
<div class="d-flex img-badges mb-5 mb-sm-0 w-100 w-sm-auto"> <div class="d-flex img-badges mb-4 mb-sm-0 w-100 w-sm-auto">
<div class="position-relative"> <div class="position-relative">
<img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10"> <img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10">
<img alt="" class="img-badge js-monthly-img-badge position-absolute start-0 top-0" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10"> <img alt="" class="img-badge js-monthly-img-badge position-absolute start-0 top-0" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10">
@ -84,7 +84,7 @@
</a> </a>
</div> </div>
<div class="fade js-tabbed-panel show"> <div class="fade js-tabbed-panel show">
<div class="btn-row btn-row-fluid btn-row-grid mb-5"> <div class="btn-row btn-row-fluid btn-row-grid mb-4">
<button class="btn btn-lg btn-link js-btn-one-time-select"> <button class="btn btn-lg btn-link js-btn-one-time-select">
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">5</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">5</span>
</button> </button>
@ -104,7 +104,7 @@
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">500</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">500</span>
</button> </button>
</div> </div>
<h2 class="mb-5">Donate, just <strong>once</strong></h2> <h2 class="mb-4">Donate, just <strong>once</strong></h2>
<div class="donate-row pb-4"> <div class="donate-row pb-4">
<div class="d-flex position-relative"> <div class="d-flex position-relative">
<div class="align-items-center d-flex h-100 position-absolute ps-3 start-0 top-0 z-2"> <div class="align-items-center d-flex h-100 position-absolute ps-3 start-0 top-0 z-2">

10
main-donation-box-message.html
View File

@ -19,9 +19,9 @@
<div class="fade h-0 js-tabbed-panel mb-0 row"> <div class="fade h-0 js-tabbed-panel mb-0 row">
<!-- Class 'd-none' is used to hide column while keeping JavaScript coupled with donation-box.html --> <!-- Class 'd-none' is used to hide column while keeping JavaScript coupled with donation-box.html -->
<div class="col-lg-6 col-12 d-none"> <div class="col-lg-6 col-12 d-none">
<h2 class="mb-5">Become a <strong class="js-monthly-level">Gold</strong> member</h2> <h2 class="mb-4">Become a <strong class="js-monthly-level">Gold</strong> member</h2>
<div class="col-12 d-flex flex-wrap"> <div class="col-12 d-flex flex-wrap">
<div class="d-flex img-badges mb-5 w-100 w-sm-auto"> <div class="d-flex img-badges mb-4 w-100 w-sm-auto">
<img alt="" class="img-badge me-3" src="https://fund.blender.org/static/img/badge_devfund_30th_birthday.png?v=1.0.10"> <img alt="" class="img-badge me-3" src="https://fund.blender.org/static/img/badge_devfund_30th_birthday.png?v=1.0.10">
<div class="position-relative"> <div class="position-relative">
<img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10"> <img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10">
@ -57,7 +57,7 @@
</p> </p>
</div> </div>
<div class="col-lg-6 col-12"> <div class="col-lg-6 col-12">
<div class="btn-row btn-row-fluid btn-row-grid mb-5"> <div class="btn-row btn-row-fluid btn-row-grid mb-4">
<button class="btn btn-lg btn-link js-btn-monthly-select"> <button class="btn btn-lg btn-link js-btn-monthly-select">
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">5</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">5</span>
</button> </button>
@ -85,7 +85,7 @@
<div class="fade js-tabbed-panel mb-0 row show"> <div class="fade js-tabbed-panel mb-0 row show">
<!-- Class 'd-none' is used to hide column while keeping JavaScript coupled with donation-box.html --> <!-- Class 'd-none' is used to hide column while keeping JavaScript coupled with donation-box.html -->
<div class="col-lg-6 col-12 d-none"> <div class="col-lg-6 col-12 d-none">
<h2 class="mb-5">Donate, just <strong>once</strong></h2> <h2 class="mb-4">Donate, just <strong>once</strong></h2>
<div class="col-12 d-flex"> <div class="col-12 d-flex">
<div class="d-flex img-badges"> <div class="d-flex img-badges">
<img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_30th_birthday.png?v=1.0.10"> <img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_30th_birthday.png?v=1.0.10">
@ -110,7 +110,7 @@
</p> </p>
</div> </div>
<div class="col-lg-6 col-12"> <div class="col-lg-6 col-12">
<div class="btn-row btn-row-fluid btn-row-grid mb-5"> <div class="btn-row btn-row-fluid btn-row-grid mb-4">
<button class="btn btn-lg btn-link js-btn-one-time-select"> <button class="btn btn-lg btn-link js-btn-one-time-select">
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">5</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">5</span>
</button> </button>

14
main-donation-box.html
View File

@ -1,11 +1,11 @@
<div class="dfdb smaller"> <div class="dfdb smaller">
<div class="box js-donation-box"> <div class="box js-donation-box">
<div class="btn-row btn-row-tabbed mb-5 rounded"> <div class="btn-row btn-row-tabbed mb-4 rounded">
<button class="btn btn-lg btn-tabbed js-btn-tabbed">Monthly</button> <button class="btn btn-lg btn-tabbed js-btn-tabbed">Monthly</button>
<button class="active btn btn-lg btn-tabbed js-btn-tabbed">One-time</button> <button class="active btn btn-lg btn-tabbed js-btn-tabbed">One-time</button>
</div> </div>
<div class="fade h-0 js-tabbed-panel"> <div class="fade h-0 js-tabbed-panel">
<div class="btn-row btn-row-fluid btn-row-grid mb-5"> <div class="btn-row btn-row-fluid btn-row-grid mb-4">
<button class="btn btn-lg btn-link js-btn-monthly-select"> <button class="btn btn-lg btn-link js-btn-monthly-select">
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">5</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">5</span>
</button> </button>
@ -25,10 +25,10 @@
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">250</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="monthly">250</span>
</button> </button>
</div> </div>
<h2 class="mb-5">Become a <strong class="js-monthly-level">Gold</strong> member</h2> <h2 class="mb-4">Become a <strong class="js-monthly-level">Gold</strong> member</h2>
<div class="mb-5 row"> <div class="mb-4 row">
<div class="col-12 d-flex flex-wrap"> <div class="col-12 d-flex flex-wrap">
<div class="d-flex img-badges mb-5 mb-sm-0 w-100 w-sm-auto"> <div class="d-flex img-badges mb-4 mb-sm-0 w-100 w-sm-auto">
<div class="position-relative"> <div class="position-relative">
<img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10"> <img alt="" class="img-badge" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10">
<img alt="" class="img-badge js-monthly-img-badge position-absolute start-0 top-0" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10"> <img alt="" class="img-badge js-monthly-img-badge position-absolute start-0 top-0" src="https://fund.blender.org/static/img/badge_devfund_bronze.png?v=1.0.10">
@ -54,7 +54,7 @@
</a> </a>
</div> </div>
<div class="fade js-tabbed-panel show"> <div class="fade js-tabbed-panel show">
<div class="btn-row btn-row-fluid btn-row-grid mb-5"> <div class="btn-row btn-row-fluid btn-row-grid mb-4">
<button class="btn btn-lg btn-link js-btn-one-time-select"> <button class="btn btn-lg btn-link js-btn-one-time-select">
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">5</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">5</span>
</button> </button>
@ -74,7 +74,7 @@
<span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">500</span> <span class="js-value-symbol">€</span> <span class="js-value-amount" data-value-group="one-time">500</span>
</button> </button>
</div> </div>
<h2 class="mb-5">Donate, just <strong>once</strong></h2> <h2 class="mb-4">Donate, just <strong>once</strong></h2>
<div class="donate-row pb-4"> <div class="donate-row pb-4">
<div class="d-flex position-relative"> <div class="d-flex position-relative">
<div class="align-items-center d-flex h-100 position-absolute ps-3 start-0 top-0 z-2"> <div class="align-items-center d-flex h-100 position-absolute ps-3 start-0 top-0 z-2">