opdavies/rebuilding-bristol-js
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Add custom font families

Browse source
This commit is contained in:
Oliver Davies 2020-09-28 01:49:30 +01:00
parent 1051373255
commit ba7069e99a
4 changed files with 12 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
public/index.html
View file

@ -6,6 +6,8 @@
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title> <title><%= htmlWebpackPlugin.options.title %></title>
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;700;900&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<noscript> <noscript>

8
src/App.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<div id="app" class="text-black"> <div id="app" class="font-display text-black">
<navbar :name="title" /> <navbar :name="title" />
<div class="h-48 flex items-center justify-center bg-yellow"> <div class="h-48 flex items-center justify-center bg-yellow">
@ -21,7 +21,7 @@
<div class="space-y-2"> <div class="space-y-2">
<h2 class="text-lg font-bold text-center">About</h2> <h2 class="text-lg font-bold text-center">About</h2>
<p class="text-sm leading-relaxed">Since May 2012 we've held monthly JavaScript talks. Today the group is over 800 members strong and has a great friendly community that we've been proud to see grow.</p> <p class="font-body text-center text-sm leading-relaxed">Since May 2012 we've held monthly JavaScript talks. Today the group is over 800 members strong and has a great friendly community that we've been proud to see grow.</p>
</div> </div>
<div> <div>
@ -36,7 +36,7 @@
<div class="space-y-2"> <div class="space-y-2">
<h2 class="text-lg font-bold text-center">Format</h2> <h2 class="text-lg font-bold text-center">Format</h2>
<p class="text-sm leading-relaxed">Talk nights are usually held on the last Wednesday of every month. They usual consist of two main talks and occasionally lightning talks that can be on any topic.</p> <p class="font-body text-center text-sm leading-relaxed">Talk nights are usually held on the last Wednesday of every month. They usual consist of two main talks and occasionally lightning talks that can be on any topic.</p>
</div> </div>
<div> <div>
@ -51,7 +51,7 @@
<div class="space-y-2"> <div class="space-y-2">
<h2 class="text-lg font-bold text-center">Fancy speaking?</h2> <h2 class="text-lg font-bold text-center">Fancy speaking?</h2>
<p class="text-sm leading-relaxed">Bristol JS is only as strong as it's speakers so we're always on the lookout for great talks. Drop us an <a href="#0">e-mail</a> with an outline of your talk as well as your availability, if it's right for us we'll get you booked in.</p> <p class="font-body text-center text-sm leading-relaxed">Bristol JS is only as strong as it's speakers so we're always on the lookout for great talks. Drop us an <a href="#0">e-mail</a> with an outline of your talk as well as your availability, if it's right for us we'll get you booked in.</p>
</div> </div>
<div> <div>

4
src/components/navbar.vue
View file

@ -3,7 +3,7 @@
<div class="max-w-6xl mx-auto py-6 px-4"> <div class="max-w-6xl mx-auto py-6 px-4">
<div class="flex justify-between"> <div class="flex justify-between">
<div class="w-1/2 flex items-center"> <div class="w-1/2 flex items-center">
<a class="text-white font-bold" href="#" v-text="name"></a> <a class="text-white font-black" href="#" v-text="name"></a>
</div> </div>
<div class="w-1/2 flex justify-end md:hidden"> <div class="w-1/2 flex justify-end md:hidden">
@ -25,7 +25,7 @@
<nav class="hidden space-x-6 md:block"> <nav class="hidden space-x-6 md:block">
<a <a
class=" class="
text-xs font-bold uppercase font-body text-xs font-bold uppercase
hover:text-yellow hover:text-yellow
focus:text-yellow focus:text-yellow
" "

4
tailwind.config.js
View file

@ -23,6 +23,10 @@ module.exports = {
white: '#fff', white: '#fff',
yellow: '#fde546' yellow: '#fde546'
}, },
fontFamily: {
display: ['Raleway'],
body: ['Lato']
},
extend: {}, extend: {},
}, },
variants: {}, variants: {},