Files
pa11y-dashboard/public/less/site-responsive.less

142 lines
2.3 KiB
Plaintext

/* Media queries */
@media (max-width:991px) {
.h1, h1 {
font-size:floor(@font-size-base * 2.15); // ~32px;
}
.h2, h2 {
font-size:floor(@font-size-base * 1.9); // ~28px;
}
.task-header .h4 {
font-size:floor(@font-size-base * 1.15); // ~17px;
}
.header {
margin-bottom:2rem;
padding-bottom:1rem;
}
.task-header .run-details {
text-align:left;
}
.task-header .btn {
padding:5px 10px;
font-size:12px;
line-height:1.5rem;
}
.task-header h2 {
margin-bottom:3px;
}
.date {
margin-top:10px;
float:right;
font-size:;
}
.other-tasks {
.sr-only();
}
.action-buttons,
.task-stats,
.btn-full-width {
margin-bottom:0;
}
.aside {
margin-bottom:15px;
}
.graph-spacer {
padding-bottom:80px;
}
}
@media (max-width:767px) {
.date-selector {
margin-top:0;
margin-bottom:25px;
}
.graph-spacer {
padding-bottom:20px;
margin-bottom:15px;
}
.action-buttons {
margin-top:10px;
.btn-full-width {
margin-bottom:10px;
}
}
}
@media (max-width:640px) {
body {
font-size:14px;
}
.h1, h1 {
font-size:floor(@font-size-base * 1.75); // ~26px;
}
.h2, h2 {
font-size:floor(@font-size-base * 1.6); // ~24px;
}
.task-header .h4 {
font-size:floor(@font-size-base * 1.1); // ~16px;
}
.badge {
font-size:floor(@font-size-base * 0.75); // ~11px;
padding:7px;
}
.rule-name .badge {
padding:3px;
}
.graph {
margin-bottom:3rem;
}
.task-stats li a {
padding:11px 0;
font-size:ceil(@font-size-base * 1.25); // ~18px
line-height:1.1;
}
.delete-button {
font-size:floor(@font-size-base * 1.35); // ~20px;
top:10px;
right:25px;
}
.standards-lists {
.tooltip {
&.top .tooltip-inner {
max-width:400px;
}
}
}
.tasks-list {
li {
margin-bottom:20px;
}
}
}
@media (max-width:479px) {
.graph {
height:200px;
margin-bottom:1.5rem;
}
.series-checkboxes li {
font-size:floor(@font-size-base * 0.8); // ~12px;
}
}
@media (max-width:360px) {
.delete-button {
display:block !important;
font-size:floor(@font-size-base * 1); // ~15px;
top:5px;
right:20px;
.opacity(0.7)
}
.standards-lists {
.checkbox {
font-size:floor(@font-size-base * 0.9); // ~13px;
}
.tooltip {
&.top .tooltip-inner {
max-width:260px;
}
}
}
.task-stats li a {
padding:11px 0;
font-size:floor(@font-size-base * 1.1); // ~16px;
line-height:1.3;
}
}