feat(ui): new design footer content layout

cotes2020 · May 12, 2023 · 3210c59 · 3210c59
1 parent 83f1c34
commit 3210c59
Show file tree

Hide file tree

Showing 22 changed files with 76 additions and 74 deletions.
diff --git a/_data/locales/ar.yml b/_data/locales/ar.yml
@@ -40,7 +40,7 @@ copyright:
     ما لم يذكر خلاف ذلك ، يتم ترخيص منشورات المدونة على هذا الموقع
     بموجب ترخيص Creative Commons Attribution 4.0 International (CC BY 4.0) من قبل المؤلف.
 
-meta: باستخدام :PLATFORM السمة :THEME.
+meta: باستخدام :PLATFORM السمة :THEME
 
 not_found:
   statment: عذرا, الرابط التالي غير صالح أو انه يشير إلى صفحة غير موجودة.

diff --git a/_data/locales/bg-BG.yml b/_data/locales/bg-BG.yml
@@ -40,7 +40,7 @@ copyright:
     Освен ако не е посочено друго, публикациите в блога на този сайт са лицензирани
     под лиценза Creative Commons Attribution 4.0 (CC BY 4.0) от автора.
 
-meta: Създадено чрез :PLATFORM и :THEME тема.
+meta: Създадено чрез :PLATFORM и :THEME тема
 
 not_found:
   statment: Съжалявам, но на този URL адрес няма налично съдържание.

diff --git a/_data/locales/cs-CZ.yml b/_data/locales/cs-CZ.yml
@@ -40,7 +40,7 @@ copyright:
     Pokud není uvedeno jinak, jsou příspěvky na tomto webu licencovány
     pod licencí Creative Commons Attribution 4.0 International (CC BY 4.0) Licence autora.
 
-meta: Použití :PLATFORM s motivem :THEME.
+meta: Použití :PLATFORM s motivem :THEME
 
 not_found:
   statment: Omlouváme se, adresu URL jsme špatně umístili nebo odkazuje na něco, co neexistuje.

diff --git a/_data/locales/de-DE.yml b/_data/locales/de-DE.yml
@@ -39,7 +39,7 @@ copyright:
   verbose: >-
     Alle Einträge auf dieser Seite stehen, soweit nicht anders angegeben, unter der Lizenz Creative Commons Attribution 4.0 (CC BY 4.0).
 
-meta: Powered by :PLATFORM with :THEME theme.
+meta: Powered by :PLATFORM with :THEME theme
 
 not_found:
   statment: Entschuldigung, dieser Link verweist auf keine vorhandene Ressource.

diff --git a/_data/locales/el-GR.yml b/_data/locales/el-GR.yml
@@ -40,7 +40,7 @@ copyright:
     Εκτός αλλού ή οπουδήποτε αλλού, τα blog posts σε αυτήν την σελίδα βρίσκονται υπο την άδεια
     Creative Commons Attribution 4.0 International (CC BY 4.0) του δημιουργού.
 
-meta: Αξιοποιώντας την :PLATFORM theme :THEME.
+meta: Αξιοποιώντας την :PLATFORM theme :THEME
 
 not_found:
   statment: Συγνώμη, έχουμε τοποθετήσει λάθος αυτήν την διεύθυνση URL ή υποδεικνύει κάτι που δεν υπάρχει.

diff --git a/_data/locales/en.yml b/_data/locales/en.yml
@@ -40,7 +40,7 @@ copyright:
     Except where otherwise noted, the blog posts on this site are licensed
     under the Creative Commons Attribution 4.0 International (CC BY 4.0) License by the author.
 
-meta: Using the :PLATFORM theme :THEME.
+meta: Using the :PLATFORM theme :THEME
 
 not_found:
   statment: Sorry, we've misplaced that URL or it's pointing to something that doesn't exist.

diff --git a/_data/locales/es-ES.yml b/_data/locales/es-ES.yml
@@ -40,7 +40,7 @@ copyright:
     Salvo que se indique explícitamente, las entradas de este blog están licenciadas
     bajo la Creative Commons Attribution 4.0 International (CC BY 4.0) License por el autor.
 
-meta: Hecho con :PLATFORM usando el tema :THEME.
+meta: Hecho con :PLATFORM usando el tema :THEME
 
 not_found:
   statment: Lo sentimos, hemos perdido esa URL o apunta a algo que no existe.

