diff options
Diffstat (limited to 'content')
| -rw-r--r-- | content/overview-abridge.md | 2 | ||||
| -rw-r--r-- | content/overview-embedded-vimeo.md | 2 | ||||
| -rw-r--r-- | content/overview-embedded-youtube.md | 2 | ||||
| -rw-r--r-- | content/overview-markdown-and-style.md | 98 |
4 files changed, 20 insertions, 84 deletions
diff --git a/content/overview-abridge.md b/content/overview-abridge.md index 61a048d..a866097 100644 --- a/content/overview-abridge.md +++ b/content/overview-abridge.md @@ -7,7 +7,7 @@ categories = ["Features"] tags = ["config"] +++ -Abridge is a fast and lightweight Zola theme using semantic html (~6kb css before svg icons), and no JS required apart from the search. Perfect score on [Google's Lighthouse audit](https://web.dev/measure/). +Abridge is a fast and lightweight Zola theme using semantic html, only ~6kb css before svg icons, no mandatory JS, and a perfect [Lighthouse](https://web.dev/measure/) score. <!-- more --> For quick setup copy the config.toml from the abridge theme into the root of your zola site, this will give you a base configuration with all config values used. diff --git a/content/overview-embedded-vimeo.md b/content/overview-embedded-vimeo.md index 319c129..99fb06f 100644 --- a/content/overview-embedded-vimeo.md +++ b/content/overview-embedded-vimeo.md @@ -15,7 +15,7 @@ Zola has many shortcodes, and new are easily added, this example shows vimeo. with `vm(id="id_here")` - `id`: the video id (mandatory) -- `class`: a class to add to the <div> surrounding the iframe (optional) +- `class`: a class to add to the <div> surrounding the iframe (optional) - `autoplay`: when set to "true", the video autoplays on load (optional) - `loop`: when set to "true", the video plays on a loop (optional) - `noautopause`: when set to "true", the video will not autopause (optional) diff --git a/content/overview-embedded-youtube.md b/content/overview-embedded-youtube.md index 0bcb4f2..21f6ed2 100644 --- a/content/overview-embedded-youtube.md +++ b/content/overview-embedded-youtube.md @@ -16,7 +16,7 @@ with `yt(id="the_id_here")` - `id`: the video id (mandatory) - `playlist`: the playlist id (optional) -- `class`: a class to add to the <div> surrounding the iframe (optional) +- `class`: a class to add to the <div> surrounding the iframe (optional) - `autoplay`: when set to "true", the video autoplays on load (optional) - `title` - set alt title for the iframe (optional, defaults to "Youtube") - `cookie` - set to "true" if you want tracking cookies, otherwise it defaults to false. diff --git a/content/overview-markdown-and-style.md b/content/overview-markdown-and-style.md index 0c372b6..df64054 100644 --- a/content/overview-markdown-and-style.md +++ b/content/overview-markdown-and-style.md @@ -178,8 +178,22 @@ during Gopherfest, November 18, 2015. [^2]: The quote is the first sentence of Aristotle's [Metaphysics](https://en.wikipedia.org/wiki/Metaphysics_(Aristotle)). +## Navs + +Site primary menu is created by nesting the nav under a header tag. Refer to the top of this site for an example. + +If the nav tag is under the main tag instead of the header tag then the links will have a border: + +<header> + <nav> + <ul> + <li><a href="#">< Previous</a></li> + <li><a href="#">Next ></a></li> + </ul> + </nav> +</header> -## Forms: +## Forms <form name="contact" method="POST" > <p><label>Name</label> @@ -242,7 +256,7 @@ during Gopherfest, November 18, 2015. Publish on my profile </label> <label for="switch_disabled"> - <input type="checkbox" id="switch_disabled" name="switch_disabled" role="switch_disabled" disabled checked> + <input type="checkbox" id="switch_disabled" name="switch_disabled" disabled checked> Publish on my profile my accomplishments </label> </fieldset> @@ -269,82 +283,4 @@ during Gopherfest, November 18, 2015. <label for="color">Color <input type="color" id="color" name="color" value="#0eaaaa"> </label> -</form> - -## Navs - -Site primary menu is created by nesting the nav under a header tag. Refer to the top of this site for an example. - -If the nav tag is under the main tag instead of the header tag then the links will have a border: - -<header> - <nav> - <ul> - <li><a href="#">< Previous</a></li> - <li><a href="#">Next ></a></li> - </ul> - </nav> -</header> - - -## Infinity Flex Grid - -### Simple Grid - -<section> - <section> 1 </section> - <section> 2 </section> - <section> 3 </section> -</section> -<section> - <section>1</section> - <section>2</section> - <section>3</section> - <section>4</section> -</section> -<section> - <section> 1 </section> - <section> 2 </section> - <section> 3 </section> - <section> 4 </section> - <section> 5 </section> -</section> - -### Complex grid - -<section> - <section> 1 </section> - <section> 2 </section> - <section> 3 </section> -</section> -<section> - <section style = "--c:2">Merge the first 2 columns</section> - <section>2</section> - <section>3</section> - <section>4</section> -</section> -<section> - <section> 1 </section> - <section style = "--c:3"> Merge 3 columns </section> - <section> 3 </section> -</section> -<section> - <section>1</section> - <section style = "--c:2">Merge 2</section> - <section style = "--c:3">Merge 3</section> - <section>4</section> - <section>5</section> - <section>6</section> - <section>7</section> -</section> -<section> - <div style = "--c:1"> 1 </div> - <div style = "--c:2"> Merge 2 columns</div> - <div style = "--c:1"> 3 </div> -</section> - -<style> - [style*="--c:"],section>section{ - background-color:#777; - } -</style> +</form>
\ No newline at end of file |