From 159cbf4bd5a5f634f0283ba671d1d82520053529 Mon Sep 17 00:00:00 2001 From: NateDhaliwal <143097364+NateDhaliwal@users.noreply.github.com> Date: Tue, 15 Apr 2025 14:11:28 +0800 Subject: [PATCH 1/4] Update 03-css.md --- docs/07-theme-developer-tutorial/03-css.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/07-theme-developer-tutorial/03-css.md b/docs/07-theme-developer-tutorial/03-css.md index 8fa0e4a..cae9419 100644 --- a/docs/07-theme-developer-tutorial/03-css.md +++ b/docs/07-theme-developer-tutorial/03-css.md @@ -14,7 +14,7 @@ As we touched on in the last chapter, the main entrypoint for theme CSS is the ` You can also use `desktop/desktop.scss` and `mobile/mobile.scss`, although we're increasingly moving away from these separate files and towards breakpoint-based styling in `common.scss`. -But for more complex situations, you can put additional scss in files like `/stylesheets/my-styles.scss`, and import from `common.scss` like `@import "my-styles";` +But for more complex situations, you can put additional scss in files like `/stylesheets/my-styles.scss`, and import from `common.scss` like `@import "my-styles";`. ## Using variables @@ -35,7 +35,7 @@ Let's make use of this knowledge by updating our theme to use the theme colors f Great! Now your banner's colors will match the site color scheme, and automatically adjust based on light/dark modes. -For more information about the variables available, check out [this document](https://meta.discourse.org/t/77551) +For more information about the variables available, check out [this document](https://meta.discourse.org/t/77551). ## Finding CSS selectors to style @@ -43,6 +43,6 @@ The number of elements and classes in Discourse can feel quite overwhelming from For example, let's assume you want to style all the buttons in Discourse. One approach would be to use DevTools and try to find every variation of every button and style it. But a better approach would be to see how core is styling buttons, and base your approach on that. -To explore re-styling Discourse in more detail, check out [the Designer's guide to Discourse themes](https://meta.discourse.org/t/152002) +To explore re-styling Discourse in more detail, check out [the Designer's guide to Discourse themes](https://meta.discourse.org/t/152002). -Or if you're ready to explore more ways to add/change content in Discourse, let's go to the [next chapter](https://meta.discourse.org/t/357799) +Or if you're ready to explore more ways to add/change content in Discourse, let's go to the [next chapter](https://meta.discourse.org/t/357799). From d77a6d6db577eb5a0d14e1f84def79d3e47d1d78 Mon Sep 17 00:00:00 2001 From: NateDhaliwal <143097364+NateDhaliwal@users.noreply.github.com> Date: Tue, 15 Apr 2025 16:11:36 +0800 Subject: [PATCH 2/4] Update 24-customizing-topic-list.md --- docs/03-code-internals/24-customizing-topic-list.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/03-code-internals/24-customizing-topic-list.md b/docs/03-code-internals/24-customizing-topic-list.md index 90c95fd..00302fb 100644 --- a/docs/03-code-internals/24-customizing-topic-list.md +++ b/docs/03-code-internals/24-customizing-topic-list.md @@ -67,7 +67,7 @@ Plugin outlets can be used to inject content into existing cells on desktop, or ## Replacing the entire topic-list-item -If you want to completely replace the core topic-list-item implementation, then you can use the `topic-list-item` Wrapper Plugin Outlet. This should only be done when your design differs so much from core that you don't want it to be affected by future core changes, and you don't need it to be compatible with other themes / plugins. +If you want to completely replace the core topic-list-item implementation, then you can use the `topic-list-item` Wrapper Plugin Outlet. This should only be done when your design differs so much from core that you don't want it to be affected by future core changes, and you don't need it to be compatible with other themes/plugins. If using this strategy, you should take extra care to ensure that your code is well tested, and you should make sure that your theme/plugin users are aware of the caveats. From 770422ee4ca933dc1a025ad8c5894469d8b1f2fa Mon Sep 17 00:00:00 2001 From: NateDhaliwal <143097364+NateDhaliwal@users.noreply.github.com> Date: Sun, 27 Apr 2025 12:22:23 +0800 Subject: [PATCH 3/4] Update 06-js-api.md --- docs/07-theme-developer-tutorial/06-js-api.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/07-theme-developer-tutorial/06-js-api.md b/docs/07-theme-developer-tutorial/06-js-api.md index 5f92973..566a97b 100644 --- a/docs/07-theme-developer-tutorial/06-js-api.md +++ b/docs/07-theme-developer-tutorial/06-js-api.md @@ -22,7 +22,7 @@ export default apiInitializer((api) => { ### headerIcons -`api.headerIcons` will allow you to add, remove and re-arrange icons in the header. For example, to add a new icon before the search icon, you'd do something like +`api.headerIcons` will allow you to add, remove and re-arrange icons in the header. For example, to add a new icon before the search icon, you'd do something like: ```gjs import DButton from "discourse/components/d-button"; @@ -54,7 +54,7 @@ export default apiInitializer((api) => { api.replaceIcon(source, destination); ``` -With this method, you can easily replace any Discourse icon with another. For example, we have [a theme component](https://meta.discourse.org/t/change-the-like-icon/87748) that replaces the heart icon for like with a thumbs-up icon +With this method, you can easily replace any Discourse icon with another. For example, we have [a theme component](https://meta.discourse.org/t/change-the-like-icon/87748) that replaces the heart icon for like with a thumbs-up icon. ### decorateCookedElement() @@ -99,7 +99,7 @@ export default apiInitializer((api) => { api.registerValueTransformer("home-logo-href", () => "https://example.com"); ``` -For more information on Transformers, check out the [dedicated guide](https://meta.discourse.org/t/349954) +For more information on Transformers, check out the [dedicated guide](https://meta.discourse.org/t/349954). ## Finding more JS API methods From 403cf3cddf0cf3e6703f245dedf460619d9f9cd4 Mon Sep 17 00:00:00 2001 From: NateDhaliwal <143097364+NateDhaliwal@users.noreply.github.com> Date: Sun, 27 Apr 2025 12:25:12 +0800 Subject: [PATCH 4/4] Update 04-outlets.md --- docs/07-theme-developer-tutorial/04-outlets.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/07-theme-developer-tutorial/04-outlets.md b/docs/07-theme-developer-tutorial/04-outlets.md index 88cac58..c7287b8 100644 --- a/docs/07-theme-developer-tutorial/04-outlets.md +++ b/docs/07-theme-developer-tutorial/04-outlets.md @@ -155,4 +155,4 @@ If you want to re-render the wrapped core implementation inside your component, ## Conclusion -Now we know how to create and insert content across the whole of Discourse, we'll explore some more advanced concepts you can use in your components. See [the next chapter](https://meta.discourse.org/t/357800) +Now we know how to create and insert content across the whole of Discourse, we'll explore some more advanced concepts you can use in your components. See [the next chapter](https://meta.discourse.org/t/357800).