Add toasts to UI (#25449)

Fixes https://github.com/go-gitea/gitea/issues/24353

In some case like async success/error, it is useful to show toasts in UI.
This commit is contained in:
silverwind 2023-06-27 04:45:24 +02:00 committed by GitHub
parent 72c60f94c1
commit c71e8abbc3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 220 additions and 20 deletions

View file

@ -1,4 +1,5 @@
{{template "base/head" .}}
<link rel="stylesheet" href="{{AssetUrlPrefix}}/css/devtest.css?v={{AssetVersion}}">
<div class="page-content devtest ui container">
<div>
<h1>Button</h1>
@ -14,11 +15,6 @@
<label><input type="checkbox" name="button-state-disabled" value="disabled">disabled</label>
</div>
<div id="devtest-button-samples">
<style>
.button-sample-groups { margin: 0; padding: 0; }
.button-sample-groups .sample-group { list-style: none; margin: 0; padding: 0; }
.button-sample-groups .sample-group .ui.button { margin-bottom: 5px; }
</style>
<ul class="button-sample-groups">
<li class="sample-group">
<h2>General purpose:</h2>
@ -242,17 +238,20 @@
</div>
</div>
<div>
<h1>Toast</h1>
<div>
<button class="ui button" id="info-toast">Show Info Toast</button>
<button class="ui button" id="warning-toast">Show Warning Toast</button>
<button class="ui button" id="error-toast">Show Error Toast</button>
</div>
</div>
<div>
<h1>ComboMarkdownEditor</h1>
<div>ps: no JS code attached, so just a layout</div>
{{template "shared/combomarkdowneditor" .}}
</div>
<style>
h1, h2 {
margin: 0;
padding: 10px 0;
}
</style>
<script src="{{AssetUrlPrefix}}/js/devtest.js?v={{AssetVersion}}"></script>
</div>
{{template "base/footer" .}}