code.gitea.io/gitea@v1.22.3/templates/devtest/fomantic-modal.tmpl (about)

     1  {{template "base/head" .}}
     2  <div class="page-content devtest ui container">
     3  	{{template "base/alert" .}}
     4  	<div class="modal-buttons flex-text-block tw-flex-wrap"></div>
     5  	<script type="module">
     6  		for (const el of $('.ui.modal')) {
     7  			const $btn = $('<button class="ui button">').text(`${el.id}`).on('click', () => {
     8  				$(el).modal({onApprove() {alert('confirmed')}}).modal('show');
     9  			});
    10  			$('.modal-buttons').append($btn);
    11  		}
    12  	</script>
    13  
    14  	<div id="test-modal-form-1" class="ui mini modal">
    15  		<div class="header">Form dialog (layout 1)</div>
    16  		<form class="content" method="post">
    17  			<div class="ui input tw-w-full"><input name="user_input"></div>
    18  			{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
    19  		</form>
    20  	</div>
    21  
    22  	<div id="test-modal-form-2" class="ui mini modal">
    23  		<div class="header">Form dialog (layout 2)</div>
    24  		<form method="post">
    25  			<div class="content">
    26  				<div class="ui input tw-w-full"><input name="user_input"></div>
    27  				{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
    28  			</div>
    29  		</form>
    30  	</div>
    31  
    32  	<div id="test-modal-form-3" class="ui mini modal">
    33  		<div class="header">Form dialog (layout 3)</div>
    34  		<form method="post">
    35  			<div class="content">
    36  				<div class="ui input tw-w-full"><input name="user_input"></div>
    37  			</div>
    38  			{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
    39  		</form>
    40  	</div>
    41  
    42  	<div id="test-modal-form-4" class="ui mini modal">
    43  		<div class="header">Form dialog (layout 4)</div>
    44  		<div class="content">
    45  			<div class="ui input tw-w-full"><input name="user_input"></div>
    46  		</div>
    47  		<form method="post">
    48  			{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
    49  		</form>
    50  	</div>
    51  
    52  	<div class="ui g-modal-confirm modal" id="test-modal-default">
    53  		<div class="header">{{svg "octicon-file"}} Default dialog <span>title</span></div>
    54  		<div class="content">
    55  			very long aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
    56  		</div>
    57  		{{template "base/modal_actions_confirm"}}
    58  	</div>
    59  
    60  	<div class="ui g-modal-confirm modal" id="test-modal-confirm">
    61  		<div class="header">Confirm dialog</div>
    62  		<div class="content">hello, this is the modal dialog content</div>
    63  		{{template "base/modal_actions_confirm" (dict "ModalButtonTypes" "confirm")}}
    64  	</div>
    65  
    66  	<div class="ui g-modal-confirm modal" id="test-modal-danger">
    67  		{{svg "octicon-x" 16 "inside close"}}
    68  		<div class="header">dangerous action dialog</div>
    69  		<div class="content">hello, this is the modal dialog content, this is a dangerous operation</div>
    70  		{{template "base/modal_actions_confirm" (dict "ModalButtonDangerText" "I know and must do  this is dangerous operation")}}
    71  	</div>
    72  </div>
    73  {{template "base/footer" .}}