UNPKG

ar-design

Version:

AR Design is a (react | nextjs) ui library.

170 lines (162 loc) 5.37 kB
/* #region PRIMARY */ .borderless:not(.disabled).primary { color: var(--primary); } .borderless:not(.disabled).primary:hover { background-color: rgba(var(--primary-rgb), 0.1); } input.borderless:not(.disabled).primary:focus { border-color: var(--primary); box-shadow: 0 0 0 3.5px rgba(var(--primary-rgb), 0.1); } .borderless:not(.disabled).primary.active { background-color: transparent; /* Sırasıyla; Ad, Süre, Hız, Gecikme Süresi, Tekrar Sayısı, Yön, Bitiş Süreci */ animation: clicked-primary ease-in-out 750ms 0s 1 normal both; } /* #endregion */ /* PRIMARY */ /* #region PRIMARY-LIGHT */ .borderless:not(.disabled).primary-light { color: var(--primary-light); } .borderless:not(.disabled).primary-light:hover { background-color: rgba(var(--primary-light-rgb), 0.1); } input.borderless:not(.disabled).primary-light:focus { border-color: var(--primary-light); box-shadow: 0 0 0 3.5px rgba(var(--primary-light-rgb), 0.1); } .borderless:not(.disabled).primary-light.active { background-color: transparent; /* Sırasıyla; Ad, Süre, Hız, Gecikme Süresi, Tekrar Sayısı, Yön, Bitiş Süreci */ animation: clicked-primary-light ease-in-out 750ms 0s 1 normal both; } /* #endregion */ /* PRIMARY-LIGHT */ /* #region SECONDARY */ .borderless:not(.disabled).secondary { color: var(--secondary); } .borderless:not(.disabled).secondary:hover { background-color: rgba(var(--secondary-rgb), 0.1); } input.borderless:not(.disabled).secondary:focus { border-color: var(--secondary); box-shadow: 0 0 0 3.5px rgba(var(--secondary-rgb), 0.1); } .borderless:not(.disabled).secondary.active { background-color: transparent; /* Sırasıyla; Ad, Süre, Hız, Gecikme Süresi, Tekrar Sayısı, Yön, Bitiş Süreci */ animation: clicked-secondary ease-in-out 750ms 0s 1 normal both; } /* #endregion */ /* SECONDARY */ /* #region SUCCESS */ .borderless:not(.disabled).success { color: var(--success); } .borderless:not(.disabled).success:hover { background-color: rgba(var(--success-rgb), 0.1); } input.borderless:not(.disabled).success:focus { border-color: var(--success); box-shadow: 0 0 0 3.5px rgba(var(--success-rgb), 0.1); } .borderless:not(.disabled).success.active { background-color: transparent; /* Sırasıyla; Ad, Süre, Hız, Gecikme Süresi, Tekrar Sayısı, Yön, Bitiş Süreci */ animation: clicked-success ease-in-out 750ms 0s 1 normal both; } /* #endregion */ /* SUCCESS */ /* #region WARNING */ .borderless:not(.disabled).warning { color: var(--warning); } .borderless:not(.disabled).warning:hover { background-color: rgba(var(--warning-rgb), 0.1); } input.borderless:not(.disabled).warning:focus { border-color: var(--warning); box-shadow: 0 0 0 3.5px rgba(var(--warning-rgb), 0.1); } .borderless:not(.disabled).warning.active { background-color: transparent; /* Sırasıyla; Ad, Süre, Hız, Gecikme Süresi, Tekrar Sayısı, Yön, Bitiş Süreci */ animation: clicked-warning ease-in-out 750ms 0s 1 normal both; } /* #endregion */ /* WARNING */ /* #region DANGER */ .borderless:not(.disabled).danger { color: var(--danger); } .borderless:not(.disabled).danger:hover { background-color: rgba(var(--danger-rgb), 0.1); } input.borderless:not(.disabled).danger:focus { border-color: var(--danger); box-shadow: 0 0 0 3.5px rgba(var(--danger-rgb), 0.1); } .borderless:not(.disabled).danger.active { background-color: transparent; /* Sırasıyla; Ad, Süre, Hız, Gecikme Süresi, Tekrar Sayısı, Yön, Bitiş Süreci */ animation: clicked-danger ease-in-out 750ms 0s 1 normal both; } /* #endregion */ /* DANGER */ /* #region INFORMATION */ .borderless:not(.disabled).information { color: var(--information); } .borderless:not(.disabled).information:hover { background-color: rgba(var(--information-rgb), 0.1); } input.borderless:not(.disabled).information:focus { border-color: var(--information); box-shadow: 0 0 0 3.5px rgba(var(--information-rgb), 0.1); } .borderless:not(.disabled).information.active { background-color: transparent; /* Sırasıyla; Ad, Süre, Hız, Gecikme Süresi, Tekrar Sayısı, Yön, Bitiş Süreci */ animation: clicked-information ease-in-out 750ms 0s 1 normal both; } /* #endregion */ /* INFORMATION */ /* #region DARK */ .borderless:not(.disabled).dark { color: var(--dark); } .borderless:not(.disabled).dark:hover { background-color: rgba(var(--dark-rgb), 0.1); } input.borderless:not(.disabled).dark:focus { border-color: var(--dark); box-shadow: 0 0 0 3.5px rgba(var(--dark-rgb), 0.1); } .borderless:not(.disabled).dark.active { background-color: transparent; /* Sırasıyla; Ad, Süre, Hız, Gecikme Süresi, Tekrar Sayısı, Yön, Bitiş Süreci */ animation: clicked-dark ease-in-out 750ms 0s 1 normal both; } /* #endregion */ /* DARK */ /* #region LIGHT */ .borderless:not(.disabled).light { color: var(--dark); } .borderless:not(.disabled).light:hover { background-color: rgba(var(--light-rgb), 0.1); } input.borderless:not(.disabled).light:focus { border-color: var(--light); box-shadow: 0 0 0 3.5px rgba(var(--light-rgb), 0.1); } .borderless:not(.disabled).light.active { background-color: transparent; /* Sırasıyla; Ad, Süre, Hız, Gecikme Süresi, Tekrar Sayısı, Yön, Bitiş Süreci */ animation: clicked-light ease-in-out 750ms 0s 1 normal both; } /* #endregion */ /* LIGHT */