datepicker cell size

This commit is contained in:
Tykayn 2022-02-11 12:11:53 +01:00 committed by tykayn
parent 3670a7efb2
commit 8a39c43ead
3 changed files with 24 additions and 20 deletions

View File

@ -89,7 +89,7 @@ p-calendar,
.p-datepicker-calendar {
td {
width: $cell-size;
width: $cell-size-datepicker-small;
padding: 0.15rem 0.25rem;
}
@ -97,8 +97,8 @@ p-calendar,
.p-ripple {
margin: 0;
padding: 0.25em;
width: $cell-size;
height: $cell-size;
width: $cell-size-datepicker-small;
height: $cell-size-datepicker-small;
transition: all ease 0.5s;
background: $white;
border: solid 1px $primary_color;

View File

@ -5,6 +5,7 @@
#creation_stepper {
.step-title-poll {
font-size: 0.85rem;
max-width: 20ch;
}
.title-section {
width: 40%;
@ -14,6 +15,23 @@
}
}
}
@media (min-width: 341px) {
// calendar datepicker cells
.p-datepicker {
.p-datepicker-calendar {
td {
width: $cell-size-datepicker-desktop;
}
td span,
.p-ripple {
width: $cell-size-datepicker-desktop;
height: $cell-size-datepicker-desktop;
}
}
}
}
@media (max-width: 400px) {
#creation_stepper {
.title-section {
@ -49,7 +67,7 @@
padding: calc(56px + 32px) 1rem;
}
.bottom-step-buttons {
padding: 0.25rem;
padding: 0.25rem 0;
.contained-in-main-column {
padding: 0.5rem;
}
@ -87,20 +105,6 @@
.feedback-container {
//position: fixed;
}
.p-datepicker {
.p-datepicker-calendar {
td {
width: $cell-size-desktop;
}
td span,
.p-ripple {
width: $cell-size-desktop;
height: $cell-size-desktop;
}
}
}
}
// wide screen like desktop

View File

@ -83,8 +83,8 @@ $stepper-nav-height: 56px;
$home-nav-height: 56px;
$home-nav-height-small: 3.5rem;
// datepicker
$cell-size: 30px;
$cell-size-desktop: 40px;
$cell-size-datepicker-small: 30px;
$cell-size-datepicker-desktop: 40px;
// css vars
:root {