@layerfi/components 0.1.56 → 0.1.57

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2366,6 +2366,19 @@
2366
2366
  border-top: 1px solid var(--color-base-200);
2367
2367
  border-bottom: 1px solid var(--color-base-200);
2368
2368
  }
2369
+ .Layer__table .Layer__table-row--selected .Layer__table-cell:first-child {
2370
+ position: relative;
2371
+ }
2372
+ .Layer__table .Layer__table-row--selected .Layer__table-cell:first-child::after {
2373
+ content: "";
2374
+ display: block;
2375
+ position: absolute;
2376
+ height: 100%;
2377
+ top: 0;
2378
+ left: 0;
2379
+ width: 4px;
2380
+ background: var(--color-base-400);
2381
+ }
2369
2382
  .Layer__table .Layer__table-row {
2370
2383
  position: relative;
2371
2384
  height: var(--spacing-5xl);
@@ -4686,66 +4699,13 @@ tbody .Layer__table__empty-row:first-child {
4686
4699
  .Layer__chart-of-accounts__loader-container {
4687
4700
  padding: var(--spacing-2xl);
4688
4701
  }
4689
- .Layer__chart-of-accounts__table {
4690
- width: 100%;
4691
- border-collapse: collapse;
4692
- }
4693
- .Layer__chart-of-accounts__actions {
4694
- display: flex;
4695
- align-items: center;
4696
- gap: var(--spacing-sm);
4697
- }
4698
- .Layer__table-cell.Layer__coa__name,
4699
- .Layer__table-cell.Layer__coa__balance {
4700
- color: var(--color-base-800);
4701
- }
4702
- .Layer__table-header.Layer__coa__name {
4703
- padding-left: var(--spacing-xl);
4704
- }
4705
- .Layer__table-cell.Layer__coa__name {
4706
- width: calc(100% - 192px - 50%);
4707
- }
4708
- .Layer__table-cell.Layer__coa__type,
4709
- .Layer__table-cell.Layer__coa__subtype {
4710
- width: calc(100% - 192px - 75%);
4711
- }
4712
- .Layer__table-cell.Layer__coa__balance {
4713
- font-variation-settings: "wght" var(--font-weight-bold);
4714
- }
4715
- .Layer__chart-of-accounts__table .Layer__table-row--depth-0 .Layer__table-cell.Layer__coa__name {
4716
- font-variation-settings: "wght" var(--font-weight-bold);
4717
- }
4718
- .Layer__coa__balance {
4719
- text-align: right;
4720
- justify-content: flex-end;
4721
- }
4722
- .Layer__table-cell.Layer__coa__actions {
4723
- width: 160px;
4724
- }
4725
- .Layer__table-cell.Layer__coa__actions .Layer__table-cell-content {
4726
- display: flex;
4727
- justify-content: flex-end;
4728
- align-items: center;
4729
- padding-top: var(--spacing-3xs);
4730
- padding-bottom: var(--spacing-3xs);
4731
- padding-right: var(--spacing-xl);
4732
- gap: var(--spacing-xs);
4733
- }
4734
- .Layer__table-cell.Layer__coa__actions .Layer__table-cell-content > .Layer__btn {
4702
+ .Layer__coa__actions .Layer__btn {
4735
4703
  opacity: 0;
4736
4704
  visibility: hidden;
4737
4705
  transition: all 300ms ease-out;
4738
4706
  transform: scale(0.92);
4739
4707
  }
4740
- .Layer__table-cell.Layer__coa__actions .Layer__btn--icon-only {
4741
- width: 32px;
4742
- height: 32px;
4743
- min-height: 32px;
4744
- max-height: 32px;
4745
- padding: 0;
4746
- box-sizing: border-box;
4747
- }
4748
- .Layer__chart-of-accounts__table .Layer__table-row:hover .Layer__coa__actions .Layer__btn {
4708
+ .Layer__table-row:hover .Layer__coa__actions .Layer__btn {
4749
4709
  opacity: 1;
4750
4710
  visibility: visible;
4751
4711
  transform: scale(1);
@@ -4774,27 +4734,6 @@ tbody .Layer__table__empty-row:first-child {
4774
4734
  justify-content: flex-end;
4775
4735
  padding-top: var(--spacing-xl);
4776
4736
  }
4777
- .Layer__chart-of-accounts__table .Layer__table-row:not(.Layer__table-row--header) {
4778
- cursor: pointer;
4779
- }
4780
- .Layer__chart-of-accounts__table .Layer__table-row:not(.Layer__table-row--header):hover {
4781
- background-color: var(--color-base-50);
4782
- }
4783
- .Layer__table__expand-icon {
4784
- transition: transform 150ms ease-out;
4785
- color: var(--color-base-600);
4786
- margin-left: -15px;
4787
- padding: var(--spacing-sm);
4788
- }
4789
- .Layer__chart-of-accounts__table .Layer__table-row:not(.Layer__table-row--depth-0):not(.Layer__table-row--header) {
4790
- background-color: var(--color-base-50);
4791
- }
4792
- .Layer__chart-of-accounts__table .Layer__table-row:not(.Layer__table-row--depth-0):not(.Layer__table-row--header):hover {
4793
- background-color: var(--color-base-100);
4794
- }
4795
- .Layer__chart-of-accounts__table .Layer__table-row--collapsed .Layer__table__expand-icon {
4796
- transform: rotate(-90deg);
4797
- }
4798
4737
  .Layer__chart-of-accounts__form {
4799
4738
  display: flex;
4800
4739
  flex-direction: column;
@@ -4889,9 +4828,6 @@ tbody .Layer__table__empty-row:first-child {
4889
4828
  color: var(--color-base-800);
4890
4829
  }
4891
4830
  @container (max-width: 1024px) {
4892
- .Layer__table-cell.Layer__coa__actions .Layer__table-cell-content {
4893
- padding-right: var(--spacing-md);
4894
- }
4895
4831
  .Layer__chart-of-accounts__sidebar__header .actions {
4896
4832
  display: none;
4897
4833
  }
@@ -4903,27 +4839,10 @@ tbody .Layer__table__empty-row:first-child {
4903
4839
  .Layer__chart-of-accounts .Layer__mobile--hidden {
4904
4840
  display: none;
4905
4841
  }
4906
- .Layer__chart-of-accounts .Layer__desktop--hidden.Layer__table-header {
4907
- display: table-cell;
4908
- }
4909
- .Layer__chart-of-accounts .Layer__desktop--hidden.Layer__table-cell-content {
4910
- display: flex;
4911
- }
4912
- .Layer__chart-of-accounts .Layer__coa__type .Layer__table-cell-content {
4913
- display: flex;
4914
- flex-direction: column;
4915
- align-items: flex-start;
4916
- }
4917
- .Layer__chart-of-accounts .Layer__coa__type .Layer__table-cell-content.Layer__mobile--hidden {
4918
- display: none;
4919
- }
4920
- .Layer__chart-of-accounts .Layer__table-cell.Layer__coa__actions {
4921
- width: 64px;
4922
- }
4923
4842
  }
4924
4843
  @container (max-width: 760px) {
4925
- .Layer__table-cell.Layer__coa__actions {
4926
- width: 64px;
4844
+ .Layer__chart-of-accounts {
4845
+ overflow: auto;
4927
4846
  }
4928
4847
  .Layer__chart-of-accounts__row---mobile {
4929
4848
  visibility: visible;
@@ -7270,6 +7189,10 @@ header.Layer__profit-and-loss-detailed-charts__header--tablet {
7270
7189
  display: none;
7271
7190
  }
7272
7191
  }
7192
+ .Layer__accounting-overview-profit-and-loss-chart {
7193
+ width: 100%;
7194
+ box-sizing: border-box;
7195
+ }
7273
7196
  @container (max-width: 460px) {
7274
7197
  .Layer__component.Layer__accounting-overview-profit-and-loss .recharts-responsive-container {
7275
7198
  margin-top: -12px;