65 lines
1.6 KiB
CSS
65 lines
1.6 KiB
CSS
|
/* ===== MOBILE AND TABLET ENHANCEMENTS ===== */
|
||
|
|
|
||
|
|
/* Touch-friendly buttons and links */
|
||
|
|
@media (hover: none) and (pointer: coarse) {
|
||
|
|
a, button, input[type="button"], input[type="submit"] {
|
||
|
|
min-height: 44px !important;
|
||
|
|
min-width: 44px !important;
|
||
|
|
padding: 8px 12px !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Improve table scrolling on mobile */
|
||
|
|
@media only screen and (max-width: 767px) {
|
||
|
|
table {
|
||
|
|
display: block !important;
|
||
|
|
overflow-x: auto !important;
|
||
|
|
-webkit-overflow-scrolling: touch !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Stack table cells vertically if needed */
|
||
|
|
table.mobile-stack tr {
|
||
|
|
display: block !important;
|
||
|
|
margin-bottom: 10px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
table.mobile-stack td,
|
||
|
|
table.mobile-stack th {
|
||
|
|
display: block !important;
|
||
|
|
text-align: left !important;
|
||
|
|
padding: 5px !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Prevent text from being too small */
|
||
|
|
@media only screen and (max-width: 767px) {
|
||
|
|
body {
|
||
|
|
-webkit-text-size-adjust: 100% !important;
|
||
|
|
-moz-text-size-adjust: 100% !important;
|
||
|
|
-ms-text-size-adjust: 100% !important;
|
||
|
|
text-size-adjust: 100% !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Hide desktop-only elements on mobile */
|
||
|
|
@media only screen and (max-width: 767px) {
|
||
|
|
.desktop-only {
|
||
|
|
display: none !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Hide mobile-only elements on desktop */
|
||
|
|
@media only screen and (min-width: 768px) {
|
||
|
|
.mobile-only {
|
||
|
|
display: none !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Improve form inputs on mobile */
|
||
|
|
@media only screen and (max-width: 767px) {
|
||
|
|
input, select, textarea {
|
||
|
|
font-size: 16px !important;
|
||
|
|
padding: 10px !important;
|
||
|
|
}
|
||
|
|
}
|