@unifylib/ui-lib 1.0.3 → 1.1.3

package/src/lib/components/editable-base-table/editable-base-table.component.scss

@@ -1,44 +1,126 @@
-.baseTable {
-  padding: 20px;
-  //margin-inline: 8px;
-  //width: max-content;
-}
-.example-month-picker .mat-calendar-period-button {
-  pointer-events: none;
-}
-
-.example-month-picker .mat-calendar-arrow {
-  display: none;
-}
-
-::ng-deep .mdc-floating-label--required:not(.mdc-floating-label--hide-required-marker)::after {
-  content: ' *';
-  color: red !important; /* asterisk color */
-  margin-left: 2px;
-  font-size: 1.5em; /* increase size */
-  vertical-align: top; /* optional: aligns better with label */
-}
-
-::ng-deep .mdc-floating-label--required::after {
-  content: ' *';
-  color: red !important; /* asterisk color */
-  margin-left: 2px;
-  font-size: 1.5em; /* increase size */
-  vertical-align: top; /* optional: aligns better with label */
-}
-
-.responsive-top-gap {
-  margin-top: 20px;
-}
-
-@media (max-width: 959px) {
-  .responsive-top-gap {
-    margin-top: 1px;
-  }
-  .baseTable {
-    padding: 20px;
-    margin-inline: 8px;
-    width: max-content;
-  }
-
-}
+.baseTable {
+  padding: 20px;
+  //margin-inline: 8px;
+  //width: max-content;
+}
+.example-month-picker .mat-calendar-period-button {
+  pointer-events: none;
+}
+
+.example-month-picker .mat-calendar-arrow {
+  display: none;
+}
+
+.responsive-top-gap {
+  margin-top: 20px;
+}
+
+@media (max-width: 959px) {
+  .responsive-top-gap {
+    margin-top: 1px;
+  }
+  .baseTable {
+    padding: 20px;
+    margin-inline: 8px;
+    width: max-content;
+  }
+
+}
+
+.flex-row {
+  display: flex;
+  flex-direction: row;
+}
+
+.flex-column {
+  display: flex;
+  flex-direction: column;
+}
+
+.flex-half {
+  flex: 0 0 50%;
+}
+
+.flex-80 {
+  flex: 0 0 80%;
+}
+
+.flex-15 {
+  flex: 0 0 15%;
+}
+
+.flex-2 {
+  flex: 0 0 2%;
+}
+
+.flex-full {
+  flex: 0 0 100%;
+}
+
+.align-start-start {
+  justify-content: flex-start;
+  align-items: flex-start;
+}
+
+.align-start-end {
+  justify-content: flex-end;
+  align-items: flex-start;
+}
+
+.align-center-start {
+  justify-content: flex-start;
+  align-items: center;
+}
+
+.align-center-center {
+  justify-content: center;
+  align-items: center;
+}
+
+.align-end-start {
+  justify-content: flex-start;
+  align-items: flex-end;
+}
+
+.align-end-end {
+  justify-content: flex-end;
+  align-items: flex-end;
+}
+
+.gap-8 {
+  gap: 8px;
+}
+
+.gap-10 {
+  gap: 10px;
+}
+
+.gap-0 {
+  gap: 0px;
+}
+
+@media (max-width: 959px) {
+  .flex-column.lt-md {
+    flex-direction: column;
+  }
+
+  .flex-row.lt-md {
+    flex-direction: row;
+  }
+
+  .flex-full.lt-md {
+    flex: 0 0 100%;
+  }
+
+  .align-center-center.lt-md {
+    justify-content: center;
+    align-items: center;
+  }
+}
+
+@media (max-width: 599px) {
+  .flex-hide.gt-xs {
+    display: none !important;
+  }
+}
+

package/src/lib/components/editable-base-table/editable-base-table.component.spec.ts

@@ -1,25 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
-
-import {EditableBaseTableComponent} from './editable-base-table.component';
-
-describe('BaseTableComponent', () => {
-  let component: EditableBaseTableComponent;
-  let fixture: ComponentFixture<EditableBaseTableComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ EditableBaseTableComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(EditableBaseTableComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
+import {ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {EditableBaseTableComponent} from './editable-base-table.component';
+
+describe('BaseTableComponent', () => {
+  let component: EditableBaseTableComponent;
+  let fixture: ComponentFixture<EditableBaseTableComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ EditableBaseTableComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(EditableBaseTableComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});