Swap sass for plain CSS

This commit is contained in:
Oliver Davies 2019-03-09 08:15:13 +00:00
parent 2c30a88d53
commit 5cf2312233
18 changed files with 111 additions and 123 deletions

20
assets/css/app.css Normal file
View file

@ -0,0 +1,20 @@
@tailwind preflight;
a {
@apply text-blue no-underline;
&:hover {
@apply underline;
}
}
@tailwind components;
@import 'components/blockquote.css';
@import 'components/button.css';
@import 'components/markup.css';
@import 'components/note.css';
@import 'components/talks/video.css';
@import 'components/widget.css';
@tailwind utilities;

View file

@ -1,2 +1,3 @@
blockquote
blockquote {
@apply border-l-4 border-blue pl-4 px-6 py-2
}

View file

@ -1,10 +1,13 @@
.button
@apply bg-blue border-blue border inline-block text-white no-underline py-2 px-3 rounded text-sm
.button {
@apply bg-blue border-blue border inline-block text-white no-underline py-2 px-3 rounded text-sm;
&:focus
&:focus {
@apply py-2 px-3 m-0
}
&:active,
&:focus,
&:hover
&:hover {
@apply bg-white text-blue
}
}

View file

@ -1,12 +1,14 @@
.markup
@apply leading-normal
.markup {
@apply leading-normal;
h2,
h3
h3 {
@apply text-black mb-3
}
h2
h2 {
@apply mt-6 mb-2
}
p,
ul,
@ -14,25 +16,34 @@
table,
figure,
pre,
[v-pre]
&:not(:last-child)
[v-pre] {
&:not(:last-child) {
@apply mb-6
}
}
code
code {
@apply bg-grey-lighter font-mono text-sm
}
p,
li
code
li {
code {
@apply inline-block border border-grey-light font-bold mx-px p-1 leading-none
}
}
pre code,
.hljs
.hljs {
@apply block leading-loose overflow-x-scroll p-6
}
figure,
img
img {
@apply block
}
figcaption
figcaption {
@apply italic text-sm text-grey-darker text-center mb-0 mt-1
}
}

View file

@ -0,0 +1,15 @@
.note {
@apply bg-blue-lighter border-blue border-l-4 mb-4 p-4 rounded;
> *:not(:first-child) {
@apply mt-6
}
p a {
@apply text-black underline;
&:hover {
@apply no-underline
}
}
}

View file

@ -1,4 +1,6 @@
.talk-video
.talk-video {
iframe,
embed
embed {
@apply absolute h-full pin-l pin-t w-full
}
}

View file

@ -0,0 +1,3 @@
.widget {
@apply block mb-6
}

View file

@ -1,25 +0,0 @@
@import '~font-awesome/css/font-awesome'
@import '~highlightjs/styles/github-gist'
@tailwind preflight
a
@apply text-blue no-underline
&:hover
@apply underline
@tailwind components
@import 'components/blockquote'
@import 'components/button'
@import 'components/listing'
@import 'components/markup'
@import 'components/note'
@import 'components/post'
@import 'components/slides'
@import 'components/table'
@import 'components/talk/video'
@import 'components/widget'
@tailwind utilities

View file

@ -1,8 +0,0 @@
.listing
@apply pl-0
.listing-item
@apply overflow-hidden pb-8
&:not(:last-child)
@apply border-b border-grey-light mb-8

View file

@ -1,8 +0,0 @@
.note
@apply bg-blue-lighter border-blue border-l-4 mb-4 p-4 rounded
> *:last-child
@apply mb-0
p a
@apply text-black

View file

@ -1,5 +0,0 @@
.post
@apply -mb-6
> *
@apply mb-6

View file

@ -1,15 +0,0 @@
.slides
background: url("../images/loading.gif") center no-repeat
min-height: 275px
@screen md
&
min-height: 375px
@screen lg
&
min-height: 450px
@screen xl
&
min-height: 560px

View file

@ -1,20 +0,0 @@
.table-collapse
@apply border-collapse
.table-responsive
@apply mb-4 border w-full overflow-x-auto overflow-y-hidden
table
@apply mb-0 border-0 whitespace-no-wrap
.table
@apply w-full table-collapse
& tr:nth-child(odd)
@apply bg-grey-lighter
& tr th
@apply text-left p-3 bg-white
& td
@apply p-3 border-t

View file

@ -1,2 +0,0 @@
.widget
@apply mb-6 block