Skip to content
Snippets Groups Projects
Commit b72462c5 authored by OZGCloud's avatar OZGCloud
Browse files

OZG-7047 Add story for tooltip

parent 42e028f4
Branches
Tags
No related merge requests found
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
<a <a
href="#" href="#"
class="flex flex-col items-start justify-between gap-2 rounded-t-md border-primary-600/50 px-6 py-4 hover:bg-background-150 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus lg:flex-row lg:gap-6" class="flex flex-col items-start justify-between gap-2 rounded-t-md border-primary-600/50 px-6 py-4 hover:bg-background-150 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus lg:flex-row lg:gap-6"
[tooltip]="'This is tooltip attached to link element'" tooltip="This is tooltip attached to link element"
> >
<div class="flex-1 basis-5/6"> <div class="flex-1 basis-5/6">
<div class="flex flex-wrap items-center gap-x-3"> <div class="flex flex-wrap items-center gap-x-3">
...@@ -397,7 +397,7 @@ ...@@ -397,7 +397,7 @@
</form> </form>
<app-bescheid-dialog-button></app-bescheid-dialog-button> <app-bescheid-dialog-button></app-bescheid-dialog-button>
<div class="my-4 flex gap-4"> <div class="my-4 flex gap-4">
<ods-button text="Button 1" [tooltip]="'Sample tooltip'" /> <ods-button text="Button 1" tooltip="Sample tooltip" />
<ods-button size="medium" [isLoading]="true" text="Button 2" /> <ods-button size="medium" [isLoading]="true" text="Button 2" />
<ods-button type="outline" text="Button 3" /> <ods-button type="outline" text="Button 3" />
</div> </div>
......
import { moduleMetadata, type Meta, type StoryObj } from '@storybook/angular';
import { TooltipDirective } from './tooltip.directive';
const meta: Meta = {
title: 'Tooltip',
excludeStories: /.*Data$/,
tags: ['autodocs'],
decorators: [
moduleMetadata({
imports: [TooltipDirective],
}),
],
parameters: {
docs: {
description: {
component: 'Tooltip directive that can be used with every element (check out default story to see tooltip working).',
},
},
},
};
export default meta;
type Story = StoryObj;
export const Default: Story = {
render: () => ({
template: '<button tooltip="Hello">I have a tooltip!</button>',
}),
};
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment