Merge branch 'feature/tweaks-and-features' of https://github.com/safing/web into feature/tweaks-and-features

This commit is contained in:
Luke 2020-11-20 14:54:22 +01:00
commit 8c7f099ef3

View file

@ -2,10 +2,6 @@
font-family: "Roboto"; font-family: "Roboto";
} }
a{
word-break: break-all;
}
body { body {
overflow-x: hidden; overflow-x: hidden;
} }
@ -196,7 +192,7 @@ a.link {
padding-top: 2.5rem !important; padding-top: 2.5rem !important;
} }
ul, ul,
ol{ ol{
padding: 1rem; padding: 1rem;
list-style-type: decimal; list-style-type: decimal;
@ -249,7 +245,7 @@ a.link {
grid-auto-flow: row; grid-auto-flow: row;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
max-width: 1350px; max-width: 1350px;
} }
@media (min-width: 640px) { @media (min-width: 640px) {
@ -276,7 +272,7 @@ a.link {
.tabs { .tabs {
border-radius: 8px; border-radius: 8px;
overflow: visible; overflow: visible;
} }
.tab { .tab {
width: 100%; width: 100%;
@ -301,7 +297,7 @@ a.link {
transition-timing-function: ease; transition-timing-function: ease;
transform: rotate(-90deg); transform: rotate(-90deg);
} }
} }
&-content { &-content {
max-height: 0; max-height: 0;
@ -396,7 +392,7 @@ input:checked {
box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35); box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35);
background: #333; background: #333;
color: #fff; color: #fff;
z-index: 1000; z-index: 1000;
} }
[tooltip]:hover::before, [tooltip]:hover::before,
@ -444,22 +440,22 @@ input:checked {
} }
// This is a hacky way to solve this problem. // This is a hacky way to solve this problem.
// I could not find away in tailwind to set a max of cols and to allow // I could not find away in tailwind to set a max of cols and to allow
// each tag to have their own width. // each tag to have their own width.
.tag-grid{ .tag-grid{
grid-template-columns: repeat(3, minmax(max-content, 1fr)) grid-template-columns: repeat(3, minmax(max-content, 1fr))
} }
@media (min-width: 640px) { @media (min-width: 640px) {
.tag-grid{ .tag-grid{
grid-template-columns: repeat(4, minmax(max-content, 1fr)) grid-template-columns: repeat(4, minmax(max-content, 1fr))
} }
} }
@media (min-width: 768px) { @media (min-width: 768px) {
.tag-grid{ .tag-grid{
grid-template-columns: repeat(7, minmax(max-content, 1fr)) grid-template-columns: repeat(7, minmax(max-content, 1fr))
} }
} }