diff options
Diffstat (limited to 'templates/devtest/gitea-ui.tmpl')
| -rw-r--r-- | templates/devtest/gitea-ui.tmpl | 32 |
1 files changed, 17 insertions, 15 deletions
diff --git a/templates/devtest/gitea-ui.tmpl b/templates/devtest/gitea-ui.tmpl index 5b40268761..cb5aad7b0c 100644 --- a/templates/devtest/gitea-ui.tmpl +++ b/templates/devtest/gitea-ui.tmpl @@ -9,16 +9,16 @@ <a class="silenced" href="#">silenced</a> </div> <h1>Button</h1> - <div> - Style: - <label><input type="checkbox" name="button-style-compact" value="compact">compact</label> - <label><input type="radio" name="button-style-size" value="">(normal)</label> - <label><input type="radio" name="button-style-size" value="tiny">tiny</label> - <label><input type="radio" name="button-style-size" value="mini">mini</label> + ".ui.button" styles: + <div class="flex-text-block tw-gap-4"> + <label class="gt-checkbox"><input type="radio" name="button-style-size" value="">(normal)</label> + <label class="gt-checkbox"><input type="radio" name="button-style-size" value="small">small</label> + <label class="gt-checkbox"><input type="radio" name="button-style-size" value="tiny">tiny</label> + <label class="gt-checkbox"><input type="radio" name="button-style-size" value="mini">mini</label> </div> - <div> - State: - <label><input type="checkbox" name="button-state-disabled" value="disabled">disabled</label> + <div class="flex-text-block tw-gap-4"> + <label class="gt-checkbox"><input type="checkbox" name="button-style-compact" value="compact">compact</label> + <label class="gt-checkbox"><input type="checkbox" name="button-state-disabled" value="disabled">disabled</label> </div> <div id="devtest-button-samples"> <ul class="button-sample-groups"> @@ -45,14 +45,16 @@ </div> </li> </ul> - <script type="module"> - const $buttons = $('#devtest-button-samples').find('button.ui'); + <script> + document.addEventListener('gitea:index-ready', () => { + const $buttons = $('#devtest-button-samples').find('button.ui'); - const $buttonStyles = $('input[name*="button-style"]'); - $buttonStyles.on('click', () => $buttonStyles.map((_ ,el) => $buttons.toggleClass(el.value, el.checked))); + const $buttonStyles = $('input[name*="button-style"]'); + $buttonStyles.on('click', () => $buttonStyles.map((_, el) => $buttons.toggleClass(el.value, el.checked))); - const $buttonStates = $('input[name*="button-state"]'); - $buttonStates.on('click', () => $buttonStates.map((_ ,el) => $buttons.prop(el.value, el.checked))); + const $buttonStates = $('input[name*="button-state"]'); + $buttonStates.on('click', () => $buttonStates.map((_, el) => $buttons.prop(el.value, el.checked))); + }); </script> </div> </div> |