From 22ed694eb1f72534d6292936084f8ce77c1b71a7 Mon Sep 17 00:00:00 2001 From: Sebastian Stehle Date: Sat, 10 Feb 2018 11:39:00 +0100 Subject: [PATCH] UI updated. --- .../Controllers/Content/ContentsController.cs | 4 +- .../Controllers/Content/Models/ContentDto.cs | 6 +- .../pages/content/content-page.component.ts | 4 +- .../contents/contents-page.component.html | 52 +- .../pages/contents/contents-page.component.ts | 142 ++- .../app/features/content/pages/messages.ts | 2 +- .../shared/content-item.component.html | 21 +- .../shared/content-item.component.scss | 31 +- .../content/shared/content-item.component.ts | 4 +- .../events/rule-events-page.component.html | 2 +- .../pages/rules/rule-wizard.component.scss | 4 - .../schema/schema-scripts-form.component.scss | 4 - .../angular/date-time-editor.component.html | 2 +- .../angular/date-time-editor.component.ts | 5 +- .../framework/angular/date-time.pipes.spec.ts | 12 + .../app/framework/angular/date-time.pipes.ts | 10 + .../angular/dialog-renderer.component.scss | 4 - .../angular/onboarding-tooltip.component.html | 1 - .../angular/onboarding-tooltip.component.scss | 4 +- src/Squidex/app/framework/module.ts | 3 + .../shared/services/contents.service.spec.ts | 12 +- .../app/shared/services/contents.service.ts | 6 +- src/Squidex/app/theme/_bootstrap.scss | 6 + src/Squidex/app/theme/_lists.scss | 4 + src/Squidex/app/theme/_panels.scss | 21 +- src/Squidex/app/theme/_vars.scss | 1 + .../app/theme/icomoon/demo-files/demo.css | 4 +- src/Squidex/app/theme/icomoon/demo.html | 372 +++--- .../app/theme/icomoon/fonts/icomoon.eot | Bin 23028 -> 23328 bytes .../app/theme/icomoon/fonts/icomoon.svg | 2 + .../app/theme/icomoon/fonts/icomoon.ttf | Bin 22864 -> 23164 bytes .../app/theme/icomoon/fonts/icomoon.woff | Bin 22940 -> 23240 bytes src/Squidex/app/theme/icomoon/selection.json | 1098 +++++++++-------- src/Squidex/app/theme/icomoon/style.css | 94 +- 34 files changed, 1080 insertions(+), 857 deletions(-) diff --git a/src/Squidex/Areas/Api/Controllers/Content/ContentsController.cs b/src/Squidex/Areas/Api/Controllers/Content/ContentsController.cs index fc81dbc70..6cc59d1b7 100644 --- a/src/Squidex/Areas/Api/Controllers/Content/ContentsController.cs +++ b/src/Squidex/Areas/Api/Controllers/Content/ContentsController.cs @@ -290,11 +290,11 @@ namespace Squidex.Areas.Api.Controllers.Contents { Instant? dt = null; - if (string.IsNullOrWhiteSpace(dueTime)) + if (!string.IsNullOrWhiteSpace(dueTime)) { var parseResult = InstantPattern.General.Parse(dueTime); - if (!parseResult.Success) + if (parseResult.Success) { dt = parseResult.Value; } diff --git a/src/Squidex/Areas/Api/Controllers/Content/Models/ContentDto.cs b/src/Squidex/Areas/Api/Controllers/Content/Models/ContentDto.cs index f2c16cedd..2be029606 100644 --- a/src/Squidex/Areas/Api/Controllers/Content/Models/ContentDto.cs +++ b/src/Squidex/Areas/Api/Controllers/Content/Models/ContentDto.cs @@ -43,17 +43,17 @@ namespace Squidex.Areas.Api.Controllers.Contents.Models /// /// The scheduled status. /// - public Status? ScheduledTo { get; } + public Status? ScheduledTo { get; set; } /// /// The scheduled date. /// - public Instant? ScheduledAt { get; } + public Instant? ScheduledAt { get; set; } /// /// The user that has scheduled the content. /// - public RefToken ScheduledBy { get; } + public RefToken ScheduledBy { get; set; } /// /// The date and time when the content item has been created. diff --git a/src/Squidex/app/features/content/pages/content/content-page.component.ts b/src/Squidex/app/features/content/pages/content/content-page.component.ts index 4dd2a16a4..9ba93a9e9 100644 --- a/src/Squidex/app/features/content/pages/content/content-page.component.ts +++ b/src/Squidex/app/features/content/pages/content/content-page.component.ts @@ -87,10 +87,10 @@ export class ContentPageComponent implements CanComponentDeactivate, OnDestroy, this.content = this.content.changeStatus( message.content.scheduledTo || message.content.status, + message.content.scheduledAt, message.content.lastModifiedBy, message.content.version, - message.content.lastModified, - message.content.scheduledAt); + message.content.lastModified); } }); diff --git a/src/Squidex/app/features/content/pages/contents/contents-page.component.html b/src/Squidex/app/features/content/pages/contents/contents-page.component.html index 9589b5b6b..9b610a95d 100644 --- a/src/Squidex/app/features/content/pages/contents/contents-page.component.html +++ b/src/Squidex/app/features/content/pages/contents/contents-page.component.html @@ -92,25 +92,25 @@
- {{selectionCount}} items selected: + {{selectionCount}} items selected:   - - - - -
- \ No newline at end of file + + +
+
+
+
+
+

{{dueTimeAction}} content items

+
+ +
+
+ + +
+ +
+ + +
+ + +
+ +
+
+ + +
+
+
+
+
diff --git a/src/Squidex/app/features/content/pages/contents/contents-page.component.ts b/src/Squidex/app/features/content/pages/contents/contents-page.component.ts index ec262312c..930c9640d 100644 --- a/src/Squidex/app/features/content/pages/contents/contents-page.component.ts +++ b/src/Squidex/app/features/content/pages/contents/contents-page.component.ts @@ -52,6 +52,12 @@ export class ContentsPageComponent implements OnDestroy, OnInit { public contentsQuery = ''; public contentsPager = new Pager(0); + public dueTimeDialog = new ModalView(); + public dueTime: string | null = ''; + public dueTimeFunction: Function | null; + public dueTimeAction: string | null = ''; + public dueTimeMode = 'Immediately'; + public selectedItems: { [id: string]: boolean; } = {}; public selectionCount = 0; @@ -118,85 +124,90 @@ export class ContentsPageComponent implements OnDestroy, OnInit { } public publishContent(content: ContentDto) { - this.changeContentItem(content, 'publish', 'Published').subscribe(); + this.changeContentItems([content], 'Publish', 'Published', false); } - public publishSelected() { - Observable.forkJoin( - this.contentItems.values - .filter(c => this.selectedItems[c.id]) - .filter(c => c.status !== 'Published') - .map(c => this.changeContentItem(c, 'publish', 'Published'))) - .finally(() => { - this.updateSelectionSummary(); - }) - .subscribe(); + public publishSelected(scheduled: boolean) { + const contents = this.contentItems.filter(c => c.status !== 'Published' && this.selectedItems[c.id]).values; + + this.changeContentItems(contents, 'Publish', 'Published', false); } public unpublishContent(content: ContentDto) { - this.changeContentItem(content, 'unpublish', 'Draft').subscribe(); + this.changeContentItems([content], 'Unpublish', 'Draft', false); } - public unpublishSelected() { - Observable.forkJoin( - this.contentItems.values - .filter(c => this.selectedItems[c.id]) - .filter(c => c.status !== 'Unpublished') - .map(c => this.changeContentItem(c, 'unpublish', 'Draft'))) - .finally(() => { - this.updateSelectionSummary(); - }) - .subscribe(); + public unpublishSelected(scheduled: boolean) { + const contents = this.contentItems.filter(c => c.status === 'Published' && this.selectedItems[c.id]).values; + + this.changeContentItems(contents, 'Unpublish', 'Draft', false); } - private changeContentItem(content: ContentDto, action: string, status: string): Observable { - return this.contentsService.changeContentStatus(this.ctx.appName, this.schema.name, content.id, action, content.version) - .catch(error => { - this.ctx.notifyError(error); + public archiveContent(content: ContentDto) { + this.changeContentItems([content], 'Archive', 'Archived', true); + } - return Observable.throw(error); - }) - .do(dto => { - this.contentItems = this.contentItems.replaceBy('id', content.changeStatus(status, this.ctx.userToken, dto.version)); + public archiveSelected(scheduled: boolean) { + const contents = this.contentItems.filter(c => this.selectedItems[c.id]).values; - this.emitContentStatusChanged(content); - }); + this.changeContentItems(contents, 'Archive', 'Archived', true); } - public archiveSelected() { - Observable.forkJoin( - this.contentItems.values.filter(c => this.selectedItems[c.id]) - .map(c => this.changeContentItem(c, 'archive', 'Archived'))) - .finally(() => { - this.load(); - }) - .subscribe(); + public restoreContent(content: ContentDto) { + this.changeContentItems([content], 'Restore', 'Draft', true); } - public archiveContent(content: ContentDto) { - this.changeContentItem(content, 'archive', 'Archived') - .finally(() => { - this.load(); - }) - .subscribe(); + public restoreSelected(scheduled: boolean) { + const contents = this.contentItems.filter(c => this.selectedItems[c.id]).values; + + this.changeContentItems(contents, 'Restore', 'Draft', true); } - public restoreSelected() { - Observable.forkJoin( - this.contentItems.values.filter(c => this.selectedItems[c.id]) - .map(c => this.changeContentItem(c, 'restore', 'Draft'))) - .finally(() => { - this.load(); - }) - .subscribe(); + private changeContentItems(contents: ContentDto[], action: string, status: string, reload: boolean) { + if (contents.length === 0) { + return; + } + + this.dueTimeFunction = () => { + if (this.dueTime) { + reload = false; + } + Observable.forkJoin( + contents + .map(c => this.changeContentItem(c, action, status, this.dueTime, reload))) + .finally(() => { + if (reload) { + this.load(); + } else { + this.updateSelectionSummary(); + } + }) + .subscribe(); + }; + + this.dueTimeAction = action; + this.dueTimeDialog.show(); } - public restoreContent(content: ContentDto) { - this.changeContentItem(content, 'restore', 'Draft') - .finally(() => { - this.load(); + private changeContentItem(content: ContentDto, action: string, status: string, dueTime: string | null, reload: boolean): Observable { + return this.contentsService.changeContentStatus(this.ctx.appName, this.schema.name, content.id, action, dueTime, content.version) + .catch(error => { + this.ctx.notifyError(error); + + return Observable.throw(error); }) - .subscribe(); + .do(dto => { + if (!reload) { + const dt = + dueTime ? + DateTime.parseISO_UTC(dueTime) : + null; + + this.contentItems = this.contentItems.replaceBy('id', content.changeStatus(status, dt, this.ctx.userToken, dto.version)); + + this.emitContentStatusChanged(content); + } + }); } public deleteSelected(content: ContentDto) { @@ -357,5 +368,18 @@ export class ContentsPageComponent implements OnDestroy, OnInit { this.contentFields = [{}]; } } + + public confirmStatusChange() { + this.dueTimeFunction!(); + + this.cancelStatusChange(); + } + + public cancelStatusChange() { + this.dueTimeMode = 'Immediately'; + this.dueTimeDialog.hide(); + this.dueTimeFunction = null; + this.dueTime = null; + } } diff --git a/src/Squidex/app/features/content/pages/messages.ts b/src/Squidex/app/features/content/pages/messages.ts index ca5a19fa4..112827d57 100644 --- a/src/Squidex/app/features/content/pages/messages.ts +++ b/src/Squidex/app/features/content/pages/messages.ts @@ -5,7 +5,7 @@ * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. */ -import { ContentDto, DateTime } from 'shared'; +import { ContentDto } from 'shared'; export class ContentCreated { constructor( diff --git a/src/Squidex/app/features/content/shared/content-item.component.html b/src/Squidex/app/features/content/shared/content-item.component.html index e3bb20cdf..bfff66cfc 100644 --- a/src/Squidex/app/features/content/shared/content-item.component.html +++ b/src/Squidex/app/features/content/shared/content-item.component.html @@ -10,7 +10,26 @@ - + + + + + +
+ {{content.status}} +
+ + + + + + + +
+ Will be set {{content.scheduledTo}} at {{content.scheduledAt | sqxFullDateTime}} +
+ + {{content.lastModified | sqxFromNow}} diff --git a/src/Squidex/app/features/content/shared/content-item.component.scss b/src/Squidex/app/features/content/shared/content-item.component.scss index 727784a9c..8b360453e 100644 --- a/src/Squidex/app/features/content/shared/content-item.component.scss +++ b/src/Squidex/app/features/content/shared/content-item.component.scss @@ -1,22 +1,31 @@ @import '_vars'; @import '_mixins'; -.content { +.content-status { & { + vertical-align: middle; cursor: pointer; } &-published { - & { - @include circle(.5rem); - display: inline-block; - border: 0; - background: $color-theme-green; - margin-left: .4rem; - } + color: $color-theme-green; + } + + &-draft { + color: $color-text-decent; + } + + &-archived { + color: $color-theme-error; + } - &.unpublished { - background: $color-theme-error; - } + &-tooltip { + @include border-radius; + background: $color-tooltip; + border: 0; + font-size: .9rem; + font-weight: normal; + color: $color-dark-foreground; + padding: .75rem; } } \ No newline at end of file diff --git a/src/Squidex/app/features/content/shared/content-item.component.ts b/src/Squidex/app/features/content/shared/content-item.component.ts index 7ba32c2f3..715f445d9 100644 --- a/src/Squidex/app/features/content/shared/content-item.component.ts +++ b/src/Squidex/app/features/content/shared/content-item.component.ts @@ -46,7 +46,7 @@ export class ContentItemComponent implements OnInit, OnChanges { public deleting = new EventEmitter(); @Output() - public selectedChange = new EventEmitter(); + public selectedChange = new EventEmitter(); @Input() public selected = false; @@ -74,6 +74,8 @@ export class ContentItemComponent implements OnInit, OnChanges { public dropdown = new ModalView(false, true); + public scheduleTooltip = new ModalView(false, true); + public values: any[] = []; constructor(public readonly ctx: AppContext diff --git a/src/Squidex/app/features/rules/pages/events/rule-events-page.component.html b/src/Squidex/app/features/rules/pages/events/rule-events-page.component.html index b0cf8866b..7af9fc272 100644 --- a/src/Squidex/app/features/rules/pages/events/rule-events-page.component.html +++ b/src/Squidex/app/features/rules/pages/events/rule-events-page.component.html @@ -77,7 +77,7 @@ Attempts: {{event.numCalls}}
- Next: {{event.nextAttempt.toStringFormat('MMM DD h:mm:ss a')}} + Next: {{event.nextAttempt | sqxFromNow}}
-
+
diff --git a/src/Squidex/app/framework/angular/date-time-editor.component.ts b/src/Squidex/app/framework/angular/date-time-editor.component.ts index 3ee9fc078..ad6103174 100644 --- a/src/Squidex/app/framework/angular/date-time-editor.component.ts +++ b/src/Squidex/app/framework/angular/date-time-editor.component.ts @@ -40,6 +40,9 @@ export class DateTimeEditorComponent implements ControlValueAccessor, OnDestroy, @Input() public enforceTime: boolean; + @Input() + public hideClear: boolean; + public timeControl = new FormControl(); public dateControl = new FormControl(); @@ -169,7 +172,7 @@ export class DateTimeEditorComponent implements ControlValueAccessor, OnDestroy, let result: string | null = null; if ((this.dateValue && !this.dateValue.isValid()) || (this.timeValue && !this.timeValue.isValid())) { - result = 'Invalid DateTime'; + result = null; } else if (!this.dateValue && !this.timeValue) { result = null; } else { diff --git a/src/Squidex/app/framework/angular/date-time.pipes.spec.ts b/src/Squidex/app/framework/angular/date-time.pipes.spec.ts index f738a3d35..c01bb8fec 100644 --- a/src/Squidex/app/framework/angular/date-time.pipes.spec.ts +++ b/src/Squidex/app/framework/angular/date-time.pipes.spec.ts @@ -13,6 +13,7 @@ import { DayPipe, DurationPipe, FromNowPipe, + FullDateTimePipe, MonthPipe, ShortDatePipe, ShortTimePipe @@ -33,6 +34,17 @@ describe('DurationPipe', () => { }); }); +describe('FullDateTimePipe', () => { + it('should format to nice string', () => { + const pipe = new FullDateTimePipe(); + + const actual = pipe.transform(dateTime); + const expected = 'Thursday, October 3, 2013 12:13 PM'; + + expect(actual).toBe(expected); + }); +}); + describe('DayPipe', () => { it('should format to day numbers', () => { const pipe = new DayPipe(); diff --git a/src/Squidex/app/framework/angular/date-time.pipes.ts b/src/Squidex/app/framework/angular/date-time.pipes.ts index 8c0d9d9e6..754f278ad 100644 --- a/src/Squidex/app/framework/angular/date-time.pipes.ts +++ b/src/Squidex/app/framework/angular/date-time.pipes.ts @@ -80,6 +80,16 @@ export class ShortTimePipe implements PipeTransform { } } +@Pipe({ + name: 'sqxFullDateTime', + pure: true +}) +export class FullDateTimePipe implements PipeTransform { + public transform(value: DateTime): any { + return value.toStringFormat('LLLL'); + } +} + @Pipe({ name: 'sqxDuration', pure: true diff --git a/src/Squidex/app/framework/angular/dialog-renderer.component.scss b/src/Squidex/app/framework/angular/dialog-renderer.component.scss index a990f3756..f86958242 100644 --- a/src/Squidex/app/framework/angular/dialog-renderer.component.scss +++ b/src/Squidex/app/framework/angular/dialog-renderer.component.scss @@ -29,8 +29,4 @@ &-bottomleft { @include fixed(auto, auto, 0, 0); } -} - -.clearfix { - width: 100%; } \ No newline at end of file diff --git a/src/Squidex/app/framework/angular/onboarding-tooltip.component.html b/src/Squidex/app/framework/angular/onboarding-tooltip.component.html index 4de8bb7f8..bd217d082 100644 --- a/src/Squidex/app/framework/angular/onboarding-tooltip.component.html +++ b/src/Squidex/app/framework/angular/onboarding-tooltip.component.html @@ -1,5 +1,4 @@
-
diff --git a/src/Squidex/app/framework/angular/onboarding-tooltip.component.scss b/src/Squidex/app/framework/angular/onboarding-tooltip.component.scss index 33430c7e2..2b991d2d7 100644 --- a/src/Squidex/app/framework/angular/onboarding-tooltip.component.scss +++ b/src/Squidex/app/framework/angular/onboarding-tooltip.component.scss @@ -1,12 +1,10 @@ @import '_mixins'; @import '_vars'; -$color: #1a2129; - .onboarding { &-help { @include border-radius; - background: $color; + background: $color-tooltip; border: 0; max-width: 20rem; padding: .75rem; diff --git a/src/Squidex/app/framework/module.ts b/src/Squidex/app/framework/module.ts index 45b1b528e..9a4f4b39f 100644 --- a/src/Squidex/app/framework/module.ts +++ b/src/Squidex/app/framework/module.ts @@ -32,6 +32,7 @@ import { FileSizePipe, FocusOnInitDirective, FromNowPipe, + FullDateTimePipe, IgnoreScrollbarDirective, ImageSourceDirective, IndeterminateValueDirective, @@ -98,6 +99,7 @@ import { FileSizePipe, FocusOnInitDirective, FromNowPipe, + FullDateTimePipe, IgnoreScrollbarDirective, ImageSourceDirective, IndeterminateValueDirective, @@ -148,6 +150,7 @@ import { FileSizePipe, FocusOnInitDirective, FromNowPipe, + FullDateTimePipe, IgnoreScrollbarDirective, ImageSourceDirective, IndeterminateValueDirective, diff --git a/src/Squidex/app/shared/services/contents.service.spec.ts b/src/Squidex/app/shared/services/contents.service.spec.ts index af7b1dc45..7f6637a95 100644 --- a/src/Squidex/app/shared/services/contents.service.spec.ts +++ b/src/Squidex/app/shared/services/contents.service.spec.ts @@ -39,7 +39,7 @@ describe('ContentDto', () => { it('should update status property and user info when changing status', () => { const content_1 = new ContentDto('1', 'Draft', creator, creator, creation, creation, null, null, null, { data: 1 }, version); - const content_2 = content_1.changeStatus('Published', modifier, newVersion, modified); + const content_2 = content_1.changeStatus('Published', null, modifier, newVersion, modified); expect(content_2.status).toEqual('Published'); expect(content_2.lastModified).toEqual(modified); @@ -49,7 +49,7 @@ describe('ContentDto', () => { it('should update schedules property and user info when changing status with due time', () => { const content_1 = new ContentDto('1', 'Draft', creator, creator, creation, creation, null, null, null, { data: 1 }, version); - const content_2 = content_1.changeStatus('Published', modifier, newVersion, modified, dueTime); + const content_2 = content_1.changeStatus('Published', dueTime, modifier, newVersion, modified); expect(content_2.status).toEqual('Draft'); expect(content_2.lastModified).toEqual(modified); @@ -315,7 +315,7 @@ describe('ContentsService', () => { it('should make put request to change content status', inject([ContentsService, HttpTestingController], (contentsService: ContentsService, httpMock: HttpTestingController) => { - contentsService.changeContentStatus('my-app', 'my-schema', 'content1', 'publish', version).subscribe(); + contentsService.changeContentStatus('my-app', 'my-schema', 'content1', 'publish', null, version).subscribe(); const req = httpMock.expectOne('http://service/p/api/content/my-app/my-schema/content1/publish'); @@ -328,11 +328,11 @@ describe('ContentsService', () => { it('should make put request with due time when status change is scheduled', inject([ContentsService, HttpTestingController], (contentsService: ContentsService, httpMock: HttpTestingController) => { - const dueTime = DateTime.parseISO_UTC('2016-12-12T10:10'); + const dueTime = '2016-12-12T10:10:00'; - contentsService.changeContentStatus('my-app', 'my-schema', 'content1', 'publish', version, dueTime).subscribe(); + contentsService.changeContentStatus('my-app', 'my-schema', 'content1', 'publish', dueTime, version).subscribe(); - const req = httpMock.expectOne('http://service/p/api/content/my-app/my-schema/content1/publish?dueTime=2016-12-12T10:10:00.000Z'); + const req = httpMock.expectOne('http://service/p/api/content/my-app/my-schema/content1/publish?dueTime=2016-12-12T10:10:00'); expect(req.request.method).toEqual('PUT'); expect(req.request.headers.get('If-Match')).toEqual(version.value); diff --git a/src/Squidex/app/shared/services/contents.service.ts b/src/Squidex/app/shared/services/contents.service.ts index 3b87d6874..966c90414 100644 --- a/src/Squidex/app/shared/services/contents.service.ts +++ b/src/Squidex/app/shared/services/contents.service.ts @@ -59,7 +59,7 @@ export class ContentDto { this.version); } - public changeStatus(status: string, user: string, version: Version, now?: DateTime, dueTime: DateTime | null = null): ContentDto { + public changeStatus(status: string, dueTime: DateTime | null, user: string, version: Version, now?: DateTime): ContentDto { if (dueTime) { return new ContentDto( this.id, @@ -249,11 +249,11 @@ export class ContentsService { .pretifyError('Failed to delete content. Please reload.'); } - public changeContentStatus(appName: string, schemaName: string, id: string, action: string, version: Version, dueTime?: DateTime): Observable> { + public changeContentStatus(appName: string, schemaName: string, id: string, action: string, dueTime: string | null, version: Version): Observable> { let url = this.apiUrl.buildUrl(`/api/content/${appName}/${schemaName}/${id}/${action}`); if (dueTime) { - url += `?dueTime=${dueTime.toISOString()}`; + url += `?dueTime=${dueTime}`; } return HTTP.putVersioned(this.http, url, {}, version) diff --git a/src/Squidex/app/theme/_bootstrap.scss b/src/Squidex/app/theme/_bootstrap.scss index c22e92ab3..b7993ea66 100644 --- a/src/Squidex/app/theme/_bootstrap.scss +++ b/src/Squidex/app/theme/_bootstrap.scss @@ -458,6 +458,12 @@ a { margin-top: 4.5rem; } } + + &-footer { + .clearfix { + width: 100%; + } + } } // diff --git a/src/Squidex/app/theme/_lists.scss b/src/Squidex/app/theme/_lists.scss index 717491867..754191386 100644 --- a/src/Squidex/app/theme/_lists.scss +++ b/src/Squidex/app/theme/_lists.scss @@ -27,6 +27,10 @@ } } + td { + border-top: 0; + } + thead { // Small font size for the table header, content is more important! th { diff --git a/src/Squidex/app/theme/_panels.scss b/src/Squidex/app/theme/_panels.scss index 33bb19aa0..b1b0b88d3 100644 --- a/src/Squidex/app/theme/_panels.scss +++ b/src/Squidex/app/theme/_panels.scss @@ -289,15 +289,24 @@ .grid-content { @include flex-grow(1); - margin: 0; - margin-top: .25rem; + padding-top: .5rem; + padding-bottom: .5rem; overflow-y: scroll; } .grid-header { - padding-top: .75 * $panel-padding; - border: 0; - border-bottom: 2px solid $color-border; + & { + border: 0; + border-bottom: 2px solid $color-border; + } + + th { + padding: .7rem; + } + + .table-items { + margin: 0; + } } .grid-footer { @@ -305,6 +314,6 @@ } .pagination { - margin-top: .25rem; + margin: .25rem 0; } } \ No newline at end of file diff --git a/src/Squidex/app/theme/_vars.scss b/src/Squidex/app/theme/_vars.scss index 9dd26ff4b..a4862968b 100644 --- a/src/Squidex/app/theme/_vars.scss +++ b/src/Squidex/app/theme/_vars.scss @@ -6,6 +6,7 @@ $color-border-dark: #b3bbbf; $color-title: #000; $color-text: #373a3c; $color-text-decent: #a9b2bb; +$color-tooltip: #1a2129; $color-input: #dbe4eb; $color-input-background: #fff; diff --git a/src/Squidex/app/theme/icomoon/demo-files/demo.css b/src/Squidex/app/theme/icomoon/demo-files/demo.css index 38755ccf3..1c4674f67 100644 --- a/src/Squidex/app/theme/icomoon/demo-files/demo.css +++ b/src/Squidex/app/theme/icomoon/demo-files/demo.css @@ -150,10 +150,10 @@ p { font-size: 32px; } .fs2 { - font-size: 28px; + font-size: 32px; } .fs3 { - font-size: 32px; + font-size: 28px; } .fs4 { font-size: 32px; diff --git a/src/Squidex/app/theme/icomoon/demo.html b/src/Squidex/app/theme/icomoon/demo.html index 78d96da2d..810b7602e 100644 --- a/src/Squidex/app/theme/icomoon/demo.html +++ b/src/Squidex/app/theme/icomoon/demo.html @@ -9,10 +9,26 @@
-

Font Name: icomoon (Glyphs: 83)

+

Font Name: icomoon (Glyphs: 85)

Grid Size: Unknown

+
+
+ + + + icon-circle +
+
+ + +
+
+ liga: + +
+
@@ -847,17 +863,17 @@
-

Grid Size: 14

+

Grid Size: 16

- + - icon-action-Slack + icon-clock
- - + +
liga: @@ -866,14 +882,14 @@
- + - icon-orleans + icon-bin2
- - + +
liga: @@ -882,30 +898,30 @@
- + - icon-document-lock + icon-earth
- - + +
liga: - +
- + - icon-document-unpublish + icon-elapsed
- - + +
liga: @@ -914,14 +930,14 @@
- + - icon-angle-down + icon-google
- - + +
liga: @@ -930,14 +946,14 @@
- + - icon-angle-left + icon-lock
- - + +
liga: @@ -946,14 +962,14 @@
- + - icon-angle-right + icon-microsoft
- - + +
liga: @@ -962,14 +978,14 @@
- + - icon-angle-up + icon-action-AzureQueue
- - + +
liga: @@ -978,14 +994,14 @@
- + - icon-api + icon-pause
- - + +
liga: @@ -994,14 +1010,14 @@
- + - icon-assets + icon-play
- - + +
liga: @@ -1010,14 +1026,14 @@
- + - icon-bug + icon-reset
- - + +
liga: @@ -1026,14 +1042,14 @@
- + - icon-caret-down + icon-settings2
- - + +
liga: @@ -1042,14 +1058,14 @@
- + - icon-caret-left + icon-timeout
- - + +
liga: @@ -1058,209 +1074,209 @@
- + - icon-caret-right + icon-unlocked
- - + +
liga:
-
+
+
+

Grid Size: 14

+
- + - icon-caret-up + icon-action-Slack
- - + +
liga:
-
+
- + - icon-contents + icon-orleans
- - + +
liga:
-
+
- + - icon-trigger-ContentChanged + icon-document-lock
- - + +
liga:
-
+
- + - icon-control-Date + icon-document-unpublish
- - + +
liga:
-
+
- + - icon-control-DateTime + icon-angle-down
- - + +
liga:
-
+
- + - icon-control-Markdown + icon-angle-left
- - + +
liga:
-
+
- + - icon-grid + icon-angle-right
- - + +
liga:
-
+
- + - icon-list + icon-angle-up
- - + +
liga:
-
+
- + - icon-user-o + icon-api
- - + +
liga:
-
+
- + - icon-rules + icon-assets
- - + +
liga:
-
+
- + - icon-action-Webhook + icon-bug
- - + +
liga:
-
-
-

Grid Size: 16

- + - icon-bin2 + icon-caret-down
- - + +
liga: @@ -1269,30 +1285,30 @@
- + - icon-earth + icon-caret-left
- - + +
liga: - +
- + - icon-elapsed + icon-caret-right
- - + +
liga: @@ -1301,14 +1317,14 @@
- + - icon-google + icon-caret-up
- - + +
liga: @@ -1317,14 +1333,14 @@
- + - icon-lock + icon-contents
- - + +
liga: @@ -1333,14 +1349,14 @@
- + - icon-microsoft + icon-trigger-ContentChanged
- - + +
liga: @@ -1349,14 +1365,14 @@
- + - icon-action-AzureQueue + icon-control-Date
- - + +
liga: @@ -1365,14 +1381,14 @@
- + - icon-pause + icon-control-DateTime
- - + +
liga: @@ -1381,14 +1397,14 @@
- + - icon-play + icon-control-Markdown
- - + +
liga: @@ -1397,14 +1413,14 @@
- + - icon-reset + icon-grid
- - + +
liga: @@ -1413,14 +1429,14 @@
- + - icon-settings2 + icon-list
- - + +
liga: @@ -1429,14 +1445,14 @@
- + - icon-timeout + icon-user-o
- - + +
liga: @@ -1445,14 +1461,30 @@
- + - icon-unlocked + icon-rules
- - + + +
+
+ liga: + +
+
+
+
+ + + + icon-action-Webhook +
+
+ +
liga: diff --git a/src/Squidex/app/theme/icomoon/fonts/icomoon.eot b/src/Squidex/app/theme/icomoon/fonts/icomoon.eot index c3b9462c50274c8fdad142ce201e6e366f870ec5..e8abe5415815252076e027ac437dcffc7cd7d46c 100644 GIT binary patch delta 431 zcmeyenQ_53MmB|L28NobiEL)f{d+_v+E)nfVqjp{1H=i*xrqh0b#9%WctWOL*7u+t z0|Vm(28NIg8L5dWg3H+UGcbfX0M(gg00lUiSfhaa3Lsx4Be$f&mfXaO0)_%cp!$d{K)ym=Vs7e8FV5dU{uQA5wu1cP5(Z|F(x@1a zJOeW` zU`Rui0^J6;P8!G&VdrCHXH%YB;3vYw!T{7O!Nhm~XpJ}{!{)M}aAs+dJ^k_gHeVUI zSwNm)xVHGAJdB?FBGjBQaXK8k;mDv_!NbKz1-hGDa|nfs`^ZO@0_D KyxBiuDI)*{O?B=7 delta 260 zcmZ3mjq%H7Mz$}J3=9F06WPp|T^(0Vw674{$-uy{2Z$4ra}x`0Yu!3J@q|phUyMf+ z0|Vm(28Q4X8L5dWf|FjSGcbfI0M(gg00lUiSR;UZAZAd>$StXG_$T-r$gctFiOI=N zPV|nAyTrf{b^|ECAvdw2fFX}Dih&`#1ISm%OUzB3>BadQ$X@|e-&T-cT*AN%lwpW8 z0Le2jGcz8WoWj`6=s)=bqcUrkfH!~dW(lUmfXy?5LztykIl9L4+k9o1A&1tdzo diff --git a/src/Squidex/app/theme/icomoon/fonts/icomoon.svg b/src/Squidex/app/theme/icomoon/fonts/icomoon.svg index e3075362d..313a70455 100644 --- a/src/Squidex/app/theme/icomoon/fonts/icomoon.svg +++ b/src/Squidex/app/theme/icomoon/fonts/icomoon.svg @@ -87,6 +87,8 @@ + + diff --git a/src/Squidex/app/theme/icomoon/fonts/icomoon.ttf b/src/Squidex/app/theme/icomoon/fonts/icomoon.ttf index d71543c96b753da153ff1f74125fe0119087cd34..d4f4fe27a0e8fc54a1f482f3a888412d5fbe5b4e 100644 GIT binary patch delta 458 zcmcbxiSf@C#(D-u1_lOhh6V;^1_S?KeItG$-d#YEJwTk0oSRs1Tj$nk1_nkMAU`KP zvA6(83jp~YK$;^xr!q~}_n;k+KY@WEWJ5-3Vv680w*3qYVGclfvkagBClhNFkY54h zt7PPsRCxRod=BK#0qRM~$xn7nEScX?!oUy#lxNtIn^;l6P{0V(5U~ZwSIA4uO`Yk* z`5VZ;0@Tn}kY8K^bSMx+#en1)n3<1HJkZS;IN66$nYBm2m%o2=31eb_1W?WY11t>8 z2N+lx6d7z87*y2-jYY+oC$IOFo*d>Z!^SlEa>LrUlOM8)D`W+@x@F1%L8hB)022H1 zB}VC|>zF1_-W?=q(10NgRSI+#+%9P#M}(b^k)2I>@}gStyhU#A3qQmN0MlxE8~^|S delta 285 zcmeyfh4I2B#(D-u1_lOhh6V;^1_S?KeItG$-km^^JwTk0oSRs1TkFvRT&Pz9j8Sq4ymlZiC~$OmEu zm5khy3WtA!&w>0Jpq`kV{A9;O@7TCY3=Cm6fC@I`CRP+MQnO`Yk* z`5VYz0o2e|kY8K^bSMx+8i3>(n3<1FJkZVPKiP*-nYBy6o4@uI=4=z zCl-Umt^oNQP%Mz1Q<(-7yTiZ`vH^r;eGl4Yq$Z{?Fog90)tG^>;4-%T89+gx*byLK z1%x@7Sfes>ODce3FM#@i>KRi!{s}(M$xjBV^Na8SD%t|VCG$H0LU16j<>$0zeJb~6S}p24Wh+9Tl0-@o|) zV`6{=Q1br)76#@646F=_47Lmms_KHqqTE;@M#J+rqQTpjRrpX!_-Epy5S+Q~58bE+x|7pO`0@V(5Gu(b@AV-9qkCB~C zd9tI0hztt@vKh#1#seVdFfweG3kqkJ7TMDu&u{aUftv;BPX>l-iyz9v=*bg8%^4#% gp9qa$oGcN(oxe$AlV*gLh*ktR#v?c13O~dM0NIa*Bme*a delta 341 zcmX@Hm2u8yMv-!VH#Y`G1|W!>!@v!u114{b5}&9oQol1fH?e?$fiVLpoCCtQwQe0v zPb>zBT>cmfFf#dtJjq$Z{?Foc5inSrq2q}S;gKtZ6`5+Gj% zggKd5BQkPJDu7}qfcj%V*x{ex^PK!-pgO;BkfIGB>>V3-DL1hKXmL2mVg)eHV~om6 z%uNM~eF1801L2uooWBe5i%WpMse!9w2C|r$k4@%b>}K?zJcCi0wM)R8zjyNi#>9Zl zj=>?!(yJU@