From 46115041b8d1578bf57bb88dacc443da6d5b67eb Mon Sep 17 00:00:00 2001
From: Gusted <postmaster@gusted.xyz>
Date: Sun, 7 Jul 2024 01:37:38 +0200
Subject: [PATCH] [BUG] Fix mobile UI for organisation creation
- Don't make checkpoints or radio inputs full width on a small screen,
these obviously shouldn't try to take up the whole width of a container.
- Wrap the label for organisation permission box inside a `<span
class="inline field">`, so it gets a left-margin from the `.inline.field
> :first-child` selector. This make the checkboxes and radio buttons
groups look indented from the left.
- Resolves #4361
(cherry picked from commit 610487eb833da399e22cf81e127fb1865a5d9054)
---
templates/org/create.tmpl | 2 +-
web_src/css/form.css | 2 +-
2 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/templates/org/create.tmpl b/templates/org/create.tmpl
index 004cd9be80..92be4a0adb 100644
--- a/templates/org/create.tmpl
+++ b/templates/org/create.tmpl
@@ -34,7 +34,7 @@
</div>
<div class="inline field" id="permission_box">
- <label>{{ctx.Locale.Tr "org.settings.permission"}}</label>
+ <span class="inline field"><label>{{ctx.Locale.Tr "org.settings.permission"}}</label></span>
<div class="inline-grouped-list">
<div class="ui checkbox">
<input type="checkbox" name="repo_admin_change_team_access" checked>
diff --git a/web_src/css/form.css b/web_src/css/form.css
index c757234e3b..7e2e1736f4 100644
--- a/web_src/css/form.css
+++ b/web_src/css/form.css
@@ -466,7 +466,7 @@ textarea:focus,
margin-bottom: 1em;
width: 100%;
}
- .new.org .ui.form .field input {
+ .new.org .ui.form .field input:not([type="checkbox"], [type="radio"]) {
width: 100% !important;
}
}