Skip to content

Commit 77aa394

Browse files
markdumaymarkdumay
authored
Merge pull request #1471 from gethinode/develop
Support xs buttons
2 parents 777c4f6 + 5d4147f commit 77aa394

File tree

14 files changed

+150
-49
lines changed

14 files changed

+150
-49
lines changed

‎assets/scss/common/_variables-dart.scss‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,3 +69,8 @@ $theme-colors: (
6969
"body": $body-bg,
7070
"body-tertiary": $gray-100,
7171
);
72+
73+
$btn-padding-y-xs: .08rem !default;
74+
$btn-padding-x-xs: 0.3rem !default;
75+
$btn-font-size-xs: $font-size-base * .6 !default;
76+
$btn-border-radius-xs: .2rem !default;

‎assets/scss/common/_variables.scss‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,3 +64,8 @@ $theme-colors: (
6464
"body": $body-bg,
6565
"body-tertiary": $gray-100,
6666
);
67+
68+
$btn-padding-y-xs: .08rem !default;
69+
$btn-padding-x-xs: 0.3rem !default;
70+
$btn-font-size-xs: $font-size-base * .6 !default;
71+
$btn-border-radius-xs: .2rem !default;

‎assets/scss/components/_button.scss‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,3 +48,7 @@ a.btn {
4848

4949
margin: 0 !important;
5050
}
51+
52+
.btn-xs {
53+
@include button-size($btn-padding-y-xs, $btn-padding-x-xs, $btn-font-size-xs, $btn-border-radius-xs);
54+
}

