apply prose invert based on the theme variant \o/
This commit is contained in:
parent
1eb249a510
commit
de3daea40e
3 changed files with 15 additions and 1 deletions
|
@ -25,6 +25,13 @@
|
|||
}
|
||||
}
|
||||
|
||||
/*
|
||||
Invert prose styles based on the variant of the theme.
|
||||
*/
|
||||
:root[data-variant=dark] .prose {
|
||||
@apply prose-invert;
|
||||
}
|
||||
|
||||
/* Set appropriate width for identity icons */
|
||||
a[rel] svg {
|
||||
width: 1em;
|
||||
|
|
|
@ -2,4 +2,11 @@ defmodule ChiyaWeb.Layouts do
|
|||
use ChiyaWeb, :html
|
||||
|
||||
embed_templates "layouts/*"
|
||||
|
||||
@doc """
|
||||
Defines which themes are light and which are dark themes.
|
||||
This influences the prose styles in app.css.
|
||||
"""
|
||||
def theme_variant(:default), do: "light"
|
||||
def theme_variant(:roguelight), do: "dark"
|
||||
end
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en" style="scrollbar-gutter: stable;" data-theme={@settings.theme}>
|
||||
<html lang="en" style="scrollbar-gutter: stable;" data-theme={@settings.theme} data-variant={theme_variant(@settings.theme)}>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
|
|
Loading…
Reference in a new issue