devel #317
3 changed files with 27 additions and 9 deletions
|
@ -10,13 +10,23 @@
|
||||||
The base layer is for things like reset rules or default styles applied to plain HTML elements.
|
The base layer is for things like reset rules or default styles applied to plain HTML elements.
|
||||||
*/
|
*/
|
||||||
@layer base {
|
@layer base {
|
||||||
|
:root {
|
||||||
|
--color-foreground: 15 23 42;
|
||||||
|
--color-background: 241 245 249;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root[data-mode=dark] {
|
||||||
|
--color-foreground: 241 245 249;
|
||||||
|
--color-background: 15 23 42;
|
||||||
|
}
|
||||||
|
|
||||||
html {
|
html {
|
||||||
font-family: 'Inter', sans-serif;
|
font-family: 'Inter', sans-serif;
|
||||||
font-feature-settings: "case", "cpsp", "frac", "salt", "ccmp", "cv01", "cv02", "cv03", "cv04", "cv05", "cv06", "cv07", "cv09", "cv10", "cv11";
|
font-feature-settings: "case", "cpsp", "frac", "salt", "ccmp", "cv01", "cv02", "cv03", "cv04", "cv05", "cv06", "cv07", "cv09", "cv10", "cv11";
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
@apply dark:bg-neutral-800;
|
@apply bg-background text-foreground;
|
||||||
}
|
}
|
||||||
|
|
||||||
.stack > * + * {
|
.stack > * + * {
|
||||||
|
@ -125,7 +135,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.divider {
|
.divider {
|
||||||
@apply flex items-center my-8 before:flex-1 after:flex-1 before:content-[''] after:content-[''] before:p-[0.5px] after:p-[0.5px] w-full mx-auto last:hidden before:bg-neutral-500/25 after:bg-neutral-500/25 before:mr-2 after:ml-2;
|
@apply flex text-red-500 items-center my-8 w-full mx-auto last:hidden;
|
||||||
|
@apply before:flex-1 before:content-[''] before:bg-neutral-500/25 before:p-[0.5px] before:mr-2;
|
||||||
|
@apply after:flex-1 after:content-[''] after:bg-neutral-500/25 after:p-[0.5px] after:ml-2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dot {
|
.dot {
|
||||||
|
|
|
@ -18,7 +18,9 @@ module.exports = {
|
||||||
extend: {
|
extend: {
|
||||||
colors: {
|
colors: {
|
||||||
primary: colors.sky,
|
primary: colors.sky,
|
||||||
neutral: colors.slate
|
neutral: colors.slate,
|
||||||
|
foreground: 'rgb(var(--color-foreground) / <alpha-value>)',
|
||||||
|
background: 'rgb(var(--color-background) / <alpha-value>)'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
|
@ -15,12 +15,6 @@
|
||||||
<%= Markdown.render(@note.content) |> raw %>
|
<%= Markdown.render(@note.content) |> raw %>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<%= if String.length(@note.url || "") > 0 do %>
|
|
||||||
<section class="note-link">
|
|
||||||
<.icon name="hero-link" /> <a href={@note.url}><%= @note.url %></a>
|
|
||||||
</section>
|
|
||||||
<% end %>
|
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
<a href={~p"/"} class="hidden | h-card u-author">Inhji</a>
|
<a href={~p"/"} class="hidden | h-card u-author">Inhji</a>
|
||||||
<a href={~p"/note/#{@note.slug}"} class="hidden | u-url u-uid"><%= @note.name %></a>
|
<a href={~p"/note/#{@note.slug}"} class="hidden | u-url u-uid"><%= @note.name %></a>
|
||||||
|
@ -78,6 +72,16 @@
|
||||||
</ul>
|
</ul>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<%= if String.length(@note.url || "") > 0 do %>
|
||||||
|
<h3><.icon name="hero-link" /> URL</h3>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<ul>
|
||||||
|
<li><a href={@note.url}><%= @note.url %></a></li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
<% end %>
|
||||||
|
|
||||||
<%= if not Enum.empty?(@note.links_to) do %>
|
<%= if not Enum.empty?(@note.links_to) do %>
|
||||||
<h3>Notes linking here</h3>
|
<h3>Notes linking here</h3>
|
||||||
<section>
|
<section>
|
||||||
|
|
Loading…
Reference in a new issue