sanitas-ui-design-system 1.1.2 → 1.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/Button.css +1 -1
- package/dist/styles/index.css +1 -1
- package/package.json +1 -5
package/dist/assets/Button.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.button{--btn-overlay-hover: .1;--btn-overlay-active: .15;--btn-disabled-opacity: .5;--btn-spinner-size: 1em;font-family:var(--font-family);font-weight:var(--font-weight-medium);border:2px solid transparent;border-radius:var(--radius-3xl);cursor:pointer;transition:background-color var(--transition-base),color var(--transition-base),border-color var(--transition-base),box-shadow var(--transition-base),transform var(--transition-base);display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);text-decoration:none;outline:none;position:relative;will-change:background-color,color,border-color}.button:focus-visible{outline:2px solid var(--celeste);outline-offset:2px}.button:disabled{opacity:var(--btn-disabled-opacity);cursor:not-allowed;pointer-events:none}.isPrimary{background-color:var(--azul);color:var(--blanco);border:2px solid var(--azul)}.isPrimary:hover:not(:disabled){background-color:var(--blanco);color:var(--azul)}.isPrimary:active:not(:disabled){background-color:var(--gray-lighter)}.isSecondary{background-color:var(--celeste);color:var(--blanco);border:2px solid var(--celeste)}.isSecondary:hover:not(:disabled){background-color:var(--blanco);color:var(--celeste)}.isSecondary:active:not(:disabled){background-color:var(--gray-lighter)}.isSuccess{background-color:var(--verde);color:var(--blanco);border:2px solid var(--verde)}.isSuccess:hover:not(:disabled){background-color:var(--blanco);color:var(--verde)}.isSuccess:active:not(:disabled){background-color:var(--gray-lighter)}.isDanger{background-color:var(--rojo);color:var(--blanco);border:2px solid var(--rojo)}.isDanger:hover:not(:disabled){background-color:var(--blanco);color:var(--rojo)}.isDanger:active:not(:disabled){background-color:var(--gray-lighter)}.isOutline{background-color:transparent;color:var(--azul);border:2px solid var(--azul)}.isOutline:hover:not(:disabled){background-color:var(--azul);color:var(--blanco)}.isOutline:active:not(:disabled){background-color:var(--hover-btn);border-color:var(--hover-btn)}.isGhost{background-color:transparent;color:var(--azul)}.isGhost:hover:not(:disabled){background-color:rgba(0,47,135,var(--btn-overlay-hover))}.isGhost:active:not(:disabled){background-color:rgba(0,47,135,var(--btn-overlay-active))}.isWhite{background-color:var(--blanco);color:var(--azul);border:2px solid var(--blanco)}.isWhite:hover:not(:disabled){background-color:var(--gray-light);box-shadow:var(--shadow-md)}.isWhite:active:not(:disabled){background-color:var(--gray-lighter);box-shadow:var(--shadow-sm)}.isIcon{background-color:transparent;color:var(--azul);padding:var(--spacing-2);min-height:auto;display:inline-flex;align-items:center;gap:var(--spacing-2)}.isIcon:hover:not(:disabled){background-color:rgba(0,47,135,calc(var(--btn-overlay-hover) / 2))}.isStatic{padding:var(--spacing-0) var(--spacing-8);background-color:var(--celeste);color:var(--blanco);border:2px solid var(--celeste);cursor:pointer;min-height:40px}.isStatic:hover:not(:disabled){background-color:var(--blanco);color:var(--celeste)}.isStatic:active:not(:disabled){background-color:var(--gray-lighter)}.isSmall{padding:var(--spacing-1) var(--spacing-3);font-size:var(--font-size-sm);min-height:32px}.isMedium{padding:var(--spacing-2) var(--spacing-4);font-size:var(--font-size-base);min-height:40px}.isLarge{padding:var(--spacing-3) var(--spacing-6);font-size:var(--font-size-lg);min-height:48px}.isFullWidth{width:100%}.isLoading{position:relative;color:transparent;pointer-events:none}.isLoading:after{content:"";position:absolute;width:var(--btn-spinner-size);height:var(--btn-spinner-size);top:50%;left:50%;margin-left:calc(var(--btn-spinner-size) / -2);margin-top:calc(var(--btn-spinner-size) / -2);border:2px solid currentColor;border-radius:50%;border-top-color:transparent;animation:button-spin .6s linear infinite;will-change:transform}@keyframes button-spin{to{transform:rotate(360deg)}}.buttonIcon{display:inline-flex;align-items:center;justify-content:center}.isRounded-none{border-radius:var(--radius-none)}.isRounded-sm{border-radius:var(--radius-sm)}.isRounded-base{border-radius:var(--radius-base)}.isRounded-md{border-radius:var(--radius-md)}.isRounded-lg{border-radius:var(--radius-lg)}.isRounded-xl{border-radius:var(--radius-xl)}.isRounded-2xl{border-radius:var(--radius-2xl)}.isRounded-3xl{border-radius:var(--radius-3xl)}.isRounded-full{border-radius:var(--radius-full)}@media screen and (max-width:479px){.isStatic{display:none}}
|
|
1
|
+
.button{--btn-overlay-hover: .1;--btn-overlay-active: .15;--btn-disabled-opacity: .5;--btn-spinner-size: 1em;font-family:var(--font-family);font-weight:var(--font-weight-medium);border:2px solid transparent;border-radius:var(--radius-3xl);cursor:pointer;transition:background-color var(--transition-base),color var(--transition-base),border-color var(--transition-base),box-shadow var(--transition-base),transform var(--transition-base);display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);text-decoration:none;outline:none;position:relative;will-change:background-color,color,border-color}.button:focus-visible{outline:2px solid var(--celeste);outline-offset:2px}.button:disabled{opacity:var(--btn-disabled-opacity);cursor:not-allowed;pointer-events:none}.isPrimary{background-color:var(--azul);color:var(--blanco);border:2px solid var(--azul)}.isPrimary:hover:not(:disabled){background-color:var(--blanco);color:var(--azul)}.isPrimary:active:not(:disabled){background-color:var(--gray-lighter)}.isSecondary{background-color:var(--celeste);color:var(--blanco);border:2px solid var(--celeste)}.isSecondary:hover:not(:disabled){background-color:var(--blanco);color:var(--celeste)}.isSecondary:active:not(:disabled){background-color:var(--gray-lighter)}.isSuccess{background-color:var(--verde);color:var(--blanco);border:2px solid var(--verde)}.isSuccess:hover:not(:disabled){background-color:var(--blanco);color:var(--verde)}.isSuccess:active:not(:disabled){background-color:var(--gray-lighter)}.isDanger{background-color:var(--rojo);color:var(--blanco);border:2px solid var(--rojo)}.isDanger:hover:not(:disabled){background-color:var(--blanco);color:var(--rojo)}.isDanger:active:not(:disabled){background-color:var(--gray-lighter)}.isOutline{background-color:transparent;color:var(--azul);border:2px solid var(--azul)}.isOutline:hover:not(:disabled){background-color:var(--azul);color:var(--blanco)}.isOutline:active:not(:disabled){background-color:var(--hover-btn);border-color:var(--hover-btn)}.isGhost{background-color:transparent;color:var(--azul)}.isGhost:hover:not(:disabled){background-color:rgba(0,47,135,var(--btn-overlay-hover))}.isGhost:active:not(:disabled){background-color:rgba(0,47,135,var(--btn-overlay-active))}.isWhite{background-color:var(--blanco);color:var(--azul);border:2px solid var(--blanco)}.isWhite:hover:not(:disabled){background-color:var(--gray-light);box-shadow:var(--shadow-md)}.isWhite:active:not(:disabled){background-color:var(--gray-lighter);box-shadow:var(--shadow-sm)}.isIcon{background-color:transparent;color:var(--azul);padding:var(--spacing-2);min-height:auto;display:inline-flex;align-items:center;gap:var(--spacing-2)}.isIcon:hover:not(:disabled){background-color:rgba(0,47,135,calc(var(--btn-overlay-hover) / 2))}.isStatic{padding:var(--spacing-0) var(--spacing-8)!important;background-color:var(--celeste);color:var(--blanco);border:2px solid var(--celeste);cursor:pointer;min-height:40px}.isStatic:hover:not(:disabled){background-color:var(--blanco);color:var(--celeste)}.isStatic:active:not(:disabled){background-color:var(--gray-lighter)}.isSmall{padding:var(--spacing-1) var(--spacing-3);font-size:var(--font-size-sm);min-height:32px}.isMedium{padding:var(--spacing-2) var(--spacing-4);font-size:var(--font-size-base);min-height:40px}.isLarge{padding:var(--spacing-3) var(--spacing-6);font-size:var(--font-size-lg);min-height:48px}.isFullWidth{width:100%}.isLoading{position:relative;color:transparent;pointer-events:none}.isLoading:after{content:"";position:absolute;width:var(--btn-spinner-size);height:var(--btn-spinner-size);top:50%;left:50%;margin-left:calc(var(--btn-spinner-size) / -2);margin-top:calc(var(--btn-spinner-size) / -2);border:2px solid currentColor;border-radius:50%;border-top-color:transparent;animation:button-spin .6s linear infinite;will-change:transform}@keyframes button-spin{to{transform:rotate(360deg)}}.buttonIcon{display:inline-flex;align-items:center;justify-content:center}.isRounded-none{border-radius:var(--radius-none)}.isRounded-sm{border-radius:var(--radius-sm)}.isRounded-base{border-radius:var(--radius-base)}.isRounded-md{border-radius:var(--radius-md)}.isRounded-lg{border-radius:var(--radius-lg)}.isRounded-xl{border-radius:var(--radius-xl)}.isRounded-2xl{border-radius:var(--radius-2xl)}.isRounded-3xl{border-radius:var(--radius-3xl)}.isRounded-full{border-radius:var(--radius-full)}@media screen and (max-width:479px){.isStatic{display:none}}
|