hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-07 10:04:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #4246 from atmire/w2p-127705_cleanup-input-form-spacing_contribute-main

Browse Source 
Reduce margins on input fields
This commit is contained in:
Tim Donohue
2025-05-02 14:51:04 -05:00
committed by GitHub
parent 9a24fb2b64 46a89533f0
commit e7359a3fd2
3 changed files with 19 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.scss
View File

@@ -40,5 +40,9 @@
.col-form-label { .col-form-label {
padding-top: 0; padding-top: 0;
padding-bottom: 0; padding-bottom: 0;
margin-bottom: 0.5rem; margin-bottom: 0.25rem;
}
label {
margin-bottom: 0.25rem;
} }

16
src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.html
View File

@@ -7,10 +7,10 @@
[formGroupName]="model.id" [formGroupName]="model.id"
[ngClass]="model.layout.element?.control"> [ngClass]="model.layout.element?.control">
@for (columnItems of items; track columnItems) { @for (columnItems of items; track columnItems) {
<div class="col-sm ms-3"> <div class="col-sm">
@for (item of columnItems; track item) { @for (item of columnItems; track item) {
<div class="custom-control custom-checkbox"> <div class="form-check">
<input type="checkbox" class="custom-control-input" <input type="checkbox" class="form-check-input"
[attr.aria-labelledby]="'label_' + model.id" [attr.aria-labelledby]="'label_' + model.id"
[attr.tabindex]="item.index" [attr.tabindex]="item.index"
[checked]="item.value" [checked]="item.value"
@@ -21,7 +21,7 @@
(blur)="onBlur($event)" (blur)="onBlur($event)"
(change)="onChange($event)" (change)="onChange($event)"
(focus)="onFocus($event)"/> (focus)="onFocus($event)"/>
<label class="custom-control-label" <label class="form-check-label"
[class.disabled]="model.disabled" [class.disabled]="model.disabled"
[ngClass]="model.layout.element?.control" [ngClass]="model.layout.element?.control"
[for]="item.id"> [for]="item.id">
@@ -43,10 +43,10 @@
[ngClass]="model.layout.element?.control" [ngClass]="model.layout.element?.control"
(change)="onChange($event)"> (change)="onChange($event)">
@for (columnItems of items; track columnItems) { @for (columnItems of items; track columnItems) {
<div class="col-sm ms-3"> <div class="col-sm">
@for (item of columnItems; track item) { @for (item of columnItems; track item) {
<div class="custom-control custom-radio"> <div class="form-check">
<input type="radio" class="custom-control-input" <input type="radio" class="form-check-input"
[checked]="item.value" [checked]="item.value"
[id]="item.id" [id]="item.id"
[name]="model.id" [name]="model.id"
@@ -54,7 +54,7 @@
[value]="item.index" [value]="item.index"
(blur)="onBlur($event)" (blur)="onBlur($event)"
(focus)="onFocus($event)"/> (focus)="onFocus($event)"/>
<label class="custom-control-label" <label class="form-check-label"
[class.disabled]="model.disabled" [class.disabled]="model.disabled"
[ngClass]="model.layout.element?.control" [ngClass]="model.layout.element?.control"
[for]="item.id"> [for]="item.id">

12
src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.spec.ts
View File

@@ -179,8 +179,8 @@ describe('DsDynamicListComponent test suite', () => {
}); });
it('should set model value properly when a checkbox option is selected', () => { it('should set model value properly when a checkbox option is selected', () => {
const de = listFixture.debugElement.queryAll(By.css('div.custom-checkbox')); const de = listFixture.debugElement.queryAll(By.css('div.form-check'));
const items = de[0].queryAll(By.css('input.custom-control-input')); const items = de[0].queryAll(By.css('input.form-check-input'));
const item = items[0]; const item = items[0];
modelValue = [Object.assign(new VocabularyEntry(), { authority: 1, display: 'one', value: 1 })]; modelValue = [Object.assign(new VocabularyEntry(), { authority: 1, display: 'one', value: 1 })];
@@ -229,8 +229,8 @@ describe('DsDynamicListComponent test suite', () => {
}); });
it('should set model value properly when a checkbox option is deselected', () => { it('should set model value properly when a checkbox option is deselected', () => {
const de = listFixture.debugElement.queryAll(By.css('div.custom-checkbox')); const de = listFixture.debugElement.queryAll(By.css('div.form-check'));
const items = de[0].queryAll(By.css('input.custom-control-input')); const items = de[0].queryAll(By.css('input.form-check-input'));
const item = items[0]; const item = items[0];
modelValue = []; modelValue = [];
@@ -267,8 +267,8 @@ describe('DsDynamicListComponent test suite', () => {
}); });
it('should set model value when a radio option is selected', () => { it('should set model value when a radio option is selected', () => {
const de = listFixture.debugElement.queryAll(By.css('div.custom-radio')); const de = listFixture.debugElement.queryAll(By.css('div.form-check'));
const items = de[0].queryAll(By.css('input.custom-control-input')); const items = de[0].queryAll(By.css('input.form-check-input'));
const item = items[0]; const item = items[0];
modelValue = Object.assign(new VocabularyEntry(), { authority: 1, display: 'one', value: 1 }); modelValue = Object.assign(new VocabularyEntry(), { authority: 1, display: 'one', value: 1 });