@sparkle-learning/core 0.0.55 → 0.0.57

package/dist/node_modules/@ionic/core/dist/collection/components/datetime/datetime.md.css

@@ -1,637 +0,0 @@
-:host {
-  /**
-   * @prop --background: The primary background of the datetime component.
-   * @prop --background-rgb: The primary background of the datetime component in RGB format.
-   * @prop --title-color: The text color of the title.
-   */
-  display: flex;
-  flex-flow: column;
-  background: var(--background);
-  overflow: hidden;
-}
-
-/**
- * When using the wheel picker to switch
- * between months, sometimes the allowed
- * dates may be filtered. As a result, it
- * is possible to get a layout shift as
- * the picker column will shrink to fit the
- * widest item in the column. Setting a minimum
- * width avoids this layout shifting.
- */
-ion-picker-column-internal {
-  min-width: 26px;
-}
-
-:host(.datetime-size-fixed) {
-  width: auto;
-  height: auto;
-}
-
-:host(.datetime-size-fixed:not(.datetime-prefer-wheel)) {
-  max-width: 350px;
-}
-
-/**
- * This ensures that the picker is apppropriately
- * sized and never truncates the text.
- */
-:host(.datetime-size-fixed.datetime-prefer-wheel) {
-  min-width: 350px;
-  max-width: max-content;
-}
-
-:host(.datetime-size-cover) {
-  width: 100%;
-}
-
-:host .calendar-body,
-:host .datetime-year {
-  opacity: 0;
-}
-
-:host(:not(.datetime-ready)) .datetime-year {
-  position: absolute;
-  pointer-events: none;
-}
-
-:host(.datetime-ready) .calendar-body {
-  opacity: 1;
-}
-
-:host(.datetime-ready) .datetime-year {
-  display: none;
-  opacity: 1;
-}
-
-/**
- * Changing the physical order of the
- * picker columns in the DOM is added
- * work, so we just use `order` instead.
- *
- * The picker automatically configures
- * the text alignment, so when switching
- * the order we need to manually switch
- * the text alignment too.
- */
-:host .wheel-order-year-first .day-column {
-  order: 3;
-  text-align: end;
-}
-
-:host .wheel-order-year-first .month-column {
-  order: 2;
-  text-align: end;
-}
-
-:host .wheel-order-year-first .year-column {
-  order: 1;
-  text-align: start;
-}
-
-/**
- * This allows the calendar to take
- * up 100% of the remaining height.
- * On iOS, if there are more than
- * 5 rows of dates, the dates should
- * be resized to fit into this
- * container.
- */
-:host .datetime-calendar,
-:host .datetime-year {
-  display: flex;
-  flex: 1 1 auto;
-  flex-flow: column;
-}
-
-:host(.show-month-and-year) .datetime-year {
-  display: flex;
-}
-
-/**
- * Safari 14 has an issue where a scroll event
- * is incorrectly fired when unhiding the calendar content.
- * To workaround this, we set the opacity
- * of the content to 0 and hide it offscreen.
- *
- * -webkit-named-image is something only WebKit supports
- * so we use this to detect general WebKit support.
- * aspect-ratio is only supported in Safari 15+
- * so by checking lack of aspect-ratio support, we know
- * that we are in a pre-Safari 15 browser.
- *
- * TODO(FW-554): Remove when iOS 14 support is dropped.
- */
-@supports (background: -webkit-named-image(apple-pay-logo-black)) and (not (aspect-ratio: 1/1)) {
-  :host(.show-month-and-year) .calendar-next-prev,
-:host(.show-month-and-year) .calendar-days-of-week,
-:host(.show-month-and-year) .calendar-body,
-:host(.show-month-and-year) .datetime-time {
-    left: -99999px;
-    position: absolute;
-    /**
-     * Use visibility instead of
-     * opacity to ensure element
-     * cannot receive focus
-     */
-    visibility: hidden;
-    pointer-events: none;
-  }
-  :host-context([dir=rtl]):host(.show-month-and-year) .calendar-next-prev, :host-context([dir=rtl]).show-month-and-year .calendar-next-prev, :host-context([dir=rtl]):host(.show-month-and-year) .calendar-days-of-week, :host-context([dir=rtl]).show-month-and-year .calendar-days-of-week, :host-context([dir=rtl]):host(.show-month-and-year) .calendar-body, :host-context([dir=rtl]).show-month-and-year .calendar-body, :host-context([dir=rtl]):host(.show-month-and-year) .datetime-time, :host-context([dir=rtl]).show-month-and-year .datetime-time {
-    left: unset;
-    right: unset;
-    right: -99999px;
-  }
-}
-/**
- * This support check two cases:
- * 1. A WebKit browser that supports aspect-ratio (Safari 15+)
- * 2. Any non-WebKit browser.
- * Note that just overriding this display: none is not
- * sufficient to resolve the issue mentioned above, which
- * is why we do another set of @supports checks.
- */
-@supports (not (background: -webkit-named-image(apple-pay-logo-black))) or ((background: -webkit-named-image(apple-pay-logo-black)) and (aspect-ratio: 1/1)) {
-  :host(.show-month-and-year) .calendar-next-prev,
-:host(.show-month-and-year) .calendar-days-of-week,
-:host(.show-month-and-year) .calendar-body,
-:host(.show-month-and-year) .datetime-time {
-    display: none;
-  }
-}
-:host(.month-year-picker-open) .datetime-footer {
-  display: none;
-}
-
-:host(.datetime-readonly),
-:host(.datetime-disabled) {
-  pointer-events: none;
-}
-
-:host(.datetime-disabled) {
-  opacity: 0.4;
-}
-
-/**
- * Title should not wrap
- * to the next line and should
- * show ellipsis instead.
- */
-:host .datetime-header .datetime-title {
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-}
-
-:host .datetime-action-buttons.has-clear-button {
-  width: 100%;
-}
-
-:host .datetime-action-buttons ion-buttons {
-  display: flex;
-  justify-content: space-between;
-}
-
-/**
- * Date/Year button should be on
- * the opposite side of the component
- * as the Next/Prev buttons
- */
-:host .calendar-action-buttons {
-  display: flex;
-  justify-content: space-between;
-}
-
-:host .calendar-action-buttons ion-item,
-:host .calendar-action-buttons ion-button {
-  --background: translucent;
-}
-
-:host .calendar-action-buttons ion-item ion-label {
-  display: flex;
-  align-items: center;
-}
-
-:host .calendar-action-buttons ion-item ion-icon {
-  padding-left: 4px;
-  padding-right: 0;
-  padding-top: 0;
-  padding-bottom: 0;
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host .calendar-action-buttons ion-item ion-icon {
-    padding-left: unset;
-    padding-right: unset;
-    -webkit-padding-start: 4px;
-    padding-inline-start: 4px;
-    -webkit-padding-end: 0;
-    padding-inline-end: 0;
-  }
-}
-
-:host .calendar-days-of-week {
-  display: grid;
-  grid-template-columns: repeat(7, 1fr);
-  text-align: center;
-}
-
-:host .calendar-body {
-  /**
-   * Show all calendar months inline
-   * and allow them to take up 100% of
-   * the free space. Do not use CSS Grid
-   * here as there are issues with nested grid
-   * on older browsers.
-   */
-  display: flex;
-  flex-grow: 1;
-  scroll-snap-type: x mandatory;
-  /**
-   * Need to explicitly set overflow-y: hidden
-   * for older implementations of scroll snapping.
-   */
-  overflow-x: scroll;
-  overflow-y: hidden;
-  scrollbar-width: none;
-  /**
-   * Hide blue outline on calendar body
-   * when it is focused.
-   */
-  outline: none;
-}
-
-:host .calendar-body .calendar-month {
-  /**
-   * Swiping should snap to at
-   * most one month at a time.
-   */
-  scroll-snap-align: start;
-  scroll-snap-stop: always;
-  flex-shrink: 0;
-  width: 100%;
-}
-
-:host .calendar-body .calendar-month-disabled {
-  /**
-   * Disables swipe gesture snapping for scroll-snap containers
-   */
-  scroll-snap-align: none;
-}
-
-/**
- * Hide scrollbars on Chrome and Safari
- */
-:host .calendar-body::-webkit-scrollbar {
-  display: none;
-}
-
-:host .calendar-body .calendar-month-grid {
-  /**
-   * Create 7 columns for
-   * 7 days in a week.
-   */
-  display: grid;
-  grid-template-columns: repeat(7, 1fr);
-  height: 100%;
-}
-
-/**
- * Center the day text vertically
- * and horizontally within its grid cell.
- */
-:host .calendar-day {
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-  margin-left: 0px;
-  margin-right: 0px;
-  margin-top: 0px;
-  margin-bottom: 0px;
-  display: flex;
-  position: relative;
-  align-items: center;
-  justify-content: center;
-  border: none;
-  outline: none;
-  background: none;
-  color: currentColor;
-  cursor: pointer;
-  appearance: none;
-  z-index: 0;
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host .calendar-day {
-    padding-left: unset;
-    padding-right: unset;
-    -webkit-padding-start: 0px;
-    padding-inline-start: 0px;
-    -webkit-padding-end: 0px;
-    padding-inline-end: 0px;
-  }
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host .calendar-day {
-    margin-left: unset;
-    margin-right: unset;
-    -webkit-margin-start: 0px;
-    margin-inline-start: 0px;
-    -webkit-margin-end: 0px;
-    margin-inline-end: 0px;
-  }
-}
-
-:host .calendar-day[disabled] {
-  pointer-events: none;
-  opacity: 0.4;
-}
-
-:host .calendar-day:after {
-  border-radius: 32px;
-  padding-left: 4px;
-  padding-right: 4px;
-  padding-top: 4px;
-  padding-bottom: 4px;
-  position: absolute;
-  /**
-   * Explicit position values are required here
-   * as pseudo element positioning is incorrect
-   * in older implementations of css grid.
-   *
-   * TODO: FW-1720: Remove top/left styles when deprecating iOS 13 support
-   */
-  /* stylelint-disable-next-line property-disallowed-list */
-  top: 50%;
-  /* stylelint-disable-next-line property-disallowed-list */
-  left: 50%;
-  width: 32px;
-  height: 32px;
-  transform: translate(-50%, -50%);
-  content: " ";
-  z-index: -1;
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host .calendar-day:after {
-    padding-left: unset;
-    padding-right: unset;
-    -webkit-padding-start: 4px;
-    padding-inline-start: 4px;
-    -webkit-padding-end: 4px;
-    padding-inline-end: 4px;
-  }
-}
-
-:host .datetime-time {
-  display: flex;
-  justify-content: space-between;
-}
-
-:host(.datetime-presentation-time) .datetime-time {
-  padding-left: 0;
-  padding-right: 0;
-  padding-top: 0;
-  padding-bottom: 0;
-}
-
-:host ion-popover {
-  --height: 200px;
-}
-
-:host .time-header {
-  display: flex;
-  align-items: center;
-}
-
-:host .time-body {
-  border-radius: 8px;
-  padding-left: 12px;
-  padding-right: 12px;
-  padding-top: 6px;
-  padding-bottom: 6px;
-  display: flex;
-  border: none;
-  background: var(--ion-color-step-300, #edeef0);
-  color: var(--ion-text-color, #000);
-  font-family: inherit;
-  font-size: inherit;
-  cursor: pointer;
-  appearance: none;
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host .time-body {
-    padding-left: unset;
-    padding-right: unset;
-    -webkit-padding-start: 12px;
-    padding-inline-start: 12px;
-    -webkit-padding-end: 12px;
-    padding-inline-end: 12px;
-  }
-}
-
-:host .time-body-active {
-  color: var(--ion-color-base);
-}
-
-:host(.in-item) {
-  position: static;
-}
-
-:host(.show-month-and-year) .calendar-action-buttons ion-item {
-  --color: var(--ion-color-base);
-}
-
-:host {
-  --background: var(--ion-color-step-100, #ffffff);
-  --title-color: var(--ion-color-contrast);
-}
-
-:host .datetime-header {
-  padding-left: 20px;
-  padding-right: 20px;
-  padding-top: 20px;
-  padding-bottom: 20px;
-  background: var(--ion-color-base);
-  color: var(--title-color);
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host .datetime-header {
-    padding-left: unset;
-    padding-right: unset;
-    -webkit-padding-start: 20px;
-    padding-inline-start: 20px;
-    -webkit-padding-end: 20px;
-    padding-inline-end: 20px;
-  }
-}
-
-:host .datetime-header .datetime-title {
-  font-size: 12px;
-  text-transform: uppercase;
-}
-
-:host .datetime-header .datetime-selected-date {
-  margin-top: 30px;
-  font-size: 34px;
-}
-:host .datetime-calendar .calendar-action-buttons ion-item {
-  --padding-start: 20px;
-}
-
-:host .calendar-action-buttons ion-item,
-:host .calendar-action-buttons ion-button {
-  color: var(--ion-color-step-650, #595959);
-}
-
-:host .calendar-days-of-week {
-  padding-left: 10px;
-  padding-right: 10px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-  color: var(--ion-color-step-500, gray);
-  font-size: 14px;
-  line-height: 36px;
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host .calendar-days-of-week {
-    padding-left: unset;
-    padding-right: unset;
-    -webkit-padding-start: 10px;
-    padding-inline-start: 10px;
-    -webkit-padding-end: 10px;
-    padding-inline-end: 10px;
-  }
-}
-
-:host .calendar-body .calendar-month .calendar-month-grid {
-  /**
-   * 3px top padding adds enough spacing at
-   * the top of the container for the selected
-   * day box shadow to display without clipping.
-   */
-  padding-left: 10px;
-  padding-right: 10px;
-  padding-top: 3px;
-  padding-bottom: 0px;
-  /**
-   * Calendar on MD will show an empty row
-   * if not enough dates to fill 6th row.
-   * Calendar on iOS fits all dates into
-   * a fixed number of rows and resizes
-   * if necessary.
-   */
-  grid-template-rows: repeat(6, 1fr);
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host .calendar-body .calendar-month .calendar-month-grid {
-    padding-left: unset;
-    padding-right: unset;
-    -webkit-padding-start: 10px;
-    padding-inline-start: 10px;
-    -webkit-padding-end: 10px;
-    padding-inline-end: 10px;
-  }
-}
-
-:host .calendar-day {
-  padding-left: 0px;
-  padding-right: 0;
-  padding-top: 13px;
-  padding-bottom: 13px;
-  font-size: 14px;
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host .calendar-day {
-    padding-left: unset;
-    padding-right: unset;
-    -webkit-padding-start: 0px;
-    padding-inline-start: 0px;
-    -webkit-padding-end: 0;
-    padding-inline-end: 0;
-  }
-}
-
-:host .calendar-day:focus:after {
-  background: rgba(var(--ion-color-base-rgb), 0.2);
-  box-shadow: 0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2);
-}
-
-/**
- * Day that today but not selected
- * should have ion-color for text color.
- */
-:host .calendar-day.calendar-day-today {
-  color: var(--ion-color-base);
-}
-
-:host .calendar-day.calendar-day-today:after {
-  border: 1px solid var(--ion-color-base);
-}
-
-/**
- * Day that is not today but
- * is selected should have ion-color for
- * text color and be bolder.
- */
-:host .calendar-day.calendar-day-active {
-  color: var(--ion-color-contrast);
-}
-
-:host .calendar-day.calendar-day-active:after {
-  border: 1px solid var(--ion-color-base);
-  background: var(--ion-color-base);
-}
-
-:host .datetime-time {
-  padding-left: 16px;
-  padding-right: 16px;
-  padding-top: 8px;
-  padding-bottom: 8px;
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host .datetime-time {
-    padding-left: unset;
-    padding-right: unset;
-    -webkit-padding-start: 16px;
-    padding-inline-start: 16px;
-    -webkit-padding-end: 16px;
-    padding-inline-end: 16px;
-  }
-}
-
-:host .time-header {
-  color: var(--ion-color-step-650, #595959);
-}
-
-/**
- * Add some margin when only selecting month/year
- * otherwise layout will too constricted.
- */
-:host(.datetime-presentation-month) .datetime-year,
-:host(.datetime-presentation-year) .datetime-year,
-:host(.datetime-presentation-month-year) .datetime-year {
-  margin-top: 20px;
-  margin-bottom: 20px;
-}
-:host .datetime-buttons {
-  padding-left: 10px;
-  padding-right: 10px;
-  padding-top: 10px;
-  padding-bottom: 10px;
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host .datetime-buttons {
-    padding-left: unset;
-    padding-right: unset;
-    -webkit-padding-start: 10px;
-    padding-inline-start: 10px;
-    -webkit-padding-end: 10px;
-    padding-inline-end: 10px;
-  }
-}
-
-:host .datetime-view-buttons ion-button {
-  color: var(--ion-color-step-800, #333333);
-}

package/dist/node_modules/@ionic/core/dist/collection/components/datetime-button/datetime-button.css

@@ -1,60 +0,0 @@
-:host {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-:host button {
-  border-radius: 8px;
-  padding-left: 12px;
-  padding-right: 12px;
-  padding-top: 6px;
-  padding-bottom: 6px;
-  margin-left: 2px;
-  margin-right: 2px;
-  margin-top: 0px;
-  margin-bottom: 0px;
-  position: relative;
-  transition: 150ms color ease-in-out;
-  border: none;
-  background: var(--ion-color-step-300, #edeef0);
-  color: var(--ion-text-color, #000);
-  font-family: inherit;
-  font-size: inherit;
-  cursor: pointer;
-  appearance: none;
-  overflow: hidden;
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host button {
-    padding-left: unset;
-    padding-right: unset;
-    -webkit-padding-start: 12px;
-    padding-inline-start: 12px;
-    -webkit-padding-end: 12px;
-    padding-inline-end: 12px;
-  }
-}
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  :host button {
-    margin-left: unset;
-    margin-right: unset;
-    -webkit-margin-start: 2px;
-    margin-inline-start: 2px;
-    -webkit-margin-end: 2px;
-    margin-inline-end: 2px;
-  }
-}
-
-:host(.time-active) #time-button,
-:host(.date-active) #date-button {
-  color: var(--ion-color-base);
-}
-
-:host(.datetime-button-disabled) {
-  pointer-events: none;
-}
-
-:host(.datetime-button-disabled) button {
-  opacity: 0.4;
-}