Added responsive classes to header

Also changed "Daniel's Weekly Devotions" to "A Word from the Word"
This commit is contained in:
Daniel J. Summers 2017-10-14 21:32:14 -05:00
parent 39a420e73f
commit 6096ecff10
3 changed files with 6462 additions and 30 deletions

View File

@ -1,6 +1,6 @@
<template lang="pug"> <template lang="pug">
#app #app
header header.site-header
.header-logo .header-logo
router-link(to='/') router-link(to='/')
img(src='/static/bitbadger.png' img(src='/static/bitbadger.png'
@ -68,9 +68,13 @@ h3 {
margin: 1rem 0; margin: 1rem 0;
} }
h2, h3 { h2, h3 {
width: 80%;
border-bottom: solid 2px navy; border-bottom: solid 2px navy;
} }
@media all and (min-width:40rem) {
h2, h3 {
width: 80%;
}
}
p { p {
margin: 1rem 0; margin: 1rem 0;
} }
@ -92,7 +96,7 @@ p {
font-size: 14pt; font-size: 14pt;
font-weight: bold; font-weight: bold;
} }
header { .site-header {
height: 100px; height: 100px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -102,12 +106,41 @@ header {
background-image: -moz-linear-gradient(top, lightgray, #FFFAFA); background-image: -moz-linear-gradient(top, lightgray, #FFFAFA);
background-image: linear-gradient(to bottom, lightgray, #FFFAFA); background-image: linear-gradient(to bottom, lightgray, #FFFAFA);
} }
header a:link, header a:visited { .site-header a:link, header a:visited {
color: black; color: black;
} }
header a:hover { .site-header a:hover {
border-bottom:none; border-bottom:none;
} }
.header-title {
font-size: 3rem;
font-weight: bold;
line-height: 100px;
text-align: center;
}
.header-spacer {
flex-grow: 3;
}
.header-social {
padding: 25px .8rem 0 0;
}
.header-social img {
width: 50px;
height: 50px;
}
@media all and (max-width:40rem) {
.site-header {
height: auto;
flex-direction: column;
align-items: center;
}
.header-title {
line-height: 3rem;
}
.header-spacer {
display: none;
}
}
.content-item { .content-item {
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
@ -145,19 +178,4 @@ ul {
li { li {
list-style-type: disc; list-style-type: disc;
} }
.header-title {
font-size: 3rem;
font-weight: bold;
line-height: 100px;
}
.header-spacer {
flex-grow: 3;
}
.header-social {
padding: 25px .8rem 0 0;
}
.header-social img {
width: 50px;
height: 50px;
}
</style> </style>

View File

@ -6,6 +6,16 @@ const CATEGORIES = [
{ id: 4, name: 'Personal' } { id: 4, name: 'Personal' }
] ]
const APPS = [ const APPS = [
{
id: 'a-word-from-the-word',
name: 'A Word from the Word',
url: 'https://devotions.summershome.org',
active: true,
categoryId: 4,
noAboutLink: true,
frontPageText: 'Devotions by Daniel',
frontPageOrder: 2
},
{ {
id: 'bay-vista', id: 'bay-vista',
name: 'Bay Vista Baptist Church', name: 'Bay Vista Baptist Church',
@ -90,16 +100,6 @@ const APPS = [
frontPageText: 'Daniel&rsquo;s personal blog', frontPageText: 'Daniel&rsquo;s personal blog',
frontPageOrder: 1 frontPageOrder: 1
}, },
{
id: 'daniels-weekly-devotions',
name: 'Daniel\'s Weekly Devotions',
url: 'https://devotions.summershome.org',
active: true,
categoryId: 4,
noAboutLink: true,
frontPageText: 'A word from the Word each week',
frontPageOrder: 2
},
{ {
id: 'dr-melissa-clouthier', id: 'dr-melissa-clouthier',
name: 'Dr. Melissa Clouthier', name: 'Dr. Melissa Clouthier',

6414
yarn.lock Normal file

File diff suppressed because it is too large Load Diff