-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Component/creation-bouton #21
Conversation
src/stories/Button.stories.ts
Outdated
@@ -10,6 +10,7 @@ const meta = { | |||
tags: ['autodocs'], | |||
argTypes: { | |||
size: { control: 'select', options: ['small', 'medium', 'large'] }, | |||
type: { options: ['primary', 'seondary', 'destructive'] }, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
typo secondary
src/stories/Button.stories.ts
Outdated
@@ -10,6 +10,7 @@ const meta = { | |||
tags: ['autodocs'], | |||
argTypes: { | |||
size: { control: 'select', options: ['small', 'medium', 'large'] }, | |||
type: { options: ['primary', 'seondary', 'destructive'] }, | |||
backgroundColor: { control: 'color' }, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
supprimer background color et tous les arg qui sont encore dans la story mais pas ds le composant
src/stories/Button.vue
Outdated
</template> | ||
|
||
<script lang="ts" setup> | ||
<script lang="ts"setup> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remettre espace entre ts" et setup
src/stories/Button.vue
Outdated
*/ | ||
primary?: boolean, | ||
type ?: 'primary'| 'secondary' | 'destructive', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
espace en trop
src/stories/Button.vue
Outdated
/** | ||
* The label of the button | ||
*/ | ||
label: string, | ||
/** | ||
* primary or secondary button | ||
* type of the button |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
* type of the button | |
* button type* |
src/stories/button.css
Outdated
|
||
.storybook-button--secondary:hover { | ||
border: 2px solid var(--color-button-border-secondary-hover); | ||
box-shadow: 2px 4px 7px 2px rgb(from var(--color-button-shadow-primary) r g b / 30%); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
ne pas oublier de creer variable : -color-button-shadow-secondary
src/stories/button.css
Outdated
.storybook-button--destructive { | ||
background-color:var(--color-button-background-destructive); | ||
border: 1px solid var(--color-button-border-destructive); | ||
color: #FFF; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
variabiliser la color
src/stories/button.css
Outdated
background-color: var(--color-button-background-destructive); | ||
border-color: var(--color-button-background-destructive); | ||
box-shadow: 2px 4px 7px 2px var(--color-button-shadow-destructive); | ||
/*remplacer par des tokens de couleurs pour la shadow ou pas ?*/ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
enlever commentaire
src/tokens/colors.css
Outdated
--color-button-shadow-secondary-active: var(--color-navy-500); | ||
|
||
|
||
--color-button-text-destructive:#FFF; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
rempacer par white
No description provided.