Split app.css into components

This commit is contained in:
Oliver Davies 2019-05-07 18:31:33 +01:00
parent 51d8fabf2d
commit abe119a1cb
4 changed files with 23 additions and 31 deletions

View file

@ -1,36 +1,8 @@
@tailwind base;
@tailwind components;
.skip-link:focus {
left: 50%;
transform: translateX(-50%);
}
#header a {
@apply text-white no-underline;
&:hover,
&:focus {
@apply underline
}
}
#main a {
@apply text-blue-300 no-underline border-b border-blue-100 border-dotted;
&:hover,
&:focus {
@apply text-blue-100 border-solid
}
}
#footer a {
@apply text-white no-underline border-b border-dotted border-white;
&:hover,
&:focus {
@apply border-none
}
}
@import './components/footer.css';
@import './components/main.css';
@import './components/skip-link.css';
@tailwind utilities;

View file

@ -0,0 +1,8 @@
#footer a {
@apply text-white no-underline border-b border-dotted border-white;
&:hover,
&:focus {
@apply border-none
}
}

View file

@ -0,0 +1,8 @@
#main a {
@apply text-blue-300 no-underline border-b border-blue-100 border-dotted;
&:hover,
&:focus {
@apply text-blue-100 border-solid
}
}

View file

@ -0,0 +1,4 @@
.skip-link:focus {
left: 50%;
transform: translateX(-50%);
}