Browse Source

Task/improve style of placeholder in entity logo component (#7572)

* Improve style

* Update changelog
pull/7573/head
Thomas Kaul 9 hours ago
committed by GitHub
parent
commit
1d948c3286
No known key found for this signature in database GPG Key ID: B5690EEEBB952194
  1. 1
      CHANGELOG.md
  2. 2
      libs/ui/src/lib/entity-logo/entity-logo.component.html
  3. 10
      libs/ui/src/lib/entity-logo/entity-logo.component.scss
  4. 13
      libs/ui/src/lib/entity-logo/entity-logo.component.stories.ts

1
CHANGELOG.md

@ -18,6 +18,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Improved the check for duplicates in the preview step of the import dividends dialog (regardless of the account)
- Extended the activities import to reuse an existing account of the user by name and currency
- Extended the activities import to resolve an ISIN to the symbol of the data provider
- Improved the style of the placeholder in the entity logo component
- Migrated the create, detail and edit account dialogs to dedicated routes
- Improved the language localization for German (`de`)

2
libs/ui/src/lib/entity-logo/entity-logo.component.html

@ -7,5 +7,5 @@
(error)="onError()"
/>
} @else if (hasPlaceholder) {
<div class="logo placeholder" [class.large]="size === 'large'"></div>
<div class="logo" [class.large]="size === 'large'"></div>
}

10
libs/ui/src/lib/entity-logo/entity-logo.component.scss

@ -11,15 +11,5 @@
height: 1.4rem;
width: 1.4rem;
}
&.placeholder {
border: 1px solid rgba(var(--dark-dividers));
}
}
}
:host-context(.theme-dark) {
.placeholder {
border-color: rgba(var(--light-dividers));
}
}

13
libs/ui/src/lib/entity-logo/entity-logo.component.stories.ts

@ -45,18 +45,17 @@ export const LogoByUrl: Story = {
}
};
export const Placeholder: Story = {
export const LogoOnError: Story = {
args: {
hasPlaceholder: true,
size: 'large'
size: 'large',
tooltip: 'Unknown',
url: 'https://unknown.ghostfol.io'
}
};
export const PlaceholderOnError: Story = {
export const Placeholder: Story = {
args: {
hasPlaceholder: true,
size: 'large',
tooltip: 'Unknown',
url: 'https://unknown.ghostfol.io'
size: 'large'
}
};

Loading…
Cancel
Save