@greghowe79/the-lib 1.8.8 → 1.8.9
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.
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
const styles = "/* .button-primary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: #333;\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: rgb(255, 255, 255);\r\n}\r\n\r\n.button-primary:hover {\r\n background: #0095ae;\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: rgb(255, 255, 255);\r\n border: 2px solid #0095ae;\r\n}\r\n\r\n.button-secondary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(59, 65, 71), rgb(48, 54, 59));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n.button-secondary:hover {\r\n background: linear-gradient(to right, #5a6268, #4e555b);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n.button-danger {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(153, 31, 43), rgb(130, 27, 37));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n.button-danger:hover {\r\n background: linear-gradient(to right, #c82333, #bd2130);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n\r\n.button-sm {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n width: 100%;\r\n}\r\n\r\n.button-md {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 8rem;\r\n}\r\n\r\n.button-lg {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 12rem;\r\n}\r\n.button__icon {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n.button__text {\r\n font-family: 'Roboto Condensed', sans-serif;\r\n white-space: nowrap;\r\n}\r\n\r\n\r\n.button-disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n}\r\n\r\nbutton.button-icon {\r\n gap: 0;\r\n background: none;\r\n border: none;\r\n outline: none;\r\n cursor: pointer;\r\n}\r\n\r\nbutton.button-icon:hover {\r\n background: #f0f0f0;\r\n}\r\n\r\nbutton.button-tertiary {\r\n background: transparent;\r\n font-weight: 500;\r\n border: 2px solid #333;\r\n outline: none;\r\n cursor: pointer;\r\n color: #333;\r\n} */\r\n\r\n/* Stile base del pulsante */\r\n.button-primary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: #333;\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: rgb(255, 255, 255);\r\n}\r\n\r\n/* Stile hover del pulsante */\r\n.button-primary:not(:disabled):hover {\r\n background: #0095ae;\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: rgb(255, 255, 255);\r\n border: 2px solid #0095ae;\r\n}\r\n\r\n/* Stile del pulsante secondario */\r\n.button-secondary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(59, 65, 71), rgb(48, 54, 59));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n/* Stile hover del pulsante secondario */\r\n.button-secondary:not(:disabled):hover {\r\n background: linear-gradient(to right, #5a6268, #4e555b);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n/* Stile del pulsante di pericolo */\r\n.button-danger {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(153, 31, 43), rgb(130, 27, 37));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n/* Stile hover del pulsante di pericolo */\r\n.button-danger:not(:disabled):hover {\r\n background: linear-gradient(to right, #c82333, #bd2130);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n/* Stile del pulsante disabilitato */\r\n.button-primary:disabled,\r\n.button-secondary:disabled,\r\n.button-danger:disabled,\r\n.button-disabled {\r\n background-color: #cccccc;\r\n color: #000000;\r\n cursor: default; /* Usa il cursore a freccia */\r\n opacity: 0.6;\r\n}\r\n\r\n/* Assicurati che l'hover non funzioni quando il pulsante è disabilitato */\r\n.button-primary:disabled:hover,\r\n.button-secondary:disabled:hover,\r\n.button-danger:disabled:hover,\r\n.button-disabled:hover {\r\n background-color: #cccccc;\r\n border: 2px solid transparent;\r\n}\r\n\r\n/* Button sizes */\r\n.button-sm {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n width: 100%;\r\n}\r\n\r\n.button-md {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 8rem;\r\n}\r\n\r\n.button-lg {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 12rem;\r\n}\r\n\r\n.button__icon {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n.button__text {\r\n font-family: 'Roboto Condensed', sans-serif;\r\n white-space: nowrap;\r\n}\r\n\r\nbutton.button-icon {\r\n gap: 0;\r\n background: none;\r\n border: none;\r\n outline: none;\r\n cursor: pointer;\r\n}\r\n\r\nbutton.button-icon:not(:disabled):hover {\r\n background: #f0f0f0;\r\n}\r\n\r\nbutton.button-tertiary {\r\n background: transparent;\r\n font-weight: 500;\r\n border: 2px solid #333;\r\n outline: none;\r\n cursor: pointer;\r\n color: #333;\r\n}\r\n\r\nbutton.button-tertiary:not(:disabled):hover {\r\n background: #f0f0f0;\r\n}\r\n\r\n/* NUOVO CODICE DA TESTARE */\r\n\r\n/*
|
|
2
|
+
const styles = "/* .button-primary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: #333;\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: rgb(255, 255, 255);\r\n}\r\n\r\n.button-primary:hover {\r\n background: #0095ae;\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: rgb(255, 255, 255);\r\n border: 2px solid #0095ae;\r\n}\r\n\r\n.button-secondary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(59, 65, 71), rgb(48, 54, 59));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n.button-secondary:hover {\r\n background: linear-gradient(to right, #5a6268, #4e555b);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n.button-danger {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(153, 31, 43), rgb(130, 27, 37));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n.button-danger:hover {\r\n background: linear-gradient(to right, #c82333, #bd2130);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n\r\n.button-sm {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n width: 100%;\r\n}\r\n\r\n.button-md {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 8rem;\r\n}\r\n\r\n.button-lg {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 12rem;\r\n}\r\n.button__icon {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n.button__text {\r\n font-family: 'Roboto Condensed', sans-serif;\r\n white-space: nowrap;\r\n}\r\n\r\n\r\n.button-disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n}\r\n\r\nbutton.button-icon {\r\n gap: 0;\r\n background: none;\r\n border: none;\r\n outline: none;\r\n cursor: pointer;\r\n}\r\n\r\nbutton.button-icon:hover {\r\n background: #f0f0f0;\r\n}\r\n\r\nbutton.button-tertiary {\r\n background: transparent;\r\n font-weight: 500;\r\n border: 2px solid #333;\r\n outline: none;\r\n cursor: pointer;\r\n color: #333;\r\n} */\r\n\r\n/* Stile base del pulsante */\r\n.button-primary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: #333;\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: rgb(255, 255, 255);\r\n}\r\n\r\n/* Stile hover del pulsante */\r\n.button-primary:not(:disabled):hover {\r\n background: #0095ae;\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: rgb(255, 255, 255);\r\n border: 2px solid #0095ae;\r\n}\r\n\r\n/* Stile del pulsante secondario */\r\n.button-secondary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(59, 65, 71), rgb(48, 54, 59));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n/* Stile hover del pulsante secondario */\r\n.button-secondary:not(:disabled):hover {\r\n background: linear-gradient(to right, #5a6268, #4e555b);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n/* Stile del pulsante di pericolo */\r\n.button-danger {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(153, 31, 43), rgb(130, 27, 37));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n/* Stile hover del pulsante di pericolo */\r\n.button-danger:not(:disabled):hover {\r\n background: linear-gradient(to right, #c82333, #bd2130);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n/* Stile del pulsante disabilitato */\r\n.button-primary:disabled,\r\n.button-secondary:disabled,\r\n.button-danger:disabled,\r\n.button-disabled {\r\n background-color: #cccccc;\r\n color: #000000;\r\n cursor: default; /* Usa il cursore a freccia */\r\n opacity: 0.6;\r\n}\r\n\r\n/* Assicurati che l'hover non funzioni quando il pulsante è disabilitato */\r\n.button-primary:disabled:hover,\r\n.button-secondary:disabled:hover,\r\n.button-danger:disabled:hover,\r\n.button-disabled:hover {\r\n background-color: #cccccc;\r\n border: 2px solid transparent;\r\n}\r\n\r\n/* Button sizes */\r\n.button-sm {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n width: 100%;\r\n}\r\n\r\n.button-md {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 8rem;\r\n}\r\n\r\n.button-lg {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 12rem;\r\n}\r\n\r\n.button__icon {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n.button__text {\r\n font-family: 'Roboto Condensed', sans-serif;\r\n white-space: nowrap;\r\n}\r\n\r\nbutton.button-icon {\r\n gap: 0;\r\n background: none;\r\n border: none;\r\n outline: none;\r\n cursor: pointer;\r\n}\r\n\r\nbutton.button-icon:not(:disabled):hover {\r\n background: #f0f0f0;\r\n}\r\n\r\nbutton.button-tertiary {\r\n background: transparent;\r\n font-weight: 500;\r\n border: 2px solid #333;\r\n outline: none;\r\n cursor: pointer;\r\n color: #333;\r\n}\r\n\r\nbutton.button-tertiary:not(:disabled):hover {\r\n background: #f0f0f0;\r\n}\r\n\r\n/* NUOVO CODICE DA TESTARE */\r\n\r\n/* Variante Tab */\r\nbutton.button-tab {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.5rem;\r\n padding: 1rem 1.5rem;\r\n background: none;\r\n border: none;\r\n border-bottom: 3px solid transparent;\r\n color: #6b7280;\r\n font-size: 1rem;\r\n font-weight: 500;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n margin-bottom: -2px;\r\n border-radius: 0;\r\n height: auto;\r\n max-width: none;\r\n}\r\n\r\nbutton.button-tab:not(:disabled):hover {\r\n color: #111827;\r\n border-bottom-color: #d1d5db;\r\n background: none;\r\n border-left: none;\r\n border-right: none;\r\n border-top: none;\r\n}\r\n\r\nbutton.button-tab.button-active {\r\n color: #06c;\r\n border-bottom-color: #06c;\r\n}\r\n\r\n/* Mantieni il colore blu quando il tab attivo è in hover */\r\nbutton.button-tab.button-active:hover {\r\n color: #06c;\r\n border-bottom-color: #06c;\r\n}\r\n\r\nbutton.button-tab .button__icon {\r\n width: 20px;\r\n height: 20px;\r\n}\r\n";
|
|
3
3
|
module.exports = styles;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const styles = "/* .button-primary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: #333;\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: rgb(255, 255, 255);\r\n}\r\n\r\n.button-primary:hover {\r\n background: #0095ae;\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: rgb(255, 255, 255);\r\n border: 2px solid #0095ae;\r\n}\r\n\r\n.button-secondary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(59, 65, 71), rgb(48, 54, 59));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n.button-secondary:hover {\r\n background: linear-gradient(to right, #5a6268, #4e555b);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n.button-danger {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(153, 31, 43), rgb(130, 27, 37));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n.button-danger:hover {\r\n background: linear-gradient(to right, #c82333, #bd2130);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n\r\n.button-sm {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n width: 100%;\r\n}\r\n\r\n.button-md {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 8rem;\r\n}\r\n\r\n.button-lg {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 12rem;\r\n}\r\n.button__icon {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n.button__text {\r\n font-family: 'Roboto Condensed', sans-serif;\r\n white-space: nowrap;\r\n}\r\n\r\n\r\n.button-disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n}\r\n\r\nbutton.button-icon {\r\n gap: 0;\r\n background: none;\r\n border: none;\r\n outline: none;\r\n cursor: pointer;\r\n}\r\n\r\nbutton.button-icon:hover {\r\n background: #f0f0f0;\r\n}\r\n\r\nbutton.button-tertiary {\r\n background: transparent;\r\n font-weight: 500;\r\n border: 2px solid #333;\r\n outline: none;\r\n cursor: pointer;\r\n color: #333;\r\n} */\r\n\r\n/* Stile base del pulsante */\r\n.button-primary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: #333;\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: rgb(255, 255, 255);\r\n}\r\n\r\n/* Stile hover del pulsante */\r\n.button-primary:not(:disabled):hover {\r\n background: #0095ae;\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: rgb(255, 255, 255);\r\n border: 2px solid #0095ae;\r\n}\r\n\r\n/* Stile del pulsante secondario */\r\n.button-secondary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(59, 65, 71), rgb(48, 54, 59));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n/* Stile hover del pulsante secondario */\r\n.button-secondary:not(:disabled):hover {\r\n background: linear-gradient(to right, #5a6268, #4e555b);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n/* Stile del pulsante di pericolo */\r\n.button-danger {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(153, 31, 43), rgb(130, 27, 37));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n/* Stile hover del pulsante di pericolo */\r\n.button-danger:not(:disabled):hover {\r\n background: linear-gradient(to right, #c82333, #bd2130);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n/* Stile del pulsante disabilitato */\r\n.button-primary:disabled,\r\n.button-secondary:disabled,\r\n.button-danger:disabled,\r\n.button-disabled {\r\n background-color: #cccccc;\r\n color: #000000;\r\n cursor: default; /* Usa il cursore a freccia */\r\n opacity: 0.6;\r\n}\r\n\r\n/* Assicurati che l'hover non funzioni quando il pulsante è disabilitato */\r\n.button-primary:disabled:hover,\r\n.button-secondary:disabled:hover,\r\n.button-danger:disabled:hover,\r\n.button-disabled:hover {\r\n background-color: #cccccc;\r\n border: 2px solid transparent;\r\n}\r\n\r\n/* Button sizes */\r\n.button-sm {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n width: 100%;\r\n}\r\n\r\n.button-md {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 8rem;\r\n}\r\n\r\n.button-lg {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 12rem;\r\n}\r\n\r\n.button__icon {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n.button__text {\r\n font-family: 'Roboto Condensed', sans-serif;\r\n white-space: nowrap;\r\n}\r\n\r\nbutton.button-icon {\r\n gap: 0;\r\n background: none;\r\n border: none;\r\n outline: none;\r\n cursor: pointer;\r\n}\r\n\r\nbutton.button-icon:not(:disabled):hover {\r\n background: #f0f0f0;\r\n}\r\n\r\nbutton.button-tertiary {\r\n background: transparent;\r\n font-weight: 500;\r\n border: 2px solid #333;\r\n outline: none;\r\n cursor: pointer;\r\n color: #333;\r\n}\r\n\r\nbutton.button-tertiary:not(:disabled):hover {\r\n background: #f0f0f0;\r\n}\r\n\r\n/* NUOVO CODICE DA TESTARE */\r\n\r\n/*
|
|
1
|
+
const styles = "/* .button-primary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: #333;\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: rgb(255, 255, 255);\r\n}\r\n\r\n.button-primary:hover {\r\n background: #0095ae;\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: rgb(255, 255, 255);\r\n border: 2px solid #0095ae;\r\n}\r\n\r\n.button-secondary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(59, 65, 71), rgb(48, 54, 59));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n.button-secondary:hover {\r\n background: linear-gradient(to right, #5a6268, #4e555b);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n.button-danger {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(153, 31, 43), rgb(130, 27, 37));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n.button-danger:hover {\r\n background: linear-gradient(to right, #c82333, #bd2130);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n\r\n.button-sm {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n width: 100%;\r\n}\r\n\r\n.button-md {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 8rem;\r\n}\r\n\r\n.button-lg {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 12rem;\r\n}\r\n.button__icon {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n.button__text {\r\n font-family: 'Roboto Condensed', sans-serif;\r\n white-space: nowrap;\r\n}\r\n\r\n\r\n.button-disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n}\r\n\r\nbutton.button-icon {\r\n gap: 0;\r\n background: none;\r\n border: none;\r\n outline: none;\r\n cursor: pointer;\r\n}\r\n\r\nbutton.button-icon:hover {\r\n background: #f0f0f0;\r\n}\r\n\r\nbutton.button-tertiary {\r\n background: transparent;\r\n font-weight: 500;\r\n border: 2px solid #333;\r\n outline: none;\r\n cursor: pointer;\r\n color: #333;\r\n} */\r\n\r\n/* Stile base del pulsante */\r\n.button-primary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: #333;\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: rgb(255, 255, 255);\r\n}\r\n\r\n/* Stile hover del pulsante */\r\n.button-primary:not(:disabled):hover {\r\n background: #0095ae;\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: rgb(255, 255, 255);\r\n border: 2px solid #0095ae;\r\n}\r\n\r\n/* Stile del pulsante secondario */\r\n.button-secondary {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(59, 65, 71), rgb(48, 54, 59));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n/* Stile hover del pulsante secondario */\r\n.button-secondary:not(:disabled):hover {\r\n background: linear-gradient(to right, #5a6268, #4e555b);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n/* Stile del pulsante di pericolo */\r\n.button-danger {\r\n display: inline-block;\r\n outline: none;\r\n border: 2px solid transparent;\r\n border-radius: 3px;\r\n box-sizing: border-box;\r\n font-weight: 500;\r\n max-width: 100%;\r\n text-align: center;\r\n text-decoration: none;\r\n transition:\r\n background 0.1s ease-out 0s,\r\n box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\r\n background: linear-gradient(to right, rgb(153, 31, 43), rgb(130, 27, 37));\r\n cursor: pointer;\r\n height: 32px;\r\n line-height: 32px;\r\n padding: 0px 12px;\r\n vertical-align: middle;\r\n width: auto;\r\n font-size: 14px;\r\n color: white;\r\n}\r\n\r\n/* Stile hover del pulsante di pericolo */\r\n.button-danger:not(:disabled):hover {\r\n background: linear-gradient(to right, #c82333, #bd2130);\r\n text-decoration: inherit;\r\n transition-duration: 0s, 0.15s;\r\n color: white;\r\n}\r\n\r\n/* Stile del pulsante disabilitato */\r\n.button-primary:disabled,\r\n.button-secondary:disabled,\r\n.button-danger:disabled,\r\n.button-disabled {\r\n background-color: #cccccc;\r\n color: #000000;\r\n cursor: default; /* Usa il cursore a freccia */\r\n opacity: 0.6;\r\n}\r\n\r\n/* Assicurati che l'hover non funzioni quando il pulsante è disabilitato */\r\n.button-primary:disabled:hover,\r\n.button-secondary:disabled:hover,\r\n.button-danger:disabled:hover,\r\n.button-disabled:hover {\r\n background-color: #cccccc;\r\n border: 2px solid transparent;\r\n}\r\n\r\n/* Button sizes */\r\n.button-sm {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n width: 100%;\r\n}\r\n\r\n.button-md {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 8rem;\r\n}\r\n\r\n.button-lg {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.313rem;\r\n font-size: 1rem;\r\n height: 100%;\r\n line-height: 1.25rem;\r\n padding: 0.75rem 1.5rem;\r\n border-radius: 2rem;\r\n max-width: 12rem;\r\n}\r\n\r\n.button__icon {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n.button__text {\r\n font-family: 'Roboto Condensed', sans-serif;\r\n white-space: nowrap;\r\n}\r\n\r\nbutton.button-icon {\r\n gap: 0;\r\n background: none;\r\n border: none;\r\n outline: none;\r\n cursor: pointer;\r\n}\r\n\r\nbutton.button-icon:not(:disabled):hover {\r\n background: #f0f0f0;\r\n}\r\n\r\nbutton.button-tertiary {\r\n background: transparent;\r\n font-weight: 500;\r\n border: 2px solid #333;\r\n outline: none;\r\n cursor: pointer;\r\n color: #333;\r\n}\r\n\r\nbutton.button-tertiary:not(:disabled):hover {\r\n background: #f0f0f0;\r\n}\r\n\r\n/* NUOVO CODICE DA TESTARE */\r\n\r\n/* Variante Tab */\r\nbutton.button-tab {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.5rem;\r\n padding: 1rem 1.5rem;\r\n background: none;\r\n border: none;\r\n border-bottom: 3px solid transparent;\r\n color: #6b7280;\r\n font-size: 1rem;\r\n font-weight: 500;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n margin-bottom: -2px;\r\n border-radius: 0;\r\n height: auto;\r\n max-width: none;\r\n}\r\n\r\nbutton.button-tab:not(:disabled):hover {\r\n color: #111827;\r\n border-bottom-color: #d1d5db;\r\n background: none;\r\n border-left: none;\r\n border-right: none;\r\n border-top: none;\r\n}\r\n\r\nbutton.button-tab.button-active {\r\n color: #06c;\r\n border-bottom-color: #06c;\r\n}\r\n\r\n/* Mantieni il colore blu quando il tab attivo è in hover */\r\nbutton.button-tab.button-active:hover {\r\n color: #06c;\r\n border-bottom-color: #06c;\r\n}\r\n\r\nbutton.button-tab .button__icon {\r\n width: 20px;\r\n height: 20px;\r\n}\r\n";
|
|
2
2
|
export {
|
|
3
3
|
styles as default
|
|
4
4
|
};
|