Use theme translations and fix login-link id (#5)

* Use theme translations and fix login-link id

Switches over to using theme translations instead of theme settings to manage the text content. This just adds a little extra flexibility for admins if they want to translate the text to other languages.

It also replaces the `login-link` id with `cta-login-link` since the `login-link` id is already used in core. The relevant CSS is added along with it.

* Run prettier

common/common.scss

@@ -34,6 +34,13 @@
     &__signup {
       margin-bottom: 1rem;
     }
+
+    &__login {
+      #cta-login-link {
+        background: transparent;
+        color: var(--primary-high);
+      }
+    }
   }
 }
 

javascripts/discourse/templates/components/topic-in-gated-category.hbs

@@ -2,18 +2,18 @@
   <div class="custom-gated-topic-container">
     <div class="custom-gated-topic-content">
       <div class="custom-gated-topic-content--header">
-        {{theme-setting "heading_text"}}
+        {{theme-i18n "heading_text"}}
       </div>
       <p class="custom-gated-topic-content--text">
-        {{theme-setting "subheading_text"}}
+        {{theme-i18n "subheading_text"}}
       </p>
 
       <div class="custom-gated-topic-content--cta">
         <div class="custom-gated-topic-content--cta__signup">
-          {{d-button action=(route-action "showCreateAccount") class="btn-primary btn-large sign-up-button" translatedLabel=(theme-setting "signup_cta_label")}}
+          {{d-button action=(route-action "showCreateAccount") class="btn-primary btn-large sign-up-button" translatedLabel=(theme-i18n "signup_cta_label")}}
         </div>
         <div class="custom-gated-topic-content--cta__login">
-          {{d-button action=(route-action "showLogin") id="login-link" class="btn btn-text login-button" translatedLabel=(theme-setting "login_cta_label")}}
+          {{d-button action=(route-action "showLogin") id="cta-login-link" class="btn btn-text login-button" translatedLabel=(theme-i18n "login_cta_label")}}
         </div>
       </div>
     </div>

locales/en.yml

@@ -1,3 +1,7 @@
 en:
   theme_metadata:
     description: "Categories with logged-in access only"
+  heading_text: "This area is for members only"
+  subheading_text: "Create an account to view this content"
+  signup_cta_label: "Sign Up"
+  login_cta_label: "Already have an account? Sign in"

settings.yml

@@ -3,19 +3,3 @@ enabled_categories:
   list_type: category
   default: ""
   description: "Choose which categories that users need to sign up for."
-heading_text:
-  type: string
-  default: "This area is for members only"
-  description: ""
-subheading_text:
-  type: string
-  default: "Create an account to view this content"
-  description: ""
-signup_cta_label:
-  type: string
-  default: "Sign Up"
-  description: ""
-login_cta_label:
-  type: string
-  default: "Already have an account? Sign in"
-  description: ""