discourse/app/assets/stylesheets/common/components/date-input.scss

.d-date-input {
  display: inline-flex;
  cursor: pointer;
  flex-direction: column;
  min-width: 140px;
  flex: 1 0 100%;

  .date-picker {
    cursor: pointer;
    margin: 0;
    text-align: left;
    width: 100%;
    box-shadow: none !important;

    &::-webkit-input-placeholder {
      font-size: $font-0;
      color: var(--primary-medium);
    }

    &::-ms-input-placeholder {
      font-size: $font-0;
      color: var(--primary-medium);
    }

    &::placeholder {
      font-size: $font-0;
      color: var(--primary-medium);
    }

    &:focus {
      @include default-focus;
    }
  }

  .pika-single {
    margin-left: -1px;
    margin-top: 1px;

    .pika-row td {
      .pika-button.pika-day {
        box-shadow: none;
        border-radius: 0;
      }
    }
  }
}

.d-date-input + .d-time-input {
  margin-left: 1px;
}

.d-time-input + .d-date-input {
  margin-left: 1px;
}

.d-date-input + .clear-date-time {
  margin-left: 1px;
}
FEATURE: new date/time components (#7898) 2019-07-18 23:29:41 +08:00			`.d-date-input {`
UX: rework date time input range (#9524) 2020-04-23 04:17:53 +08:00			`display: inline-flex;`
FIX: makes clicking and displaying date picker more reliable (#9302) 2020-03-31 04:02:24 +08:00			`cursor: pointer;`
			`flex-direction: column;`
UX: rework date time input range (#9524) 2020-04-23 04:17:53 +08:00			`min-width: 140px;`
UX: uses native date picker when possible (eg: not safari) (#12668) Note that this is only applied on date-input and not the old date-picker for now. This commit is also slightly modifying admin report dates form to ensure the native picker is correctly used, as a result: it doesn’t auto refresh on date change and fixes a border bug. 2021-04-22 16:34:23 +08:00			`flex: 1 0 100%;`
UX: improves date-time-input on mobile (#9291) 2020-03-27 20:29:58 +08:00
FEATURE: new date/time components (#7898) 2019-07-18 23:29:41 +08:00			`.date-picker {`
FIX: makes clicking and displaying date picker more reliable (#9302) 2020-03-31 04:02:24 +08:00			`cursor: pointer;`
FEATURE: new date/time components (#7898) 2019-07-18 23:29:41 +08:00			`margin: 0;`
			`text-align: left;`
			`width: 100%;`
			`box-shadow: none !important;`
UX: rework date time input range (#9524) 2020-04-23 04:17:53 +08:00
			`&::-webkit-input-placeholder {`
			`font-size: $font-0;`
FEATURE: automatic dark mode (#10341) A first step to adding automatic dark mode color scheme switching. Adds a new SCSS file at `color_definitions.scss` that serves to output all SCSS color variables as CSS custom properties. And replaces all SCSS color variables with the new CSS custom properties throughout the stylesheets. This is an alpha feature at this point, can only be enabled via console using the `default_dark_mode_color_scheme_id` site setting. 2020-08-04 10:57:10 +08:00			`color: var(--primary-medium);`
UX: rework date time input range (#9524) 2020-04-23 04:17:53 +08:00			`}`

			`&::-ms-input-placeholder {`
			`font-size: $font-0;`
FEATURE: automatic dark mode (#10341) A first step to adding automatic dark mode color scheme switching. Adds a new SCSS file at `color_definitions.scss` that serves to output all SCSS color variables as CSS custom properties. And replaces all SCSS color variables with the new CSS custom properties throughout the stylesheets. This is an alpha feature at this point, can only be enabled via console using the `default_dark_mode_color_scheme_id` site setting. 2020-08-04 10:57:10 +08:00			`color: var(--primary-medium);`
UX: rework date time input range (#9524) 2020-04-23 04:17:53 +08:00			`}`

			`&::placeholder {`
			`font-size: $font-0;`
FEATURE: automatic dark mode (#10341) A first step to adding automatic dark mode color scheme switching. Adds a new SCSS file at `color_definitions.scss` that serves to output all SCSS color variables as CSS custom properties. And replaces all SCSS color variables with the new CSS custom properties throughout the stylesheets. This is an alpha feature at this point, can only be enabled via console using the `default_dark_mode_color_scheme_id` site setting. 2020-08-04 10:57:10 +08:00			`color: var(--primary-medium);`
UX: rework date time input range (#9524) 2020-04-23 04:17:53 +08:00			`}`

			`&:focus {`
UX: Uniformize styles for focus states (#11933) 2021-02-04 00:45:54 +08:00			`@include default-focus;`
UX: rework date time input range (#9524) 2020-04-23 04:17:53 +08:00			`}`
FEATURE: new date/time components (#7898) 2019-07-18 23:29:41 +08:00			`}`

			`.pika-single {`
			`margin-left: -1px;`
UX: rework date time input range (#9524) 2020-04-23 04:17:53 +08:00			`margin-top: 1px;`

			`.pika-row td {`
			`.pika-button.pika-day {`
			`box-shadow: none;`
			`border-radius: 0;`
			`}`
			`}`
FEATURE: new date/time components (#7898) 2019-07-18 23:29:41 +08:00			`}`
			`}`
UX: rework date time input range (#9524) 2020-04-23 04:17:53 +08:00
			`.d-date-input + .d-time-input {`
			`margin-left: 1px;`
			`}`

			`.d-time-input + .d-date-input {`
			`margin-left: 1px;`
			`}`

			`.d-date-input + .clear-date-time {`
			`margin-left: 1px;`
			`}`