".form-row" still in use in scss [#3311048]

Problem/Motivation

CSS rules not applied to form button => button misaligned

Steps to reproduce

Drupal 9 with Bootstrap Barrio 5.5.6

Proposed resolution

replace ".form-row" with "row" in scss/components/form.scss file

Remaining tasks

User interface changes

API changes

Data model changes

Comment	File	Size	Author
#16	add-form-wrapper-3311048-16.patch	914 bytes	fanton
#2	remove-form-row-from-scss-3311048-2.patch	458 bytes	shyam_bhatt

Issue fork bootstrap_barrio-3311048

Show commands

Start within a Git clone of the project using the version control instructions.

Add & fetch this issue fork’s repository

Or, if you do not have SSH keys set up on git.drupalcode.org:

Add & fetch this issue fork’s repository

1 hidden branch

3311048-.form-row-still-in

changes, plain diff MR !29

Check out this branch for the first time

Check out existing branch, if you already have it locally

About issue forks

Comments

Comment #1

22 September 2022 at 03:27

thhomas created an issue. See original summary.

Comment #2

shyam_bhatt

he/him

commented 22 September 2022 at 06:00

Status:

Needs work

» Needs review

Status	File	Size
new	remove-form-row-from-scss-3311048-2.patch	458 bytes

Please check the patch. ".form-row" replaced with "row" in scss/components/form.scss file.

Comment #3

miyuki

Toronto, ON

commented 6 October 2022 at 23:00

FYI, the patch successfully makes changes to scss/components/form.scss, but not css/components/form.css.

Comment #4

15 October 2022 at 22:54

hatuhay committed 957ff67 on 5.5.x

Issue #3311048 by Shyam_Bhatt: .form-row still in use in scss

Comment #5

hatuhay commented 15 October 2022 at 23:00

Status:

Needs review

» Fixed

Comment #6

jurgenhaas

he/him

German

Gottmadingen

commented 17 October 2022 at 11:27

Status:

Fixed

» Needs work

This approach breaks a lot of other things, because the selector .row > div affects almost everything in a BS layout. Example: it overwrites padding, flex and width definitions for all sidebars that have a class like e.g. col-md-4

Comment #7

17 October 2022 at 11:29

jurgenhaas opened merge request !29

Comment #8

jurgenhaas

he/him

German

Gottmadingen

commented 17 October 2022 at 11:30

Version:	5.5.6	» 5.5.x-dev
Status:	Needs work	» Needs review

The attached MR makes sure, that those selectors only work inside of forms, not globally.

Comment #9

shyam_bhatt

he/him

commented 21 October 2022 at 12:29

Status:

Needs review

» Reviewed & tested by the community

@jurgenhaas yes adding a form wrapper will be more accurate. "MR !29" looks fine to me.

form {
  .row>fieldset,
  .row>div {
    padding-right: 5px;
    padding-left: 5px;
    flex: 0 1 auto;
    width: auto;
    max-width: none;
  }

Comment #10

crutch commented 25 October 2022 at 18:29

not using scss, getting error with this patch. Trying to resolve #6

Error: Call to a member function addClass() on array in bootstrap_barrio_preprocess_input() (line 736 of themes\contrib\bootstrap_barrio\bootstrap_barrio.theme).

manually changing form.css line 18 and 19 to