From 82b3ffe013f45abd855d927cd5254f8222a959b6 Mon Sep 17 00:00:00 2001 From: Sebas Risco Date: Wed, 13 Oct 2021 17:59:51 +0200 Subject: [PATCH 01/20] =?UTF-8?q?=F0=9F=8D=B1=20Add=20orcid=20and=20resear?= =?UTF-8?q?chgate=20icons?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- assets/icons/orcid.svg | 1 + assets/icons/researchgate.svg | 1 + 2 files changed, 2 insertions(+) create mode 100644 assets/icons/orcid.svg create mode 100644 assets/icons/researchgate.svg diff --git a/assets/icons/orcid.svg b/assets/icons/orcid.svg new file mode 100644 index 00000000..65aa73b8 --- /dev/null +++ b/assets/icons/orcid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/icons/researchgate.svg b/assets/icons/researchgate.svg new file mode 100644 index 00000000..d4377d58 --- /dev/null +++ b/assets/icons/researchgate.svg @@ -0,0 +1 @@ + \ No newline at end of file From 83a18dfd7c67a156927a0dbaf06e162e4a4824ad Mon Sep 17 00:00:00 2001 From: Sebas Risco Date: Wed, 13 Oct 2021 18:01:43 +0200 Subject: [PATCH 02/20] =?UTF-8?q?=F0=9F=92=84=20Add=20full=20cool-gray=20c?= =?UTF-8?q?olor=20scheme?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- assets/css/schemes/cool-gray.css | 37 ++++++++++++++++++++++++++++++++ 1 file changed, 37 insertions(+) create mode 100644 assets/css/schemes/cool-gray.css diff --git a/assets/css/schemes/cool-gray.css b/assets/css/schemes/cool-gray.css new file mode 100644 index 00000000..4415fd57 --- /dev/null +++ b/assets/css/schemes/cool-gray.css @@ -0,0 +1,37 @@ +/* Ocean scheme */ +:root { + --color-neutral: #fff; + /* Cool Gray */ + --color-neutral-50: #f8fafc; + --color-neutral-100: #f1f5f9; + --color-neutral-200: #e2e8f0; + --color-neutral-300: #cbd5e1; + --color-neutral-400: #94a3b8; + --color-neutral-500: #64748b; + --color-neutral-600: #475569; + --color-neutral-700: #334155; + --color-neutral-800: #1e293b; + --color-neutral-900: #0f172a; + /* Cool Gray */ + --color-primary-50: #f8fafc; + --color-primary-100: #f1f5f9; + --color-primary-200: #e2e8f0; + --color-primary-300: #cbd5e1; + --color-primary-400: #94a3b8; + --color-primary-500: #64748b; + --color-primary-600: #475569; + --color-primary-700: #334155; + --color-primary-800: #1e293b; + --color-primary-900: #0f172a; + /* Cool Gray */ + --color-secondary-50: #f8fafc; + --color-secondary-100: #f1f5f9; + --color-secondary-200: #e2e8f0; + --color-secondary-300: #cbd5e1; + --color-secondary-400: #94a3b8; + --color-secondary-500: #64748b; + --color-secondary-600: #475569; + --color-secondary-700: #334155; + --color-secondary-800: #1e293b; + --color-secondary-900: #0f172a; +} From aec564a4c4657a578eed2445e98a652a60af7903 Mon Sep 17 00:00:00 2001 From: Sebas Risco Date: Wed, 13 Oct 2021 18:04:18 +0200 Subject: [PATCH 03/20] =?UTF-8?q?=F0=9F=93=9D=20Add=20new=20user?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- exampleSite/content/users.md | 1 + 1 file changed, 1 insertion(+) diff --git a/exampleSite/content/users.md b/exampleSite/content/users.md index eae73fed..ce2953cc 100644 --- a/exampleSite/content/users.md +++ b/exampleSite/content/users.md @@ -19,5 +19,6 @@ Real websites that are built with Congo. | -------------------------------------------- | ---------------------------- | | [jamespanther.com](https://jamespanther.com) | Personal site - Theme author | | [zekeriyaay.com](https://zekeriyaay.com) | Personal cheat sheets site | +| [srisco.dev](https://srisco.dev) | Personal site | **Congo user?** To add your site to this list, [submit a pull request](https://github.com/jpanther/congo/blob/dev/exampleSite/content/users.md). From 9f13b440d2116fee4ed0e8b73ffe920c88f5e800 Mon Sep 17 00:00:00 2001 From: Sebas Risco Date: Thu, 14 Oct 2021 18:00:56 +0200 Subject: [PATCH 04/20] =?UTF-8?q?=F0=9F=92=84=20Update=20Cool=20Gray=20sch?= =?UTF-8?q?eme=20(it=20was=20Blue=20Gray)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- assets/css/schemes/cool-gray.css | 62 ++++++++++++++++---------------- 1 file changed, 31 insertions(+), 31 deletions(-) diff --git a/assets/css/schemes/cool-gray.css b/assets/css/schemes/cool-gray.css index 4415fd57..acae649c 100644 --- a/assets/css/schemes/cool-gray.css +++ b/assets/css/schemes/cool-gray.css @@ -1,37 +1,37 @@ -/* Ocean scheme */ +/* Cool gray scheme */ :root { --color-neutral: #fff; /* Cool Gray */ - --color-neutral-50: #f8fafc; - --color-neutral-100: #f1f5f9; - --color-neutral-200: #e2e8f0; - --color-neutral-300: #cbd5e1; - --color-neutral-400: #94a3b8; - --color-neutral-500: #64748b; - --color-neutral-600: #475569; - --color-neutral-700: #334155; - --color-neutral-800: #1e293b; - --color-neutral-900: #0f172a; + --color-neutral-50: #F9FAFB; + --color-neutral-100: #F3F4F6; + --color-neutral-200: #E5E7EB; + --color-neutral-300: #D1D5DB; + --color-neutral-400: #9CA3AF; + --color-neutral-500: #6B7280; + --color-neutral-600: #4B5563; + --color-neutral-700: #374151; + --color-neutral-800: #1F2937; + --color-neutral-900: #111827; /* Cool Gray */ - --color-primary-50: #f8fafc; - --color-primary-100: #f1f5f9; - --color-primary-200: #e2e8f0; - --color-primary-300: #cbd5e1; - --color-primary-400: #94a3b8; - --color-primary-500: #64748b; - --color-primary-600: #475569; - --color-primary-700: #334155; - --color-primary-800: #1e293b; - --color-primary-900: #0f172a; + --color-primary-50: #F9FAFB; + --color-primary-100: #F3F4F6; + --color-primary-200: #E5E7EB; + --color-primary-300: #D1D5DB; + --color-primary-400: #9CA3AF; + --color-primary-500: #6B7280; + --color-primary-600: #4B5563; + --color-primary-700: #374151; + --color-primary-800: #1F2937; + --color-primary-900: #111827; /* Cool Gray */ - --color-secondary-50: #f8fafc; - --color-secondary-100: #f1f5f9; - --color-secondary-200: #e2e8f0; - --color-secondary-300: #cbd5e1; - --color-secondary-400: #94a3b8; - --color-secondary-500: #64748b; - --color-secondary-600: #475569; - --color-secondary-700: #334155; - --color-secondary-800: #1e293b; - --color-secondary-900: #0f172a; + --color-secondary-50: #F9FAFB; + --color-secondary-100: #F3F4F6; + --color-secondary-200: #E5E7EB; + --color-secondary-300: #D1D5DB; + --color-secondary-400: #9CA3AF; + --color-secondary-500: #6B7280; + --color-secondary-600: #4B5563; + --color-secondary-700: #374151; + --color-secondary-800: #1F2937; + --color-secondary-900: #111827; } From 41751dec85097c8c075f64ccdd9e6d1f35424de9 Mon Sep 17 00:00:00 2001 From: James Panther <4462786+jpanther@users.noreply.github.com> Date: Sun, 17 Oct 2021 10:23:42 +1100 Subject: [PATCH 05/20] =?UTF-8?q?=F0=9F=93=9D=20Documentation=20updates?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- exampleSite/content/docs/configuration.md | 16 ++++++++-------- exampleSite/content/docs/front-matter.md | 2 +- .../content/docs/homepage-layout/index.md | 12 ++++++++---- 3 files changed, 17 insertions(+), 13 deletions(-) diff --git a/exampleSite/content/docs/configuration.md b/exampleSite/content/docs/configuration.md index 1e6bd5cb..7db2cb45 100644 --- a/exampleSite/content/docs/configuration.md +++ b/exampleSite/content/docs/configuration.md @@ -19,7 +19,7 @@ The default theme configuration is documented in each file so you can freely adj As outlined in the [installation instructions]({{< ref "/docs/installation#set-up-theme-configuration-files" >}}), you should adjust your theme configuration by modifying the files in the `config/_default/` folder of your Hugo project and delete the `config.toml` file in your project root. {{< /alert >}} -## Site Configuration +## Site configuration Standard Hugo configuration variables are respected throughout the theme, however there are some specific things that should be configured for the best experience. @@ -30,9 +30,9 @@ Note that the variable names provided in this table use dot notation to simplify |Name|Type|Default|Description| | --- | --- | --- | --- | -|`theme`|string|`"congo"`|When using Hugo Modules this config value should be removed. For all other installation types, this must be set to `"congo"` for the theme to function.| +|`theme`|string|`"congo"`|When using Hugo Modules this config value should be removed. For all other installation types, this must be set to `congo` for the theme to function.| |`baseURL`|string|_Not set_|The URL to the root of the website.| -|`languageCode`|string|`en`|The language of the website for site metadata purposes. It can be a top-level language (ie. `"en"`) or a sub-variant (ie. `en-AU`)."| +|`languageCode`|string|`"en"`|The language of the website for site metadata purposes. It can be a top-level language (ie. `en`) or a sub-variant (ie. `en-AU`)."| |`defaultContentLanguage`|string|`"en"`|This value determines the language of theme components."| |`title`|string|`"Congo"`|The title of the website. This will be displayed in the site header and footer.| |`copyright`|string|_Not set_|A Markdown string containing the copyright message to be displayed in the site footer. If none is provided, Congo will automatically generate a copyright string using the site `title`. @@ -41,11 +41,11 @@ Note that the variable names provided in this table use dot notation to simplify |`author.name`|string|_Not set_|The author's name. This will be displayed in article footers, and on the homepage when the profile layout is used.| |`author.image`|string|_Not set_|Path to the image file of the author. The image should be a 1:1 aspect ratio and placed in the site's `static/` folder.| |`author.links`|array of objects|_Not set_|The links to display alongside the author's details. The config file contains example links which can simply be uncommented to enable. The order that the links are displayed is determined by the order they appear in the array. Custom links can be added by providing corresponding SVG icon assets in `assets/icons/`.| -|`[permalinks]`||_Not set_|Refer to the [Hugo docs](https://gohugo.io/content-management/urls/#permalinks) for permalink configuration.| -|`[taxonomies]`||_Not set_|Refer to the [Hugo docs](https://gohugo.io/content-management/taxonomies/) for taxonomy configuration.| +|`permalinks`||_Not set_|Refer to the [Hugo docs](https://gohugo.io/content-management/urls/#permalinks) for permalink configuration.| +|`taxonomies`||_Not set_|Refer to the [Organising content]({{< ref "getting-started#organising-content" >}}) section for taxonomy configuration.| -## Theme Parameters +## Theme parameters Congo provides a large number of configuration parameters that control how the theme functions. The table below outlines every available parameter in the `config/_default/params.toml` file. @@ -55,7 +55,7 @@ Many of the article defaults here can be overridden on a per article basis by sp |Name|Type|Default|Description| | --- | --- | --- | --- | |`colorScheme`|string|`"congo"`|The theme colour scheme to use. Valid values are `congo` (default), `avocado`, `ocean` and `fire`. Refer to [Advanced Customisation]({{< ref "advanced-customisation#colour-schemes" >}}) for more details.| -|`logo`|string|_Not set_|The relative path to the site logo file within the Hugo assets folder. The logo file should be provided at 2x resolution and supports any image dimensions.| +|`logo`|string|_Not set_|The relative path to the site logo file within the `assets/` folder. The logo file should be provided at 2x resolution and supports any image dimensions.| |`description`|string|_Not set_|The description of the website for metadata purposes.| |`mainSections`|array of strings|_Not set_|The sections that should be displayed in the recent articles list. If not provided the section with the greatest number of articles is used.| |`robots`|string|_Not set_|String that indicates how robots should handle your site. If set, it will be output in the page head. Refer to [Google's docs](https://developers.google.com/search/docs/advanced/robots/robots_meta_tag#directives) for valid values.| @@ -77,7 +77,7 @@ Many of the article defaults here can be overridden on a per article basis by sp |`list.groupByYear`|boolean|`true`|Whether or not articles are grouped by year on list pages.| |`sitemap.excludedKinds`|array of strings|`["taxonomy", "term"]`|Kinds of content that should be excluded from the generated `/sitemap.xml` file. Refer to the [Hugo docs](https://gohugo.io/templates/section-templates/#page-kinds) for acceptable values.| |`taxonomy.showTermCount`|boolean|`true`|Whether or not the number of articles within a taxonomy term is displayed on the taxonomy listing.| -|`fathomAnalytics.site`|string|_Not set_|The site code generated by Fathom Analytics for the website. Refer to the [Analytics docs]({{< ref "partials#analytics" >}}) below for more details.| +|`fathomAnalytics.site`|string|_Not set_|The site code generated by Fathom Analytics for the website. Refer to the [Analytics docs]({{< ref "partials#analytics" >}}) for more details.| |`fathomAnalytics.domain`|string|_Not set_|If using a custom domain with Fathom Analytics, provide it here to serve `script.js` from the custom domain.| |`verification.google`|string|_Not set_|The site verification string provided by Google to be included in the site metadata.| |`verification.bing`|string|_Not set_|The site verification string provided by Bing to be included in the site metadata.| diff --git a/exampleSite/content/docs/front-matter.md b/exampleSite/content/docs/front-matter.md index 334bd682..7be4e04e 100644 --- a/exampleSite/content/docs/front-matter.md +++ b/exampleSite/content/docs/front-matter.md @@ -7,7 +7,7 @@ slug: "front-matter" tags: ["front matter", "config", "docs"] --- -In addition to the [default Hugo front matter parameters](https://gohugo.io/content-management/front-matter/#front-matter-variables), Congo adds a number of additional options to customise the presentation of individual articles. All the available theme parameters are listed below. +In addition to the [default Hugo front matter parameters](https://gohugo.io/content-management/front-matter/#front-matter-variables), Congo adds a number of additional options to customise the presentation of individual articles. All the available theme front matter parameters are listed below. Front matter parameter default values are inherited from the theme's [base configuration]({{< ref "configuration" >}}), so you only need to specify these parameters in your front matter when you want to override the default. diff --git a/exampleSite/content/docs/homepage-layout/index.md b/exampleSite/content/docs/homepage-layout/index.md index 4b570a90..94bff73e 100644 --- a/exampleSite/content/docs/homepage-layout/index.md +++ b/exampleSite/content/docs/homepage-layout/index.md @@ -9,7 +9,7 @@ tags: ["homepage", "layouts", "docs"] Congo provides a fully flexible homepage layout. There are two main templates to choose from with additional settings to adjust the design. Alternatively, you can also provide your own template and have complete control over the homepage content. -The layout of the homepage is controlled by the `homepage.layout` setting in the `params.toml` configuration file. Additionally, all layouts have the option to include a listing of recent articles. +The layout of the homepage is controlled by the `homepage.layout` setting in the `params.toml` configuration file. Additionally, all layouts have the option to include a listing of [recent articles](#recent-articles). ## Page layout @@ -23,10 +23,12 @@ To enable the page layout, set `homepage.layout = "page"` in the `params.toml` c The profile layout is great for personal websites and blogs. It puts the author's details front and centre by providing an image and links to social profiles. -The author information is provided in the `author.toml` configuration file. Additionally, any Markdown content that is provided in the homepage content will be placed below the author profile. This allows extra flexibility for displaying a bio or other custom content using shortcodes. - ![Profile layout](home-profile.jpg) +The author information is provided in the `config.toml` configuration file. Refer to the [Getting Started]({{< ref "getting-started" >}}) and [Site Configuration]({{< ref "configuration#site-configuration" >}}) sections for parameter details. + +Additionally, any Markdown content that is provided in the homepage content will be placed below the author profile. This allows extra flexibility for displaying a bio or other custom content using shortcodes. + To enable the profile layout, set `homepage.layout = "profile"` in the `params.toml` configuration file. ## Custom layout @@ -37,7 +39,9 @@ To enable the custom layout, set `homepage.layout = "custom"` in the `params.tom With the configuration value set, create a new `custom.html` file and place it in `layouts/partials/home/custom.html`. Now whatever is in the `custom.html` file will be placed in the content area of the site homepage. You can use whatever HTML, Tailwind, or Hugo templating functions to define your layout. -To include recent articles on the custom layout, use the `recent-articles.html` partial. +To include [recent articles](#recent-articles) on the custom layout, use the `recent-articles.html` partial. + +As an example, the [homepage]({{< ref "/" >}}) on this site uses the custom layout to allow toggling between the profile and page layouts. Visit the [GitHub repo](https://github.com/jpanther/congo/blob/dev/exampleSite/layouts/partials/home/custom.html) to see how it works. ## Recent articles From 12cb25c0e3bb831ce20fb83504349b9f16d47628 Mon Sep 17 00:00:00 2001 From: Sebas Risco Date: Sun, 17 Oct 2021 18:33:49 +0200 Subject: [PATCH 06/20] =?UTF-8?q?=E2=9C=A8=20Add=20"slate"=20theme?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- assets/css/schemes/{cool-gray.css => slate.css} | 2 +- exampleSite/content/docs/advanced-customisation.md | 2 +- exampleSite/content/docs/configuration.md | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) rename assets/css/schemes/{cool-gray.css => slate.css} (97%) diff --git a/assets/css/schemes/cool-gray.css b/assets/css/schemes/slate.css similarity index 97% rename from assets/css/schemes/cool-gray.css rename to assets/css/schemes/slate.css index acae649c..000ba078 100644 --- a/assets/css/schemes/cool-gray.css +++ b/assets/css/schemes/slate.css @@ -1,4 +1,4 @@ -/* Cool gray scheme */ +/* Slate scheme */ :root { --color-neutral: #fff; /* Cool Gray */ diff --git a/exampleSite/content/docs/advanced-customisation.md b/exampleSite/content/docs/advanced-customisation.md index f1cd88ec..ec5a1cf2 100644 --- a/exampleSite/content/docs/advanced-customisation.md +++ b/exampleSite/content/docs/advanced-customisation.md @@ -11,7 +11,7 @@ There are a few ways you can make style changes to Congo. ## Colour schemes -Congo ships with a few colour schemes out of the box. To change the basic colour scheme, you can set the `colorScheme` theme parameter to one of the default configurations. Valid options are `congo` (the default), `avocado`, `fire` and `ocean`. +Congo ships with a few colour schemes out of the box. To change the basic colour scheme, you can set the `colorScheme` theme parameter to one of the default configurations. Valid options are `congo` (the default), `avocado`, `fire`, `ocean` and `slate`. In addition to the default scheme, you can also create your own and restyle the entire website to your liking. Schemes are created by by placing a `.css` file in the `assets/css/schemes/` folder. Once the file is created, simply refer to it by name in the theme configuration. diff --git a/exampleSite/content/docs/configuration.md b/exampleSite/content/docs/configuration.md index 1e6bd5cb..6f6a6d03 100644 --- a/exampleSite/content/docs/configuration.md +++ b/exampleSite/content/docs/configuration.md @@ -54,7 +54,7 @@ Many of the article defaults here can be overridden on a per article basis by sp |Name|Type|Default|Description| | --- | --- | --- | --- | -|`colorScheme`|string|`"congo"`|The theme colour scheme to use. Valid values are `congo` (default), `avocado`, `ocean` and `fire`. Refer to [Advanced Customisation]({{< ref "advanced-customisation#colour-schemes" >}}) for more details.| +|`colorScheme`|string|`"congo"`|The theme colour scheme to use. Valid values are `congo` (default), `avocado`, `ocean`, `fire` and `slate`. Refer to [Advanced Customisation]({{< ref "advanced-customisation#colour-schemes" >}}) for more details.| |`logo`|string|_Not set_|The relative path to the site logo file within the Hugo assets folder. The logo file should be provided at 2x resolution and supports any image dimensions.| |`description`|string|_Not set_|The description of the website for metadata purposes.| |`mainSections`|array of strings|_Not set_|The sections that should be displayed in the recent articles list. If not provided the section with the greatest number of articles is used.| From 96bc578153c9ae5b9c235257badfe38f3a64c8df Mon Sep 17 00:00:00 2001 From: James Panther <4462786+jpanther@users.noreply.github.com> Date: Mon, 18 Oct 2021 13:08:36 +1100 Subject: [PATCH 07/20] =?UTF-8?q?=F0=9F=93=9D=20Update=20changelog?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index d33f3d8c..a532e80c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,11 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ## [Unreleased] +### Added + +- Slate colour scheme ([#9](https://github.com/jpanther/congo/pull/9)) +- Icons for ORCID and ResearchGate ([#9](https://github.com/jpanther/congo/pull/9)) + ## [1.3.0] - 2021-09-29 ### Added From 586224fc7a7eeb8217c9105d7fb95a67fad8a37c Mon Sep 17 00:00:00 2001 From: James Panther <4462786+jpanther@users.noreply.github.com> Date: Mon, 18 Oct 2021 14:36:36 +1100 Subject: [PATCH 08/20] =?UTF-8?q?=F0=9F=93=9D=20Add=20colour=20scheme=20do?= =?UTF-8?q?cs=20with=20preview=20swatches?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../content/docs/advanced-customisation.md | 4 +-- exampleSite/content/docs/configuration.md | 2 +- exampleSite/content/docs/getting-started.md | 34 +++++++++++++++++++ exampleSite/content/docs/installation.md | 2 +- exampleSite/layouts/shortcodes/swatches.html | 14 ++++++++ 5 files changed, 52 insertions(+), 4 deletions(-) create mode 100644 exampleSite/layouts/shortcodes/swatches.html diff --git a/exampleSite/content/docs/advanced-customisation.md b/exampleSite/content/docs/advanced-customisation.md index ec5a1cf2..73d00c22 100644 --- a/exampleSite/content/docs/advanced-customisation.md +++ b/exampleSite/content/docs/advanced-customisation.md @@ -11,9 +11,9 @@ There are a few ways you can make style changes to Congo. ## Colour schemes -Congo ships with a few colour schemes out of the box. To change the basic colour scheme, you can set the `colorScheme` theme parameter to one of the default configurations. Valid options are `congo` (the default), `avocado`, `fire`, `ocean` and `slate`. +Congo ships with a number of colour schemes out of the box. To change the basic colour scheme, you can set the `colorScheme` theme parameter. Refer to the [Getting Started]({{< ref "getting-started#colour-schemes" >}}) section to learn more about the built-in schemes. -In addition to the default scheme, you can also create your own and restyle the entire website to your liking. Schemes are created by by placing a `.css` file in the `assets/css/schemes/` folder. Once the file is created, simply refer to it by name in the theme configuration. +In addition to the default schemes, you can also create your own and re-style the entire website to your liking. Schemes are created by by placing a `.css` file in the `assets/css/schemes/` folder. Once the file is created, simply refer to it by name in the theme configuration. Congo defines a three-colour palette that is used throughout the theme. The three colours are defined as `neutral`, `primary` and `secondary` variants, each containing ten shades of colour. diff --git a/exampleSite/content/docs/configuration.md b/exampleSite/content/docs/configuration.md index 3f7fcb3e..e92e1252 100644 --- a/exampleSite/content/docs/configuration.md +++ b/exampleSite/content/docs/configuration.md @@ -54,7 +54,7 @@ Many of the article defaults here can be overridden on a per article basis by sp |Name|Type|Default|Description| | --- | --- | --- | --- | -|`colorScheme`|string|`"congo"`|The theme colour scheme to use. Valid values are `congo` (default), `avocado`, `ocean`, `fire` and `slate`. Refer to [Advanced Customisation]({{< ref "advanced-customisation#colour-schemes" >}}) for more details.| +|`colorScheme`|string|`"congo"`|The theme colour scheme to use. Valid values are `congo` (default), `avocado`, `ocean`, `fire` and `slate`. Refer to the [Colour Schemes]({{< ref "getting-started#colour-schemes" >}}) section for more details.| |`logo`|string|_Not set_|The relative path to the site logo file within the `assets/` folder. The logo file should be provided at 2x resolution and supports any image dimensions.| |`description`|string|_Not set_|The description of the website for metadata purposes.| |`mainSections`|array of strings|_Not set_|The sections that should be displayed in the recent articles list. If not provided the section with the greatest number of articles is used.| diff --git a/exampleSite/content/docs/getting-started.md b/exampleSite/content/docs/getting-started.md index 487b326b..18b7b7f7 100644 --- a/exampleSite/content/docs/getting-started.md +++ b/exampleSite/content/docs/getting-started.md @@ -34,6 +34,40 @@ The `[author]` configuration determines how the author information is displayed Further detail about these configuration options is covered in the [Configuration]({{< ref "configuration" >}}) section. +## Colour schemes + +Congo ships with a number of colour schemes out of the box. To change the scheme, simply set the `colorScheme` theme parameter. Valid options are `congo` (default), `avocado`, `fire`, `ocean` and `slate`. + +```toml +# config/_default/params.toml + +colorScheme = "congo" +``` + +Congo defines a three-colour palette that is used throughout the theme. Each main colour contains ten shades which are based upon the colours that are included in [Tailwind](https://tailwindcss.com/docs/customizing-colors#color-palette-reference). + +#### Congo (default) + +{{< swatches "#71717a" "#8b5cf6" "#d946ef" >}} + +#### Avocado + +{{< swatches "#78716c" "#84cc16" "#10b981" >}} + +#### Fire + +{{< swatches "#78716c" "#f97316" "#f43f5e" >}} + +#### Ocean + +{{< swatches "#64748b" "#3b82f6" "#06b6d4" >}} + +#### Slate + +{{< swatches "#6B7280" "#6B7280" "#6B7280" >}} + +Although these are the default schemes, you can also create your own. Refer to the [Advanced Customisation]({{< ref "advanced-customisation#colour-schemes" >}}) section for details. + ## Organising content By default, Congo doesn't force you to use a particular content type. In doing so you are free to define your content as you wish. You might prefer _pages_ for a static site, _posts_ for a blog, or _projects_ for a portfolio. diff --git a/exampleSite/content/docs/installation.md b/exampleSite/content/docs/installation.md index c5ac0959..b376c09e 100644 --- a/exampleSite/content/docs/installation.md +++ b/exampleSite/content/docs/installation.md @@ -101,4 +101,4 @@ config/_default/ You're now all set up to use Congo. From here you can add some content and start the Hugo server. -Refer to the Hugo docs for more information or read the next section to learn more about configuring the theme. +Refer to the [Hugo docs](https://gohugo.io/getting-started/) for more information or continue to the [Getting Started]({{< ref "getting-started" >}}) section to learn more about configuring the theme. diff --git a/exampleSite/layouts/shortcodes/swatches.html b/exampleSite/layouts/shortcodes/swatches.html new file mode 100644 index 00000000..322db53e --- /dev/null +++ b/exampleSite/layouts/shortcodes/swatches.html @@ -0,0 +1,14 @@ +
+ + + +
From 07562ee7d4870f64df744c651e44cc8e68c8a222 Mon Sep 17 00:00:00 2001 From: James Panther <4462786+jpanther@users.noreply.github.com> Date: Tue, 19 Oct 2021 15:44:23 +1100 Subject: [PATCH 09/20] =?UTF-8?q?=F0=9F=9A=B8=20Make=20main=20menu=20optio?= =?UTF-8?q?nal?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 4 ++++ layouts/partials/header.html | 32 ++++++++++++++++++-------------- 2 files changed, 22 insertions(+), 14 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index a532e80c..5d181965 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,6 +11,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), - Slate colour scheme ([#9](https://github.com/jpanther/congo/pull/9)) - Icons for ORCID and ResearchGate ([#9](https://github.com/jpanther/congo/pull/9)) +### Changed + +- Main menu is now optional + ## [1.3.0] - 2021-09-29 ### Added diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 3616b597..63fe8713 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -1,6 +1,7 @@
+ {{/* Site logo/title */}}
{{ if .Site.Params.Logo -}} {{ $logo := resources.Get .Site.Params.Logo }} @@ -21,18 +22,21 @@ > {{- end }}
- + {{/* Main menu */}} + {{ if .Site.Menus.main }} + + {{ end }}
From 1901917d7c5be8ea1c26be2a6214e070e673d1ac Mon Sep 17 00:00:00 2001 From: James Panther <4462786+jpanther@users.noreply.github.com> Date: Tue, 19 Oct 2021 15:45:11 +1100 Subject: [PATCH 10/20] =?UTF-8?q?=E2=9C=A8=20Add=20footer=20menu?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 1 + assets/css/compiled/main.css | 4 ++++ config/_default/menus.toml | 12 ++++++++++- exampleSite/content/docs/front-matter.md | 1 + exampleSite/content/docs/getting-started.md | 24 +++++++++++++++++++-- layouts/partials/footer.html | 21 ++++++++++++++++-- 6 files changed, 58 insertions(+), 5 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 5d181965..a1c6d9fb 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ### Added +- Footer menu - Slate colour scheme ([#9](https://github.com/jpanther/congo/pull/9)) - Icons for ORCID and ResearchGate ([#9](https://github.com/jpanther/congo/pull/9)) diff --git a/assets/css/compiled/main.css b/assets/css/compiled/main.css index ebcd58fb..904d9336 100644 --- a/assets/css/compiled/main.css +++ b/assets/css/compiled/main.css @@ -2341,6 +2341,10 @@ body a, body button { padding-top: 0.75rem; } +.pb-4 { + padding-bottom: 1rem; +} + .pt-4 { padding-top: 1rem; } diff --git a/config/_default/menus.toml b/config/_default/menus.toml index 7d0c31f4..16298213 100644 --- a/config/_default/menus.toml +++ b/config/_default/menus.toml @@ -1,5 +1,5 @@ # -- Main Menu -- -# The main menu is displayed at the top of the theme. +# The main menu is displayed in the header at the top of the page. # Acceptable parameters are name, pageRef, page, url, title, weight. # # The simplest menu configuration is to provide: @@ -24,3 +24,13 @@ name = "Tags" pageRef = "tags" weight = 30 + + +# -- Footer Menu -- +# The footer menu is displayed at the bottom of the page, just before +# the copyright notice. Configure as per the main menu above. + +# [[footer]] +# name = "Tags" +# pageRef = "tags" +# weight = 10 diff --git a/exampleSite/content/docs/front-matter.md b/exampleSite/content/docs/front-matter.md index 7be4e04e..79c7a65e 100644 --- a/exampleSite/content/docs/front-matter.md +++ b/exampleSite/content/docs/front-matter.md @@ -20,6 +20,7 @@ Front matter parameter default values are inherited from the theme's [base confi |`showEdit`|boolean|`article.showEdit`|Whether or not the link to edit the article content should be displayed.| |`editURL`|string|`article.editURL`|When `showEdit` is active, the URL for the edit link.| |`editAppendPath`|boolean|`article.editAppendPath`|When `showEdit` is active, whether or not the path to the current article should be appended to the URL set at `editURL`.| +|`menu`|string or array|_Not set_|When a value is provided, a link to this article will appear in the named menus. Valid values are `main` or `footer`.| |`robots`|string|_Not set_|String that indicates how robots should handle this article. If set, it will be output in the page head. Refer to [Google's docs](https://developers.google.com/search/docs/advanced/robots/robots_meta_tag#directives) for valid values.| |`showHeadingAnchors`|boolean|`article.showHeadingAnchors`|Whether or not heading anchor links are displayed alongside headings within this article.| |`showPagination`|boolean|`article.showPagination`|Whether or not the next/previous article links are displayed in the article footer.| diff --git a/exampleSite/content/docs/getting-started.md b/exampleSite/content/docs/getting-started.md index 18b7b7f7..50f9fc2b 100644 --- a/exampleSite/content/docs/getting-started.md +++ b/exampleSite/content/docs/getting-started.md @@ -84,7 +84,13 @@ topic = "topics" This will replace the default _tags_ and _categories_ with _topics_. Refer to the [Hugo Taxonomy docs](https://gohugo.io/content-management/taxonomies/) for more information on naming taxonomies. -When you create a new taxonomy, you will need to adjust the navigation links on the website to point to the new sections: +When you create a new taxonomy, you will need to adjust the navigation links on the website to point to the correct sections. + +## Menus + +Congo has two menus that can be customised to suit the content and layout of your site. The `main` menu appears in the site header and the `footer` menu appears at the bottom of the page just above the copyright notice. + +Both menus are configured in the `menus.toml` file. ```toml # config/_default/menus.toml @@ -98,6 +104,20 @@ When you create a new taxonomy, you will need to adjust the navigation links on name = "Topics" pageRef = "topics" weight = 20 + +[[footer]] + name = "Privacy" + url = "https://external-link" ``` -These steps are the bare minimum configuration. If you now run `hugo server` you will be presented with a blank Congo website. Detailed configuration is covered in the [Configuration]({{< ref "configuration" >}}) section. +The `name` parameter specifies the text that is used in the menu link. You can also optionally provide a `title` which fills the HTML title attribute for the link. + +The `pageRef` parameter allows you to easily reference Hugo content pages and taxonomies. It is the quickest way to configure the menu as you can simply refer to any Hugo content item and it will automatically build the correct link. To link to external URLs, the `url` parameter can be used. + +Menu links will be sorted from lowest to highest `weight`, and then alphabetically by `name`. + +Both menus are completely optional and can be commented out if not required. Use the template provided in the file as a guide. + +## Detailed configuration + +The steps above are the bare minimum configuration. If you now run `hugo server` you will be presented with a blank Congo website. Detailed configuration is covered in the [Configuration]({{< ref "configuration" >}}) section. diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 278dfbd2..dc97fc34 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -1,6 +1,23 @@ -