@media (min-width: 568px) { .sidebar-toggle-box span { display: inline; } .cache-item > :nth-child(2) { flex: 0 0 auto; } .cache-item > :nth-child(3) { display: block; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } } @media (min-width: 667px) { .header .nav { display: flex; flex: 1 1 auto; } .sidebar-toggle-box { flex: 0 1 auto; } } @media (min-width: 768px) { .sidebar-open aside { transform: translate(0); } .header, .site-footer { position: fixed; } } @media (min-width: 769px) { .sidebar-open aside { transform: translate(-100%); } .sidebar-open .site-footer { display: flex; } aside { transition: none; transform: translate(0); width: 210px; overflow: hidden; bottom: 40px; } }