Skip to content
Snippets Groups Projects
Commit 27cebae2 authored by Norman Kämper-Leymann's avatar Norman Kämper-Leymann
Browse files

#3502178 Typography

parent 9fbcd871
No related branches found
No related tags found
No related merge requests found
File deleted
File deleted
File added
File added
File added
File added
......@@ -29,8 +29,10 @@ const { title, description, image = '/blog-placeholder-1.jpg' } = Astro.props;
<meta name="generator" content={Astro.generator} />
<!-- Font preloads -->
<link rel="preload" href="/fonts/atkinson-regular.woff" as="font" type="font/woff" crossorigin />
<link rel="preload" href="/fonts/atkinson-bold.woff" as="font" type="font/woff" crossorigin />
<link rel="preload" href="/fonts/ubuntu-sans-v2-latin-700.woff2" as="font" type="font/woff" crossorigin />
<link rel="preload" href="/fonts/ubuntu-sans-v2-latin-700italic.woff2" as="font" type="font/woff" crossorigin />
<link rel="preload" href="/fonts/ubuntu-sans-v2-latin-italic.woff2" as="font" type="font/woff" crossorigin />
<link rel="preload" href="/fonts/ubuntu-sans-v2-latin-regular.woff2" as="font" type="font/woff" crossorigin />
<!-- Canonical URL -->
<link rel="canonical" href={canonicalURL} />
......
......@@ -65,13 +65,13 @@ import { SITE_TITLE } from '../consts';
}
nav a {
padding: 1em 0.5em;
color: var(--black);
border-bottom: 4px solid transparent;
text-decoration: none;
@apply text-dug-dark;
}
nav a.active {
text-decoration: none;
border-bottom-color: var(--accent);
@apply border-b-dug-dark;
}
.social-links,
.social-links a {
......
// Place any global data in this file.
// You can import this data from anywhere in your site by using the `import` keyword.
export const SITE_TITLE = 'Astro Blog';
export const SITE_DESCRIPTION = 'Welcome to my website!';
export const SITE_TITLE = 'Drupal User Group Berlin';
export const SITE_DESCRIPTION = 'The Drupal User Group Berlin is a community of Drupal enthusiasts meeting monthly to share knowledge, discuss projects, and network. Open to all, both online and in-person.';
......@@ -63,7 +63,7 @@ const posts = (await getCollection('blog')).sort(
}
ul li a:hover h4,
ul li a:hover .date {
color: rgb(var(--accent));
@apply underline;
}
ul a:hover img {
box-shadow: var(--box-shadow);
......
......@@ -15,32 +15,49 @@
--box-shadow: 0 2px 6px rgba(var(--gray), 25%), 0 8px 24px rgba(var(--gray), 33%),
0 16px 32px rgba(var(--gray), 33%);
}
/* ubuntu-sans-regular - latin */
@font-face {
font-family: 'Atkinson';
src: url('/fonts/atkinson-regular.woff') format('woff');
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Ubuntu Sans';
font-style: normal;
font-weight: 400;
src: url('/fonts/ubuntu-sans-v2-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ubuntu-sans-italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Ubuntu Sans';
font-style: italic;
font-weight: 400;
src: url('/fonts/ubuntu-sans-v2-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ubuntu-sans-700 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Ubuntu Sans';
font-style: normal;
font-display: swap;
font-weight: 700;
src: url('/fonts/ubuntu-sans-v2-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ubuntu-sans-700italic - latin */
@font-face {
font-family: 'Atkinson';
src: url('/fonts/atkinson-bold.woff') format('woff');
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Ubuntu Sans';
font-style: italic;
font-weight: 700;
font-style: normal;
font-display: swap;
src: url('/fonts/ubuntu-sans-v2-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
body {
font-family: 'Atkinson', sans-serif;
font-family: 'Ubuntu Sans', sans-serif;
margin: 0;
padding: 0;
text-align: left;
background: linear-gradient(var(--gray-gradient)) no-repeat;
background-size: 100% 600px;
word-wrap: break-word;
overflow-wrap: break-word;
color: rgb(var(--gray-dark));
font-size: 20px;
font-size: 18px;
line-height: 1.7;
@apply bg-dug-light text-dug-dark;
}
main {
width: 720px;
......@@ -55,11 +72,10 @@ h4,
h5,
h6 {
margin: 0 0 0.5rem 0;
color: rgb(var(--black));
line-height: 1.2;
}
h1 {
font-size: 3.052em;
@apply text-5xl;
}
h2 {
font-size: 2.441em;
......@@ -78,10 +94,10 @@ b {
font-weight: 700;
}
a {
color: var(--accent);
@apply text-dug-accent;
}
a:hover {
color: var(--accent);
@apply text-dug-accent underline;
}
p {
margin-bottom: 1em;
......
......@@ -2,23 +2,30 @@
const { spacing } = require('tailwindcss/defaultTheme')
export default {
content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
theme: {
extend: {
colors: {
'dug-dark': '#092D48',
'dug-light': '#E0F1FE',
'dug-accent-dark': '#0478BE',
'dug-accent-light': '#7ECEFB'
},
},
container: {
center: true,
padding: {
DEFAULT: spacing[5],
lg: spacing[10]
}
},
},
plugins: [],
content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
theme: {
extend: {
colors: {
'dug-dark': '#092d48',
'dug-light': '#e0f1fe',
'dug-accent': '#109ce7',
'dug-accent-light': '#7ecefb',
'dug-accent-dark': '#0478be'
},
},
container: {
center: true,
padding: {
DEFAULT: spacing[5],
lg: spacing[10]
}
},
fontSize: {
'5xl': ['3rem', {
lineHeight: '4rem',
fontWeight: '700',
}],
}
},
plugins: [],
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment