Spaces
This commit is contained in:
parent
cfc41d2f4a
commit
57d1b8350c
|
@ -1,18 +1,17 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="sm:flex">
|
||||
<div class="w-full sm:w-1/3 lg:w-1/4 flex items-center">
|
||||
<div class="w-3/4 py-5">
|
||||
{{ siteName }}
|
||||
</div>
|
||||
|
||||
<div class="w-1/4 text-right sm:hidden">
|
||||
<button type="button" class="nav-toggle appearance-none" @click="mobileNavHidden = !mobileNavHidden" aria-label="Toggle main menu">
|
||||
<svg class="fill-current text-grey-dark w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M16.4 9H3.6c-.552 0-.6.447-.6 1 0 .553.048 1 .6 1h12.8c.552 0 .6-.447.6-1 0-.553-.048-1-.6-1zm0 4H3.6c-.552 0-.6.447-.6 1 0 .553.048 1 .6 1h12.8c.552 0 .6-.447.6-1 0-.553-.048-1-.6-1zM3.6 7h12.8c.552 0 .6-.447.6-1 0-.553-.048-1-.6-1H3.6c-.552 0-.6.447-.6 1 0 .553.048 1 .6 1z"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="sm:flex">
|
||||
<div class="w-full sm:w-1/3 lg:w-1/4 flex items-center">
|
||||
<div class="w-3/4 py-5">
|
||||
{{ siteName }}
|
||||
</div>
|
||||
|
||||
<div class="w-1/4 text-right sm:hidden">
|
||||
<button type="button" class="nav-toggle appearance-none" @click="mobileNavHidden = !mobileNavHidden" aria-label="Toggle main menu">
|
||||
<svg class="fill-current text-grey-dark w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M16.4 9H3.6c-.552 0-.6.447-.6 1 0 .553.048 1 .6 1h12.8c.552 0 .6-.447.6-1 0-.553-.048-1-.6-1zm0 4H3.6c-.552 0-.6.447-.6 1 0 .553.048 1 .6 1h12.8c.552 0 .6-.447.6-1 0-.553-.048-1-.6-1zM3.6 7h12.8c.552 0 .6-.447.6-1 0-.553-.048-1-.6-1H3.6c-.552 0-.6.447-.6 1 0 .553.048 1 .6 1z"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<nav
|
||||
class="w-full -mx-4 mt-px sm:mt-0 sm:mx-0 block sm:flex sm:flex-wrap sm:flex-1 sm:justify-end bg-white absolute sm:relative border-b sm:border-b-0"
|
||||
:class="{hidden: mobileNavHidden}"
|
||||
|
@ -23,7 +22,7 @@
|
|||
:href="item.href"
|
||||
class="block p-4 border-l-3 sm:border-l-0 sm:border-b-3 border-transparent hover:border-grey-light sm:ml-4 sm:mr-0 sm:p-0 hover:no-underline"
|
||||
:class="{
|
||||
'border-blue hover:border-blue': pageUrl.match(new RegExp(item.pattern)),
|
||||
'border-blue hover:border-blue': pageUrl.match(new RegExp(item.pattern)),
|
||||
}"
|
||||
>
|
||||
<span class="flex items-center h-full">
|
||||
|
@ -37,40 +36,40 @@
|
|||
|
||||
<script>
|
||||
export default {
|
||||
props: ['siteName', 'pageUrl'],
|
||||
props: ['siteName', 'pageUrl'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
mobileNavHidden: true,
|
||||
data() {
|
||||
return {
|
||||
mobileNavHidden: true,
|
||||
|
||||
navItems: [
|
||||
{
|
||||
title: 'About',
|
||||
href: '/',
|
||||
pattern: '^/.$',
|
||||
},
|
||||
{
|
||||
title: 'Talks',
|
||||
href: '/talks',
|
||||
pattern: '^/talks/?',
|
||||
},
|
||||
{
|
||||
title: 'Blog',
|
||||
href: '/blog',
|
||||
pattern: '^/blog/?',
|
||||
},
|
||||
{
|
||||
title: 'Book',
|
||||
href: '/test-driven-drupal',
|
||||
pattern: '^/test-driven-drupal/?$',
|
||||
},
|
||||
{
|
||||
title: 'Contact',
|
||||
href: '/contact',
|
||||
pattern: '^/contact/?',
|
||||
}
|
||||
]
|
||||
}
|
||||
navItems: [
|
||||
{
|
||||
title: 'About',
|
||||
href: '/',
|
||||
pattern: '^/.$',
|
||||
},
|
||||
{
|
||||
title: 'Talks',
|
||||
href: '/talks',
|
||||
pattern: '^/talks/?',
|
||||
},
|
||||
{
|
||||
title: 'Blog',
|
||||
href: '/blog',
|
||||
pattern: '^/blog/?',
|
||||
},
|
||||
{
|
||||
title: 'Book',
|
||||
href: '/test-driven-drupal',
|
||||
pattern: '^/test-driven-drupal/?$',
|
||||
},
|
||||
{
|
||||
title: 'Contact',
|
||||
href: '/contact',
|
||||
pattern: '^/contact/?',
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -1,24 +1,24 @@
|
|||
a
|
||||
color: inherit
|
||||
text-decoration: none
|
||||
color: inherit
|
||||
text-decoration: none
|
||||
|
||||
&:focus,
|
||||
&:hover
|
||||
text-decoration: underline
|
||||
|
||||
main a
|
||||
&:focus,
|
||||
&:hover
|
||||
text-decoration: underline
|
||||
|
||||
&:focus,
|
||||
&:hover
|
||||
text-decoration: none
|
||||
main a
|
||||
text-decoration: underline
|
||||
|
||||
&:focus,
|
||||
&:hover
|
||||
text-decoration: none
|
||||
|
||||
h1, h2, h3
|
||||
@apply mb-2
|
||||
@apply mb-2
|
||||
|
||||
.content h2,
|
||||
.content h3
|
||||
@apply mt-6
|
||||
@apply mt-6
|
||||
|
||||
p,
|
||||
ul,
|
||||
|
@ -26,4 +26,4 @@ ol,
|
|||
blockquote,
|
||||
table,
|
||||
pre
|
||||
@apply mb-6
|
||||
@apply mb-6
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
img
|
||||
&.with-border
|
||||
@apply border border-solid border-grey-light
|
||||
&.with-border
|
||||
@apply border border-solid border-grey-light
|
||||
|
||||
&.with-padding
|
||||
@apply p-1
|
||||
&.with-padding
|
||||
@apply p-1
|
||||
|
||||
&.avatar
|
||||
@apply border p-1 rounded-full
|
||||
&.avatar
|
||||
@apply border p-1 rounded-full
|
||||
|
||||
svg
|
||||
fill: currentColor
|
||||
fill: currentColor
|
||||
|
|
|
@ -1,2 +1,2 @@
|
|||
blockquote
|
||||
@apply border-l-4 border-blue pl-4 px-6 py-2
|
||||
@apply border-l-4 border-blue pl-4 px-6 py-2
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
.button
|
||||
@apply bg-blue inline-block rounded text-white px-4 py-2
|
||||
@apply bg-blue inline-block rounded text-white px-4 py-2
|
||||
|
||||
&:active,
|
||||
&:hover
|
||||
@apply bg-blue-dark
|
||||
&:active,
|
||||
&:hover
|
||||
@apply bg-blue-dark
|
||||
|
|
|
@ -1,2 +1,2 @@
|
|||
.link
|
||||
@apply text-blue
|
||||
@apply text-blue
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
.listing
|
||||
@apply pl-0
|
||||
@apply pl-0
|
||||
|
||||
.listing-item
|
||||
@apply overflow-hidden pb-8
|
||||
@apply overflow-hidden pb-8
|
||||
|
||||
&:not(:last-child)
|
||||
@apply border-b border-grey-light mb-8
|
||||
&:not(:last-child)
|
||||
@apply border-b border-grey-light mb-8
|
||||
|
|
|
@ -1,22 +1,22 @@
|
|||
.markdown
|
||||
h2
|
||||
@apply mt-8 mb-3 text-black
|
||||
h2
|
||||
@apply mt-8 mb-3 text-black
|
||||
|
||||
h2, h3
|
||||
@apply text-black
|
||||
h2, h3
|
||||
@apply text-black
|
||||
|
||||
p,
|
||||
li
|
||||
a
|
||||
@apply link
|
||||
p,
|
||||
li
|
||||
a
|
||||
@apply link
|
||||
|
||||
code
|
||||
@apply bg-grey-lighter inline-block font-mono text-sm px-1 py-px border border-grey-light
|
||||
code
|
||||
@apply bg-grey-lighter inline-block font-mono text-sm px-1 py-px border border-grey-light
|
||||
|
||||
p:last-child
|
||||
@apply mb-0
|
||||
p:last-child
|
||||
@apply mb-0
|
||||
|
||||
pre code,
|
||||
.hljs
|
||||
@apply bg-grey-lighter block border-grey-dark border-l-4 font-mono
|
||||
@apply leading-loose overflow-x-scroll p-6 rounded text-sm
|
||||
pre code,
|
||||
.hljs
|
||||
@apply bg-grey-lighter block border-grey-dark border-l-4 font-mono
|
||||
@apply leading-loose overflow-x-scroll p-6 rounded text-sm
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
.note
|
||||
@apply bg-blue-lighter border-blue border-l-4 mb-4 p-4 rounded
|
||||
@apply bg-blue-lighter border-blue border-l-4 mb-4 p-4 rounded
|
||||
|
||||
> *:last-child
|
||||
@apply mb-0
|
||||
> *:last-child
|
||||
@apply mb-0
|
||||
|
||||
p a
|
||||
@apply text-black
|
||||
p a
|
||||
@apply text-black
|
||||
|
|
|
@ -1,15 +1,15 @@
|
|||
.slides
|
||||
background: url("../images/loading.gif") center no-repeat
|
||||
min-height: 275px
|
||||
background: url("../images/loading.gif") center no-repeat
|
||||
min-height: 275px
|
||||
|
||||
@screen md
|
||||
&
|
||||
min-height: 375px
|
||||
@screen md
|
||||
&
|
||||
min-height: 375px
|
||||
|
||||
@screen lg
|
||||
&
|
||||
min-height: 450px
|
||||
@screen lg
|
||||
&
|
||||
min-height: 450px
|
||||
|
||||
@screen xl
|
||||
&
|
||||
min-height: 560px
|
||||
@screen xl
|
||||
&
|
||||
min-height: 560px
|
||||
|
|
|
@ -1,20 +1,20 @@
|
|||
.table-collapse
|
||||
@apply border-collapse
|
||||
@apply border-collapse
|
||||
|
||||
.table-responsive
|
||||
@apply mb-4 border w-full overflow-x-auto overflow-y-hidden
|
||||
@apply mb-4 border w-full overflow-x-auto overflow-y-hidden
|
||||
|
||||
table
|
||||
@apply mb-0 border-0 whitespace-no-wrap
|
||||
table
|
||||
@apply mb-0 border-0 whitespace-no-wrap
|
||||
|
||||
.table
|
||||
@apply w-full table-collapse
|
||||
@apply w-full table-collapse
|
||||
|
||||
& tr:nth-child(odd)
|
||||
@apply bg-grey-lighter
|
||||
& tr:nth-child(odd)
|
||||
@apply bg-grey-lighter
|
||||
|
||||
& tr th
|
||||
@apply text-left p-3 bg-white
|
||||
& tr th
|
||||
@apply text-left p-3 bg-white
|
||||
|
||||
& td
|
||||
@apply p-3 border-t
|
||||
& td
|
||||
@apply p-3 border-t
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
.talk-video
|
||||
iframe,
|
||||
embed
|
||||
@apply absolute h-full pin-l pin-t w-full
|
||||
iframe,
|
||||
embed
|
||||
@apply absolute h-full pin-l pin-t w-full
|
||||
|
|
|
@ -1,2 +1,2 @@
|
|||
.widget
|
||||
@apply mb-6 block
|
||||
@apply mb-6 block
|
||||
|
|
Reference in a new issue