fix: make the year toggle button smaller

Make the year toggle button smaller and right positioned
Closes #26

Author: mlopezFC

src/vcf-date-range-picker-overlay-content.js

@@ -54,7 +54,7 @@ class DatePickerOverlayContentElement extends ThemableMixin(DirMixin(GestureEven
         display: flex;
       }
 
-      [part="years-toggle-button"][desktop] {
+      [part="overlay-header"][desktop] {
         display: none;
       }
 

theme/lumo/vcf-date-range-picker-overlay-content-styles.js

@@ -140,18 +140,21 @@ registerStyles(
       /* Narrow viewport mode (fullscreen) */
 
       :host([fullscreen]) [part="toolbar"] {
-        order: -1;
+        order: -3;
         background-color: var(--lumo-base-color);
       }
 
       :host([fullscreen]) [part="overlay-header"] {
         order: -2;
         height: var(--lumo-size-m);
         padding: var(--lumo-space-s);
-        position: absolute;
         left: 0;
         right: 0;
-        justify-content: center;
+        justify-content: end;
+        padding-top: 0px;
+        padding-right: 3px;
+        padding-bottom: 1px;
+        height: 0px;
       }
 
       :host([fullscreen]) [part="toggle-button"],
@@ -163,7 +166,9 @@ registerStyles(
       /* Very narrow screen (year scroller initially hidden) */
 
       [part="years-toggle-button"] {
+        font-size: var(--lumo-font-size-s);
         position: relative;
+        top: -7px;
         right: auto;
         display: flex;
         align-items: center;