Files
supabase/apps/studio/styles/date-picker.scss
37f77ae482 Add new ui for restore to new project (#30325)
* add new ui for restore to new project

* rm false

* fix typeerr badly

* add form with name and new project pass

* fix flash in loading > results state change

* restore api types

* update api types, add pitr picker

* add additional monthly spend section

* fix loading state jump

* update copy

* update api types

* update to new clone status api res

* fix mutation missing vars

* dont render logical backups in list

* fix state issue on submit

* better pitr empty state

* Update apps/studio/pages/project/[ref]/database/backups/restore-to-new-project.tsx

Co-authored-by: Wen Bo Xie <5532241+w3b6x9@users.noreply.github.com>

* Update apps/studio/pages/project/[ref]/database/backups/restore-to-new-project.tsx

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>

* Apply suggestions from code review

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Co-authored-by: Wen Bo Xie <5532241+w3b6x9@users.noreply.github.com>

* update api types to accept recoveryTimeTarget for PITR restores

* simplify pitr code a bit cleanup state bugs

* cleanup

* add PITR submit

* dont show restore btn unless status is complete

* update api types

* fix backups nav

* markdown descs and fix type err in nav

* check if project is cloned

* fix: make source project data optional

* fix datepicker highlighted day style

* fix tz picker

* check if its same or before/after in isWithinRange

* update api types fix issue with clones

* unsus

* fix markdown rendering issues

* add badge

* Update database roles and permissions description

* Update restore message text in PITR form component

* Update key attribute to item.id in DatabaseBackupsNav component

* Add conditional rendering for multiple available dates

* Refactor dialog section styles in restore-to-new-project.tsx

* Update null to undefined in conditional text assignment

* reuse component in pitr backups

* Update apps/studio/pages/project/[ref]/database/backups/restore-to-new-project.tsx

Co-authored-by: Wen Bo Xie <5532241+w3b6x9@users.noreply.github.com>

* Update link to original project in RestoreToNewProject

* fix prettier

---------

Co-authored-by: Wen Bo Xie <5532241+w3b6x9@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Co-authored-by: Crispy1975 <12525875+Crispy1975@users.noreply.github.com>
2024-11-21 17:52:10 +01:00

105 lines
2.7 KiB
SCSS

/* // date picker */
.react-datepicker__input-container input {
@apply block w-full text-base md:text-sm bg-white border border-background-surface-100 rounded shadow-sm;
}
.react-datepicker-popper {
@apply z-40 w-72 text-sm bg-surface-100 shadow px-3 py-2 border-2 border-background rounded;
}
.react-datepicker-left {
@apply absolute left-0 right-auto top-11 transform-none #{!important};
}
.react-datepicker-right {
@apply absolute right-0 left-auto top-11 transform-none #{!important};
}
.react-datepicker__portal {
@apply absolute z-10 w-72 text-sm transform-none bg-studio shadow px-3 py-2 top-12 right-0 border-2 border-background rounded;
}
.react-datepicker__month-container {
@apply flex flex-col;
}
.react-datepicker__month {
@apply flex flex-col;
@apply -space-y-px;
}
.react-datepicker__current-month {
@apply ml-2.5 text-lg font-semibold text-border-stronger;
}
.react-datepicker__week {
@apply flex -space-x-px;
}
.react-datepicker__day-names {
@apply flex -space-x-px text-foreground-lighter font-normal text-center text-xs;
}
.react-datepicker__day-name {
@apply w-10 h-10 flex items-center justify-center py-1 rounded-full;
}
.react-datepicker__navigation {
@apply absolute top-2;
}
.react-datepicker__navigation--previous {
@apply right-12 w-10 h-10 rounded transition flex items-center justify-center hover:bg-studio;
}
.react-datepicker__navigation--next {
@apply right-4 w-10 h-10 rounded transition flex items-center justify-center hover:bg-studio;
}
.react-datepicker__day {
@apply w-10 h-10 flex items-center font-normal justify-center text-sm leading-loose transition text-foreground-light cursor-pointer;
/* @apply mb-1 py-1; */
@apply -space-y-px;
@apply border border-default;
}
.react-datepicker__day--disabled {
@apply cursor-not-allowed opacity-40 hover:bg-transparent;
}
.react-datepicker__day--outside-month {
@apply text-border-stronger;
}
.react-datepicker__day--in-range {
@apply bg-brand-400 text-scale-fixed-100 border-brand-300 text-foreground;
}
.react-datepicker__day--in-selecting-range {
@apply bg-brand-400 text-scale-fixed-100 border-brand-400 text-foreground;
}
.react-datepicker__day--selecting-range-start,
.react-datepicker__day--selecting-range-end {
@apply bg-brand-300 text-foreground hover:bg-brand-400;
}
.react-datepicker__day--selected,
.react-datepicker__day--selected.react-datepicker__day--highlighted {
@apply bg-brand text-foreground;
}
.react-datepicker__day--range-start,
.react-datepicker__day--range-end {
@apply bg-brand text-foreground;
}
.react-datepicker__day--highlighted {
@apply bg-overlay-hover text-foreground-light;
}
.react-datepicker__aria-live {
@apply sr-only;
}