diff --git a/_data/locales/fi-FI.yml b/_data/locales/fi-FI.yml
@@ -39,7 +39,7 @@ copyright:
   verbose: >-
     Paitsi jos erikseen mainitaan on kaikki sisältö Creative Commons Attribution 4.0 International (CC BY 4.0) Lisensoitu kirjoittajan toimesta.
 
-meta: Käytetään :PLATFORM iä Teema :THEME.
+meta: Käytetään :PLATFORM iä Teema :THEME
 
 not_found:
   statment: Valitettavasti tällä URL-osoitteella ei ole saatavilla sisältöä.

diff --git a/_data/locales/hu-HU.yml b/_data/locales/hu-HU.yml
@@ -42,7 +42,7 @@ copyright:
     Creative Commons Attribution 4.0 International (CC BY 4.0) licenccel rendelkeznek,
     hacsak másképp nincs jelezve.
 
-meta: Készítve :PLATFORM motorral :THEME témával.
+meta: Készítve :PLATFORM motorral :THEME témával
 
 not_found:
   statment: Sajnáljuk, az URL-t rosszul helyeztük el, vagy valami nem létezőre mutat.

diff --git a/_data/locales/id-ID.yml b/_data/locales/id-ID.yml
@@ -40,7 +40,7 @@ copyright:
     Kecuali jika dinyatakan, Postingan blog di situs ini dilisensikan
     di bawah Lisensi Creative Commons Attribution 4.0 International (CC BY 4.0) oleh penulis.
 
-meta: Didukung oleh :PLATFORM dengan tema :THEME.
+meta: Didukung oleh :PLATFORM dengan tema :THEME
 
 not_found:
   statment: Maaf, kami gagal menemukan URL itu atau memang mengarah ke sesuatu yang tidak ada.

diff --git a/_data/locales/it-IT.yml b/_data/locales/it-IT.yml
@@ -40,7 +40,7 @@ copyright:
     Eccetto quando esplicitamente menzionato, i post di questo blog sono da ritenersi sotto
     i termini di licenza Creative Commons Attribution 4.0 International (CC BY 4.0).
 
-meta: Servizio offerto da :PLATFORM con tema :THEME.
+meta: Servizio offerto da :PLATFORM con tema :THEME
 not_found:
   statment: Ci scusiamo, non è stato possibile trovare l'URL in questione. Potrebbe puntare ad una pagina non esistente.
 

diff --git a/_data/locales/ko-KR.yml b/_data/locales/ko-KR.yml
@@ -40,7 +40,7 @@ copyright:
     명시되지 않는 한 이 사이트의 블로그 게시물은 작성자의
     Creative Commons Attribution 4.0 International(CC BY 4.0) 라이선스에 따라 사용이 허가되었습니다.
 
-meta: Powered by :PLATFORM with :THEME theme.
+meta: Powered by :PLATFORM with :THEME theme
 
 not_found:
   statment: 해당 URL은 존재하지 않습니다.

diff --git a/_data/locales/my-MM.yml b/_data/locales/my-MM.yml
@@ -40,7 +40,7 @@ copyright:
     အခြားမှတ်သားထားချက်များမှလွဲ၍ ဤဆိုက်ရှိ ဘလော့ဂ်ပို့စ်များသည် စာရေးသူ၏
     Creative Commons Attribution 4.0 International (CC BY 4.0) အောက်တွင် လိုင်စင်ရထားပါသည်။
 
-meta: Powered by :PLATFORM with :THEME theme.
+meta: Powered by :PLATFORM with :THEME theme
 
 not_found:
   statment: ဝမ်းနည်းပါသည်၊ ကျွန်ုပ်တို့သည် အဆိုပါ URL ကို မှားယွင်းစွာ နေရာချထားခြင်း သို့မဟုတ် ၎င်းသည် မရှိသောအရာကို ညွှန်ပြနေပါသည်။

diff --git a/_data/locales/pt-BR.yml b/_data/locales/pt-BR.yml
@@ -40,7 +40,7 @@ copyright:
     Exceto onde indicado de outra forma, as postagens do blog neste site são licenciadas sob a
     Creative Commons Attribution 4.0 International (CC BY 4.0) License pelo autor.
 
