Shiloh/githaven
Shiloh/githaven
1
0
Fork 1
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Fix some UI problems (install/checkbox) (#30854)

Browse Source 
Fix the space between the box and label for checkboxes, and fix incorrect usages in "repo-issue.js"
This commit is contained in:
wxiaoguang 2024-05-06 14:32:05 +08:00 committed by GitHub
parent 22c7b3a744
commit ce8b11ae13
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 170 additions and 168 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
templates/install.tmpl
View File

@ -157,7 +157,7 @@
<!-- Optional Settings --> <!-- Optional Settings -->
<h4 class="ui dividing header">{{ctx.Locale.Tr "install.optional_title"}}</h4> <h4 class="ui dividing header">{{ctx.Locale.Tr "install.optional_title"}}</h4>
<div>
<!-- Email --> <!-- Email -->
<details class="optional field"> <details class="optional field">
<summary class="right-content tw-py-2{{if .Err_SMTP}} text red{{end}}"> <summary class="right-content tw-py-2{{if .Err_SMTP}} text red{{end}}">
@ -319,6 +319,9 @@
<input id="admin_confirm_passwd" name="admin_confirm_passwd" autocomplete="new-password" type="password" value="{{.admin_confirm_passwd}}"> <input id="admin_confirm_passwd" name="admin_confirm_passwd" autocomplete="new-password" type="password" value="{{.admin_confirm_passwd}}">
</div> </div>
</details> </details>
</div>
<div class="divider"></div>
{{if .EnvConfigKeys}} {{if .EnvConfigKeys}}
<!-- Environment Config --> <!-- Environment Config -->
@ -333,12 +336,11 @@
</div> </div>
{{end}} {{end}}
<div class="divider"></div>
<div class="inline field"> <div class="inline field">
<div class="right-content"> <div class="right-content">
These configuration options will be written into: {{.CustomConfFile}} These configuration options will be written into: {{.CustomConfFile}}
</div> </div>
<div class="right-content tw-mt-2"> <div class="tw-mt-4 tw-mb-2 tw-text-center">
<button class="ui primary button">{{ctx.Locale.Tr "install.install_btn_confirm"}}</button> <button class="ui primary button">{{ctx.Locale.Tr "install.install_btn_confirm"}}</button>
</div> </div>
</div> </div>

8
web_src/css/install.css
View File

@ -13,8 +13,7 @@
.page-content.install .ui.form .field > .help, .page-content.install .ui.form .field > .help,
.page-content.install .ui.form .field > .ui.checkbox:first-child, .page-content.install .ui.form .field > .ui.checkbox:first-child,
.page-content.install .ui.form .field > .right-content { .page-content.install .ui.form .field > .right-content {
margin-left: 30%; margin-left: calc(30% + 5px);
padding-left: 5px;
width: auto; width: auto;
} }
@ -24,10 +23,11 @@
} }
.page-content.install form.ui.form details.optional.field[open] { .page-content.install form.ui.form details.optional.field[open] {
border-bottom: 1px dashed var(--color-secondary);
padding-bottom: 10px; padding-bottom: 10px;
} }
.page-content.install form.ui.form details.optional.field[open]:not(:last-child) {
border-bottom: 1px dashed var(--color-secondary);
}
.page-content.install form.ui.form details.optional.field[open] summary { .page-content.install form.ui.form details.optional.field[open] summary {
margin-bottom: 10px; margin-bottom: 10px;
} }

2
web_src/css/modules/checkbox.css
View File

@ -41,7 +41,7 @@ input[type="radio"] {
.ui.checkbox label, .ui.checkbox label,
.ui.radio.checkbox label { .ui.radio.checkbox label {
margin-left: 1.85714em; margin-left: 20px;
} }
.ui.checkbox + label { .ui.checkbox + label {

14
web_src/js/features/repo-issue.js
View File

@ -299,23 +299,23 @@ export function initRepoPullRequestMergeInstruction() {
export function initRepoPullRequestAllowMaintainerEdit() { export function initRepoPullRequestAllowMaintainerEdit() {
const wrapper = document.getElementById('allow-edits-from-maintainers'); const wrapper = document.getElementById('allow-edits-from-maintainers');
if (!wrapper) return; if (!wrapper) return;
const checkbox = wrapper.querySelector('input[type="checkbox"]');
wrapper.querySelector('input[type="checkbox"]')?.addEventListener('change', async (e) => { checkbox.addEventListener('input', async () => {
const checked = e.target.checked;
const url = `${wrapper.getAttribute('data-url')}/set_allow_maintainer_edit`; const url = `${wrapper.getAttribute('data-url')}/set_allow_maintainer_edit`;
wrapper.classList.add('is-loading'); wrapper.classList.add('is-loading');
e.target.disabled = true;
try { try {
const response = await POST(url, {data: {allow_maintainer_edit: checked}}); const resp = await POST(url, {data: new URLSearchParams({allow_maintainer_edit: checkbox.checked})});
if (!response.ok) { if (!resp.ok) {
throw new Error('Failed to update maintainer edit permission'); throw new Error('Failed to update maintainer edit permission');
} }
const data = await resp.json();
checkbox.checked = data.allow_maintainer_edit;
} catch (error) { } catch (error) {
checkbox.checked = !checkbox.checked;
console.error(error); console.error(error);
showTemporaryTooltip(wrapper, wrapper.getAttribute('data-prompt-error')); showTemporaryTooltip(wrapper, wrapper.getAttribute('data-prompt-error'));
} finally { } finally {
wrapper.classList.remove('is-loading'); wrapper.classList.remove('is-loading');
e.target.disabled = false;
} }
}); });
} }