Skip to content

Commit e4d5c7d

Browse files
alexandrevryghemalexandrevryghem
committed
141115: Prevent content from overflowing using the new device-width value
1 parent dc362eb commit e4d5c7d

16 files changed

Lines changed: 90 additions & 96 deletions

File tree

‎src/app/dso-shared/dso-edit-metadata/dso-edit-metadata.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@
3131
</button>
3232
}
3333
</div>
34-
<div role="table" [attr.aria-label]="'item.edit.head' | translate">
34+
<div class="overflow-auto" role="table" [attr.aria-label]="'item.edit.head' | translate">
3535
<ds-dso-edit-metadata-headers [dsoType]="dsoType"></ds-dso-edit-metadata-headers>
3636
@if (form.newValue) {
3737
<div class="d-flex flex-row ds-field-row" role="row">

‎src/app/footer/footer.component.scss‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,13 +43,20 @@
4343
}
4444
}
4545
ul {
46+
flex-direction: column;
47+
48+
@media screen and (min-width: map-get($grid-breakpoints, md)) {
49+
flex-direction: row;
50+
}
51+
4652
li {
4753
display: inline-flex;
4854

4955
a, .btn-link {
5056
padding: 0 calc(var(--bs-spacer) / 2);
5157
color: inherit;
5258
font-size: .875em;
59+
margin: 0 auto;
5360

5461
&:focus {
5562
box-shadow: none;

‎src/app/item-page/full/field-components/file-section/full-file-section.component.html‎

Lines changed: 47 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -9,44 +9,9 @@ <h3 class="h5 simple-view-element-header">
99
<ds-pagination [hideGear]="true" [hidePagerWhenSinglePage]="true" [paginationOptions]="originalOptions"
1010
[collectionSize]="originals?.totalElements" [retainScrollPosition]="true">
1111
@for (file of originals?.page; track file) {
12-
<div class="file-section row mb-3">
13-
<div class="col-3">
14-
<ds-thumbnail [thumbnail]="(file.thumbnail | async)?.payload"></ds-thumbnail>
15-
</div>
16-
<div class="col-7">
17-
<dl class="row">
18-
<dt class="col-md-4">
19-
{{ "item.page.filesection.name" | translate }}
20-
</dt>
21-
<dd class="col-md-8">{{ dsoNameService.getName(file) }}</dd>
22-
<dt class="col-md-4">
23-
{{ "item.page.filesection.size" | translate }}
24-
</dt>
25-
<dd class="col-md-8">{{ file.sizeBytes | dsFileSize }}</dd>
26-
<dt class="col-md-4">
27-
{{ "item.page.filesection.format" | translate }}
28-
</dt>
29-
<dd class="col-md-8">
30-
{{ (file.format | async)?.payload?.description }}
31-
</dd>
32-
@if (file.hasMetadata('dc.description')) {
33-
<dt class="col-md-4">
34-
{{ "item.page.filesection.description" | translate }}
35-
</dt>
36-
<dd class="col-md-8">
37-
{{ file.firstMetadataValue("dc.description") }}
38-
</dd>
39-
}
40-
</dl>
41-
</div>
42-
<div class="col-2">
43-
<ds-file-download-link [showIcon]="true" [bitstream]="file" [item]="item" cssClasses="btn btn-outline-primary btn-download">
44-
<span class="d-none d-md-inline">
45-
{{ "item.page.filesection.download" | translate }}
46-
</span>
47-
</ds-file-download-link>
48-
</div>
49-
</div>
12+
<ng-container [ngTemplateOutlet]="fileSection"
13+
[ngTemplateOutletContext]="{ file : file }">
14+
</ng-container>
5015
}
5116
</ds-pagination>
5217
}
@@ -63,46 +28,54 @@ <h3 class="h5 simple-view-element-header">
6328
<ds-pagination [hideGear]="true" [hidePagerWhenSinglePage]="true" [paginationOptions]="licenseOptions"
6429
[collectionSize]="licenses?.totalElements" [retainScrollPosition]="true">
6530
@for (file of licenses?.page; track file) {
66-
<div class="file-section row">
67-
<div class="col-3">
68-
<ds-thumbnail [thumbnail]="(file.thumbnail | async)?.payload"></ds-thumbnail>
69-
</div>
70-
<div class="col-7">
71-
<dl class="row">
72-
<dt class="col-md-4">
73-
{{ "item.page.filesection.name" | translate }}
74-
</dt>
75-
<dd class="col-md-8">{{ dsoNameService.getName(file) }}</dd>
76-
<dt class="col-md-4">
77-
{{ "item.page.filesection.size" | translate }}
78-
</dt>
79-
<dd class="col-md-8">{{ file.sizeBytes | dsFileSize }}</dd>
80-
<dt class="col-md-4">
81-
{{ "item.page.filesection.format" | translate }}
82-
</dt>
83-
<dd class="col-md-8">
84-
{{ (file.format | async)?.payload?.description }}
85-
</dd>
86-
<dt class="col-md-4">
87-
{{ "item.page.filesection.description" | translate }}
88-
</dt>
89-
<dd class="col-md-8">
90-
{{ file.firstMetadataValue("dc.description") }}
91-
</dd>
92-
</dl>
93-
</div>
94-
<div class="col-2">
95-
<ds-file-download-link [showIcon]="true" [bitstream]="file" [item]="item" cssClasses="btn btn-outline-primary btn-download">
96-
<span class="d-none d-md-inline">
97-
{{ "item.page.filesection.download" | translate }}
98-
</span>
99-
</ds-file-download-link>
100-
</div>
101-
</div>
31+
<ng-container [ngTemplateOutlet]="fileSection"
32+
[ngTemplateOutletContext]="{ file : file }">
33+
</ng-container>
10234
}
10335
</ds-pagination>
10436
}
10537
</div>
10638
}
10739
</div>
10840
</ds-metadata-field-wrapper>
41+
42+
<ng-template #fileSection let-file="file">
43+
<div class="file-section row mb-3">
44+
<div class="col-3">
45+
<ds-thumbnail [thumbnail]="(file.thumbnail | async)?.payload"></ds-thumbnail>
46+
</div>
47+
<div class="col-7">
48+
<dl class="row">
49+
<dt class="col-md-4">
50+
{{ "item.page.filesection.name" | translate }}
51+
</dt>
52+
<dd class="col-md-8">{{ dsoNameService.getName(file) }}</dd>
53+
<dt class="col-md-4">
54+
{{ "item.page.filesection.size" | translate }}
55+
</dt>
56+
<dd class="col-md-8">{{ file.sizeBytes | dsFileSize }}</dd>
57+
<dt class="col-md-4">
58+
{{ "item.page.filesection.format" | translate }}
59+
</dt>
60+
<dd class="col-md-8">
61+
{{ (file.format | async)?.payload?.description }}
62+
</dd>
63+
@if (file.hasMetadata('dc.description')) {
64+
<dt class="col-md-4">
65+
{{ "item.page.filesection.description" | translate }}
66+
</dt>
67+
<dd class="col-md-8">
68+
{{ file.firstMetadataValue("dc.description") }}
69+
</dd>
70+
}
71+
</dl>
72+
</div>
73+
<div class="col-2">
74+
<ds-file-download-link [showIcon]="true" [bitstream]="file" [item]="item" cssClasses="btn btn-outline-primary btn-download">
75+
<span class="d-none d-md-inline">
76+
{{ "item.page.filesection.download" | translate }}
77+
</span>
78+
</ds-file-download-link>
79+
</div>
80+
</div>
81+
</ng-template>

‎src/app/item-page/full/field-components/file-section/full-file-section.component.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1-
import { AsyncPipe } from '@angular/common';
1+
import {
2+
AsyncPipe,
3+
NgTemplateOutlet,
4+
} from '@angular/common';
25
import {
36
Component,
47
Inject,
@@ -55,6 +58,7 @@ import { FileSectionComponent } from '../../../simple/field-components/file-sect
5558
AsyncPipe,
5659
FileSizePipe,
5760
MetadataFieldWrapperComponent,
61+
NgTemplateOutlet,
5862
PaginationComponent,
5963
ThemedFileDownloadLinkComponent,
6064
ThemedThumbnailComponent,

‎src/app/my-dspace-page/my-dspace-new-submission/my-dspace-new-external-dropdown/my-dspace-new-external-dropdown.component.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
@if ((moreThanOne$ | async) !== true) {
22
<div class="add">
3-
<button class="btn btn-lg btn-outline-primary mt-1 ms-2"
3+
<button class="btn btn-lg btn-outline-primary"
44
[attr.aria-label]="'mydspace.new-submission-external' | translate" [dsBtnDisabled]="(initialized$ | async) !== true"
55
(click)="openPage(singleEntity)" role="button"
66
title="{{'mydspace.new-submission-external' | translate}}">
@@ -12,7 +12,7 @@
1212
<div class="add w-100" display="dynamic" placement="bottom-right"
1313
ngbDropdown
1414
>
15-
<button class="btn btn-lg btn-outline-primary mt-1 ms-2" id="dropdownImport" ngbDropdownToggle
15+
<button class="btn btn-lg btn-outline-primary" id="dropdownImport" ngbDropdownToggle
1616
type="button" [dsBtnDisabled]="(initialized$ | async) !== true"
1717
[attr.aria-label]="'mydspace.new-submission-external' | translate"
1818
[attr.data-test]="'import-dropdown' | dsBrowserOnly"

‎src/app/my-dspace-page/my-dspace-new-submission/my-dspace-new-submission-dropdown/my-dspace-new-submission-dropdown.component.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
@if ((moreThanOne$ | async) !== true) {
22
<div class="add">
3-
<button class="btn btn-lg btn-primary mt-1 ms-2" [attr.aria-label]="'mydspace.new-submission' | translate"
3+
<button class="btn btn-lg btn-primary" [attr.aria-label]="'mydspace.new-submission' | translate"
44
[dsBtnDisabled]="(initialized$ | async) !== true" (click)="openDialog(singleEntity)" role="button">
55
<i class="fa fa-plus-circle" aria-hidden="true"></i>
66
</button>
@@ -10,7 +10,7 @@
1010
<div class="add w-100" display="dynamic" placement="bottom-right"
1111
ngbDropdown
1212
>
13-
<button class="btn btn-lg btn-primary mt-1 ms-2" id="dropdownSubmission" ngbDropdownToggle
13+
<button class="btn btn-lg btn-primary" id="dropdownSubmission" ngbDropdownToggle
1414
type="button" [dsBtnDisabled]="(initialized$ | async) !== true"
1515
[attr.aria-label]="'mydspace.new-submission' | translate"
1616
[attr.data-test]="'submission-dropdown' | dsBrowserOnly"

‎src/app/my-dspace-page/my-dspace-new-submission/my-dspace-new-submission.component.html‎

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,10 @@
55
[uploadFilesOptions]="uploadFilesOptions"
66
(onCompleteItem)="onCompleteItem($event)"
77
(onUploadError)="onUploadError($event)"
8-
(onFileSelected)="afterFileLoaded($event)"></ds-uploader>
8+
(onFileSelected)="afterFileLoaded($event)"></ds-uploader>
99
}
1010

1111
</div>
12-
<div class="add">
13-
<ds-my-dspace-new-submission-dropdown></ds-my-dspace-new-submission-dropdown>
14-
</div>
15-
<div class="add">
16-
<ds-my-dspace-new-external-dropdown></ds-my-dspace-new-external-dropdown>
17-
</div>
18-
12+
<ds-my-dspace-new-submission-dropdown></ds-my-dspace-new-submission-dropdown>
13+
<ds-my-dspace-new-external-dropdown></ds-my-dspace-new-external-dropdown>
1914
</div>

‎src/app/my-dspace-page/my-dspace-new-submission/my-dspace-new-submission.component.scss‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
.parent {
22
display: flex;
3+
flex-wrap: wrap;
4+
justify-content: end;
5+
gap: calc(var(--ds-content-spacing) / 2);
36
}
47

58
.upload {

‎src/app/profile-page/profile-page.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@ <h1>{{'profile.title' | translate}}</h1>
6060
<h2 class="mt-4">{{ 'profile.groups.head' | translate }}</h2>
6161
<ul class="list-group list-group-flush">
6262
@for (group of groups; track group) {
63-
<li class="list-group-item">{{ dsoNameService.getName(group) }}</li>
63+
<li class="list-group-item text-break">{{ dsoNameService.getName(group) }}</li>
6464
}
6565
</ul>
6666
</div>

‎src/app/shared/search-form/search-form.component.html‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,10 @@
1111
<input type="text" [(ngModel)]="query" name="query" class="form-control"
1212
[attr.aria-label]="searchPlaceholder" [attr.data-test]="'search-box' | dsBrowserOnly"
1313
[placeholder]="searchPlaceholder" tabindex="0">
14-
<button type="submit" class="search-button btn btn-{{brandColor}}" [attr.data-test]="'search-button' | dsBrowserOnly" role="button" tabindex="0"><i class="fas fa-search"></i> {{ ('search.form.search' | translate) }}</button>
14+
<button [attr.aria-label]="'search.form.search' | translate" type="submit" class="search-button btn btn-{{brandColor}}" [attr.data-test]="'search-button' | dsBrowserOnly" role="button" tabindex="0">
15+
<i aria-hidden="true" class="fas fa-search"></i>
16+
<span class="d-none d-sm-inline ms-1">{{ ('search.form.search' | translate) }}</span>
17+
</button>
1518
</div>
1619
</div>
1720
</form>

0 commit comments

Comments
 (0)