quentin_duwa/qd-design
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

implement tooltip

Browse Source
This commit is contained in:
MastersGame
2026-01-31 20:31:35 +01:00
parent dc5e532769
commit b631df89ea
8 changed files with 553 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
projects/qd-design-demo/src/app/app.html
View File

@@ -1,5 +1,5 @@
<div class="horizontal">
<qd-button variant="elevated" [text]="'Play'" [iconName]="'play_arrow'" (click)="onClick()"></qd-button>
<qd-button variant="elevated" tooltip="tooltip" [text]="'Play'" [iconName]="'play_arrow'" (click)="onClick()"></qd-button>
<qd-button variant="elevated" [text]="'Play'" [iconName]="'play_arrow'" (click)="onClick()" [disabled]="true"></qd-button>
<qd-button variant="filled" [text]="'Play'" [iconName]="'play_arrow'" (click)="onClick()"></qd-button>
@@ -15,7 +15,7 @@
<qd-button variant="text" [text]="'Play'" [iconName]="'play_arrow'" (click)="onClick()" [disabled]="true"></qd-button>
</div>
<div class="horizontal">
<qd-card clickable style="width: 300px" (click)="onClick()">
<qd-card clickable tooltip="tooltip" style="width: 300px" (click)="onClick()">
<figure image class="image-wrapper">
<img [ngSrc]="'https://i0.wp.com/www.bishoprook.com/wp-content/uploads/2021/05/placeholder-image-gray-16x9-1.png?ssl=1'" fill alt="''"/>
</figure>

3
projects/qd-design-demo/src/app/app.ts
View File

@@ -3,10 +3,11 @@ import {QdButton} from '../../../qd-design/src/lib/qd-button/qd-button';
import {QdButtonType} from '../../../qd-design/src/enums/qd-button-type.enum';
import {QdCard} from '../../../qd-design/src/lib/qd-card/qd-card';
import {NgOptimizedImage} from '@angular/common';
import {QdTooltipDirective} from '../../../qd-design/src/directives/qd-tooltip-directive';
@Component({
selector: 'app-root',
imports: [QdButton, QdCard, NgOptimizedImage],
imports: [QdButton, QdCard, NgOptimizedImage, QdTooltipDirective],
templateUrl: './app.html',
styleUrl: './app.scss'
})