View Issue Details

IDProjectCategoryView StatusLast Update
0023243mantisbtuipublic2017-10-08 23:52
ReporterdregadAssigned Todregad 
PrioritynormalSeveritytweakReproducibilityhave not tried
Status closedResolutionfixed 
Product Version2.0.0-beta.1 
Target Version2.7.0Fixed in Version2.7.0 
Summary0023243: Narrow space between checkbox/radio button and label
Description

Currently, there is only very little spacing (1px) between checkboxes/radio buttons and the corresponding label.

In many places, this is compensated by adding some whitespace to the left of the label's text (e.g. Report Issue page, see View Status radio buttons and Report Stay checkbox (see attached label_space_report_issue_page.png and label_space_report_issue_page_source.png), but when the generated HTML does not have such spacing, the label appears too close to the checkbox (see label_space_snippets_plugin.png).

I believe it is incorrect to rely on whitespace in the HTML, and that this spacing should be handled by CSS instead.

TagsNo tags attached.

Activities

dregad

dregad

2017-08-18 08:31

developer  

dregad

dregad

2017-08-18 08:56

developer   ~0057500

@syncguru your opinion on this would be appreciated.

The CSS fix is easy, just need to increase the right margin in the existing setting in ace.css or to override it in ace-mantis.css

/* Increased spacing between checkbox/radio button and label */
input[type=checkbox].ace + .lbl::before,
input[type=radio].ace + .lbl::before {
    margin-right: .5em;
}
dregad

dregad

2017-08-27 05:14

developer   ~0057550

Looking at ace.css, it appears there are several padding classes doing exactly what I described in 0023243:0057500.

Various occurences where whitespace was added to provide proper spacing should be replaced by use of the padding-6 class, which provides more or less the same amount of spacing.

dregad

dregad

2017-08-27 05:37

developer   ~0057551

PR https://github.com/mantisbt/mantisbt/pull/1169

Related Changesets

MantisBT: master 65ed709a

2017-08-27 05:29:30

dregad

Details Diff
Use CSS for spacing before checkbox/radio labels

Use padding-6 class and remove hardcoded whitespace

Fixes 0023243
mod - account_prefs_inc.php Diff File
mod - bug_actiongroup_page.php Diff File
mod - bug_change_status_page.php Diff File
mod - bug_report_page.php Diff File
mod - bugnote_add_inc.php Diff File
mod - core/filter_form_api.php Diff File
mod - login_password_page.php Diff File
mod - manage_filter_edit_page.php Diff File
mod - manage_user_page.php Diff File
mod - plugins/MantisCoreFormatting/pages/config.php Diff File
mod - plugins/XmlImportExport/pages/import.php Diff File
mod - query_store_page.php Diff File
mod - view_all_inc.php Diff File

Issue History

Date Modified Username Field Change
2017-08-18 08:31 dregad New Issue
2017-08-18 08:31 dregad Status new => assigned
2017-08-18 08:31 dregad Assigned To => dregad
2017-08-18 08:31 dregad File Added: label_space_report_issue_page_source.png
2017-08-18 08:31 dregad File Added: label_space_report_issue_page.png
2017-08-18 08:31 dregad File Added: label_space_snippets_plugin.png
2017-08-18 08:56 dregad Note Added: 0057500
2017-08-22 12:12 dregad View Status private => public
2017-08-27 05:14 dregad Note Added: 0057550
2017-08-27 05:37 dregad Note Added: 0057551
2017-09-03 18:49 vboctor Target Version 2.6.0 => 2.7.0
2017-10-07 12:20 dregad Changeset attached => MantisBT master 65ed709a
2017-10-07 12:20 dregad Status assigned => resolved
2017-10-07 12:20 dregad Resolution open => fixed
2017-10-07 12:20 dregad Fixed in Version => 2.7.0
2017-10-08 23:52 vboctor Status resolved => closed