From e6dca90f80241324579b7e1218b16eae274549c2 Mon Sep 17 00:00:00 2001 From: Mat Pellerin Date: Mon, 9 Oct 2023 15:16:55 +0200 Subject: [PATCH] [sc-7470]: add book a demo button in header (#1055) Also update left and right spaces on the layout to match the latest designs. --- .../account-home/account-home.component.scss | 4 +-- .../account-kbs/account-kbs.component.scss | 2 +- .../account-manage.component.scss | 2 +- .../account-nua/account-nua.component.scss | 2 +- .../nua-activity/nua-activity.component.scss | 2 +- .../account-users.component.scss | 2 +- .../src/app/activity/activity.component.scss | 2 +- .../knowledge-box-home.component.scss | 2 +- .../knowledge-box-keys.component.scss | 2 +- libs/common/common.babel | 31 +++++++++++++++++++ libs/common/src/assets/i18n/ca.json | 1 + libs/common/src/assets/i18n/de.json | 1 + libs/common/src/assets/i18n/en.json | 1 + libs/common/src/assets/i18n/es.json | 1 + libs/common/src/assets/i18n/fr.json | 1 + libs/common/src/assets/i18n/pt.json | 1 + libs/common/src/lib/base/base.module.ts | 3 +- libs/common/src/lib/base/css-variables.scss | 3 +- .../dashboard-layout.component.scss | 5 +-- .../src/lib/entities/entities.component.scss | 5 +-- .../resource-list.component.scss | 2 +- .../src/lib/search/search.component.scss | 2 +- .../src/lib/topbar/topbar.component.html | 14 +++++++++ .../common/src/lib/topbar/topbar.component.ts | 9 ++++-- libs/common/src/lib/topbar/topbar.module.ts | 2 ++ .../upload-data/upload-data.component.scss | 2 +- .../public/icons/glyphs-sprite.svg | 2 +- libs/sistema/assets/glyphs-sprite.svg | 2 +- libs/sistema/glyphs/help.svg | 4 +-- 29 files changed, 84 insertions(+), 28 deletions(-) diff --git a/apps/dashboard/src/app/account/account-home/account-home.component.scss b/apps/dashboard/src/app/account/account-home/account-home.component.scss index 5499a1b9c..86909ead4 100644 --- a/apps/dashboard/src/app/account/account-home/account-home.component.scss +++ b/apps/dashboard/src/app/account/account-home/account-home.component.scss @@ -1,8 +1,8 @@ @import 'variables'; .account-home { - max-width: calc(rhythm(90) * 2); - padding: 4.5vw var(--app-layout-margin-right); + max-width: calc(#{rhythm(90)} * 2); + padding: 4.5vw var(--app-layout-margin-right) 4.5vw var(--app-layout-margin-left); .container-row { display: flex; diff --git a/apps/dashboard/src/app/account/account-kbs/account-kbs.component.scss b/apps/dashboard/src/app/account/account-kbs/account-kbs.component.scss index e8c1491e9..1cbac7ef2 100644 --- a/apps/dashboard/src/app/account/account-kbs/account-kbs.component.scss +++ b/apps/dashboard/src/app/account/account-kbs/account-kbs.component.scss @@ -1,7 +1,7 @@ @import 'variables'; .account-kbs { - padding: 70px var(--app-layout-margin-right) 60px 5%; + padding: 70px var(--app-layout-margin-right) 60px var(--app-layout-margin-left); h2 { margin: 0 0 rhythm(1) 0; } diff --git a/apps/dashboard/src/app/account/account-manage/account-manage.component.scss b/apps/dashboard/src/app/account/account-manage/account-manage.component.scss index 4d86156ee..0e7cde1b6 100644 --- a/apps/dashboard/src/app/account/account-manage/account-manage.component.scss +++ b/apps/dashboard/src/app/account/account-manage/account-manage.component.scss @@ -1,7 +1,7 @@ @import 'variables'; .container { - padding: rhythm(9) var(--app-layout-margin-right) rhythm(8) 5%; + padding: rhythm(9) var(--app-layout-margin-right) rhythm(8) var(--app-layout-margin-left); } h1 { margin-bottom: rhythm(4); diff --git a/apps/dashboard/src/app/account/account-nua/account-nua.component.scss b/apps/dashboard/src/app/account/account-nua/account-nua.component.scss index 72aa0a22e..cd42eb9cf 100644 --- a/apps/dashboard/src/app/account/account-nua/account-nua.component.scss +++ b/apps/dashboard/src/app/account/account-nua/account-nua.component.scss @@ -1,7 +1,7 @@ @import 'variables'; .account-nua { - padding: 70px var(--app-layout-margin-right) 60px 5%; + padding: 70px var(--app-layout-margin-right) 60px var(--app-layout-margin-left); } h2 { diff --git a/apps/dashboard/src/app/account/account-nua/nua-activity/nua-activity.component.scss b/apps/dashboard/src/app/account/account-nua/nua-activity/nua-activity.component.scss index dbab479fe..f0b37d3b8 100644 --- a/apps/dashboard/src/app/account/account-nua/nua-activity/nua-activity.component.scss +++ b/apps/dashboard/src/app/account/account-nua/nua-activity/nua-activity.component.scss @@ -1,7 +1,7 @@ @import 'variables'; .nua-activity { - padding: 50px var(--app-layout-margin-right) 60px 5%; + padding: 50px var(--app-layout-margin-right) 60px var(--app-layout-margin-left); position: relative; min-height: 200px; } diff --git a/apps/dashboard/src/app/account/account-users/account-users.component.scss b/apps/dashboard/src/app/account/account-users/account-users.component.scss index af78b263b..d79c53ced 100644 --- a/apps/dashboard/src/app/account/account-users/account-users.component.scss +++ b/apps/dashboard/src/app/account/account-users/account-users.component.scss @@ -1,7 +1,7 @@ @import 'variables'; .account-users { - padding: 70px var(--app-layout-margin-right) 60px 5%; + padding: 70px var(--app-layout-margin-right) 60px var(--app-layout-margin-left); h2 { margin: 0 0 36px 0; font-weight: var(--stf-font-weight-bold); diff --git a/apps/dashboard/src/app/activity/activity.component.scss b/apps/dashboard/src/app/activity/activity.component.scss index e894742df..d266c3d70 100644 --- a/apps/dashboard/src/app/activity/activity.component.scss +++ b/apps/dashboard/src/app/activity/activity.component.scss @@ -1,7 +1,7 @@ @import 'variables'; .activity { - padding: rhythm(6) var(--app-layout-margin-right) rhythm(7) 5%; + padding: rhythm(6) var(--app-layout-margin-right) rhythm(7) var(--app-layout-margin-left); position: relative; min-height: 200px; } diff --git a/apps/dashboard/src/app/knowledge-box/knowledge-box-home/knowledge-box-home.component.scss b/apps/dashboard/src/app/knowledge-box/knowledge-box-home/knowledge-box-home.component.scss index 9fde26738..2e7230c7f 100644 --- a/apps/dashboard/src/app/knowledge-box/knowledge-box-home/knowledge-box-home.component.scss +++ b/apps/dashboard/src/app/knowledge-box/knowledge-box-home/knowledge-box-home.component.scss @@ -1,7 +1,7 @@ @import 'variables'; .knowledge-box-home { - padding: rhythm(6) var(--app-layout-margin-right); + padding: rhythm(6) var(--app-layout-margin-right) rhythm(6) var(--app-layout-margin-left); $flex-gap: rhythm(3); $width-right-column: rhythm(40) + rhythm(1); diff --git a/apps/dashboard/src/app/knowledge-box/knowledge-box-keys/knowledge-box-keys.component.scss b/apps/dashboard/src/app/knowledge-box/knowledge-box-keys/knowledge-box-keys.component.scss index 3fe739edf..0ac0956e6 100644 --- a/apps/dashboard/src/app/knowledge-box/knowledge-box-keys/knowledge-box-keys.component.scss +++ b/apps/dashboard/src/app/knowledge-box/knowledge-box-keys/knowledge-box-keys.component.scss @@ -1,7 +1,7 @@ @import 'variables'; .knowledge-box-keys { - padding: 70px var(--app-layout-margin-right); + padding: 70px var(--app-layout-margin-right) 70px var(--app-layout-margin-left); h2 { margin: 0 0 rhythm(0.25) 0; diff --git a/libs/common/common.babel b/libs/common/common.babel index d4fe59abb..687041b92 100644 --- a/libs/common/common.babel +++ b/libs/common/common.babel @@ -14194,6 +14194,37 @@ + + need-help-book-demo + + + + + ca-ES + false + + + de-DE + false + + + en-US + false + + + es-ES + false + + + fr-FR + false + + + pt-PT + false + + + ner-add-entity-dialog diff --git a/libs/common/src/assets/i18n/ca.json b/libs/common/src/assets/i18n/ca.json index e4cdc96f5..82ff5ec42 100644 --- a/libs/common/src/assets/i18n/ca.json +++ b/libs/common/src/assets/i18n/ca.json @@ -448,6 +448,7 @@ "modal.upload.queue_length": "Mida de la cua", "modal.upload.title": "Puja els teus fitxers", "modal.upload_folder": "Afegeix una carpeta", + "need-help-book-demo": "Necessitar ajuda? Reserva una demo!", "ner-add-entity-dialog.title": "Afegeix NER", "ner-family-dialog.family-color": "Color de la família NER", "ner-family-dialog.family-color-placeholder": "Color hexadecimal (#ffdd1a)", diff --git a/libs/common/src/assets/i18n/de.json b/libs/common/src/assets/i18n/de.json index 7897fb6d5..06fbdb13e 100644 --- a/libs/common/src/assets/i18n/de.json +++ b/libs/common/src/assets/i18n/de.json @@ -449,6 +449,7 @@ "modal.upload.queue_length": "Warteschlangenlänge", "modal.upload.title": "Laden Sie Ihre Dateien hoch", "modal.upload_folder": "Fügen Sie einen Ordner hinzu", + "need-help-book-demo": "Brauchen Sie Hilfe? Buchen Sie eine Demo!", "ner-add-entity-dialog.title": "NER hinzufügen", "ner-family-dialog.family-color": "Farbe der NER-Familie", "ner-family-dialog.family-color-placeholder": "Hexadezimale Farbe (#ffdd1a)", diff --git a/libs/common/src/assets/i18n/en.json b/libs/common/src/assets/i18n/en.json index f0dc5c55d..335d62465 100644 --- a/libs/common/src/assets/i18n/en.json +++ b/libs/common/src/assets/i18n/en.json @@ -449,6 +449,7 @@ "modal.upload.queue_length": "Queue length", "modal.upload.title": "Upload your files", "modal.upload_folder": "Add a folder", + "need-help-book-demo": "Need help? Book a demo!", "ner-add-entity-dialog.title": "Add NER", "ner-family-dialog.family-color": "NER family color", "ner-family-dialog.family-color-placeholder": "Hexadecimal color (#ffdd1a)", diff --git a/libs/common/src/assets/i18n/es.json b/libs/common/src/assets/i18n/es.json index a45344993..2779dc81f 100644 --- a/libs/common/src/assets/i18n/es.json +++ b/libs/common/src/assets/i18n/es.json @@ -448,6 +448,7 @@ "modal.upload.queue_length": "Tamaño de la cola", "modal.upload.title": "Sube tus ficheros", "modal.upload_folder": "Añade una carpeta", + "need-help-book-demo": "¿Necesitas ayuda? ¡Reserve una demo!", "ner-add-entity-dialog.title": "Añadir NER", "ner-family-dialog.family-color": "Color de la familia NER", "ner-family-dialog.family-color-placeholder": "Color hexadecimal (#ffdd1a)", diff --git a/libs/common/src/assets/i18n/fr.json b/libs/common/src/assets/i18n/fr.json index acfee03dc..156b96f68 100644 --- a/libs/common/src/assets/i18n/fr.json +++ b/libs/common/src/assets/i18n/fr.json @@ -449,6 +449,7 @@ "modal.upload.queue_length": "Longueur de la file d'attente", "modal.upload.title": "Téléchargez vos fichiers", "modal.upload_folder": "Ajouter un dossier", + "need-help-book-demo": "Besoin d'aide? Réservez une démo !", "ner-add-entity-dialog.title": "Ajouter NER", "ner-family-dialog.family-color": "Couleur de la famille NER", "ner-family-dialog.family-color-placeholder": "Couleur hexadécimale (#ffdd1a)", diff --git a/libs/common/src/assets/i18n/pt.json b/libs/common/src/assets/i18n/pt.json index 56e679c46..c7a253445 100644 --- a/libs/common/src/assets/i18n/pt.json +++ b/libs/common/src/assets/i18n/pt.json @@ -449,6 +449,7 @@ "modal.upload.queue_length": "Comprimento da fila", "modal.upload.title": "Carregue seus arquivos", "modal.upload_folder": "Adicionar uma pasta", + "need-help-book-demo": "Preciso de ajuda? Agende uma demo!", "ner-add-entity-dialog.title": "Adicionar NER", "ner-family-dialog.family-color": "Cor da família NER", "ner-family-dialog.family-color-placeholder": "Cor hexadecimal (#ffdd1a)", diff --git a/libs/common/src/lib/base/base.module.ts b/libs/common/src/lib/base/base.module.ts index 91588a7b5..40b006999 100644 --- a/libs/common/src/lib/base/base.module.ts +++ b/libs/common/src/lib/base/base.module.ts @@ -5,10 +5,11 @@ import { TopbarModule } from '../topbar'; import { DashboardLayoutComponent } from './dashboard-layout/dashboard-layout.component'; import { STFSidebarModule } from '../sidebar'; import { NavbarModule } from '../navbar'; +import { CommonModule } from '@angular/common'; @NgModule({ declarations: [BaseComponent, DashboardLayoutComponent], exports: [BaseComponent, DashboardLayoutComponent], - imports: [RouterModule, TopbarModule, STFSidebarModule, NavbarModule], + imports: [CommonModule, NavbarModule, RouterModule, STFSidebarModule, TopbarModule], }) export class BaseModule {} diff --git a/libs/common/src/lib/base/css-variables.scss b/libs/common/src/lib/base/css-variables.scss index 85b6606a1..801f88bc0 100644 --- a/libs/common/src/lib/base/css-variables.scss +++ b/libs/common/src/lib/base/css-variables.scss @@ -2,7 +2,8 @@ --app-min-width: 1024px; --app-background-color: var(--stf-gray-background); --app-topbar-height: 70px; - --app-layout-margin-right: 7.3vw; + --app-layout-margin-left: 6rem; + --app-layout-margin-right: 2rem; // z-index --app-zindex-topbar: 1000; diff --git a/libs/common/src/lib/base/dashboard-layout/dashboard-layout.component.scss b/libs/common/src/lib/base/dashboard-layout/dashboard-layout.component.scss index e8fac197e..fc7cb2c04 100644 --- a/libs/common/src/lib/base/dashboard-layout/dashboard-layout.component.scss +++ b/libs/common/src/lib/base/dashboard-layout/dashboard-layout.component.scss @@ -1,7 +1,4 @@ -:host > ::ng-deep app-account-kbs { - margin: 22px; - display: block; -} +@import 'apps/dashboard/src/variables'; stf-sidebar { top: var(--app-topbar-height) !important; diff --git a/libs/common/src/lib/entities/entities.component.scss b/libs/common/src/lib/entities/entities.component.scss index 254baac3d..020d7c8f8 100644 --- a/libs/common/src/lib/entities/entities.component.scss +++ b/libs/common/src/lib/entities/entities.component.scss @@ -2,7 +2,7 @@ $page-padding-top: rhythm(5); $page-padding-bottom: rhythm(8); -$page-padding-left: 5%; +$page-padding-left: var(--app-layout-margin-left); $header-height: rhythm(12); $header-margin-bottom: rhythm(5); $navbar-width: rhythm(7); @@ -95,7 +95,8 @@ $gap-family-selection: rhythm(7); transition: opacity $transition-hint; } } - &.selected-family, &:hover { + &.selected-family, + &:hover { .family-actions pa-button { opacity: 1; } diff --git a/libs/common/src/lib/resources/resource-list/resource-list.component.scss b/libs/common/src/lib/resources/resource-list/resource-list.component.scss index 3daca6799..bc8c07015 100644 --- a/libs/common/src/lib/resources/resource-list/resource-list.component.scss +++ b/libs/common/src/lib/resources/resource-list/resource-list.component.scss @@ -3,7 +3,7 @@ $table-breakpoint: 1400px; .resource-list { - padding: rhythm(5) var(--app-layout-margin-right) rhythm(8) 5%; + padding: rhythm(5) var(--app-layout-margin-right) rhythm(8) var(--app-layout-margin-left); position: relative; min-height: rhythm(24); } diff --git a/libs/common/src/lib/search/search.component.scss b/libs/common/src/lib/search/search.component.scss index 7fe6cc342..375d3ea70 100644 --- a/libs/common/src/lib/search/search.component.scss +++ b/libs/common/src/lib/search/search.component.scss @@ -1,7 +1,7 @@ @import 'variables'; .search-page { - padding: rhythm(5) var(--app-layout-margin-right) rhythm(8) 5%; + padding: rhythm(5) var(--app-layout-margin-right) rhythm(8) var(--app-layout-margin-left); .search-bar-section { display: flex; diff --git a/libs/common/src/lib/topbar/topbar.component.html b/libs/common/src/lib/topbar/topbar.component.html index f2661e6a5..34a5dcd6c 100644 --- a/libs/common/src/lib/topbar/topbar.component.html +++ b/libs/common/src/lib/topbar/topbar.component.html @@ -17,6 +17,20 @@ [alt]="!standalone ? 'Nuclia' : 'NucliaDB'" /> + + + {{ 'need-help-book-demo' | translate }} + + +
- + diff --git a/libs/sistema/assets/glyphs-sprite.svg b/libs/sistema/assets/glyphs-sprite.svg index 9202feb1d..a429af7cb 100644 --- a/libs/sistema/assets/glyphs-sprite.svg +++ b/libs/sistema/assets/glyphs-sprite.svg @@ -80,7 +80,7 @@ - + diff --git a/libs/sistema/glyphs/help.svg b/libs/sistema/glyphs/help.svg index dfe350ee7..5e2d9da31 100644 --- a/libs/sistema/glyphs/help.svg +++ b/libs/sistema/glyphs/help.svg @@ -1,5 +1,3 @@ - - - +