diff --git a/src/app/app.config.ts b/src/app/app.config.ts index d2668a5..38ba88f 100644 --- a/src/app/app.config.ts +++ b/src/app/app.config.ts @@ -6,6 +6,7 @@ import { provideClientHydration, withEventReplay } from '@angular/platform-brows import { provideCharts, withDefaultRegisterables } from 'ng2-charts'; import { HTTP_INTERCEPTORS, provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'; import { AuthInterceptor } from './core/interceptors/auth.interceptor'; +import { MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field'; export const appConfig: ApplicationConfig = { providers: [ @@ -16,5 +17,6 @@ export const appConfig: ApplicationConfig = { provideHttpClient(withInterceptorsFromDi()), provideCharts(withDefaultRegisterables()), { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true }, + { provide: MAT_FORM_FIELD_DEFAULT_OPTIONS, useValue: { subscriptSizing: 'dynamic' } } ] }; diff --git a/src/app/carnet/application/application.component.scss b/src/app/carnet/application/application.component.scss index c0d0b55..5c09e32 100644 --- a/src/app/carnet/application/application.component.scss +++ b/src/app/carnet/application/application.component.scss @@ -11,6 +11,10 @@ background: none; box-shadow: none; + mat-card-content { + padding: inherit 0; + } + .loading-shade { position: absolute; top: 0; diff --git a/src/app/carnet/goods/goods.component.scss b/src/app/carnet/goods/goods.component.scss index 0cd65f3..c8bd7a0 100644 --- a/src/app/carnet/goods/goods.component.scss +++ b/src/app/carnet/goods/goods.component.scss @@ -1,8 +1,7 @@ .goods-container { - padding: 16px; .form-section { - margin-bottom: 1rem; + margin-bottom: 0.75rem; } .checkbox-group { @@ -29,14 +28,14 @@ display: flex; justify-content: space-between; align-items: center; - margin-bottom: 16px; + margin-bottom: 0.75rem; h3 { margin: 0; color: var(--mat-sys-primary); font-weight: 500; } - + .actions { display: flex; gap: 16px; @@ -58,9 +57,8 @@ } .table-container { - position: relative; - overflow-x: auto; - margin-bottom: 16px; + // position: relative; + // overflow-x: auto; .loading-shade { position: absolute; @@ -139,6 +137,7 @@ display: flex; gap: 16px; margin-bottom: 16px; + align-items: start; mat-form-field { flex: 1; @@ -164,6 +163,6 @@ .form-actions { display: flex; justify-content: flex-end; - margin-top: 24px; + margin-top: 0.9rem; } } \ No newline at end of file diff --git a/src/app/carnet/goods/goods.component.ts b/src/app/carnet/goods/goods.component.ts index 7eff47c..0da5680 100644 --- a/src/app/carnet/goods/goods.component.ts +++ b/src/app/carnet/goods/goods.component.ts @@ -186,6 +186,7 @@ export class GoodsComponent { weight: 0, value: 0 }); + this.itemForm.markAsUntouched(); } // Edit existing item diff --git a/src/app/carnet/shipping/shipping.component.html b/src/app/carnet/shipping/shipping.component.html index edd359a..71e0b89 100644 --- a/src/app/carnet/shipping/shipping.component.html +++ b/src/app/carnet/shipping/shipping.component.html @@ -49,7 +49,7 @@ Company Name - Address is required + Company name is required Maximum 100 characters allowed diff --git a/src/app/carnet/shipping/shipping.component.scss b/src/app/carnet/shipping/shipping.component.scss index eaa0059..d86f7f9 100644 --- a/src/app/carnet/shipping/shipping.component.scss +++ b/src/app/carnet/shipping/shipping.component.scss @@ -1,14 +1,14 @@ .shipping-container { - padding: 16px; + padding-top: 0.5rem; .section { - margin-bottom: 24px; + margin-bottom: 1rem; padding: 16px; border: 1px solid #e0e0e0; border-radius: 4px; h3 { - margin: 0px 0px 16px 0px; + margin: 0 0 0.9rem 0; color: var(--mat-sys-primary); font-weight: 500; } @@ -33,12 +33,14 @@ .radio-group { display: flex; gap: 16px; - margin-bottom: 16px; + margin-bottom: 0.9rem; } .form-row { display: flex; gap: 16px; + margin-bottom: 0.5rem; + align-items: start; mat-form-field { flex: 1; @@ -58,7 +60,7 @@ display: flex; justify-content: flex-end; gap: 16px; - margin-top: 16px; + margin-top: 0.9rem; } .presaved-address { @@ -66,6 +68,7 @@ display: flex; flex-direction: row; gap: 8px; + font-size: 0.875rem; p { margin: 0; diff --git a/src/app/carnet/shipping/shipping.component.ts b/src/app/carnet/shipping/shipping.component.ts index 8516478..21b40da 100644 --- a/src/app/carnet/shipping/shipping.component.ts +++ b/src/app/carnet/shipping/shipping.component.ts @@ -413,7 +413,7 @@ export class ShippingComponent { notes: shipping.contact?.notes, }) } - + this.shippingForm.markAsUntouched(); this.completed.emit(this.shippingForm.valid); } diff --git a/src/app/carnet/terms-conditions/terms-conditions.component.scss b/src/app/carnet/terms-conditions/terms-conditions.component.scss index 8263cb2..dcaa108 100644 --- a/src/app/carnet/terms-conditions/terms-conditions.component.scss +++ b/src/app/carnet/terms-conditions/terms-conditions.component.scss @@ -20,6 +20,7 @@ mat-card-header { flex: 1; overflow-y: auto; padding: 16px; + font-size: 0.875rem; h3 { color: var(--mat-sys-primary); diff --git a/src/app/carnet/travel-plan/travel-plan.component.scss b/src/app/carnet/travel-plan/travel-plan.component.scss index 7edc1cd..8a5ee13 100644 --- a/src/app/carnet/travel-plan/travel-plan.component.scss +++ b/src/app/carnet/travel-plan/travel-plan.component.scss @@ -8,6 +8,18 @@ // max-width: 300px; // } + + .form-row { + // display: flex; + // gap: 16px; + margin-bottom: 16px; + //align-items: start; + + // mat-form-field { + // flex: 1; + // } + } + .usa-entries { width: 300px; } @@ -32,7 +44,7 @@ h3 { margin: 0 0 16px 0; - font-size: 16px; + font-size: 0.875rem; font-weight: 500; } @@ -99,6 +111,7 @@ .totals-section { display: flex; gap: 24px; + font-size: 0.875rem; .total-item { display: flex; diff --git a/src/app/holder/contacts/contacts.component.scss b/src/app/holder/contacts/contacts.component.scss index 97921b4..36fc225 100644 --- a/src/app/holder/contacts/contacts.component.scss +++ b/src/app/holder/contacts/contacts.component.scss @@ -104,6 +104,7 @@ .form-row { display: flex; gap: 16px; + align-items: start; mat-form-field { flex: 1; @@ -155,7 +156,7 @@ .readonly-value { padding: 0.25rem; - font-size: 0.9375rem; + font-size: 0.875rem; display: flex; align-items: center; } diff --git a/src/app/holder/search/search-holder.component.scss b/src/app/holder/search/search-holder.component.scss index dabe4d5..3a2dbd5 100644 --- a/src/app/holder/search/search-holder.component.scss +++ b/src/app/holder/search/search-holder.component.scss @@ -1,5 +1,5 @@ .page-header { - margin: 0.5rem 0px; + margin: 0.5rem 0 0; color: var(--mat-sys-primary); font-weight: 500; } @@ -38,6 +38,7 @@ display: flex; justify-content: flex-end; gap: 0.5rem; + margin-top: 0.9rem; button { display: flex; @@ -63,6 +64,11 @@ justify-content: center; } + mat-slide-toggle { + transform: scale(0.8); + margin-left: -0.5rem; + } + .selected-holder { color: #28a745; font-weight: 500; diff --git a/src/app/user-settings/user-settings.component.scss b/src/app/user-settings/user-settings.component.scss index 74f0abe..67fce93 100644 --- a/src/app/user-settings/user-settings.component.scss +++ b/src/app/user-settings/user-settings.component.scss @@ -28,6 +28,7 @@ .label { padding-right: 1rem; padding-bottom: 2rem; + font-size: 0.875rem; } .control { diff --git a/src/styles.scss b/src/styles.scss index 0c11033..ec773ad 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -13,4 +13,28 @@ body { body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; +} + +:root { + + /*form field*/ + @include mat.form-field-overrides((container-text-size: 0.875rem, + container-text-line-height:1.7, // line height should be atleast 1.5 times text size + outlined-label-text-size:0.875rem)); + + /* stepper */ + @include mat.stepper-overrides((header-height:50px)); + + /* list */ + @include mat.list-overrides((list-item-label-text-size:0.875rem, + list-item-label-text-line-height:1.7, // line height should be atleast 1.5 times text size + )); + + /*select*/ + @include mat.select-overrides((trigger-text-size:0.875rem, + trigger-text-line-height:1.7, // line height should be atleast 1.5 times text size + )); + + /*select options*/ + --mat-option-label-text-size: 0.875rem; } \ No newline at end of file