feat: widget system for configuring homepage

BREAKING CHANGE: Param 'hero' in params.toml is deprecated.

BREAKING CHANGE: Param 'icon_pack' in %q is deprecated. Use 'iconPack'.

BREAKING CHANGE: 'doc_list' in doc layout is deprecated. Use 'doc-list'.

Closes #11

README.md

@@ -17,7 +17,8 @@ Read [Getting Started](https://www.wangchucheng.com/en/docs/eureka/getting-start
 ## View Document
 
 - **[Getting Started](https://www.wangchucheng.com/en/docs/eureka/getting-started/)**: In [Getting Started](https://www.wangchucheng.com/en/docs/eureka/getting-started/) you will learn how to quickly build a Hugo site with Eureka.
-- **[Content Management](https://www.wangchucheng.com/en/docs/eureka/content-management/)**: In [Getting Started](https://www.wangchucheng.com/en/docs/eureka/getting-started/), I believe you have successfully run the Hugo site using Eureka. Next we will add some content. Content Management will lead you to understand site content structure and editing skills.
-- **[Customize Eureka](https://www.wangchucheng.com/en/docs/eureka/customize-eureka/)**: In [Content Management](https://www.wangchucheng.com/en/docs/eureka/content-management/), you have already learned about all kinds of content of Eureka. Next, we will introduce Eureka's customization options. [Customize Eureka](https://www.wangchucheng.com/en/docs/eureka/customize-eureka/) will lead you to understand how Eureka is configured and its options.
-- **[Multilingual Mode](https://www.wangchucheng.com/en/docs/eureka/multilingual-mode/)**: In addition to [Content Management](https://www.wangchucheng.com/en/docs/eureka/content-management/) and [Customize Eureka](https://www.wangchucheng.com/en/docs/eureka/customize-eureka/) described above, Eureka also supports [Multilingual Mode](https://www.wangchucheng.com/en/docs/eureka/multilingual-mode/). [Multilingual Mode](https://www.wangchucheng.com/en/docs/eureka/multilingual-mode/) will lead you to understand how to build a multilingual site.
-- **[Update Eureka](https://www.wangchucheng.com/en/docs/eureka/update-eureka/)**: [Update Eureka](https://www.wangchucheng.com/en/docs/eureka/update-eureka/) will introduce different ways to update Eureka.
+- **[Homepage Configuration](https://www.wangchucheng.com/en/docs/eureka/homepage-configuration/)**: In [Getting Started](https://www.wangchucheng.com/en/docs/eureka/getting-started/), I believe you have successfully run the Hugo site using Eureka. In [Homepage Configuration](https://www.wangchucheng.com/en/docs/eureka/homepage-configuration/) you will learn how to customize the website homepage.
+- **[Content Management](https://www.wangchucheng.com/en/docs/eureka/content-management/)**: You have configured the website homepage in [Homepage Configuration](https://www.wangchucheng.com/en/docs/eureka/homepage-configuration/). Next we will add some content. Content Management will lead you to understand site content structure and editing skills.
+- **[Customize Eureka](https://www.wangchucheng.com/en/docs/eureka/customization/)**: In [Content Management](https://www.wangchucheng.com/en/docs/eureka/content-management/), you have already learned about all kinds of content of Eureka. Next, we will introduce Eureka's customization options. [Customize Eureka](https://www.wangchucheng.com/en/docs/eureka/customization/) will lead you to understand how Eureka is configured and its options.
+- **[Multilingual Mode](https://www.wangchucheng.com/en/docs/eureka/multilingual-mode/)**: In addition to [Content Management](https://www.wangchucheng.com/en/docs/eureka/content-management/) and [Customize Eureka](https://www.wangchucheng.com/en/docs/eureka/customization/) described above, Eureka also supports [Multilingual Mode](https://www.wangchucheng.com/en/docs/eureka/multilingual-mode/). [Multilingual Mode](https://www.wangchucheng.com/en/docs/eureka/multilingual-mode/) will lead you to understand how to build a multilingual site.
+- **[Update Eureka](https://www.wangchucheng.com/en/docs/eureka/update/)**: [Update Eureka](https://www.wangchucheng.com/en/docs/eureka/update/) will introduce different ways to update Eureka.

README.zh.md

@@ -17,7 +17,8 @@ Eureka致力于为[Hugo](https://gohugo.io/)提供一个优雅，功能丰富且
 ## 阅读文档
 
 - **[入门](https://www.wangchucheng.com/zh/docs/eureka/getting-started/)**：在[入门](https://www.wangchucheng.com/zh/docs/eureka/getting-started/)中你将了解到如何快速搭建一个Eureka主题的Hugo网站。
-- **[内容管理](https://www.wangchucheng.com/zh/docs/eureka/content-management/)**：在[入门](https://www.wangchucheng.com/zh/docs/eureka/getting-started/)中，相信你已经成功运行了使用Eureka主题的Hugo网站。接下来我们将添加一些内容。[内容管理](https://www.wangchucheng.com/zh/docs/eureka/content-management/)将带领你了解网站内容结构及编辑技巧。
-- **[定制Eureka](https://www.wangchucheng.com/zh/docs/eureka/customize-eureka/)**：在[内容管理](https://www.wangchucheng.com/zh/docs/eureka/content-management/)中，你已经了解了Eureka的各类内容。接下来我们将介绍Eureka的定制化选项。[定制Eureka](https://www.wangchucheng.com/zh/docs/eureka/customize-eureka/)将带领你了解Eureka的配置方式及其选项。
-- **[多语言模式](https://www.wangchucheng.com/zh/docs/eureka/multilingual-mode/)**：除了前文的[内容管理](https://www.wangchucheng.com/zh/docs/eureka/content-management/)以及[定制Eureka](https://www.wangchucheng.com/zh/docs/eureka/customize-eureka/)，Eureka也支持[多语言模式](https://www.wangchucheng.com/zh/docs/eureka/multilingual-mode/)。[多语言模式](https://www.wangchucheng.com/zh/docs/eureka/multilingual-mode/)将带领你了解如何构建一个多语言网站。
-- **[更新Eureka](https://www.wangchucheng.com/zh/docs/eureka/update-eureka/)**：[更新Eureka](https://www.wangchucheng.com/zh/docs/eureka/update-eureka/)将介绍通过不同方式更新Eureka的方法。
+- **[主页配置](https://www.wangchucheng.com/zh/docs/eureka/homepage-configuration)**：在[入门](https://www.wangchucheng.com/zh/docs/eureka/getting-started)中，相信你已经成功运行了使用Eureka主题的Hugo网站。在[主页配置](https://www.wangchucheng.com/zh/docs/eureka/homepage-configuration)中你将了解如何自定义网站主页。
+- **[内容管理](https://www.wangchucheng.com/zh/docs/eureka/content-management)**：在[主页配置](https://www.wangchucheng.com/zh/docs/eureka/homepage-configuration)中你已经配置好了主页样式。接下来我们将添加一些内容。[内容管理](https://www.wangchucheng.com/zh/docs/eureka/content-management)将带领你了解网站内容结构及编辑技巧。
+- **[定制Eureka](https://www.wangchucheng.com/zh/docs/eureka/customization/)**：在[内容管理](https://www.wangchucheng.com/zh/docs/eureka/content-management/)中，你已经了解了Eureka的各类内容。接下来我们将介绍Eureka的定制化选项。[定制Eureka](https://www.wangchucheng.com/zh/docs/eureka/customization/)将带领你了解Eureka的配置方式及其选项。
+- **[多语言模式](https://www.wangchucheng.com/zh/docs/eureka/multilingual-mode/)**：除了前文的[内容管理](https://www.wangchucheng.com/zh/docs/eureka/content-management/)以及[定制Eureka](https://www.wangchucheng.com/zh/docs/eureka/customization/)，Eureka也支持[多语言模式](https://www.wangchucheng.com/zh/docs/eureka/multilingual-mode/)。[多语言模式](https://www.wangchucheng.com/zh/docs/eureka/multilingual-mode/)将带领你了解如何构建一个多语言网站。
+- **[更新Eureka](https://www.wangchucheng.com/zh/docs/eureka/update/)**：[更新Eureka](https://www.wangchucheng.com/zh/docs/eureka/update/)将介绍通过不同方式更新Eureka的方法。

archetypes/authors/_index.md

@@ -11,9 +11,9 @@ avatar = ""
 
 # Check the available icons on https://fontawesome.com/.
 # You can get similar results like this <i class="fab fa-github"></i> after searching.
-# Then icon is github and icon_pack is fab for this case.
+# Then icon is github and iconPack is fab for this case.
 [[social]]
   icon = ""
-  icon_pack = ""
+  iconPack = ""
   url = ""
 +++

archetypes/docs/_index.md

@@ -1,4 +1,4 @@
 +++
 title = "Docs"
-layout = "doc_list" #Do not modify
+layout = "doc-list" #Do not modify
 +++

archetypes/widgets/about.md

@@ -0,0 +1,46 @@
++++
+title = "{{ replace .Name "-" " " | title }}"
+weight = 1
+draft = false
+
+role = ""
+bio = ""
+avatar = ""
+
+[organization]
+  name = ""
+  url = ""
+
+# Check the available icons on https://fontawesome.com/.
+# You can get similar results like this <i class="fab fa-github"></i> after searching.
+# Then icon is github and iconPack is fab for this case.
+[[social]]
+  icon = ""
+  iconPack = ""
+  url = ""
+
+[widget]
+  handler = "about"
+
+  # Options: sm, md, lg and xl. Default is md.
+  width = ""
+
+  [widget.sidebar]
+    # Options: left and right. Leave blank to hide.
+    position = ""
+    # Options: sm, md, lg and xl. Default is md.
+    scale = ""
+
+  [widget.background]
+    # Options: primary, secondary, tertiary or any valid color value. Default is primary.
+    color = ""
+
+    # See TODO
+    image = ""
+    # Options: auto, cover and contain. Default is auto.
+    size = ""
+    # Options: center, top, right, bottom, left.
+    position = ""
+    # Options: fixed, local, scroll.
+    attachment = ""
++++

archetypes/widgets/blank.html

@@ -0,0 +1,30 @@
++++
+title = "{{ replace .Name "-" " " | title }}"
+weight = 1
+draft = false
+
+[widget]
+  handler = "blank"
+
+  # Options: sm, md, lg and xl. Default is md.
+  width = ""
+
+  [widget.sidebar]
+    # Options: left and right. Leave blank to hide.
+    position = ""
+    # Options: sm, md, lg and xl. Default is md.
+    scale = ""
+
+  [widget.background]
+    # Options: primary, secondary, tertiary or any valid color value. Default is primary.
+    color = ""
+
+    # See TODO
+    image = ""
+    # Options: auto, cover and contain. Default is auto.
+    size = ""
+    # Options: center, top, right, bottom, left.
+    position = ""
+    # Options: fixed, local, scroll.
+    attachment = ""
++++

archetypes/widgets/pages.md

@@ -0,0 +1,37 @@
++++
+title = "{{ replace .Name "-" " " | title }}"
+weight = 1
+draft = false
+
+# Section you want to display
+section = "posts"
+# Pages count
+count = 5
+# Options: card, plain and masonry.
+style = "card"
+
+[widget]
+  handler = "pages"
+
+  # Options: sm, md, lg and xl. Default is md.
+  width = ""
+
+  [widget.sidebar]
+    # Options: left and right. Leave blank to hide.
+    position = ""
+    # Options: sm, md, lg and xl. Default is md.
+    scale = ""
+
+  [widget.background]
+    # Options: primary, secondary, tertiary or any valid color value. Default is primary.
+    color = ""
+
+    # See TODO
+    image = ""
+    # Options: auto, cover and contain. Default is auto.
+    size = ""
+    # Options: center, top, right, bottom, left.
+    position = ""
+    # Options: fixed, local, scroll.
+    attachment = ""
++++

archetypes/widgets/vintage.md

@@ -0,0 +1,35 @@
++++
+title = "{{ replace .Name "-" " " | title }}"
+weight = 1
+draft = false
+
+slogan = ""
+# See TODO
+imgLeft = ""
+imgRight = ""
+
+[widget]
+  handler = "vintage"
+
+  # Options: sm, md, lg and xl. Default is md.
+  width = ""
+
+  [widget.sidebar]
+    # Options: left and right. Leave blank to hide.
+    position = ""
+    # Options: sm, md, lg and xl. Default is md.
+    scale = ""
+
+  [widget.background]
+    # Options: primary, secondary, tertiary or any valid color value. Default is primary.
+    color = ""
+
+    # See TODO
+    image = ""
+    # Options: auto, cover and contain. Default is auto.
+    size = ""
+    # Options: center, top, right, bottom, left.
+    position = ""
+    # Options: fixed, local, scroll.
+    attachment = ""
++++

assets/css/tailwind.config.js

@@ -17,6 +17,12 @@ module.exports = {
       'mono': ['SFMono-Regular', 'Menlo'],
     },
     extend: {
+      height: {
+        '(screen-16)': 'calc(100vh - 4rem)',
+        '96': '24rem',
+        '128': '32rem',
+        '160': '40rem',
+      },
       minHeight: {
         '16': '4rem',
       },

assets/js/eureka.js

@@ -112,7 +112,7 @@ function resizeInstance(instance) {
     resizeGridItem(item);
 }
 
-//color schema
+//color components/schema
 function getcolorscheme() {
     let storageColorScheme = localStorage.getItem("lightDarkMode")
     let element = document.getElementById('lightDarkMode');

data/eureka.toml

@@ -0,0 +1 @@
+version = "0.4.0"

exampleSite/config/_default/menus.toml

@@ -1,6 +1,6 @@
 [[main]]
   name = "About"
-  url = "/about/"
+  url = "#about"
   weight = 1
 
 [[main]]

exampleSite/config/_default/params.toml

@@ -18,12 +18,6 @@ icon = "images/icon.png"
 publisherName = "C. Wang"
 publisherLogo = ""
 
-[hero]
-  slogan = "We are all in the gutter, but some of us are looking at the stars."
-  # Specify the image name in `assets/images/` folder.
-  imgLeft = "images/hero-left.jpg"
-  imgRight = "images/hero-right.jpg"
-
 [math]
   handler = "katex"
 

exampleSite/content/authors/example-author/_index.md

@@ -3,25 +3,25 @@
 title = "Example Author"
 role = "Example Role"
 bio = "Aenean vel bibendum quam. Aliquam at mollis quam. Proin efficitur."
-avatar = "images/avatar.jpg"
+avatar = "images/icon.png"
 
 [organization]
   name = "Example Organization"
   url = "https://example.com/"
 
 [[social]]
   icon = "envelope"
-  icon_pack = "fas"
+  iconPack = "fas"
   url = "mailto:[email protected]"
 
 [[social]]
   icon = "twitter"
-  icon_pack = "fab"
+  iconPack = "fab"
   url = "https://example.com/"
 
 [[social]]
   icon = "github"
-  icon_pack = "fab"
+  iconPack = "fab"
   url = "https://example.com/"
 
 +++

exampleSite/content/authors/hugo-authors/_index.md

@@ -11,17 +11,17 @@ shortContent = "Example Short Content"
 
 [[social]]
   icon = "envelope"
-  icon_pack = "fas"
+  iconPack = "fas"
   url = "mailto:[email protected]"
 
 [[social]]
   icon = "twitter"
-  icon_pack = "fab"
+  iconPack = "fab"
   url = "https://example.com/"
 
 [[social]]
   icon = "github"
-  icon_pack = "fab"
+  iconPack = "fab"
   url = "https://example.com/"
 
 +++

exampleSite/content/docs/_index.md

@@ -1,4 +1,4 @@
 +++
 title = "Docs"
-layout = "doc_list"
+layout = "doc-list"
 +++