opdavies/oliverdavies.uk-drupal-old
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Integrate the typography plugin with dark mode

Browse source 
References #27
This commit is contained in:
Oliver Davies 2020-10-29 01:41:32 +00:00
parent c0355a4e89
commit a888430ef3
7 changed files with 22 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
web/themes/custom/opdavies/assets/css/custom-base.pcss
View file

@ -15,7 +15,7 @@ img {
}
a {
@apply text-blue-700 no-underline hover:underline
@apply text-blue-500 no-underline hover:underline
}
blockquote {

14
web/themes/custom/opdavies/tailwind.config.js
View file

@ -55,6 +55,19 @@ module.exports = {
'pre code::before': false,
'pre code::after': false
}
},
dark: {
css: {
color: theme('colors.gray.200'),
h2: {
color: theme('colors.white')
},
strong: {
color: theme('colors.gray.200')
}
}
}
}),
extend: {
@ -103,6 +116,7 @@ module.exports = {
borderStyle: [...variants.borderStyle, 'hover', 'focus'],
borderWidth: [...variants.borderWidth, 'hover', 'focus'],
margin: [...variants.margin, 'first', 'last', 'odd', 'even'],
typography: ['responsive', 'dark']
},
experimental: {
applyComplexClasses: true,

6
web/themes/custom/opdavies/templates/field/field--body.html.twig
View file

@ -44,12 +44,12 @@
{% if multiple %}
<div{{ attributes }}>
{% for item in items %}
<div{{ item.attributes.addClass('prose max-w-none') }}>{{ item.content }}</div>
<div{{ item.attributes.addClass('prose dark:prose-dark max-w-none') }}>{{ item.content }}</div>
{% endfor %}
</div>
{% else %}
{% for item in items %}
<div{{ attributes.addClass('prose max-w-none') }}>{{ item.content }}</div>
<div{{ attributes.addClass('prose dark:prose-dark max-w-none') }}>{{ item.content }}</div>
{% endfor %}
{% endif %}
{% else %}
@ -59,7 +59,7 @@
<div>
{% endif %}
{% for item in items %}
<div{{ item.attributes.addClass('prose max-w-none') }}>{{ item.content }}</div>
<div{{ item.attributes.addClass('prose dark:prose-dark max-w-none') }}>{{ item.content }}</div>
{% endfor %}
{% if multiple %}
</div>

2
web/themes/custom/opdavies/templates/field/field--node--field-events--talk.html.twig
View file

@ -42,7 +42,7 @@
]
%}
<div{{ attributes.addClass('prose max-w-none') }}>
<div{{ attributes.addClass('prose dark:prose-dark max-w-none') }}>
<h2{{ title_attributes.addClass(title_classes) }}>
{{ label }}
</h2>

2
web/themes/custom/opdavies/templates/node/node--talk.html.twig
View file

@ -90,7 +90,7 @@
</footer>
{% endif %}
<div{{ content_attributes.addClass(['space-y-6', page ? 'prose max-w-none']) }}>
<div{{ content_attributes.addClass(['space-y-6', page ? 'prose dark:prose-dark max-w-none']) }}>
{{ content }}
</div>

2
web/themes/custom/opdavies/templates/view/views-view--blog-posts.html.twig
View file

@ -41,7 +41,7 @@
{{ title_suffix }}
{% if header %}
<header class="prose lg:prose-lg xl:prose-xl">
<header class="prose dark:prose-dark lg:prose-lg xl:prose-xl">
{{ header }}
</header>
{% endif %}

2
web/themes/custom/opdavies/templates/view/views-view--talks.html.twig
View file

@ -41,7 +41,7 @@
{{ title_suffix }}
{% if header %}
<header class="prose lg:prose-lg xl:prose-xl">
<header class="prose dark:prose-dark lg:prose-lg xl:prose-xl">
{{ header }}
</header>
{% endif %}