- fix styles to use the right vars;

JoaoFerreira-FrontEnd · JoaoFerreira-FrontEnd · commit 427c89a84480 · 2025-06-20T10:27:03.000+01:00
- remove focus of adjacent day, since adjacent days are not docusable;
diff --git a/core/src/components/datetime/datetime.ionic.scss b/core/src/components/datetime/datetime.ionic.scss
@@ -160,8 +160,7 @@
 }
 
 // Focused Day
-.calendar-day:focus-visible,
-.calendar-day.calendar-day-adjacent-day:focus-visible {
+.calendar-day:focus-visible {
   border: var(--focus-ring-width) globals.$ion-border-style-solid var(--focus-ring-color);
 }
 
@@ -173,18 +172,19 @@
 }
 
 // Pressed Day
-.calendar-day:active {
-  background: globals.$ion-semantics-primary-300;
+.calendar-day:active,
+.calendar-day.calendar-day-adjacent-day:active {
+  background: globals.$ion-bg-primary-subtle-press;
 }
 
 // Adjacent Day
 .calendar-day.calendar-day-adjacent-day {
   color: globals.$ion-text-subtlest;
 }
 
-// Pressed Adjacent Day
-.calendar-day.calendar-day-adjacent-day:active {
-  background: globals.$ion-bg-primary-subtle-press;
+// Selected Adjacent Day
+.calendar-day.calendar-day-active.calendar-day-adjacent-day {
+  color: globals.$ion-text-default;
 }
 
 // Time / Header

Original file line number	Diff line number	Diff line change
`@@ -160,8 +160,7 @@`
`160`	`160`	`}`
`161`	`161`
`162`	`162`	`// Focused Day`
`163`		`-.calendar-day:focus-visible,`
`164`		`-.calendar-day.calendar-day-adjacent-day:focus-visible {`
	`163`	`+.calendar-day:focus-visible {`
`165`	`164`	`border: var(--focus-ring-width) globals.$ion-border-style-solid var(--focus-ring-color);`
`166`	`165`	`}`
`167`	`166`
`@@ -173,18 +172,19 @@`
`173`	`172`	`}`
`174`	`173`
`175`	`174`	`// Pressed Day`
`176`		`-.calendar-day:active {`
`177`		`- background: globals.$ion-semantics-primary-300;`
	`175`	`+.calendar-day:active,`
	`176`	`+.calendar-day.calendar-day-adjacent-day:active {`
	`177`	`+ background: globals.$ion-bg-primary-subtle-press;`
`178`	`178`	`}`
`179`	`179`
`180`	`180`	`// Adjacent Day`
`181`	`181`	`.calendar-day.calendar-day-adjacent-day {`
`182`	`182`	`color: globals.$ion-text-subtlest;`
`183`	`183`	`}`
`184`	`184`
`185`		`-// Pressed Adjacent Day`
`186`		`-.calendar-day.calendar-day-adjacent-day:active {`
`187`		`- background: globals.$ion-bg-primary-subtle-press;`
	`185`	`+// Selected Adjacent Day`
	`186`	`+.calendar-day.calendar-day-active.calendar-day-adjacent-day {`
	`187`	`+ color: globals.$ion-text-default;`
`188`	`188`	`}`
`189`	`189`
`190`	`190`	`// Time / Header`