‎data/structures/get-dimension.yml‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,17 @@ comment: >-
22
Initializes images dimensions (widht x height for supported image ratios.
33
arguments:
44
ratio:
5+
type: select
6+
optional: true
7+
comment: >-
8+
Ratio of the media asset. When the asset is an image, it is resized and
9+
cropped (not applicable to vector graphics). For video assets, the padding
10+
of the embedded frame is adjusted.
11+
options:
12+
values:
13+
- 1x1
14+
- 3x2
15+
- 4x3
16+
- 16x9
17+
- 21x9
18+
- auto

‎exampleSite/content/en/blog/bootstrap-elements.md‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,16 @@ As an example, the following shortcode displays a simple alert.
5959
{{< /example >}}
6060
<!-- markdownlint-enable MD037 -->
6161

62+
## Args
63+
64+
Use the args shortcode to generates a table of structured arguments. The argument definitions are expected to be defined in a data file identified by a provided structure name.
65+
66+
<!-- markdownlint-disable MD037 -->
67+
{{< example lang="hugo" >}}
68+
{{</* args "args" */>}}
69+
{{< /example >}}
70+
<!-- markdownlint-enable MD037 -->
71+
6272
## Badge
6373

6474
Use the badge shortcode to display a badge for a heading.
@@ -238,10 +248,12 @@ Use the `file` shortcode to print and highlight the full content of a given inpu
238248

239249
<!-- markdownlint-disable MD037 -->
240250
{{< example lang="hugo" >}}
241-
{{</* file file="./config/_default/languages.toml" id="file-collapse-1" */>}}
251+
{{</* file file="./config/_default/languages.toml" id="file-collapse-1" full=false */>}}
242252
{{< /example >}}
243253
<!-- markdownlint-enable MD037 -->
244254

255+
{{< file full="false" file="./config/_default/languages.toml" id="file-collapse-5" >}}
256+
245257
## Icon
246258

247259
As an example, the following shortcodes show a square check, a brand logo, a circle check, and a custom icon.

‎exampleSite/hugo_stats.json‎

Lines changed: 78 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -119,15 +119,28 @@
119119
"breadcrumb-item",
120120
"btn",
121121
"btn-close",
122+
"btn-danger",
123+
"btn-dark",
122124
"btn-group",
125+
"btn-info",
126+
"btn-lg",
123127
"btn-light",
124128
"btn-link",
125-
"btn-md",
129+
"btn-outline-danger",
130+
"btn-outline-dark",
131+
"btn-outline-info",
132+
"btn-outline-light",
126133
"btn-outline-primary",
127134
"btn-outline-secondary",
135+
"btn-outline-success",
136+
"btn-outline-warning",
128137
"btn-primary",
129138
"btn-secondary",
139+
"btn-sm",
130140
"btn-social",
141+
"btn-success",
142+
"btn-warning",
143+
"btn-xs",
131144
"card",
132145
"card-block-2",
133146
"card-body",
@@ -184,6 +197,7 @@
184197
"col-sm-12",
185198
"col-sm-3",
186199
"col-sm-6",
200+
"col-sm-8",
187201
"collapse",
188202
"collapsed",
189203
"container",
@@ -205,6 +219,7 @@
205219
"d-sm-block",
206220
"d-sm-none",
207221
"data-table",
222+
"disabled",
208223
"display-1",
209224
"display-4",
210225
"dropdown",
@@ -250,6 +265,7 @@
250265
"fa-globe",
251266
"fa-grip",
252267
"fa-h",
268+
"fa-hand-pointer",
253269
"fa-heart",
254270
"fa-house",
255271
"fa-info",
@@ -272,6 +288,7 @@
272288
"fa-stack-2x",
273289
"fa-sun",
274290
"fa-timeline",
291+
"fa-trash-can",
275292
"fa-up-right-from-square",
276293
"fa-whatsapp",
277294
"fa-wrapper",
@@ -328,9 +345,11 @@
328345
"img-wrap",
329346
"invisible",
330347
"is-search",
348+
"justify-content-around",
331349
"justify-content-between",
332350
"justify-content-center",
333351
"justify-content-end",
352+
"justify-content-evenly",
334353
"justify-content-md-end",
335354
"justify-content-md-start",
336355
"justify-content-start",
@@ -372,7 +391,10 @@
372391
"mt-auto",
373392
"mt-md-0",
374393
"multi-docs-collapse-15",
394+
"multi-docs-collapse-19",
395+
"multi-docs-collapse-20",
375396
"multi-file-collapse-1",
397+
"multi-file-collapse-5",
376398
"mx-auto",
377399
"mx-md-0",
378400
"mx-md-2",
@@ -399,6 +421,8 @@
399421
"navbar-toggler",
400422
"next",
401423
"no-js",
424+
"offset-md-4",
425+
"offset-sm-2",
402426
"order-0",
403427
"order-1",
404428
"order-first",
@@ -569,19 +593,27 @@
569593
"alerte",
570594
"animatie",
571595
"animation",
596+
"args",
572597
"arguments",
573598
"background-type",
574599
"badge",
575600
"barre-de-navigation",
576601
"block-diagram",
577602
"blog",
578603
"body-docs-collapse-15",
604+
"body-docs-collapse-19",
605+
"body-docs-collapse-20",
579606
"body-file-collapse-1",
607+
"body-file-collapse-5",
580608
"bouton",
581609
"breadcrumb",
582610
"build-a-static-website-fast-and-flexible",
583611
"button",
584612
"button-group",
613+
"buttons-with-a-badge",
614+
"buttons-with-a-collapsible-panel",
615+
"buttons-with-a-tooltip",
616+
"buttons-with-an-icon",
585617
"c4-diagram",
586618
"card",
587619
"card-group",
@@ -594,6 +626,7 @@
594626
"cloudinary",
595627
"collapse",
596628
"collapse-1",
629+
"colored-buttons",
597630
"command-prompt",
598631
"comment-nous-partageons-vos-informations",
599632
"comment-utilisons-nous-les-cookies-",
@@ -608,10 +641,12 @@
608641
"elements-type",
609642
"entity-relationship-diagram",
610643
"example",
644+
"examples",
611645
"exemple",
612646
"fa-address-card",
613647
"fa-face-frown",
614648
"fa-font-awesome",
649+
"fa-hand-pointer",
615650
"fa-square-check",
616651
"fab-bootstrap",
617652
"fab-docker",
@@ -622,11 +657,41 @@
622657
"fab-medium",
623658
"fab-whatsapp",
624659
"fab-x-twitter",
625-
"faq-664efd96843c20a5a8800d1318cb7744",
626-
"faq-664efd96843c20a5a8800d1318cb7744-heading-faq-664efd96843c20a5a8800d1318cb7744",
627-
"faq-664efd96843c20a5a8800d1318cb7744-item-0",
628-
"faq-664efd96843c20a5a8800d1318cb7744-item-1",
629-
"faq-664efd96843c20a5a8800d1318cb7744-item-2",
660+
"faq-03262a038417e1bab3887f63db7d440f",
661+
"faq-03262a038417e1bab3887f63db7d440f-heading-faq-03262a038417e1bab3887f63db7d440f",
662+
"faq-03262a038417e1bab3887f63db7d440f-item-0",
663+
"faq-03262a038417e1bab3887f63db7d440f-item-1",
664+
"faq-03262a038417e1bab3887f63db7d440f-item-2",
665+
"faq-516ddc5b7dd16bc24b857082a9aab4ed",
666+
"faq-516ddc5b7dd16bc24b857082a9aab4ed-heading-faq-516ddc5b7dd16bc24b857082a9aab4ed",
667+
"faq-516ddc5b7dd16bc24b857082a9aab4ed-item-0",
668+
"faq-516ddc5b7dd16bc24b857082a9aab4ed-item-1",
669+
"faq-516ddc5b7dd16bc24b857082a9aab4ed-item-2",
670+
"faq-56ff67870957c4eb63627fad0245b8b7",
671+
"faq-56ff67870957c4eb63627fad0245b8b7-heading-faq-56ff67870957c4eb63627fad0245b8b7",
672+
"faq-56ff67870957c4eb63627fad0245b8b7-item-0",
673+
"faq-56ff67870957c4eb63627fad0245b8b7-item-1",
674+
"faq-56ff67870957c4eb63627fad0245b8b7-item-2",
675+
"faq-a65942a4e80d8b9331232f2839b0b404",
676+
"faq-a65942a4e80d8b9331232f2839b0b404-heading-faq-a65942a4e80d8b9331232f2839b0b404",
677+
"faq-a65942a4e80d8b9331232f2839b0b404-item-0",
678+
"faq-a65942a4e80d8b9331232f2839b0b404-item-1",
679+
"faq-a65942a4e80d8b9331232f2839b0b404-item-2",
680+
"faq-b7d43cad454395dd12765b2970e95cbc",
681+
"faq-b7d43cad454395dd12765b2970e95cbc-heading-faq-b7d43cad454395dd12765b2970e95cbc",
682+
"faq-b7d43cad454395dd12765b2970e95cbc-item-0",
683+
"faq-b7d43cad454395dd12765b2970e95cbc-item-1",
684+
"faq-b7d43cad454395dd12765b2970e95cbc-item-2",
685+
"faq-c411b9f9b15c4b7a1a0d1de458f85fc9",
686+
"faq-c411b9f9b15c4b7a1a0d1de458f85fc9-heading-faq-c411b9f9b15c4b7a1a0d1de458f85fc9",
687+
"faq-c411b9f9b15c4b7a1a0d1de458f85fc9-item-0",
688+
"faq-c411b9f9b15c4b7a1a0d1de458f85fc9-item-1",
689+
"faq-c411b9f9b15c4b7a1a0d1de458f85fc9-item-2",
690+
"faq-e6bc2b3599e2d94773085876d5822076",
691+
"faq-e6bc2b3599e2d94773085876d5822076-heading-faq-e6bc2b3599e2d94773085876d5822076",
692+
"faq-e6bc2b3599e2d94773085876d5822076-item-0",
693+
"faq-e6bc2b3599e2d94773085876d5822076-item-1",
694+
"faq-e6bc2b3599e2d94773085876d5822076-item-2",
630695
"fas-1",
631696
"fas-2",
632697
"fas-3",
@@ -660,14 +725,18 @@
660725
"fas-sort",
661726
"fas-sun",
662727
"fas-timeline",
728+
"fas-trash-can",
663729
"fas-up-right-from-square",
664730
"fichier",
665731
"fil-dariane",
666732
"file",
667733
"flexible--ready-to-use",
668734
"flowchart",
669735
"footer-docs-collapse-15",
736+
"footer-docs-collapse-19",
737+
"footer-docs-collapse-20",
670738
"footer-file-collapse-1",
739+
"footer-file-collapse-5",
671740
"formula-katex",
672741
"formule-katex",
673742
"gantt-diagram",
@@ -719,11 +788,10 @@
719788
"navbar-0-collapse",
720789
"navbar-mode",
721790
"navbar-mode-checkbox",
722-
"navbar-sample",
723-
"navbar-sample-checkbox",
724791
"navbar-sample-collapse",
725792
"navigation",
726793
"notification",
794+
"outlined-buttons",
727795
"overview",
728796
"persona",
729797
"pie-chart",
@@ -739,8 +807,10 @@
739807
"réduire",
740808
"security",
741809
"sequence-diagram",
810+
"sized-buttons",
742811
"spinner",
743812
"state-diagram",
813+
"stateful-buttons",
744814
"sub",
745815
"sup",
746816
"sécurité",

‎go.mod‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ require (
1818
github.com/gethinode/mod-simple-datatables v1.1.7 // indirect
1919
github.com/gethinode/mod-simple-datatables/v2 v2.0.1 // indirect
2020
github.com/gethinode/mod-utils/v3 v3.3.1 // indirect
21-
github.com/gethinode/mod-utils/v4 v4.5.1 // indirect
21+
github.com/gethinode/mod-utils/v4 v4.6.0 // indirect
2222
github.com/nextapps-de/flexsearch v0.0.0-20250606060143-c28f52c09b7a // indirect
2323
github.com/twbs/bootstrap v5.3.7+incompatible // indirect
2424
)

‎go.sum‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -438,6 +438,8 @@ github.com/gethinode/mod-utils/v4 v4.5.0 h1:p6sDsMNA/KE2IK3SPdWjFX3cPAwPP5gDxzJu
438438
github.com/gethinode/mod-utils/v4 v4.5.0/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
439439
github.com/gethinode/mod-utils/v4 v4.5.1 h1:VKmqi6+oC93noHUJ6HvFlelglHT/9+kXQjpJs7VtWko=
440440
github.com/gethinode/mod-utils/v4 v4.5.1/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
441+
github.com/gethinode/mod-utils/v4 v4.6.0 h1:XQ7hiCrn15SzgkcD0j53XVZPQYeQKUxg/UUkr80pJ2w=
442+
github.com/gethinode/mod-utils/v4 v4.6.0/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
441443
github.com/nextapps-de/flexsearch v0.0.0-20230711092928-1243fd883ec3 h1:H/qVR5O4BXjRjD+5PZB+r4ug2BSJ2Of4RtwOntd+OKo=
442444
github.com/nextapps-de/flexsearch v0.0.0-20230711092928-1243fd883ec3/go.mod h1:5GdMfPAXzbA2gXBqTjC6l27kioSYzHlqDMh0+wyx7sU=
443445
github.com/nextapps-de/flexsearch v0.0.0-20240108021025-afd75f742f22 h1:re7L8FxbXQpnX8BgzkdUnDpsUmloGNyLmiy2ZCln8pg=

‎layouts/_partials/assets/args.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,15 +45,15 @@
4545

4646
{{ $comment := $val.comment }}
4747
{{ if $val.deprecated }}
48-
{{ $btn := printf `{{< release version="%s" short="true" button-size="sm" inline="true" release-state="deprecated" >}}` $val.deprecated }}
48+
{{ $btn := printf `{{< release version="%s" short="true" button-size="xs" inline="true" release-state="deprecated" >}}` $val.deprecated }}
4949
{{ with $val.alternative }}
5050
{{ $comment = printf "%s **%s**. %s" $btn (T "alternativeFeature" .) $comment }}
5151
{{ else }}
5252
{{ $comment = printf "%s %s" $btn $comment }}
5353
{{ end }}
5454
{{ end }}
5555
{{ if $val.release }}
56-
{{ $comment = printf `{{< release version="%s" short="true" button-size="sm" inline="true" >}} %s` $val.release $comment }}
56+
{{ $comment = printf `{{< release version="%s" short="true" button-size="xs" inline="true" >}} %s` $val.release $comment }}
5757
{{ end }}
5858

5959
{{ $min := "" }}

‎layouts/_partials/assets/button.html‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,8 +33,7 @@
3333
{{- with $args.tooltip }}{{ $tooltip = . }}{{ end -}}
3434
{{- end -}}
3535

36-
{{- $href := .href -}}
37-
36+
{{- $href := $args.href -}}
3837
{{ $linkType := or $args.linkType $args.type }}
3938
{{ $buttonSize := or $args.buttonSize $args.size }}
4039
{{ $toastID := or $args.toastId $args.toast }}
@@ -74,13 +73,21 @@
7473

7574
{{/* Main code */}}
7675
{{ if not $error }}
76+
{{- $btnClass := "" -}}
77+
{{- if eq $linkType "button" }}
78+
{{- $btnClass = printf "btn btn-%s%s" (cond $args.outline "outline-" "") $args.color -}}
79+
{{- if ne $buttonSize "md" }}{{ $btnClass = printf "%s btn-%s" $btnClass $buttonSize }}{{ end -}}
80+
{{- if in (slice "disabled" "active") $state }}{{ $btnClass = printf "%s %s" $btnClass $state }}{{ end -}}
81+
{{- $btnClass = printf "%s position-relative %s" $btnClass $class }}
82+
{{- end -}}
83+
7784
<a aria-label="{{ (or $label $title) | safeHTML }}"
7885
{{ if ne $state "disabled" }}{{ with $href }}href="{{ . }}"{{ end }}{{ end -}}
7986
{{- with $args.id }} id="{{ . }}"{{ end -}}
8087
{{- with $target }} target="{{ . }}"{{ end }}{{ with $rel }} rel="{{ . }}"{{ end -}}
8188
{{- with $toastID }} data-toast-target="{{ . }}"{{ end -}}
8289
{{- with $args.clipboard }} data-clipboard="{{ . }}"{{ end -}}
83-
{{- if eq $linkType "button" }} class="btn btn-{{ if $args.outline }}outline-{{ end }}{{ $args.color }} {{ if ne $buttonSize "md" }}btn-{{ $args.size }}{{ end }} position-relative {{ if in (slice "disabled" "active") $args.state }}{{ $args.state }}{{ end }} {{ $class -}}"
90+
{{- with $btnClass }} class="{{ . }}"
8491
{{ if eq $state "disabled" }}aria-disabled="true"{{ end -}}
8592
{{- else }} class="btn btn-link link-{{ $args.color }} position-relative {{ $class }}"{{ end -}}
8693
{{- with $tooltip }} data-bs-toggle="tooltip" data-bs-title="{{ . }}" data-bs-placement="{{ $args.placement }}"{{ end -}}

0 commit comments

Comments
 (0)