Discource-C
/
discourse-ai
mirror of https://github.com/discourse/discourse-ai.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: add support for dark mode (#529)

This commit is contained in:
Kris 2024-03-13 13:16:07 -04:00 committed by GitHub
parent ea5c38686e
commit fc6c3c81e7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 117 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/views/discourse_ai/ai_bot/shared_ai_conversations/show.html.erb
View File

@ -10,8 +10,7 @@
<meta name="twitter:title" content="<%= @shared_conversation.title %>">
<meta name="twitter:description" content="<%= @shared_conversation.formatted_excerpt %>">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="<%= share_asset_url("share.css") %>">
<link rel="stylesheet" href="<%= share_asset_url("highlight.min.css") %>">
<link rel="stylesheet" href="<%= ::UrlHelper.local_cdn_url("/plugins/discourse-ai/ai-share/share.css") %>">
<script>
window.hljs_initHighlighting = function() {
document.querySelectorAll('pre code').forEach((el) => {
@ -26,13 +25,13 @@
<a href="https://discourse.org/ai" class="ai-logo">
<svg xmlns="http://www.w3.org/2000/svg" class="logo" viewBox="0 0 289.09 72.93">
<path id="d-sparkles" fill="#f15d22" d="M280.75 16.89c-9.26 0-16.79-7.53-16.79-16.79 0-.05-.04-.1-.1-.1s-.1.04-.1.1c0 9.3-7.53 16.86-16.79 16.86-.05 0-.1.04-.1.1v.03c0 .05.04.1.1.1 9.26 0 16.79 7.5 16.79 16.72 0 .05.04.1.1.1s.1-.04.1-.1c0-9.26 7.53-16.79 16.79-16.79.05 0 .1-.04.1-.1v-.03c0-.05-.04-.1-.1-.1ZM289.04 33.73c-4.58 0-8.31-3.73-8.31-8.31 0-.03-.02-.05-.05-.05s-.05.02-.05.05c0 4.6-3.73 8.35-8.31 8.35-.03 0-.05.02-.05.05v.02s.02.05.05.05c4.58 0 8.31 3.71 8.31 8.27 0 .03.02.05.05.05s.05-.02.05-.05c0-4.58 3.73-8.31 8.31-8.31.03 0 .05-.02.05-.05v-.02s-.02-.05-.05-.05Z"/>
<path fill="#010101" d="M62.53 29.48c.9 0 1.68.33 2.33.98.65.66.97 1.45.97 2.38s-.32 1.7-.96 2.35c-.64.65-1.41.97-2.3.97s-1.7-.33-2.35-.99c-.65-.66-.97-1.46-.97-2.41s.32-1.68.96-2.32c.64-.64 1.41-.96 2.32-.96Zm-2.58 11.21h5.16v21.49h-5.16V40.69ZM82.38 44.09l-3.19 3.19c-1.3-1.28-2.47-1.93-3.53-1.93-.58 0-1.03.12-1.36.37-.33.25-.49.55-.49.92 0 .28.1.53.31.77.21.23.72.55 1.54.95l1.89.94c1.99.98 3.36 1.98 4.1 3 .74 1.02 1.12 2.22 1.12 3.59 0 1.83-.67 3.35-2.01 4.57-1.34 1.22-3.14 1.83-5.39 1.83-3 0-5.39-1.17-7.18-3.51l3.17-3.46c.6.71 1.31 1.28 2.13 1.71.81.43 1.53.65 2.16.65.68 0 1.23-.16 1.64-.49.42-.33.62-.71.62-1.13 0-.79-.75-1.57-2.25-2.32l-1.74-.87c-3.33-1.67-4.99-3.77-4.99-6.29 0-1.62.63-3.01 1.88-4.17 1.25-1.15 2.86-1.73 4.81-1.73 1.33 0 2.59.29 3.77.88 1.18.59 2.18 1.43 2.99 2.52ZM106.4 45.38l-4.29 2.36c-.81-.84-1.6-1.43-2.39-1.76-.79-.33-1.71-.49-2.77-.49-1.93 0-3.49.58-4.68 1.73-1.19 1.15-1.79 2.62-1.79 4.42s.57 3.18 1.72 4.28c1.15 1.11 2.65 1.66 4.52 1.66 2.31 0 4.1-.79 5.39-2.36l4.07 2.79c-2.2 2.87-5.32 4.3-9.33 4.3-3.61 0-6.45-1.07-8.49-3.21-2.05-2.14-3.07-4.65-3.07-7.52 0-1.99.5-3.82 1.49-5.5.99-1.67 2.38-2.99 4.17-3.95 1.78-.96 3.78-1.44 5.98-1.44 2.04 0 3.87.41 5.5 1.22 1.62.81 2.95 1.97 3.99 3.47ZM119.11 40.69c1.94 0 3.76.49 5.47 1.45 1.71.97 3.04 2.29 4 3.95.96 1.66 1.44 3.46 1.44 5.38s-.48 3.75-1.45 5.44c-.96 1.69-2.28 3.01-3.94 3.96-1.66.95-3.5 1.43-5.5 1.43-2.95 0-5.46-1.05-7.55-3.15-2.08-2.1-3.13-4.64-3.13-7.64 0-3.21 1.18-5.89 3.53-8.03 2.07-1.86 4.44-2.8 7.12-2.8Zm.08 4.86c-1.6 0-2.94.56-4 1.67-1.07 1.11-1.6 2.54-1.6 4.28s.53 3.24 1.58 4.35c1.05 1.11 2.39 1.66 4 1.66s2.96-.56 4.03-1.68c1.07-1.12 1.61-2.56 1.61-4.33s-.53-3.2-1.58-4.3c-1.05-1.1-2.4-1.65-4.04-1.65ZM133.14 41.22h5.22v9.9c0 1.93.13 3.27.4 4.02.27.75.69 1.33 1.28 1.75.59.42 1.31.62 2.17.62s1.59-.2 2.19-.61c.6-.41 1.04-1.01 1.34-1.8.21-.59.32-1.86.32-3.8V41.23h5.16v8.71c0 3.59-.28 6.05-.85 7.37-.69 1.61-1.71 2.85-3.06 3.71-1.35.86-3.06 1.29-5.14 1.29-2.25 0-4.08-.5-5.47-1.51-1.39-1.01-2.37-2.41-2.94-4.21-.4-1.25-.61-3.51-.61-6.8v-8.56ZM154.63 41.22h4.42v2.59c.48-1.02 1.11-1.79 1.91-2.32.79-.53 1.66-.79 2.61-.79.67 0 1.37.18 2.1.53l-1.61 4.44c-.6-.3-1.1-.45-1.49-.45-.79 0-1.46.49-2.01 1.47-.55.98-.82 2.91-.82 5.78l.02 1v8.31h-5.12V41.23ZM180.27 44.09l-3.19 3.19c-1.3-1.28-2.47-1.93-3.53-1.93-.58 0-1.03.12-1.36.37-.33.25-.49.55-.49.92 0 .28.1.53.31.77.21.23.72.55 1.54.95l1.89.94c1.99.98 3.36 1.98 4.1 3 .74 1.02 1.12 2.22 1.12 3.59 0 1.83-.67 3.35-2.01 4.57-1.34 1.22-3.14 1.83-5.39 1.83-3 0-5.39-1.17-7.18-3.51l3.17-3.46c.6.71 1.31 1.28 2.13 1.71.81.43 1.53.65 2.16.65.68 0 1.23-.16 1.64-.49.42-.33.62-.71.62-1.13 0-.79-.75-1.57-2.25-2.32l-1.74-.87c-3.32-1.67-4.99-3.77-4.99-6.29 0-1.62.63-3.01 1.88-4.17 1.25-1.15 2.86-1.73 4.81-1.73 1.33 0 2.59.29 3.77.88 1.18.59 2.18 1.43 2.99 2.52ZM204.77 52.99H188.2c.24 1.46.88 2.62 1.92 3.49 1.04.86 2.36 1.29 3.98 1.29 1.93 0 3.58-.67 4.97-2.02l4.35 2.04c-1.08 1.54-2.38 2.67-3.89 3.41-1.51.74-3.31 1.1-5.38 1.1-3.22 0-5.85-1.02-7.88-3.05-2.03-2.03-3.04-4.58-3.04-7.64s1.01-5.74 3.03-7.81c2.02-2.07 4.56-3.11 7.6-3.11 3.24 0 5.87 1.04 7.9 3.11 2.03 2.07 3.04 4.81 3.04 8.21l-.02.98Zm-5.16-4.06c-.34-1.15-1.01-2.08-2.02-2.8-1-.72-2.17-1.08-3.49-1.08-1.44 0-2.7.4-3.78 1.21-.68.5-1.31 1.39-1.89 2.66h11.18ZM27.63 17.64C12.63 17.64 0 29.8 0 44.8v28.13l27.62-.03c15 0 27.16-12.63 27.16-27.63S42.62 17.64 27.62 17.64Z"/>
<path class="d-logo-black" fill="#010101" d="M62.53 29.48c.9 0 1.68.33 2.33.98.65.66.97 1.45.97 2.38s-.32 1.7-.96 2.35c-.64.65-1.41.97-2.3.97s-1.7-.33-2.35-.99c-.65-.66-.97-1.46-.97-2.41s.32-1.68.96-2.32c.64-.64 1.41-.96 2.32-.96Zm-2.58 11.21h5.16v21.49h-5.16V40.69ZM82.38 44.09l-3.19 3.19c-1.3-1.28-2.47-1.93-3.53-1.93-.58 0-1.03.12-1.36.37-.33.25-.49.55-.49.92 0 .28.1.53.31.77.21.23.72.55 1.54.95l1.89.94c1.99.98 3.36 1.98 4.1 3 .74 1.02 1.12 2.22 1.12 3.59 0 1.83-.67 3.35-2.01 4.57-1.34 1.22-3.14 1.83-5.39 1.83-3 0-5.39-1.17-7.18-3.51l3.17-3.46c.6.71 1.31 1.28 2.13 1.71.81.43 1.53.65 2.16.65.68 0 1.23-.16 1.64-.49.42-.33.62-.71.62-1.13 0-.79-.75-1.57-2.25-2.32l-1.74-.87c-3.33-1.67-4.99-3.77-4.99-6.29 0-1.62.63-3.01 1.88-4.17 1.25-1.15 2.86-1.73 4.81-1.73 1.33 0 2.59.29 3.77.88 1.18.59 2.18 1.43 2.99 2.52ZM106.4 45.38l-4.29 2.36c-.81-.84-1.6-1.43-2.39-1.76-.79-.33-1.71-.49-2.77-.49-1.93 0-3.49.58-4.68 1.73-1.19 1.15-1.79 2.62-1.79 4.42s.57 3.18 1.72 4.28c1.15 1.11 2.65 1.66 4.52 1.66 2.31 0 4.1-.79 5.39-2.36l4.07 2.79c-2.2 2.87-5.32 4.3-9.33 4.3-3.61 0-6.45-1.07-8.49-3.21-2.05-2.14-3.07-4.65-3.07-7.52 0-1.99.5-3.82 1.49-5.5.99-1.67 2.38-2.99 4.17-3.95 1.78-.96 3.78-1.44 5.98-1.44 2.04 0 3.87.41 5.5 1.22 1.62.81 2.95 1.97 3.99 3.47ZM119.11 40.69c1.94 0 3.76.49 5.47 1.45 1.71.97 3.04 2.29 4 3.95.96 1.66 1.44 3.46 1.44 5.38s-.48 3.75-1.45 5.44c-.96 1.69-2.28 3.01-3.94 3.96-1.66.95-3.5 1.43-5.5 1.43-2.95 0-5.46-1.05-7.55-3.15-2.08-2.1-3.13-4.64-3.13-7.64 0-3.21 1.18-5.89 3.53-8.03 2.07-1.86 4.44-2.8 7.12-2.8Zm.08 4.86c-1.6 0-2.94.56-4 1.67-1.07 1.11-1.6 2.54-1.6 4.28s.53 3.24 1.58 4.35c1.05 1.11 2.39 1.66 4 1.66s2.96-.56 4.03-1.68c1.07-1.12 1.61-2.56 1.61-4.33s-.53-3.2-1.58-4.3c-1.05-1.1-2.4-1.65-4.04-1.65ZM133.14 41.22h5.22v9.9c0 1.93.13 3.27.4 4.02.27.75.69 1.33 1.28 1.75.59.42 1.31.62 2.17.62s1.59-.2 2.19-.61c.6-.41 1.04-1.01 1.34-1.8.21-.59.32-1.86.32-3.8V41.23h5.16v8.71c0 3.59-.28 6.05-.85 7.37-.69 1.61-1.71 2.85-3.06 3.71-1.35.86-3.06 1.29-5.14 1.29-2.25 0-4.08-.5-5.47-1.51-1.39-1.01-2.37-2.41-2.94-4.21-.4-1.25-.61-3.51-.61-6.8v-8.56ZM154.63 41.22h4.42v2.59c.48-1.02 1.11-1.79 1.91-2.32.79-.53 1.66-.79 2.61-.79.67 0 1.37.18 2.1.53l-1.61 4.44c-.6-.3-1.1-.45-1.49-.45-.79 0-1.46.49-2.01 1.47-.55.98-.82 2.91-.82 5.78l.02 1v8.31h-5.12V41.23ZM180.27 44.09l-3.19 3.19c-1.3-1.28-2.47-1.93-3.53-1.93-.58 0-1.03.12-1.36.37-.33.25-.49.55-.49.92 0 .28.1.53.31.77.21.23.72.55 1.54.95l1.89.94c1.99.98 3.36 1.98 4.1 3 .74 1.02 1.12 2.22 1.12 3.59 0 1.83-.67 3.35-2.01 4.57-1.34 1.22-3.14 1.83-5.39 1.83-3 0-5.39-1.17-7.18-3.51l3.17-3.46c.6.71 1.31 1.28 2.13 1.71.81.43 1.53.65 2.16.65.68 0 1.23-.16 1.64-.49.42-.33.62-.71.62-1.13 0-.79-.75-1.57-2.25-2.32l-1.74-.87c-3.32-1.67-4.99-3.77-4.99-6.29 0-1.62.63-3.01 1.88-4.17 1.25-1.15 2.86-1.73 4.81-1.73 1.33 0 2.59.29 3.77.88 1.18.59 2.18 1.43 2.99 2.52ZM204.77 52.99H188.2c.24 1.46.88 2.62 1.92 3.49 1.04.86 2.36 1.29 3.98 1.29 1.93 0 3.58-.67 4.97-2.02l4.35 2.04c-1.08 1.54-2.38 2.67-3.89 3.41-1.51.74-3.31 1.1-5.38 1.1-3.22 0-5.85-1.02-7.88-3.05-2.03-2.03-3.04-4.58-3.04-7.64s1.01-5.74 3.03-7.81c2.02-2.07 4.56-3.11 7.6-3.11 3.24 0 5.87 1.04 7.9 3.11 2.03 2.07 3.04 4.81 3.04 8.21l-.02.98Zm-5.16-4.06c-.34-1.15-1.01-2.08-2.02-2.8-1-.72-2.17-1.08-3.49-1.08-1.44 0-2.7.4-3.78 1.21-.68.5-1.31 1.39-1.89 2.66h11.18ZM27.63 17.64C12.63 17.64 0 29.8 0 44.8v28.13l27.62-.03c15 0 27.16-12.63 27.16-27.63S42.62 17.64 27.62 17.64Z"/>
<path fill="#fff9ae" d="M27.89 28.15c-9.3 0-16.84 7.54-16.84 16.84 0 2.91.74 5.64 2.03 8.02l-3.04 9.8 10.94-2.47c2.11.95 4.44 1.48 6.91 1.48 9.3 0 16.84-7.54 16.84-16.84s-7.54-16.84-16.84-16.84Z"/>
<path fill="#00aeef" d="M41.26 34.75c2.18 2.84 3.47 6.39 3.47 10.24 0 9.3-7.54 16.84-16.84 16.84-2.46 0-4.8-.53-6.91-1.48l-10.94 2.47 11.14-1.32c2 1.16 4.27 1.94 6.71 2.2 9.25.97 17.53-5.74 18.5-14.98.57-5.41-1.49-10.48-5.15-13.96Z"/>
<path fill="#00a94f" d="M38.15 31.64c2.46 2.59 4.12 5.99 4.52 9.82.97 9.25-5.74 17.53-14.98 18.5-2.45.26-4.83-.03-7.02-.75l-10.62 3.6 10.94-2.47c2.11.95 4.44 1.48 6.91 1.48 9.3 0 16.84-7.54 16.84-16.84 0-5.44-2.58-10.27-6.58-13.35Z"/>
<path fill="#f15d22" d="M14.1 53.39c-1.04-2.51-1.49-5.3-1.18-8.19.97-9.25 9.26-15.96 18.5-14.98 3.84.4 7.24 2.07 9.84 4.54-3.08-4.01-7.92-6.6-13.36-6.6-9.3 0-16.84 7.54-16.84 16.84 0 2.91.74 5.64 2.03 8.02l-3.04 9.8 4.05-9.43Z"/>
<path fill="#d0232b" d="M13.09 53.01c-1.3-2.39-2.03-5.12-2.03-8.02 0-9.3 7.54-16.84 16.84-16.84 3.86 0 7.42 1.3 10.26 3.49-3.48-3.67-8.56-5.73-13.98-5.17-9.25.97-15.96 9.26-14.98 18.5.3 2.89 1.32 5.53 2.86 7.77l-2 10.07 3.04-9.8Z"/>
<path fill="#231f20" d="M227.73 34.1h5.4l10.75 27.94h-5.53l-2.19-5.76h-11.4l-2.27 5.76h-5.53l10.78-27.94Zm2.73 7.41-3.75 9.59h7.48l-3.73-9.59ZM247.21 34.1h5.28v27.94h-5.28V34.1Z"/>
<path class="d-logo-black" fill="#010101" d="M227.73 34.1h5.4l10.75 27.94h-5.53l-2.19-5.76h-11.4l-2.27 5.76h-5.53l10.78-27.94Zm2.73 7.41-3.75 9.59h7.48l-3.73-9.59ZM247.21 34.1h5.28v27.94h-5.28V34.1Z"/>
</svg>
</a>
<a class="site-title" href="<%= Discourse.base_url %>">

9
public/ai-share/highlight.min.css vendored
View File

@ -1,9 +0,0 @@
/*!
Theme: Default
Description: Original highlight.js style
Author: (c) Ivan Sagalaev <maniac@softwaremaniacs.org>
Maintainer: @highlightjs/core-team
Website: https://highlightjs.org/
License: see project LICENSE
Touched: 2021
*/pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{background:#f0f0f0;color:#444}.hljs-comment{color:#888}.hljs-punctuation,.hljs-tag{color:#444a}.hljs-tag .hljs-attr,.hljs-tag .hljs-name{color:#444}.hljs-attribute,.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-name,.hljs-selector-tag{font-weight:700}.hljs-deletion,.hljs-number,.hljs-quote,.hljs-selector-class,.hljs-selector-id,.hljs-string,.hljs-template-tag,.hljs-type{color:#800}.hljs-section,.hljs-title{color:#800;font-weight:700}.hljs-link,.hljs-operator,.hljs-regexp,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-symbol,.hljs-template-variable,.hljs-variable{color:#bc6060}.hljs-literal{color:#78a960}.hljs-addition,.hljs-built_in,.hljs-bullet,.hljs-code{color:#397300}.hljs-meta{color:#1f7199}.hljs-meta .hljs-string{color:#4d99bf}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}

115
public/ai-share/share.css
View File

@ -18,6 +18,25 @@
--tertiary: #08c;
/* colors from the default dark discourse color scheme */
@media (prefers-color-scheme: dark) {
--primary: #dddddd;
--primary-50: #282828;
--primary-100: #2c2c2c;
--primary-200: #313131;
--primary-300: #585858;
--primary-400: #7a7a7a;
--primary-500: #858585;
--primary-600: #909090;
--primary-700: #9b9b9b;
--primary-800: #a6a6a6;
--primary-900: #c7c7c7;
--secondary: #222222;
--tertiary: #099dd7;
}
--border-radius-large: 1em;
--border-radius-small: 0.33em;
@ -89,6 +108,12 @@ body {
}
}
@media (prefers-color-scheme: dark) {
.d-logo-black {
fill: var(--primary);
}
}
@media (prefers-reduced-motion: no-preference) {
.ai-logo:hover #d-sparkles {
animation: d-rainbow-sparkles 1.5s forwards ease-in-out;
@ -380,10 +405,98 @@ li, p {
.lightbox-wrapper .meta svg, .lightbox-wrapper .meta .informations {
display: none;
}
.lightbox-wrapper .meta .filename {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
/*
custom code highlighting for dark mode support...
overrides highlightjs (https://highlightjs.org/) CSS colors.
*/
.hljs{
--hljs-red: #c63c1b;
--hljs-salmon: #ec8972;
--hljs-lime: #4dff4d;
--hljs-green: #090;
--hljs-sky: #47c2ff;
@media (prefers-color-scheme: dark) {
--hljs-red: #af3719;
--hljs-salmon: #c7705c;
--hljs-lime: #3fcf3f;
--hljs-green: #048504;
--hljs-sky: #379ccf;
}
--hljs-blue: var(--tertiary); /* already has a dark variant at root */
background:var(--primary-50);
color:var(--primary);
}
pre code.hljs{
display:block;
overflow-x:auto;
padding:1em
}
code.hljs{
padding:3px 5px
}
.hljs-attribute,.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-name,.hljs-selector-tag{
font-weight:700
}
.hljs-emphasis{
font-style:italic
}
.hljs-strong{
font-weight:700
}
.hljs-comment{
color: var(--hljs-comment);
}
.hljs-punctuation,.hljs-tag{
color:var(--primary-900);
}
.hljs-tag .hljs-attr,.hljs-tag .hljs-name{
color:var(--primary-900);
}
.hljs-deletion,.hljs-number,.hljs-quote,.hljs-selector-class,.hljs-selector-id,.hljs-string,.hljs-template-tag,.hljs-type{
color: var(--hljs-red);
}
.hljs-section,.hljs-title{
color: var(--hljs-red);
font-weight:700
}
.hljs-link,.hljs-operator,.hljs-regexp,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-symbol,.hljs-template-variable,.hljs-variable{
color:var(--hljs-salmon);
}
.hljs-literal{
color: var(--hljs-lime);
}
.hljs-addition,.hljs-built_in,.hljs-bullet,.hljs-code{
color:var(--hljs-green);
}
.hljs-meta{
color:var(--hljs-blue);
}
.hljs-meta .hljs-string{
color:var(--hljs-sky);
}