Create a search bar to the top of the page if the user enabled it in the _config.yml

This search bar should search in the headers of the site pages

If the user wants can bind pages to custom URLs

like in settings.yml user can specify

	navigation: [
		"/guide/, "/documentation/"
	]

This should replace all /guide/ URLs with /documentation/ on multi-level dropdown menu generation

This way the user can customize the final results of the menu points

This ticket is related to #32

Supporting music links files and so on in readme files.
This way our users can use audio logs for instance in their markdowns

Like with the following syntax

[MUSIC(link-to-music)]

link-to-music could be a local path or a link where the music can be accessed.

Supporting basic video types
Like GitHub basic one where you can drag a video over your markdown file and GH will upload for you if it matches with (mp4 | mov) extensions

Support youtube embed with a simple logic where the user can specify the video that want to be emebed
like :

[YOUTUBE(YOUTUBE_VIDEO_LINK)]

Create a style section in the _config.yml

By hand
Or create a styler where you can change all the settings that is related to the style settings in the theme
And also you can preview there before apply it to your github pages

Contribution guide should contain a few words about the Branching, Ticketing and the Pull Requesting

Create contributors element that can be invoked by adding [CONTRIBUTORS] to your markdown file

Contributors can be gotten from https://api.github.com/repos/{{ site.github.repository_nwo }}/contributors where {{ site.github.repository_nwo }} means REPOSITORY_OWNER/PROJECT_NAME

with this, the following objects array will be produced

[
  {
    "login": "USER_NAME",
    "id": USER_ID,
    "node_id": "USER_NODE_ID",
    "avatar_url": "https://avatars.githubusercontent.com/u/USER_ID?v=4",
    "gravatar_id": "",
    "url": "https://api.github.com/users/USER_NAME",
    "html_url": "https://github.com/USER_NAME",
    "followers_url": "https://api.github.com/users/USER_NAME/followers",
    "following_url": "https://api.github.com/users/USER_NAME/following{/other_user}",
    "gists_url": "https://api.github.com/users/USER_NAME/gists{/gist_id}",
    "starred_url": "https://api.github.com/users/USER_NAME/starred{/owner}{/repo}",
    "subscriptions_url": "https://api.github.com/users/USER_NAME/subscriptions",
    "organizations_url": "https://api.github.com/users/USER_NAME/orgs",
    "repos_url": "https://api.github.com/users/USER_NAME/repos",
    "events_url": "https://api.github.com/users/USER_NAME/events{/privacy}",
    "received_events_url": "https://api.github.com/users/USER_NAME/received_events",
    "type": USER_PRIVILAGE_TYPE,
    "site_admin": IS_USER_SITE_ADMIN,
    "contributions": USER_CONTRIBUTIONS
  }
]

From this array, we will need login, html_url, and avatar_url for each contributor.

And generate a horizontally scrollable list from it.

Create a button to the top of the nav bar to be able to toggle dark and light themes

The welcome layout should be driven from the default layout and has two options

• title (string) | This way user has control over the displayed title
• redirect (object { buttonText (string), redirectUri (string) } )| The user can tell where the user should continue and what text should sit on the button

On this page, all the content is centered.

The content structure will be the following

<h1>{{ title }}</h1>
	{{ content }} (content from the md file where welcome layout is applied)
	<button onclick="navigate -> redirect"><button>

Create a GitHub page where the user can see a preview of the documentation site and he/she can change the values in the sidebar this generates changes on the preview.

When the user has finished changing what he/she wanted with pushing the generate button this page produce a custom style YAML section that can be copy-pasted to _config.yml and it changes the page style on the next deployment

On mobile or smaller display the side nav should close for example

Creating a juicy readme for this project

What should the readme contain?

• A few words about the dependencies what the project includes, also list them on top of the readme (badges)
• h2 heading title of the project name ( ZOCS )
• Pronunciation of the project name (The same as socks)
• A slogan along the logo or banner of the project (this will be included in this ticket further on)
• The main purpose of the project, the idea in the background
• A link to the demo page what actually will be the documentation on this project
• A Roadmap to see what happens in the next releases
• About contribution
• List of contributors

Slogan should look like the following in the readme

Zocs to keep your docs warm

Logos Banners
A Sock where a documentation icon lives

Imagine a house cut half in middle
Like this just instead of a house imagine with a sock

List of contributors like

CSS variables

Also should create a file with all our colors as variables
This is needed because we use similar but different colors all over the page
- Create variables for colors
- Use the variables in CSS files var(VARIABLE)

If this is done we can now create the built-in themes.
Because we only need to override the variables in this file 🍡 👯‍♀️

YAML settings

Create different themes that can be switched in the settings section of _config.yml

settings:{
	theme: dark-green // [PARENT_THEME]-[CHILD_THEME]
}

Themes with their description

Dark themes
- Green
- Yellow
- Red
- Blue

The dark theme's background is dark and the texts are whites and the colored elements are what the second child indicates like green

Light themes
- Green
- Yellow
- Red
- Blue

The light theme's background is light as you probably guessed, the text are blacks, and colored elements behave as in the dark theme case

Generated a link to all page then select them from the html dom

After then we have a collection of uri's

[
 "/about/us"
 "/about/us/edit
 ...
]

This needs to compiles to

{
  name: about,
  children: [{ 
      name: "us",
      }]
}
...

We need to Find a Way to generate menu items from it

Documentation should contain

• Quick start guide
  • Installation
  • Required settings
  • About settings yaml and settings properties the user can initialize
  • About pages, layout types what can be applied to the page
  • About page headers where page settings/options can be initialized optionally
  • Folder structuring and menu binding
• About Features
  • LIST COMMING SOON STAY TUNED
• Theming / Styling
  • Built in themes
    • See in #42
  • Creating custom theme
    • Theme generator (See in #43)
    • Creating custom theme by hand

Create different overlays to cover more use cases then already

Overlays

• default
  All overlays comes from default

• home( can be applied to only one page)
  This is the home page of the Site

• page
  Its a normal page has options what Will be described Soon

• wiki page
  Its like a wikipedia page