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 +19 -14
5 changed files with 19 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 59b3ec1994 - Show all commits

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

File diff suppressed because one or more lines are too long

8
dist/donation-box.html vendored
View File

File diff suppressed because one or more lines are too long

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

@ -130,14 +130,14 @@
<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>
<div class="row"> <div class="donate-row">
<div class="col-4 d-flex position-relative"> <div class="d-flex position-relative">
<div class="align-items-center d-flex h-100 position-absolute ps-5 start-0 top-0 z-2"> <div class="align-items-center d-flex h-100 position-absolute ps-5 start-0 top-0 z-2">
<span class="fs-4 js-value-symbol text-color-primary">€</span> <span class="fs-4 js-value-symbol text-color-primary">€</span>
</div> </div>
<input class="form-control fs-4 input-one-time-donate js-input-one-time-donate text-center" min="5" max="999999" type="number"> <input class="form-control fs-4 input-one-time-donate js-input-one-time-donate text-center" min="5" max="999999" type="number">
</div> </div>
<div class="col-8"> <div>
<a class="btn btn-lg btn-primary js-btn-one-time-donate w-100" href="#"> <a class="btn btn-lg btn-primary js-btn-one-time-donate w-100" href="#">
<span class="me-1">Donate</span><i class="i-heart-filled"></i> <span class="me-1">Donate</span><i class="i-heart-filled"></i>
</a> </a>

6
main-donation-box.html
View File

@ -75,14 +75,14 @@
</button> </button>
</div> </div>
<h2 class="mb-5">Donate, just <strong>once</strong></h2> <h2 class="mb-5">Donate, just <strong>once</strong></h2>
<div class="pb-4 row"> <div class="donate-row pb-4">
<div class="col-4 d-flex position-relative"> <div class="d-flex position-relative">
<div class="align-items-center d-flex h-100 position-absolute ps-5 start-0 top-0 z-2"> <div class="align-items-center d-flex h-100 position-absolute ps-5 start-0 top-0 z-2">
<span class="fs-4 js-value-symbol text-color-primary">€</span> <span class="fs-4 js-value-symbol text-color-primary">€</span>
</div> </div>
<input class="form-control fs-4 input-one-time-donate js-input-one-time-donate text-center" min="5" max="999999" type="number"> <input class="form-control fs-4 input-one-time-donate js-input-one-time-donate text-center" min="5" max="999999" type="number">
</div> </div>
<div class="col-8"> <div>
<a class="btn btn-primary btn-lg js-btn-one-time-donate w-100" href="#"> <a class="btn btn-primary btn-lg js-btn-one-time-donate w-100" href="#">
<span class="me-1">Donate</span><i class="i-heart-filled"></i> <span class="me-1">Donate</span><i class="i-heart-filled"></i>
</a> </a>

5
sass/custom.sass
View File

@ -254,6 +254,11 @@ input
.container .container
max-width: var(--container-width) max-width: var(--container-width)
.donate-row
display: grid
gap: calc(var(--spacer) * 2)
grid-template-columns: 1fr 2fr
.form-control .form-control
height: auto height: auto
Pablo Vazquez commented 2024-09-16 16:15:51 +02:00
Outdated
Review
Copy Link

// TODO: Move to Web Assets

Isn't that in https://projects.blender.org/infrastructure/web-assets/src/branch/v2/src/styles/bootstrap-5/dist/css/bootstrap-utilities.css#L1274 ?

> // TODO: Move to Web Assets Isn't that in https://projects.blender.org/infrastructure/web-assets/src/branch/v2/src/styles/bootstrap-5/dist/css/bootstrap-utilities.css#L1274 ?
Márton Lente commented 2024-09-16 16:41:10 +02:00
Outdated
Review
Copy Link

It is, but Web Assets also applies font-variation-settings rules on top, to make font-weight settings consistently work with variable fonts as well. (The +fw-title mixin should be added – combining font-variation-settings and font-weight rules – to Web Assets similarily to +fw-bold, that already exists.)

It is, but Web Assets also applies `font-variation-settings` rules on top, to make font-weight settings consistently work with variable fonts as well. (The `+fw-title` mixin should be added – combining `font-variation-settings` and `font-weight` rules – to Web Assets similarily to `+fw-bold`, that already exists.)