-meta: Feito com :PLATFORM usando o tema :THEME.
+meta: Feito com :PLATFORM usando o tema :THEME
 
 not_found:
   statment: Desculpe, a página não foi encontrada.

diff --git a/_data/locales/ru-RU.yml b/_data/locales/ru-RU.yml
@@ -40,7 +40,7 @@ copyright:
     Публикации на сайте защищены лицензией Creative Commons Attribution 4.0 International (CC BY 4.0),
     если в тексте публикации не указано иное.
 
-meta: Powered by :PLATFORM with :THEME theme.
+meta: Powered by :PLATFORM with :THEME theme
 
 not_found:
   statment: Извините, эта ссылка указывает на ресурс который не существует.

diff --git a/_data/locales/tr-TR.yml b/_data/locales/tr-TR.yml
@@ -40,7 +40,7 @@ copyright:
     Aksi belirtilmediği sürece, bu sitedeki gönderiler Creative Commons Atıf 4.0 Uluslararası (CC BY 4.0) Lisansı altındadır.
     Kısaca sayfa linkini de vererek paylaşabilir veya düzenleyip paylaşabilirsin.
 
-meta: :PLATFORM ve :THEME teması.
+meta: :PLATFORM ve :THEME teması
 
 not_found:
   statment: Üzgünüz, bu linki yanlış yerleştirdik veya var olmayan bir şeye işaret ediyor.

diff --git a/_data/locales/uk-UA.yml b/_data/locales/uk-UA.yml
@@ -40,7 +40,7 @@ copyright:
     Публікації на сайті захищено ліцензією Creative Commons Attribution 4.0 International (CC BY 4.0),
     якщо інше не вказано в тексті.
 
-meta: Powered by :PLATFORM with :THEME theme.
+meta: Powered by :PLATFORM with :THEME theme
 
 not_found:
   statment: Вибачте, це посилання вказує на ресурс, що не існує.

diff --git a/_data/locales/vi-VN.yml b/_data/locales/vi-VN.yml
@@ -38,7 +38,9 @@ copyright:
   brief: Một số quyền được bảo lưu.
   verbose: >-
     Trừ khi có ghi chú khác, các bài viết đăng trên trang này được cấp phép bởi tác giả theo giấy phép Creative Commons Attribution 4.0 International (CC BY 4.0).
-meta: Trang web này được tạo bởi :PLATFORM với chủ đề :THEME.
+
+meta: Trang web này được tạo bởi :PLATFORM với chủ đề :THEME
+
 not_found:
   statment: Xin lỗi, chúng tôi đã đặt nhầm URL hoặc đường dẫn trỏ đến một trang nào đó không tồn tại.
 

diff --git a/_data/locales/zh-CN.yml b/_data/locales/zh-CN.yml
@@ -39,7 +39,7 @@ copyright:
   verbose: >-
     除非另有说明，本网站上的博客文章均由作者按照知识共享署名 4.0 国际 (CC BY 4.0) 许可协议进行授权。
 
-meta: 本站由 :PLATFORM 生成，采用 :THEME 主题。
+meta: 本站采用 :PLATFORM 主题 :THEME
 
 not_found:
   statment: 抱歉，我们放错了该 URL，或者它指向了不存在的内容。

diff --git a/_includes/footer.html b/_includes/footer.html
@@ -2,41 +2,33 @@
 
 <footer>
   <div class="container pl-lg-4 pr-lg-4">
-    <div class="d-flex justify-content-between align-items-center text-muted ml-md-3 mr-md-3">
-      <div class="footer-left">
-        <p class="mb-0">
-          © {{ 'now' | date: '%Y' }}
-          <a href="{{ site.social.links[0] }}">{{ site.social.name }}</a>.
-          {% if site.data.locales[include.lang].copyright.brief %}
-            <span
-              data-toggle="tooltip"
-              data-placement="top"
-              title="{{ site.data.locales[include.lang].copyright.verbose }}"
-            >
-              {{- site.data.locales[include.lang].copyright.brief -}}
-            </span>
-          {% endif %}
-        </p>
-      </div>
-
-      <div class="footer-right">
-        <p class="mb-0">
-          {%- capture _platform -%}
+    <div class="d-flex justify-content-center align-items-center text-muted ml-md-3 mr-md-3">
+      <p>
+        {%- capture _platform -%}
           <a href="https://jekyllrb.com" target="_blank" rel="noopener">Jekyll</a>
