Error page

This commit is contained in:
Adina Țeudan 2021-08-24 00:12:29 +02:00
parent 9c845a9cd7
commit 951202a3fa
46 changed files with 83 additions and 268 deletions

View File

@ -1,2 +1,3 @@
<router-outlet></router-outlet>
<iqser-full-page-loading-indicator></iqser-full-page-loading-indicator>
<iqser-full-page-error></iqser-full-page-error>

View File

@ -1,9 +1,8 @@
@import '../../../assets/styles/variables';
@import '../../../assets/styles/red-mixins';
.dev-mode {
background-color: #dd4d50;
color: #fff;
background-color: $primary;
color: $white;
font-size: 22px;
line-height: 16px;
text-align: center;

View File

@ -1,4 +1,5 @@
@import '../../../assets/styles/red-mixins';
@import '../../../assets/styles/variables';
@import 'libs/common-ui/src/assets/styles/mixins';
.content-container {
background-color: $grey-2;

View File

@ -1,5 +1,5 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.sub-header {
display: flex;

View File

@ -1,6 +1,3 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
iqser-table-header::ng-deep .header-item {
padding-right: 16px;
}

View File

@ -1,6 +1,3 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
.right-container {
width: 353px;
min-width: 353px;

View File

@ -1,38 +1,34 @@
@import '../../../../../assets/styles/red-mixins';
.page-header .actions {
display: flex;
justify-content: flex-end;
}
.header-item {
padding: 0 24px 0 10px;
}
iqser-table-header::ng-deep .attributes-actions-container {
display: flex;
flex: 1;
justify-content: flex-end;
iqser-table-column-name::ng-deep {
> div {
padding-left: 10px !important;
> *:not(:last-child) {
margin-right: 10px;
}
}
.content-container {
cdk-virtual-scroll-viewport {
cdk-virtual-scroll-viewport {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 2fr 2fr 1fr 1fr 11px;
.table-item > div {
height: 50px;
&:not(.scrollbar-placeholder) {
padding-left: 10px;
}
}
}
&.has-scrollbar:hover {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 2fr 2fr 1fr 1fr 11px;
.table-item > div {
height: 50px;
&:not(.scrollbar-placeholder) {
padding-left: 10px;
}
}
}
&.has-scrollbar:hover {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 2fr 2fr 1fr 1fr;
}
grid-template-columns: auto 2fr 2fr 1fr 1fr;
}
}
}

View File

@ -1,40 +1,25 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
cdk-virtual-scroll-viewport {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 1fr 1fr 1fr 1fr 11px;
.header-item {
padding: 0 24px 0 10px;
}
.table-item {
> div:not(.scrollbar-placeholder) {
padding-left: 10px;
iqser-table-column-name::ng-deep {
> div {
padding-left: 10px !important;
}
}
.stats-subtitle {
margin-top: 4px;
}
.content-container {
cdk-virtual-scroll-viewport {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 1fr 1fr 1fr 1fr 11px;
.table-item {
> div:not(.scrollbar-placeholder) {
padding-left: 10px;
.stats-subtitle {
margin-top: 4px;
}
.table-item-title {
max-width: 100%;
}
.table-item-title {
max-width: 100%;
}
}
}
}
&.has-scrollbar:hover {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 1fr 1fr 1fr 1fr;
}
&.has-scrollbar:hover {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 1fr 1fr 1fr 1fr;
}
}
}

View File

@ -1,14 +1,10 @@
@import '../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.page-header .actions {
display: flex;
justify-content: flex-end;
}
iqser-table-header::ng-deep .header-item {
padding: 0 24px 0 10px;
}
.content-container cdk-virtual-scroll-viewport {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 2fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 11px;

View File

@ -1,5 +1,5 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.content-container {
background-color: $grey-2;

View File

@ -1,4 +1,4 @@
@import '../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
@import '../../../../../assets/styles/variables';
.content-container {

View File

@ -1,5 +1,5 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.page-header .actions {
display: flex;

View File

@ -1,5 +1,3 @@
@import '../../../../../assets/styles/red-mixins';
.editor-container {
width: 100%;
padding: 15px;

View File

@ -1,5 +1,4 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
.bulk-actions {
display: flex;
@ -10,12 +9,6 @@
}
}
iqser-table-column-name::ng-deep {
> div {
padding-left: 10px !important;
}
}
.content-container {
cdk-virtual-scroll-viewport {
::ng-deep.cdk-virtual-scroll-content-wrapper {

View File

@ -1,33 +1,21 @@
.content-container {
.header-item {
padding: 0 24px 0 10px;
}
cdk-virtual-scroll-viewport {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 2fr 1fr 1fr 1fr auto 11px;
iqser-table-column-name::ng-deep {
> div {
padding: 0 13px 0 10px !important;
}
}
.table-item {
> div:not(.scrollbar-placeholder) {
padding-left: 10px;
cdk-virtual-scroll-viewport {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 2fr 1fr 1fr 1fr auto 11px;
.table-item {
> div:not(.scrollbar-placeholder) {
padding-left: 10px;
&.center {
align-items: center;
}
&.center {
align-items: center;
}
}
}
}
&.has-scrollbar:hover {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 2fr 1fr 1fr 1fr auto;
}
&.has-scrollbar:hover {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 2fr 1fr 1fr 1fr auto;
}
}
}

View File

@ -1,5 +1,5 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
:host {
display: block;

View File

@ -1,6 +1,6 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-components';
@import '../../../../../assets/styles/red-text-styles';
@import 'libs/common-ui/src/assets/styles/texts';
:host {
@extend .stats-subtitle;

View File

@ -1,5 +1,5 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.read-only {
padding: 13px 16px;

View File

@ -1,5 +1,5 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
:host {
height: 100%;

View File

@ -1,4 +1,4 @@
@import '../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.search-container {
margin-top: 16px;

View File

@ -1,5 +1,5 @@
@import '../../../../../../assets/styles/variables';
@import '../../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.instructions {
color: $grey-7;

View File

@ -1,5 +1,5 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.dialog-content {
padding: 0;

View File

@ -1,4 +1,3 @@
@import '../../../../../assets/styles/red-mixins';
@import '../../../../../assets/styles/variables';
.content-container {

View File

@ -1,5 +1,4 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
:root {
--dynamic-columns: '1fr';
@ -9,16 +8,6 @@
display: none;
}
.header-item {
padding: 0 24px 0 10px;
}
iqser-table-column-name::ng-deep {
> div {
padding-left: 10px !important;
}
}
cdk-virtual-scroll-viewport {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 3fr 2fr repeat(var(--dynamic-columns, 1), 1fr) 2fr 1fr auto 11px;

View File

@ -1,5 +1,4 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
.vertical-line {
width: 1px;

View File

@ -1,4 +1,4 @@
@import 'apps/red-ui/src/assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
@import '../../../../../assets/styles/variables';
.content-container {

View File

@ -1,5 +1,4 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
:host {
width: 100%;

View File

@ -1,4 +1,4 @@
@import '../../../../../assets/styles/red-mixins';
@import '../../../../../assets/styles/variables';
.empty-state {
display: flex;

View File

@ -1,5 +1,5 @@
@import '../../../../../assets/styles/variables';
@import '../../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
:host {
display: block;

View File

@ -1,5 +1,5 @@
@import '../../../../assets/styles/variables';
@import '../../../../assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.red-upload-download-overlay {
background: $white;

View File

@ -846,6 +846,10 @@
"side-nav-title": "Configurations",
"unsaved-changes": "You have unsaved changes. Save or revert before changing the tab."
},
"error": {
"generic": "Oops! Something went wrong...",
"reload": "Reload"
},
"exact-date": "{day} {month} {year} at {hour}:{minute}",
"file": "File",
"file-attribute-types": {

View File

@ -1,14 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg height="20px" version="1.1" viewBox="0 0 20 20" width="20px"
xmlns="http://www.w3.org/2000/svg">
<!-- Generator: Sketch 49.1 (51147) - http://www.bohemiancoding.com/sketch -->
<defs></defs>
<g fill="none" fill-rule="evenodd" id="Upload" stroke="none" stroke-width="1">
<g fill="currentColor" id="Upload-Errors-01"
transform="translate(-1388.000000, -622.000000)">
<path
d="M1405.075,639.075 C1406.88516,637.26484 1408,634.761 1408,632 C1408,629.2398 1406.88516,626.7352 1405.075,624.925 C1403.26484,623.1148 1400.761,622 1398,622 C1395.2398,622 1392.7352,623.11484 1390.925,624.925 C1389.1148,626.73516 1388,629.239 1388,632 C1388,634.7602 1389.11484,637.2648 1390.925,639.075 C1392.73516,640.8852 1395.239,642 1398,642 C1400.7602,642 1403.2648,640.88516 1405.075,639.075 Z M1399.3532,635.8578 C1399.3532,635.10858 1398.75008,634.50468 1398.00008,634.50468 C1397.25086,634.50468 1396.62898,635.1078 1396.62898,635.8578 C1396.62898,636.60702 1397.25086,637.2289 1398.00008,637.2289 C1398.7493,637.2289 1399.3532,636.60702 1399.3532,635.8578 Z M1398.00008,633.1336 C1397.50632,633.1336 1397.1407,632.73126 1397.08602,632.21954 L1396.62898,628.14294 C1396.55554,627.42966 1397.30554,626.77184 1398.00008,626.77184 C1398.69462,626.77184 1399.44462,627.42966 1399.3532,628.14294 L1398.91414,632.21954 C1398.85945,632.73126 1398.49382,633.1336 1398.00008,633.1336 Z"
id="error_icon"></path>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -1,5 +1,5 @@
@import 'variables';
@import 'red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.mat-autocomplete-panel {
@include scroll-bar;

View File

@ -1,5 +1,5 @@
@import 'variables';
@import 'red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.breadcrumbs-container {
display: flex;

View File

@ -1,5 +1,5 @@
@import 'variables';
@import 'red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.oval,
.square {

View File

@ -1,5 +1,4 @@
@import 'variables';
@import 'red-mixins';
.changed-row-marker {
background: rgba($primary, 0.1);

View File

@ -1,5 +1,5 @@
@import 'variables';
@import 'red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.mat-menu-panel {
border-radius: 8px !important;

View File

@ -1,23 +0,0 @@
@import '../../../../../libs/common-ui/src/assets/styles/mixins';
@import 'variables';
@mixin line-clamp($lines) {
display: -webkit-box;
-webkit-line-clamp: $lines;
-webkit-box-orient: vertical;
overflow: hidden;
display: block;
@if $lines == 1 {
text-overflow: ellipsis;
white-space: nowrap;
}
}
@mixin inset-shadow {
box-shadow: inset 0 4px 3px -2px $grey-4;
}
@mixin drop-shadow {
box-shadow: 0 4px 3px 2px $grey-4;
}

View File

@ -1,5 +1,5 @@
@import 'variables';
@import 'red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
html,
body {

View File

@ -1,5 +1,5 @@
@import 'variables';
@import 'red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.mat-select-panel {
@include scroll-bar;

View File

@ -1,5 +1,5 @@
@import 'variables';
@import 'red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
.default-table {
border-collapse: collapse;

View File

@ -1,87 +0,0 @@
@import 'variables';
@import 'red-mixins';
a {
color: $primary;
transition: color 0.1s;
&:hover {
color: lighten($primary, 10%);
}
&.with-underline {
&:hover {
text-decoration: underline;
}
}
cursor: pointer;
}
pre {
font-family: Inter, sans-serif;
color: $accent;
}
.heading-xl {
font-size: 24px;
font-weight: 600;
line-height: 29px;
}
.info {
font-size: 13px;
line-height: 18px;
opacity: 0.7;
}
.page-title {
font-size: 13px;
font-weight: 600;
line-height: 18px;
text-align: center;
padding: 0 20px;
}
.small-label {
opacity: 0.7;
font-size: 11px;
line-height: 14px;
font-weight: initial;
}
.link-action {
font-size: 11px;
line-height: 14px;
text-decoration: underline;
cursor: pointer;
&:hover {
text-decoration: none;
}
}
.large-label {
color: $accent;
font-size: 13px;
line-height: 16px;
}
.clamp-1 {
@include line-clamp(1);
}
.clamp-2 {
@include line-clamp(2);
}
.text-overflow {
display: block !important;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.no-wrap {
white-space: nowrap;
}

View File

@ -2,7 +2,6 @@
@import '~ngx-toastr/toastr';
@import 'red-material-theme';
@import 'red-page-layout';
@import 'red-text-styles';
@import 'red-select';
@import 'red-autocomplete';
@import 'red-list';

View File

@ -21,7 +21,7 @@
"format:check": "nx format:check",
"format:write": "nx format:write",
"help": "nx help",
"i18n:extract": "ngx-translate-extract --input ./apps/red-ui/src --output apps/red-ui/src/assets/i18n/en.json --clean --sort --format namespaced-json && prettier apps/red-ui/src/assets/i18n/*.json --write",
"i18n:extract": "ngx-translate-extract --input ./apps/red-ui/src ./libs/common-ui/src --output apps/red-ui/src/assets/i18n/en.json --clean --sort --format namespaced-json && prettier apps/red-ui/src/assets/i18n/*.json --write",
"postinstall": "ngcc --properties es2015 browser module main",
"lint": "nx workspace-lint && nx lint",
"lint-fix": "nx workspace-lint --fix && nx lint --fix",

View File

@ -1,5 +1,5 @@
@import '../apps/red-ui/src/assets/styles/variables';
@import '../apps/red-ui/src/assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
@import 'mixin';
.site-sidebar {

View File

@ -1,5 +1,5 @@
@import '../apps/red-ui/src/assets/styles/variables';
@import '../apps/red-ui/src/assets/styles/red-mixins';
@import 'libs/common-ui/src/assets/styles/mixins';
@import 'fonts';
@import 'header';
@import 'homepage';