<div align="right">

[![GitHub License](https://img.shields.io/github/license/scape-agency/page.gl?style=flat-square&logo=readthedocs&logoColor=FFFFFF&label=&labelColor=%23041B26&color=%23041B26&link=LICENSE)](https://github.com/scape-agency/page.gl/blob/main/LICENSE)
[![devContainer](https://img.shields.io/badge/Container-Remote?style=flat-square&logo=visualstudiocode&logoColor=%23FFFFFF&label=Remote&labelColor=%23041B26&color=%23041B26)](https://vscode.dev/redirect?url=vscode://ms-vscode-remote.remote-containers/cloneInVolume?url=https://github.com/scape-agency/page.gl)

</div>

---

<div>
    <img align="right" src="https://raw.githubusercontent.com/scape-agency/brand/master/src/logo/page.gl.png" width="96" alt="page.gl Logo">
    <h1 align="left">page.gl</h1>
    <h3 align="left">Stylescape Layout Template Library</h3>
</div>

---

<img align="right" width="50%" src="/res/page.gl.png"  alt="page.gl">

### Contents

- [Introduction](#introduction)
- [Colophon](#colophon)

<br clear="both"/>

---

<div align="right">

[![Report a Bug](https://img.shields.io/badge/Report%20a%20Bug-GitHub?style=flat-square&&logoColor=%23FFFFFF&color=%23E1E4E5)](https://github.com/scape-agency/page.gl/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&projects=&template=bug_report.yml)
[![Request a Feature](https://img.shields.io/badge/Request%20a%20Feature-GitHub?style=flat-square&&logoColor=%23FFFFFF&color=%23E1E4E5)](https://github.com/scape-agency/page.gl/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&projects=&template=feature_request.yml)
[![Ask a Question](https://img.shields.io/badge/Ask%20a%20Question-GitHub?style=flat-square&&logoColor=%23FFFFFF&color=%23E1E4E5)](https://github.com/scape-agency/page.gl/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&projects=&template=question.yml)
[![Make a Suggestion](https://img.shields.io/badge/Make%20a%20Suggestion-GitHub?style=flat-square&&logoColor=%23FFFFFF&color=%23E1E4E5)](https://github.com/scape-agency/page.gl/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&projects=&template=suggestion.yml)
[![Start a Discussion](https://img.shields.io/badge/Start%20a%20Discussion-GitHub?style=flat-square&&logoColor=%23FFFFFF&color=%23E1E4E5)](https://github.com/scape-agency/page.gl/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&projects=&template=discussion.yml)

</div>

**Stylescape Layout Template Library<.**

## Introduction

Welcome to `page.gl`, a comprehensive collection of layout templates created using Jinja. These templates are designed to simplify the process of web page creation, offering a variety of layouts that cater to different styles and purposes. Whether you're building a personal blog, a business site, or a creative portfolio, `page.gl` has something to offer.

## Features

- **Diverse Collection of Layouts**: Choose from a wide range of template designs, from minimalistic to complex.
- **Jinja-Powered Templates**: Easy integration with Python-based web applications.
- **Responsive Design**: All templates are built to be fully responsive, ensuring compatibility with various devices and screen sizes.
- **Well-Documented Code**: Each template is thoroughly documented, making customization and integration straightforward.

## Installation

To use `page.gl` templates in your project, follow these simple steps:

### GIT

1. **Clone the Repository**

   ``` sh
   git clone https://github.com/scape-agency/page.gl.git
   ```

2. **Navigate to the Repository**

   ``` sh
   cd page.gl
   ```

3. **Choose a Template**

   - Browse through the template collection and select one that suits your needs.
   - Copy the Jinja template files into your project.


### NPM Module

``` bash
npm i page.gl
```

## Usage

- Integrate the Jinja templates into your Python web application.
- Customize the templates as needed to fit the style and branding of your website.
- Utilize the well-documented code to tweak layouts, styles, and functionalities.

## Templates

### HTML Tags

| **tag**           |      |
| ----------------- | ---- |
| `a`               |      |
| `abbr`            |      |
| `acronym`         |      |
| `address`         |      |
| `applet`          |      |
| `area`            |      |
| `article`         |      |
| `aside`           |      |
| `audio`           |      |
| `b`               |      |
| `base`            |      |
| `basefont`        |      |
| `bb`              |      |
| `bdo`             |      |
| `big`             |      |
| `blockquote`      |      |
| `body`            |      |
| `br`              |      |
| `button`          |      |
| `canvas`          |      |
| `caption`         |      |
| `center`          |      |
| `cite`            |      |
| `code`            |      |
| `col`             |      |
| `colgroup`        |      |
| `command`         |      |
| `datalist`        |      |
| `dd`              |      |
| `del`             |      |
| `details`         |      |
| `dfn`             |      |
| `dialog`          |      |
| `dir`             |      |
| `div`             |      |
| `dl`              |      |
| `dt`              |      |
| `em`              |      |
| `embed`           |      |
| `eventsource`     |      |
| `fieldset`         |      |
| `figcaption`       |      |
| `figure`           |      |
| `font`            |      |
| `footer`          |      |
| `form`            |      |
| `frame`           |      |
| `frameset`        |      |
| `h1`              |      |
| `h2`              |      |
| `h3`              |      |
| `h4`              |      |
| `h5`              |      |
| `h6`              |      |
| `head`            |      |
| `header`          |      |
| `hgroup`          |      |
| `hr`              |      |
| `html`            |      |
| `i`               |      |
| `iframe`          |      |
| `img`             |      |
| `input`           |      |
| `ins`             |      |
| `isindex`         |      |
| `kbd`             |      |
| `keygen`          |      |
| `label`           |      |
| `legend`          |      |
| `li`              |      |
| `link`            |      |
| `map`             |      |
| `mark`            |      |
| `menu`            |      |
| `meta`            |      |
| `meter`           |      |
| `nav`             |      |
| `noframes`        |      |
| `noscript`        |      |
| `object`          |      |
| `ol`              |      |
| `optgroup`        |      |
| `option`          |      |
| `output`          |      |
| `p`               |      |
| `param`           |      |
| `pre`             |      |
| `progress`        |      |
| `q`               |      |
| `rp`              |      |
| `rt`              |      |
| `ruby`            |      |
| `s`               |      |
| `samp`            |      |
| `script`          |      |
| `section`         |      |
| `select`          |      |
| `small`           |      |
| `source`          |      |
| `span`            |      |
| `strike`          |      |
| `strong`          |      |
| `style`           |      |
| `sub`             |      |
| `sup`             |      |
| `table`           |      |
| `tbody`           |      |
| `td`              |      |
| `textarea`        |      |
| `tfoot`           |      |
| `th`              |      |
| `thead`           |      |
| `time`            |      |
| `title`           |      |
| `tr`              |      |
| `track`           |      |
| `tt`              |      |
| `u`               |      |
| `ul`              |      |
| `var`             |      |
| `video`           |      |
| `wbr`             |      |

## Links

- [Website](https://www.page.gl)
- [NPM](https://www.npmjs.com/package/page.gl)

---

## Colophon

### Authors

**page.gl** is an open-source project by **[Scape Agency](https://www.scape.agency "Scape Agency website")**.

##### Scape Agency

Scape Agency is a spatial innovation collective that dreams, discovers and designs the everyday of tomorrow. We blend design thinking with emerging technologies to create a brighter perspective for people and planet. Our products and services naturalise technology in liveable and sustainable –scapes that spark the imagination and inspire future generations.

- website: [scape.agency](https://www.scape.agency "Scape Agency website")
- github: [github.com/scape-agency](https://github.com/scape-agency "Scape Agency GitHub")

### Development Resources

#### Contributing

We'd love for you to contribute and to make this project even better than it is today!
Please refer to the [contribution guidelines](.github/CONTRIBUTING.md) for information.

### Legal Information

#### Copyright

Copyright &copy; 2023 [Scape Agency BV](https://www.scape.agency/ "Scape Agency website"). All Rights Reserved.

#### License

Except as otherwise noted, the content in this repository is licensed under the
[Creative Commons Attribution 4.0 International (CC BY 4.0) License](https://creativecommons.org/licenses/by/4.0/), and
code samples are licensed under the [Apache 2.0 License](http://www.apache.org/licenses/LICENSE-2.0).

Also see [LICENSE](https://github.com/scape-agency/community/blob/master/src/LICENSE) and [LICENSE-CODE](https://github.com/scape-agency/community/blob/master/src/LICENSE-CODE).

#### Disclaimer

**THIS SOFTWARE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.**