-          {%- endcapture -%}
+        {%- endcapture -%}
 
-          {%- capture _theme -%}
+        {%- capture _theme -%}
           <a href="https://github.com/cotes2020/jekyll-theme-chirpy" target="_blank" rel="noopener">Chirpy</a>
-          {%- endcapture -%}
+        {%- endcapture -%}
+
+        {{ site.data.locales[include.lang].meta | replace: ':PLATFORM', _platform | replace: ':THEME', _theme }}
+      </p>
 
-          {{
-            site.data.locales[include.lang].meta
-            | default: 'Using the :PLATFORM theme :THEME.'
-            | replace: ':PLATFORM', _platform
-            | replace: ':THEME', _theme
-          }}
-        </p>
-      </div>
+      <p>
+        {{- '©' }}
+        {{ 'now' | date: '%Y' }}
+        <a href="{{ site.social.links[0] }}">{{ site.social.name }}</a>.
+        {% if site.data.locales[include.lang].copyright.brief %}
+          <span
+            data-toggle="tooltip"
+            data-placement="top"
+            title="{{ site.data.locales[include.lang].copyright.verbose }}"
+          >
+            {{- site.data.locales[include.lang].copyright.brief -}}
+          </span>
+        {% endif %}
+      </p>
     </div>
   </div>
 </footer>
diff --git a/_sass/addon/commons.scss b/_sass/addon/commons.scss
@@ -194,10 +194,7 @@ footer {
     line-height: 1.2rem;
     padding-bottom: 1rem;
     border-top: 1px solid var(--main-border-color);
-
-    > div {
-      width: 350px;
-    }
+    flex-wrap: wrap;
   }
 
   a {
@@ -213,8 +210,10 @@ footer {
     }
   }
 
-  .footer-right {
-    text-align: right;
+  p {
+    width: 100%;
+    text-align: center;
+    margin-bottom: 0;
   }
 }
 
@@ -1185,7 +1184,7 @@ $btn-mb: 0.5rem;
 #main-wrapper {
   background-color: var(--main-bg);
   position: relative;
-  min-height: calc(100vh - #{$footer-height});
+  min-height: calc(100vh - $footer-height-mobile);
 
   @include pl-pr(0);
 }
@@ -1294,22 +1293,6 @@ $btn-mb: 0.5rem;
 */
 
 @media all and (max-width: 576px) {
-  footer {
-    height: $footer-height-mobile;
-
-    div.d-flex {
-      padding: 1.5rem 0;
-      line-height: 1.65;
-      flex-wrap: wrap;
-      justify-content: space-around !important;
-    }
-
-    .footer-left,
-    .footer-right {
-      text-align: center;
-    }
-  }
-
   #main-wrapper {
     min-height: calc(100vh - #{$footer-height-mobile});
   }
@@ -1369,6 +1352,14 @@ $btn-mb: 0.5rem;
 
   footer {
     @include slide;
+
+    height: $footer-height-mobile;
+
+    div.d-flex {
+      padding: 1.5rem 0;
+      line-height: 1.65;
+      flex-wrap: wrap;
+    }
   }
 
   [#{$sidebar-display}] {
@@ -1470,6 +1461,23 @@ $btn-mb: 0.5rem;
     margin-left: $sidebar-width;
   }
 
+  #main-wrapper {
+    min-height: calc(100vh - $footer-height);
+  }
+
+  footer {
+    p {
+      width: auto;
+      &:last-child {
+        &::before {
+          content: '-';
+          margin: 0 0.75rem;
+          opacity: 0.8;
+        }
+      }
+    }
+  }
+
   #sidebar {
     .profile-wrapper {
       margin-top: 3rem;

diff --git a/_sass/addon/variables.scss b/_sass/addon/variables.scss
@@ -12,7 +12,7 @@ $sidebar-width-large: 300px !default; /* screen width: >= 1650px */
 $topbar-height: 3rem !default;
 $search-max-width: 210px !default;
 $footer-height: 5rem !default;
-$footer-height-mobile: 6rem !default; /* screen width: <= 576px */
+$footer-height-mobile: 6rem !default; /* screen width: < 850px */
 $main-content-max-width: 1250px !default;
 $bottom-min-height: 35rem !default;
 $base-radius: 0.5rem;