@shift72/core-template 1.2.0 → 1.4.0

package/site/styles/_variables.scss

@@ -4,35 +4,85 @@
 // These variables should be reasonably generic so that overrides are placed in main.scss.
 
 :root {
+  /*#region BASE COLOURS */
+  // Don't put derivative colour variables in this region.
+
   --primary-rgb: 0, 163, 255;
   --secondary-rgb: 102, 199, 255;
   --body-color-rgb: 255, 255, 255;
-  --body-bg-rgb: 15, 15, 15;
-  --body-bg-accent-rgb: 25, 25, 25; // darken(body-bg, 10%) OR lighten(body-bg, 10%)
-  --link-color-hover-rgb: 217, 217, 217; // darken(body-color, 15%)
-  --input-focus-border-color-rgb: 131, 210, 216; // lighten(primary, 25%)
-  --main-content-icon-hover-rgb: 207, 207, 207; // white .8 opacity
+  --body-bg-rgb: 0, 0, 0;
+
+  // To calculate --body-color-hover-rgb, do:
+  //   1.  Convert var(--body-color-rgb) to hex.
+  //   2a. If dark themed, run it through the Sass darken function:  darken(hex, 20%).
+  //   2b. If light themed, run it through the Sass lighten function:  lighten(hex, 20%).
+  //   3.  Convert the result back to RGB.
+  //   TODO(jackh): figure out a non-Sass way of calculating this.
+  --body-color-hover-rgb: 204, 204, 204;
+
+  // To calculate --input-focus-border-color-rgb, do:
+  //   1.  Convert var(--body-bg) to hex.
+  //   2a. If dark themed, run it through the Sass lighten function:  lighten(hex, 10%).
+  //   2b. If light themed, run it through the Sass darken function:  darken(hex, 10%).
+  //   3.  Convert the result back to RGB.
+  //   TODO(jackh): figure out a non-Sass way of calculating this.
+  --body-bg-accent-rgb: 25, 25, 25;
+
+  // To calculate --input-focus-border-color-rgb, do:
+  //   1.  Convert var(--primary-rgb) to hex.
+  //   2.  Run it through the Sass lighten function:  lighten(hex, 25%).
+  //   3.  Convert the result back to RGB.
+  //   TODO(jackh): figure out a non-Sass way of calculating this.
+  --input-focus-border-color-rgb: 131, 210, 216;
+
+  // To calculate --hover-background-rgb, do:
+  //   1.  Convert var(--body-bg-accent-rgb) to hex.
+  //   2a. If dark themed, run it through the Sass lighten function:  lighten(hex, 13%).
+  //   2b. If light themed, run it through the Sass darken function:  darken(hex, 13%).
+  //   3.  Convert the result back to RGB.
+  //   TODO(jackh): figure out a non-Sass way of calculating this.
+  --hover-background-rgb: 58, 58, 58;
 
   --primary: rgb(var(--primary-rgb));
   --secondary: rgb(var(--secondary-rgb));
   --body-color: rgb(var(--body-color-rgb));
+  --body-color-hover: rgb(var(--body-color-hover-rgb));
   --body-bg: rgb(var(--body-bg-rgb));
   --body-bg-accent: rgb(var(--body-bg-accent-rgb));
-  --link-color: var(--body-color);
-  --link-color-hover: rgb(var(--link-color-hover-rgb));
   --input-focus-border-color: rgb(var(--input-focus-border-color-rgb));
-  --main-content-icon-hover: rgb(var(--main-content-icon-hover-rgb));
+  --hover-background: rgb(var(--hover-background-rgb));
+  /*#endregion BASE COLOURS */
+
   --tooltip-color: var(--body-bg, #000);
   --tooltip-bg: var(--primary, #00a3ff);
   --tooltip-arrow-color: var(--tooltip-bg);
 
   --input-height: 40px;
 
-  --navbar-brand-padding-y: 25px;
-  --navbar-brand-min-width: 126px;
-  --navbar-brand-min-width-md: 126px;
-  --navbar-brand-min-width-lg: 126px;
-  --navbar-brand-min-width-xl: 126px;
+  --link-color: var(--body-color);
+  --link-color-hover: var(--body-color-hover);
+
+  --navbar-link-color: var(--body-color);
+  --navbar-link-hover-color: var(--body-color-hover);
+  --navbar-search-background-color: var(--body-bg-accent);
+  --navbar-dropdown-background: var(--body-bg-accent);
+  --navbar-brand-height: 50px;
+
+  --footer-brand-height: 50px;
+
+  --signin-text-color: var(--body-color);
+  --signin-text-color-hover: var(--body-color-hover);
+  --signin-border-color: transparent;
+  --signin-border-color-hover: transparent;
+  --signin-background: rgba(var(--body-color-rgb), 0.1);
+  --signin-background-hover: var(--hover-background);
+  --signin-background-lg: transparent;
+  --signin-background-hover-lg: transparent;
+
+  --signout-background: rgba(var(--body-color-rgb), 0.1);
+  --signout-background-hover: rgba(var(--body-color-rgb), 0.2);
+  --signout-text-color: var(--body-color);
+  --signout-text-color-hover: var(--body-color);
 
   --carousel-height: 75vh;
   --carousel-height-sm: 75vh;
@@ -47,9 +97,36 @@
   --page-padding-top: 120px;
   --page-padding-top-md: 120px;
   --page-padding-top-lg: 180px;
-  --page-detail-padding-top: 120px;
-  --page-detail-padding-top-md: 120px;
-  --page-detail-padding-top-lg: 180px;
+  --page-detail-padding-top: 245px;
+  --page-detail-padding-top-md: 290px;
+  --page-detail-padding-top-lg: 440px;
+
+  --heading-1-style-letter-spacing: normal;
+  --heading-2-style-letter-spacing: normal;
+  --heading-3-style-letter-spacing: normal;
+  --heading-3-style-letter-spacing-sm: normal;
+  --heading-4-style-letter-spacing: normal;
+  --body-1-style-letter-spacing: normal;
+  --body-2-style-letter-spacing: normal;
+  --subtitle-1-style-letter-spacing: normal;
+  --subtitle-2-style-letter-spacing: normal;
+  --caption-1-style-letter-spacing: normal;
+  --overline-style-letter-spacing: normal;
+
+  --heading-1-style-font-size: 32px;
+  --heading-1-style-font-size-xs: 46px;
+  --heading-1-style-font-size-small: 24px;
+  --heading-2-style-font-size: 29px;
+  --heading-2-style-font-size-sm: 35px;
+  --heading-3-style-font-size: 20px;
+  --heading-3-style-font-size-sm: 24px;
+  --heading-4-style-font-size: 18px;
+  --body-1-style-font-size: 16px;
+  --body-2-style-font-size: 14px;
+  --subtitle-1-style-font-size: 16px;
+  --subtitle-2-style-font-size: 14px;
+  --caption-1-style-font-size: 16px;
+  --overline-style-font-size: 14px;
 }
 
 // Bootstrap 4 overrides START
@@ -133,19 +210,12 @@ $navbar-show-background-color: var(--body-bg-accent) !default;
 $navbar-dark-active-color: var(--primary) !default;
 $navbar-nav-link-padding-x: 1em !default;
 $navbar-nav-link-padding-y: 1em !default;
-$navbar-search-background-color: var(--body-bg-accent) !default;
 
 // Uses navbar-dark theme so we can use variables for colouring
 $navbar-dark-active-color: #fd4766 !default;
 $navbar-dark-color: var(--body-color) !default;
 $navbar-dark-hover-color: #fd4766 !default;
 
-// Sub Navivgation
-$subnav-nav-item-color: var(--body-color) !default;
-$subnav-nav-item-hover-background-color: var(--primary) !default;
-$subnav-nav-item-active-background-color: var(--primary) !default;
-$subnav-dropdown-background: var(--body-bg-accent) !default;
-
 // Buttons
 $button-text-color: var(--body-bg) !default;
 $button-text-color-hover: var(--body-bg) !default;
@@ -154,15 +224,6 @@ $button-background-hover: var(--secondary) !default;
 $trailer-button-text-color: var(--body-color) !default;
 $mobile-nav-link-color: var(--body-color) !default;
 
-$signin-text-color: var(--body-color) !default;
-$signin-text-color-hover: var(--primary) !default;
-$signin-border-color: transparent !default;
-$signin-border-color-hover: transparent !default;
-$signin-background: rgba(var(--body-color-rgb), 0.1) !default;
-$signin-background-hover: rgba(var(--body-color-rgb), 0.2) !default;
-$signin-background-lg: transparent !default;
-$signin-background-hover-lg: transparent !default;
-
 $signup-text-color: $button-text-color !default;
 $signup-text-color-hover: $button-text-color-hover !default;
 $signup-border-color: transparent !default;
@@ -170,11 +231,6 @@ $signup-border-color-hover: transparent !default;
 $signup-background: $button-background !default;
 $signup-background-hover: $button-background-hover !default;
 
-$signout-background: rgba(var(--body-color-rgb), 0.1) !default;
-$signout-background-hover: rgba(var(--body-color-rgb), 0.2) !default;
-$signout-text-color: var(--body-color) !default;
-$signout-text-color-hover: var(--body-color) !default;
-
 // Image Gradient Overlays
 $top-gradient-color: var(--body-bg-rgb) !default;
 $right-gradient-bg-color: var(--body-bg-rgb) !default;
@@ -189,15 +245,6 @@ $footer-brand-min-width: 100px !default;
 $footer-brand-min-width-md: 100px !default;
 $footer-bar-background-color: var(--body-bg-accent) !default;
 
-// Social
-// ------------------------------------
-$facebook-color: var(--body-color) !default;
-$instagram-color: var(--body-color) !default;
-$twitter-color: var(--body-color) !default;
-$youtube-color: var(--body-color) !default;
-$linkedin-color: var(--body-color) !default;
-$letterboxd-color: var(--body-color) !default;
-
 // Meta Items
 // ------------------------------------
 $meta-item-border-radius: 4px !default;

package/site/subscriptions.html.jet

@@ -1,7 +1,7 @@
 {{extends "templates/application/application.jet"}}
 
 {{block head()}}
-  {{yield seo(title=i18n("usersubscriptions_page_header"), index=false)}}
+  {{yield seo(title=i18n("usersubscriptions_page_header_seo"), index=false)}}
 {{end}}
 
 {{block body()}}

package/site/templates/application/application.jet

@@ -4,14 +4,11 @@
 {{import "./google.jet" }}
 {{import "./footer/footer.jet" }}
 
-{{CDN := "//cdn.shift72.com/1.3"}}
+{{CDN := "//cdn.shift72.com/latest"}}
 {*{CDN := "//localhost:3000"}*}
 
-{{CSSFilename := ""}}
-{{if isEnabled("self_service_css") && site.CSSFilename != "" }}
-  {{CSSFilename = site.CSSFilename}}
-{{end}}
-{*{CSSFilename = "local.css"}*}
+{{CSSFileURL := site.SiteBrand.GetLink("css", "")}}
+{*{CSSFileURL := "/styles/local.css"}*}
 
 <!DOCTYPE html>
 <html lang="{{lang.Code}}">
@@ -34,22 +31,23 @@
 
     {{yield font()}}
     <link rel="stylesheet" href="/styles/main.css">
-    {{if CSSFilename != "" }}
-      <link rel="stylesheet" href="/styles/{{CSSFilename}}">
+    {{if CSSFileURL != "" }}
+      <link rel="stylesheet" href="{{CSSFileURL}}">
     {{end}}
 
-    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
-    <link rel="icon" href="/favicon.ico" type="image/x-icon">
+    {{faviconURL := site.SiteBrand.GetImage("favicon", "/favicon.ico")}}
+    <link rel="shortcut icon" href="{{faviconURL}}" type="image/x-icon">
+    <link rel="icon" href="{{faviconURL}}" type="image/x-icon">
 
     {{block head()}}
       {{yield seo()}}
     {{end}}
 
-    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=default,fetch" defer></script>
+    <script src="https://polyfill.io/v3/polyfill.min.js?features=Intl%2Cdefault%2Cfetch" defer></script>
     <script src="{{CDN}}/s72.core.js" defer></script>
     <script src="{{CDN}}/s72.ui.js" defer></script>
 
-    <script src="/scripts/main.js" defer></script>    
+    <script src="/scripts/main.js" defer></script>
 
     <script src="{{CDN}}/s72.transactional.js" defer></script>
     <script src="https://js.stripe.com/v3/" defer></script>

package/site/templates/application/brand/logo.jet

@@ -0,0 +1,11 @@
+{{block logo(class="")}}
+  {{logo1x := site.SiteBrand.GetImage("logo@1x", "/images/common/logo.png")}}
+  {{logo2x := site.SiteBrand.GetImage("logo@2x", "/images/common/logo@2x.png")}}
+  {{siteName := site.Config.GetSiteName()}}
+
+  <img class="{{class}}"
+       srcset="{{logo1x}} 300w, {{logo2x}} 600w"
+       sizes="(max-width: 768px) 300px, 600px"
+       src="{{logo2x}}"
+       alt="{{siteName}}">
+{{end}}

package/site/templates/application/brand/sponsors.jet

@@ -0,0 +1,11 @@
+{{block sponsors(class="")}}
+  {{sponsorsXXXS := site.SiteBrand.GetImage("sponsors-xxxs", "/images/common/sponsors-xxxs.png")}}
+  {{sponsorsXS := site.SiteBrand.GetImage("sponsors-xs", "/images/common/sponsors-xs.png")}}
+  {{sponsorsMD := site.SiteBrand.GetImage("sponsors-md", "/images/common/sponsors-md.png")}}
+
+  <picture class="{{class}}">
+    <source class="sponsor-image" srcset="{{sponsorsMD}}" media="(min-width: 768px)">
+    <source class="sponsor-image" srcset="{{sponsorsXS}}" media="(min-width: 475px)">
+    <img class="sponsor-image" src="{{sponsorsXXXS}}">
+  </picture>
+{{end}}

package/site/templates/application/footer/brand.jet

@@ -1,5 +1,7 @@
+{{import "../brand/logo.jet"}}
+
 {{block footerBrand()}}
   <a class="footer-brand-link" href="{{routeToPath("/")}}" aria-label="{{site.Config.GetSiteName()}}">
-    <s72-image class="footer-brand-image" src="/images/common/logo.png" alt="{{site.Config.GetSiteName()}}"></s72-image>
+    {{yield logo(class="footer-brand-image")}}
   </a>
 {{end}}

package/site/templates/application/footer/sponsor-banner.jet

@@ -1,9 +1,9 @@
+{{import "../brand/sponsors.jet"}}
+
 {{block sponsorBanner()}}
   {{if config("show_sponsor_banner") == "true"}}
     <div class="sponsor-banner">
-      <s72-image class="sponsors-xxxs" src="/images/common/sponsors-xxxs.png"></s72-image>
-      <s72-image class="sponsors-xs" src="/images/common/sponsors-xs.png"></s72-image>
-      <s72-image class="sponsors-md" src="/images/common/sponsors-md.png"></s72-image>
+      {{yield sponsors(class="sponsor-picture")}}
     </div>
   {{end}}
 {{end}}

package/site/templates/application/head/seo.jet

@@ -9,7 +9,7 @@
   {{end}}
 
   {* Set this to be a local file path to have a default SEO sharing image e.g. "/images/common/logo.png" *}
-  {{seoImage := site.SiteConfig.SiteURL + "/images/common/facebook-image.png"}}
+  {{seoImage := site.SiteBrand.GetImage("facebook-image", site.SiteConfig.SiteURL + "/images/common/facebook-image.png")}}
   {{if isset(.Seo) && len(.Seo.Image) > 0}}
     {{seoImage = .Seo.Image}}
   {{end}}

package/site/templates/application/nav/nav.jet

@@ -1,16 +1,17 @@
 {{import "./user_logged_out.jet"}}
 {{import "./user_logged_in.jet"}}
 {{import "./header-banner.jet"}}
+{{import "../brand/logo.jet"}}
 
 {{block nav(showSubNav=true)}}
 <header class="navigation" data-toggle="affix">
   {{yield headerBanner()}}
   <div class="navbar-brand-container-tablet">
-    <a class="navbar-brand" href="{{routeToPath("/")}}">{{site.Config.GetSiteName()}}</a>
+    <a class="navbar-brand-logo" href="{{routeToPath("/")}}">{{yield logo()}}</a>
   </div>
   <div class="navbar" aria-label="{{i18n("wcag_aria_label_nav_main")}}">
     <div class="navbar-brand-container">
-      <a class="navbar-brand" href="{{routeToPath("/")}}">{{site.Config.GetSiteName()}}</a>
+      <a class="navbar-brand-logo" href="{{routeToPath("/")}}">{{yield logo()}}</a>
     </div>
 
     {{if config("search_disabled") != "true"}}
@@ -18,8 +19,8 @@
         <button type="button" class="btn-search-open" aria-label="open search" tabindex="-1">
           <i class="fa fa-search search-icon"></i>
         </button>
-        <input class="form-control form-control-search" type="search" placeholder="{{i18n("search_control_placeholder")}}" name="q" aria-label="{{i18n("search_control_placeholder")}}">
-        <button class="sr-only" type="submit">{{i18n("search_control_submit")}}</button>
+        <input class="form-control form-control-search" type="search" placeholder="{{i18n("nav_search_control_placeholder")}}" name="q" aria-label="{{i18n("nav_search_control_placeholder")}}">
+        <button class="sr-only" type="submit">{{i18n("nav_search_control_sr_submit")}}</button>
         <button type="button" class="btn-search-close" aria-label="close search" tabindex="-1">
           <i class="fa fa-times"></i>
         </button>

package/site/templates/collection/carousel/carousel.jet

@@ -8,8 +8,11 @@
 	{{end}}
 	{{items := .Items[0:maxSlides]}}
 
+	{{playSpeed := config("carousel_play_speed")}}
+	{{fadeTime := config("carousel_fade_time")}}
+
 	{{if len(items) > 0}}
-		<s72-carousel>
+		<s72-carousel play-speed="{{playSpeed}}" fade-time="{{fadeTime}}">
 			<section class="page-collection page-collection-carousel" aria-label="{{i18n("wcag_aria_label_carousel")}}">
 				<h2 class="sr-only">{{i18n("wcag_carousel_h2")}}</h2>
 

package/site/templates/collection/carousel/item.jet

@@ -33,9 +33,11 @@
               {{yield carouselItemSynopsis(synopsis=item.InnerItem.Tagline)}}
             {{end}}
 
+            <s72-availability-label data-slug="{{item.Slug}}"></s72-availability-label>
+            
             {{yield ctaButtons(itemType=item.ItemType) item.InnerItem}}
 
-            <s72-availability-label data-slug="{{item.Slug}}"></s72-availability-label>
+
           </div>
         </div>
       {{end}}

package/site/tr_TR.all.json

@@ -551,10 +551,10 @@
     "other": "İlginiz için teşekkür ederiz."
   },
   "shopping_error_incorrect_cvc": {
-    "other": "Lütfen geçerli bir CVV girin."
+    "other": "Lütfen geçerli bir CVC girin."
   },
   "shopping_error_invalid_cvc": {
-    "other": "Lütfen geçerli bir CVV girin."
+    "other": "Lütfen geçerli bir CVC girin."
   },
   "shopping_error_incorrect_number": {
     "other": "Lütfen geçerli bir Kredi Kart Numarası girin."
@@ -631,6 +631,9 @@
   "shopping_error_payment_intent_authentication_failure": {
     "other": "Kredi Kartınız reddedildi. Lütfen tekrar deneyin."
   },
+  "shopping_error_card_not_supported": {
+    "other": "Kartınız desteklenmiyor."
+  },
   "shopping_complete_rental": {
     "other": "Başardınız!"
   },
@@ -980,7 +983,7 @@
     "other": "Hüküm ve şartları kabul etmelisiniz."
   },
   "shopping_error_item_limit_exceeded": {
-    "other": " Ne yazık ki{{.Title}} tükendi. ."
+    "other": " Ne yazık ki{{.Title}} tükendi."
   },
   "shopping_card_change": {
     "other": "Kredi kartı doğru değil? <a href=\"{{.SubscriptionsURL}}\">Kartınızı güncellemek için buraya tıklayın.</a>"
@@ -1005,7 +1008,7 @@
     "other": "Her Ücretli {{.Interval}} sizin sonra {{.Count}} günlük ücretsiz deneme sürümü bitmeden."
   },
   "shopping_price_plan_note_without_trial": {
-    "other": "Her {{.Interval}} ."
+    "other": "Her {{.Interval}}."
   },
   "shopping_price_plan_note_interval": {
     "one": "{{.Interval}}",
@@ -1331,7 +1334,83 @@
   "pricing_ownership_promo": {
     "other": "Tazmin etmek"
   },
+  "subscription_cta_label": {
+    "other": "Abone olmak {{.Price}}/{{.Recurrence}}"
+  },
+  "subscription_recurrence_year": {
+    "one": "Yıl",
+    "other": "{{.Count}} yıllar"
+  },
+  "subscription_recurrence_month": {
+    "one": "Ay",
+    "other": "{{.Count}} ay"
+  },
+  "subscription_recurrence_week": {
+    "one": "Hafta",
+    "other": "{{.Count}} Haftalar"
+  },
+  "subscription_recurrence_day": {
+    "one": "Gün",
+    "other": "{{.Count}} Günler"
+  },
   "shopping_info_ownership_subscription": {
     "other": "abonelik"
+  },
+  "something_bad_happened": {
+    "other": "Lütfen tekrar deneyin"
+  },
+  "stripe_card_not_supported": {
+    "other": "Kartınız desteklenmiyor."
+  },
+  "nav_search_control_placeholder": {
+    "other": "Arama"
+  },
+  "nav_search_control_sr_submit": {
+    "other": "Aramayı gönder"
+  },
+  "shopping_info_plan_interval": {
+    "one": "{{.Interval}} otomatik olarak yeniler",
+    "other": "Otomatik olarak her yeniler {{.Count}} {{.Interval}}"
+  },
+  "shopping_info_trial_period": {
+    "one": "24 saatlik ücretsiz denemenizi şimdi deneyin!",
+    "other": "Ücretsiz {{.Count}} günlük denemenizi deneyin!"
+  },
+  "usersubscriptions_page_header_seo": {
+    "other": "Abonelikler ve Faturalandırma"
+  },
+  "usersubscriptions_subscription_status_past_due": {
+    "other": "vadesi geçmiş"
+  },
+  "usersubscriptions_subscription_status_unpaid": {
+    "other": "ödenmemiş"
+  },
+  "usersubscriptions_subscription_status_cancelled": {
+    "other": "İptal edildi"
+  },
+  "usersubscriptions_subscription_status_cancelling": {
+    "other": "İptal"
+  },
+  "interval_day": {
+    "one": "gün",
+    "other": "günler"
+  },
+  "interval_week": {
+    "one": "hafta",
+    "other": "haftalar"
+  },
+  "interval_month": {
+    "one": "ay",
+    "other": "aylar"
+  },
+  "interval_year": {
+    "one": "yıl",
+    "other": "yıllar"
+  },
+  "shopping_error_processing_error": {
+    "other": "Kartınız işlenirken bir hata oluştu. Daha sonra veya farklı bir ödeme yöntemiyle tekrar deneyin."
+  },
+  "shopping_error_invalid_session_token": {
+    "other": "Alışveriş oturumunun süresi doldu, lütfen tekrar deneyin."
   }
 }

package/site/uk_UA.all.json

@@ -615,10 +615,10 @@
     "other": "Сталася помилка."
   },
   "shopping_error_incorrect_cvc": {
-    "other": "Будь ласка, введіть дійсний CVV."
+    "other": "Будь ласка, введіть дійсний CVC."
   },
   "shopping_error_invalid_cvc": {
-    "other": "Будь ласка, введіть дійсний CVV."
+    "other": "Будь ласка, введіть дійсний CVC."
   },
   "shopping_error_incorrect_number": {
     "other": "Будь ласка, введіть дійсний номер банківської картки."
@@ -695,6 +695,9 @@
   "shopping_error_payment_intent_authentication_failure": {
     "other": "Банківську картку відхилено. Спробуйте ще раз."
   },
+  "shopping_error_card_not_supported": {
+    "other": "Ваша картка не підтримується."
+  },
   "shopping_complete_rental": {
     "other": "Успішно!"
   },
@@ -1125,7 +1128,7 @@
     "other": "Заряджені кожен {{.Interval}} після вашого {{.Count}} дня закінчується безкоштовно суд."
   },
   "shopping_price_plan_note_without_trial": {
-    "other": "Стягується через кожний {{.Interval}} ."
+    "other": "Стягується через кожний {{.Interval}}."
   },
   "shopping_price_plan_note_interval": {
     "one": "{{.Interval}}",
@@ -1154,7 +1157,9 @@
   },
   "shopping_info_trial_period_offer": {
     "one": "Спробуйте безкоштовну 24-годинну пробну версію зараз!",
-    "other": "Спробуйте безкоштовну пробну версію {{.Count}}"
+    "few": "Спробуйте {{.Count}}-денну безкоштовну пробну версію!",
+    "many": "Спробуйте {{.Count}}-денну безкоштовну пробну версію!",
+    "other": "Спробуйте {{.Count}}-денну безкоштовну пробну версію!"
   },
   "plans_page_header": {
     "other": "Доступні плани"
@@ -1363,7 +1368,103 @@
   "pricing_ownership_promo": {
     "other": "Викупити"
   },
+  "subscription_cta_label": {
+    "other": "Підпишіться {{.Price}}/{{.Recurrence}}"
+  },
+  "subscription_recurrence_year": {
+    "one": "рік",
+    "few": "{{.Count}} років",
+    "many": "{{.Count}} років",
+    "other": "{{.Count}} років"
+  },
+  "subscription_recurrence_month": {
+    "one": "місяць",
+    "few": "{{.Count}} Місяці",
+    "many": "{{.Count}} Місяці",
+    "other": "{{.Count}} Місяці"
+  },
+  "subscription_recurrence_week": {
+    "one": "тиждень",
+    "few": "{{.Count}} тижнів",
+    "many": "{{.Count}} тижнів",
+    "other": "{{.Count}} тижнів"
+  },
+  "subscription_recurrence_day": {
+    "one": "День",
+    "few": "{{.Count}} днів",
+    "many": "{{.Count}} днів",
+    "other": "{{.Count}} днів"
+  },
   "shopping_info_ownership_subscription": {
     "other": "Підписка"
+  },
+  "something_bad_happened": {
+    "other": "Будь ласка спробуйте ще раз"
+  },
+  "stripe_card_not_supported": {
+    "other": "Ваша картка не підтримується."
+  },
+  "nav_search_control_placeholder": {
+    "other": "Пошук"
+  },
+  "nav_search_control_sr_submit": {
+    "other": "Шукати"
+  },
+  "shopping_info_plan_interval": {
+    "one": "Автоматично поновлюється через кожний {{.Interval}}",
+    "few": "Автоматично оновлює кожні {{.Count}} {{.Interval}} сек",
+    "many": "Автоматично оновлює кожні {{.Count}} {{.Interval}} сек",
+    "other": "Автоматично оновлює кожні {{.Count}} {{.Interval}} сек"
+  },
+  "shopping_info_trial_period": {
+    "one": "Спробуйте безкоштовну 24-годинну пробну версію зараз!",
+    "few": "Спробуйте {{.Count}}-денну безкоштовну пробну версію!",
+    "many": "Спробуйте {{.Count}}-денну безкоштовну пробну версію!",
+    "other": "Спробуйте {{.Count}}-денну безкоштовну пробну версію!"
+  },
+  "usersubscriptions_page_header_seo": {
+    "other": "Підписки та виставлення рахунків"
+  },
+  "usersubscriptions_subscription_status_past_due": {
+    "other": "Прострочено"
+  },
+  "usersubscriptions_subscription_status_unpaid": {
+    "other": "Неоплачений"
+  },
+  "usersubscriptions_subscription_status_cancelled": {
+    "other": "Скасовано"
+  },
+  "usersubscriptions_subscription_status_cancelling": {
+    "other": "Скасування"
+  },
+  "interval_day": {
+    "one": "день",
+    "few": "днів",
+    "many": "днів",
+    "other": "днів"
+  },
+  "interval_week": {
+    "one": "тиждень",
+    "few": "тижнів",
+    "many": "тижнів",
+    "other": "тижнів"
+  },
+  "interval_month": {
+    "one": "місяць",
+    "few": "місяців",
+    "many": "місяців",
+    "other": "місяців"
+  },
+  "interval_year": {
+    "one": "рік",
+    "few": "років",
+    "many": "років",
+    "other": "років"
+  },
+  "shopping_error_processing_error": {
+    "other": "Під час обробки вашої картки сталася помилка. Спробуйте пізніше або іншим способом оплати."
+  },
+  "shopping_error_invalid_session_token": {
+    "other": "Сеанс покупки закінчився, повторіть спробу."
   }
 }