[ADF-4323] Add style fixes from ACA (#4546)

* [ADF-4323] add style fix for adf-search-sorting-picker

- moved from ACA

* [ADF-4323] use Flex Layout's media query mixin

* [ADF-4323] add style fix for adf-pagination

- moved from ACA

* [ADF-4323] add style fix for adf-version-manager

- which fixed issue [ACA-1750]

* [ADF-4323] remove not used property

* [ADF-4323] remove extra bottom-border

* [ADF-4323] upload-drag-area refactor to scss

* [ADF-4323] add style fix for adf file upload

- from ACA

* [ADF-4323] add style fix for adf-info-drawer

- from ACA

* [ADF-4323] add style fix for adf-toolbar

- from ACA

* [ADF-4323] add style fix for adf-sidenav-layout

- from ACA

* [ADF-4323] add style fix for adf-search-filter

- from ACA

* [ADF-4323] add style fix for adf-upload-drag-area

- from ACA

* [ADF-4323] add style fix for adf-info-drawer

- from ACA

* [ADF-4323] move style fix for adf-manage-versions from demo-shell

* [ADF-4323] use Flex Layout's media query mixin

* [ADF-4323] small fix to remove scrolling

* [ADF-4323] add adf-sidenav-layout host element class

* [ADF-4323] change 'inline' class name to 'adf-toolbar--inline'

- css lint was failing because of old naming

* [ADF-4323] set pagination empty state styling

* [ADF-4323] set pagination border to none
This commit is contained in:
Suzana Dirla
2019-04-05 16:05:21 +03:00
committed by Eugenio Romano
parent ec9d2785fa
commit e656cc6977
20 changed files with 311 additions and 147 deletions

View File

@@ -1,4 +1,3 @@
@mixin adf-upload-dialog-theme($theme) {
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
@@ -10,6 +9,7 @@
bottom: 20px;
width: 40%;
box-shadow: 1px 5px 15px #888888;
z-index: 999;
&--padding {
padding: 1em;

View File

@@ -1,4 +1,3 @@
@mixin adf-file-uploading-row-theme($theme) {
$background: map-get($theme, background);
$foreground: map-get($theme, foreground);
@@ -32,7 +31,7 @@
}
&__group, &__block {
min-width: 200px;
min-width: 100px;
display: flex;
justify-content: flex-end;
}
@@ -72,7 +71,7 @@
}
&__action--remove {
color: mat-color($accent);
color: mat-color($warn);
}
}
}

View File

@@ -1,15 +0,0 @@
adf-upload-drag-area {
overflow: hidden;
}
.adf-upload-border {
vertical-align: middle;
text-align: center;
width: 100%;
box-sizing: border-box;
}
.adf-file-draggable__input-focus {
color: #2196f3;
border: 1px dashed #2196f3;
}

View File

@@ -0,0 +1,88 @@
$adf-upload-dragging-color: #2196f3 !default;
$adf-upload-dragging-border: 1px dashed #2196f3 !default;
$adf-upload-dragging-background: #e3f2fd !default;
$adf-upload-dragging-level1-color: #2196f3 !default;
$adf-upload-dragging-level1-border: 1px dashed #2196f3 !default;
@mixin file-draggable__input-focus($text-color, $border) {
color: $text-color;
border: $border !important;
margin-left: 0 !important;
}
@mixin adf-upload-drag-area-theme($theme) {
adf-upload-drag-area {
@include flex-column;
.adf-upload-border {
@include flex-column;
vertical-align: unset;
text-align: unset;
width: 100%;
box-sizing: border-box;
}
.adf-file-draggable__input-focus {
color: $adf-upload-dragging-color;
border: $adf-upload-dragging-border;
adf-document-list {
background: $adf-upload-dragging-background;
adf-datatable > table {
background: inherit;
}
}
}
.adf-upload__dragging {
background: $adf-upload-dragging-background;
color: $adf-upload-dragging-color;
}
.adf-upload__dragging td {
border-top: $adf-upload-dragging-border !important;
border-bottom: $adf-upload-dragging-border !important;
&:first-child {
border-left: $adf-upload-dragging-border !important;
}
&:last-child {
border-right: $adf-upload-dragging-border !important;
}
}
&:first-child {
& > div {
adf-upload-drag-area {
.adf-file-draggable__input-focus {
@include file-draggable__input-focus(
$adf-upload-dragging-color,
$adf-upload-dragging-border
);
}
}
}
.adf-upload-border {
vertical-align: inherit !important;
text-align: inherit !important;
}
.adf-file-draggable__input-focus {
color: $adf-upload-dragging-level1-color !important;
border: $adf-upload-dragging-level1-border !important;
margin-left: 0 !important;
adf-upload-drag-area {
& > div {
@include file-draggable__input-focus(
$adf-upload-dragging-color,
$adf-upload-dragging-border
);
}
}
}
}
}
}

View File

@@ -25,7 +25,7 @@ import { UploadBase } from './base-upload/upload-base';
@Component({
selector: 'adf-upload-drag-area',
templateUrl: './upload-drag-area.component.html',
styleUrls: ['./upload-drag-area.component.css'],
styleUrls: ['./upload-drag-area.component.scss'],
host: { 'class': 'adf-upload-drag-area' },
viewProviders: [
{ provide: EXTENDIBLE_COMPONENT, useExisting: forwardRef(() => UploadDragAreaComponent) }