feat(progress): label & value font size adjusted with the selected size

This commit is contained in:
Junior Garcia 2023-03-30 23:31:50 -03:00
parent 564ec4ddef
commit 9157b08187
43 changed files with 285 additions and 110 deletions

View File

@ -1,5 +1,12 @@
# @nextui-org/accordion
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/accordion",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Collapse display a list of high-level options that can expand/collapse to reveal more information.",
"keywords": [
"react",

View File

@ -1,5 +1,12 @@
# @nextui-org/avatar
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/avatar",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "The Avatar component is used to represent a user, and displays the profile picture, initials or fallback icon.",
"keywords": [
"avatar"

View File

@ -1,5 +1,12 @@
# @nextui-org/badge
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/badge",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Badges are used as a small numerical value or status descriptor for UI elements.",
"keywords": [
"badge"

View File

@ -1,5 +1,14 @@
# @nextui-org/button
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
- @nextui-org/drip@0.0.0-dev-v2-20230331023043
- @nextui-org/spinner@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/button",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Buttons allow users to perform actions and choose with a single tap.",
"keywords": [
"button"

View File

@ -1,5 +1,13 @@
# @nextui-org/card
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
- @nextui-org/drip@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/card",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Card is a container for text, photos, and actions in the context of a single subject.",
"keywords": [
"card"

View File

@ -1,5 +1,12 @@
# @nextui-org/checkbox
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/checkbox",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Checkboxes allow users to select multiple items from a list of individual items, or to mark one individual item as selected.",
"keywords": [
"checkbox"

View File

@ -1,5 +1,12 @@
# @nextui-org/chip
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/chip",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Chips help people enter information, make selections, filter content, or trigger actions.",
"keywords": [
"chip"

View File

@ -1,5 +1,12 @@
# @nextui-org/code
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/code",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Code is a component used to display inline code.",
"keywords": [
"code"

View File

@ -1,5 +1,12 @@
# @nextui-org/drip
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/drip",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "A ripple effect for ensuring that the user fells the system is reacting instantaneously",
"keywords": [
"drip"

View File

@ -1,5 +1,12 @@
# @nextui-org/link
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/link",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Links allow users to click their way from page to page. This component is styled to resemble a hyperlink and semantically renders an <a>",
"keywords": [
"link"

View File

@ -1,5 +1,12 @@
# @nextui-org/pagination
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/pagination",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "The Pagination component allows you to display active page and navigate between multiple pages.",
"keywords": [
"pagination"

View File

@ -1,5 +1,12 @@
# @nextui-org/progress
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/progress",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Progress bars show either determinate or indeterminate progress of an operation over time.",
"keywords": [
"progress"

View File

@ -56,7 +56,11 @@ const IntervalTemplate: ComponentStory<typeof Progress> = (args: ProgressProps)
return () => clearInterval(interval);
}, []);
return <Progress {...args} value={value} />;
return (
<div className="max-w-[400px]">
<Progress {...args} value={value} />
</div>
);
};
export const Default = Template.bind({});

View File

@ -1,5 +1,12 @@
# @nextui-org/radio
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/radio",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Radios allow users to select a single option from a list of mutually exclusive options.",
"keywords": [
"radio"

View File

@ -1,5 +1,13 @@
# @nextui-org/snippet
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
- @nextui-org/tooltip@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/snippet",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Display a snippet of copyable code for the command line.",
"keywords": [
"snippet"

View File

@ -1,5 +1,12 @@
# @nextui-org/spinner
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/spinner",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Loaders express an unspecified wait time or display the length of a process.",
"keywords": [
"loading",

View File

@ -1,5 +1,12 @@
# @nextui-org/switch
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/switch",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "A switch is similar to a checkbox, but represents on/off values as opposed to selection.",
"keywords": [
"switch"

View File

@ -1,5 +1,12 @@
# @nextui-org/tooltip
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/tooltip",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "A React Component for rendering dynamically positioned Tooltips",
"keywords": [
"tooltip"

View File

@ -1,5 +1,13 @@
# @nextui-org/user
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
- @nextui-org/avatar@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/user",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "Flexible User Profile Component.",
"keywords": [
"user"

View File

@ -1,5 +1,30 @@
# @nextui-org/react
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Updated dependencies
- @nextui-org/theme@0.0.0-dev-v2-20230331023043
- @nextui-org/accordion@0.0.0-dev-v2-20230331023043
- @nextui-org/avatar@0.0.0-dev-v2-20230331023043
- @nextui-org/badge@0.0.0-dev-v2-20230331023043
- @nextui-org/button@0.0.0-dev-v2-20230331023043
- @nextui-org/card@0.0.0-dev-v2-20230331023043
- @nextui-org/checkbox@0.0.0-dev-v2-20230331023043
- @nextui-org/chip@0.0.0-dev-v2-20230331023043
- @nextui-org/code@0.0.0-dev-v2-20230331023043
- @nextui-org/drip@0.0.0-dev-v2-20230331023043
- @nextui-org/link@0.0.0-dev-v2-20230331023043
- @nextui-org/pagination@0.0.0-dev-v2-20230331023043
- @nextui-org/progress@0.0.0-dev-v2-20230331023043
- @nextui-org/radio@0.0.0-dev-v2-20230331023043
- @nextui-org/snippet@0.0.0-dev-v2-20230331023043
- @nextui-org/spinner@0.0.0-dev-v2-20230331023043
- @nextui-org/switch@0.0.0-dev-v2-20230331023043
- @nextui-org/tooltip@0.0.0-dev-v2-20230331023043
- @nextui-org/user@0.0.0-dev-v2-20230331023043
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/react",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "🚀 Beautiful and modern React UI library.",
"author": "Junior Garcia <jrgarciadev@gmail.com>",
"homepage": "https://nextui.org",

View File

@ -1,5 +1,11 @@
# @nextui-org/theme
## 0.0.0-dev-v2-20230331023043
### Patch Changes
- Progress label and value size changed
## 0.0.0-dev-v2-20230331020226
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@nextui-org/theme",
"version": "0.0.0-dev-v2-20230331020226",
"version": "0.0.0-dev-v2-20230331023043",
"description": "The default theme for NextUI components",
"keywords": [
"theme",

View File

@ -53,18 +53,28 @@ const progress = tv(
},
size: {
xs: {
label: "text-xs",
value: "text-xs",
track: "h-1",
},
sm: {
label: "text-sm",
value: "text-sm",
track: "h-2",
},
md: {
label: "text-base",
value: "text-base",
track: "h-4",
},
lg: {
label: "text-lg",
value: "text-lg",
track: "h-6",
},
xl: {
label: "text-lg",
value: "text-lg",
track: "h-7",
},
},

View File

@ -13,7 +13,7 @@ import {link, button} from "@nextui-org/theme";
<br />
<p className="text-md text-neutral-600 max-w-xl">
<p className="!text-base !text-foreground max-w-xl">
Here you can find the guidelines, components APIs and examples to help you build your next project
with NextUI. This version is still in development, so some components are not yet available. You
can follow the progress in the{" "}
@ -27,94 +27,95 @@ import {link, button} from "@nextui-org/theme";
.
</p>
<div className="flex flex-row justify-start items-center mt-8 gap-4">
<a
href="https://nextui.org"
target="_blank"
className={button({
color: "primary",
variant: "flat",
className: "gap-1",
})}
>
Website (v1)
<svg
aria-hidden="true"
className="flex text-current self-center"
fill="none"
height="1em"
shapeRendering="geometricPrecision"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
viewBox="0 0 24 24"
width="1em"
<div className="flex flex-col gap-8">
<div className="flex flex-row justify-start items-center mt-8 gap-4">
<a
href="https://nextui.org"
target="_blank"
className={button({
color: "primary",
variant: "flat",
className: "!text-primary gap-1 [&>svg]:fill-none",
})}
>
<path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6" />
<path d="M15 3h6v6" />
<path d="M10 14L21 3" />
</svg>
</a>
<a
href="https://github.com/nextui-org/nextui"
target="_blank"
className={button({
color: "neutral",
variant: "bordered",
className: "gap-1",
})}
>
Github
<svg
aria-hidden="true"
className="flex text-current self-center"
fill="none"
height="1em"
shapeRendering="geometricPrecision"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
viewBox="0 0 24 24"
width="1em"
Website (v1)
<svg
aria-hidden="true"
className="flex stroke-current self-center"
fill="none"
height="1em"
shapeRendering="geometricPrecision"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
viewBox="0 0 24 24"
width="1em"
>
<path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6" />
<path d="M15 3h6v6" />
<path d="M10 14L21 3" />
</svg>
</a>
<a
href="https://github.com/nextui-org/nextui"
target="_blank"
className={button({
color: "neutral",
variant: "bordered",
className: "!text-foreground gap-1 [&>svg]:fill-none",
})}
>
<path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6" />
<path d="M15 3h6v6" />
<path d="M10 14L21 3" />
</svg>
</a>
<a
href="https://discord.gg/9b6yyZKmH4"
target="_blank"
className={button({
color: "neutral",
variant: "bordered",
className: "gap-1",
})}
>
Discord
<svg
aria-hidden="true"
className="flex text-current self-center"
fill="none"
height="1em"
shapeRendering="geometricPrecision"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
viewBox="0 0 24 24"
width="1em"
Github
<svg
aria-hidden="true"
className="flex stroke-current self-center"
fill="none"
height="1em"
shapeRendering="geometricPrecision"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
viewBox="0 0 24 24"
width="1em"
>
<path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6" />
<path d="M15 3h6v6" />
<path d="M10 14L21 3" />
</svg>
</a>
<a
href="https://discord.gg/9b6yyZKmH4"
target="_blank"
className={button({
color: "neutral",
variant: "bordered",
className: "!text-foreground gap-1 [&>svg]:fill-none",
})}
>
<path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6" />
<path d="M15 3h6v6" />
<path d="M10 14L21 3" />
</svg>
</a>
</div>
Discord
<svg
aria-hidden="true"
className="flex stroke-current self-center"
fill="none"
height="1em"
shapeRendering="geometricPrecision"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
viewBox="0 0 24 24"
width="1em"
>
<path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6" />
<path d="M15 3h6v6" />
<path d="M10 14L21 3" />
</svg>
</a>
</div>
<div className="mt-8 flex items-center gap-2">
<div className="flex items-center gap-2">
<svg width="30" height="30" viewBox="0 0 374 374" >
<g transform="translate(-773 -353)">
<rect width="374" height="374" rx="99" transform="translate(773 353)" fill="currentColor"/>
@ -129,13 +130,11 @@ import {link, button} from "@nextui-org/theme";
>
<path fill="currentColor" d="M18.745 0v24.069h-2.139L2.386 3.914h-.188v20.155H0V0h2.127l14.267 20.179h.188V0zm13.256 24.445a7.934 7.934 0 01-4.371-1.181 7.79 7.79 0 01-2.85-3.279 11.069 11.069 0 01-1-4.836 11.2 11.2 0 011-4.848 8.1 8.1 0 012.785-3.326 7.175 7.175 0 014.119-1.2 7.689 7.689 0 012.832.535 7.042 7.042 0 012.45 1.634 7.836 7.836 0 011.722 2.756 11.015 11.015 0 01.635 3.931v1.034h-12.1V13.82h9.963a6.882 6.882 0 00-.7-3.132 5.55 5.55 0 00-1.939-2.2 5.11 5.11 0 00-2.862-.811 5.121 5.121 0 00-3.02.917 6.251 6.251 0 00-2.039 2.421 7.513 7.513 0 00-.746 3.291v1.1a8.822 8.822 0 00.746 3.755 5.751 5.751 0 002.124 2.487 5.9 5.9 0 003.255.881 5.873 5.873 0 002.251-.4 4.843 4.843 0 001.634-1.075 4.729 4.729 0 001-1.487l1.986.646a5.885 5.885 0 01-1.346 2.1 6.889 6.889 0 01-2.327 1.545 8.251 8.251 0 01-3.202.587zm12.74-18.428l4.654 7.7 4.654-7.7h2.433l-5.806 9.026 5.806 9.026H54.05l-4.654-7.451-4.655 7.451H42.32l5.735-9.026-5.735-9.026zm23.246 0v1.822h-8.615V6.017zm-5.923-4.325h2.1v17.664a3.414 3.414 0 00.388 1.769 2.159 2.159 0 001.011.9 3.363 3.363 0 001.328.264 4.045 4.045 0 00.705-.053q.294-.053.517-.112l.447 1.892a5.433 5.433 0 01-.752.217 5.162 5.162 0 01-1.1.1 5.1 5.1 0 01-2.215-.505 4.337 4.337 0 01-1.743-1.499 4.3 4.3 0 01-.682-2.48zM89.211 0h2.2v15.936a8.411 8.411 0 01-1.152 4.389 8.18 8.18 0 01-3.2 3.044 9.854 9.854 0 01-4.77 1.111 9.82 9.82 0 01-4.76-1.116 8.225 8.225 0 01-3.208-3.044 8.379 8.379 0 01-1.152-4.384V0h2.2v15.783a6.747 6.747 0 00.858 3.414 6.13 6.13 0 002.415 2.356 7.444 7.444 0 003.649.858 7.478 7.478 0 003.655-.858 6.08 6.08 0 002.413-2.353 6.784 6.784 0 00.852-3.414zM100 0v24.069h-2.2V0z" />
</svg>
</div>
</div>
<br/>
<br />
<div class="block text-xs text-neutral-400">
Last updated on <time datetime="2023-03-07">March 30, 2023</time>
</div>