diff --git a/README.md b/README.md index 25416e5..88c47a3 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # Garage Website -¡ Work in progress ! +¡ Work in progress (almost done) ! --- @@ -11,4 +11,36 @@ - Run `npm install` to get the dev dependencies - Run `zola build` to get the public directory - Run `npm start` to compile styles and scripts -- Run `zola serve` \ No newline at end of file +- Run `zola serve` + +## Build + +CSS : `28.4 kB` + +JS : `6.8 kB (app)` + `1.2 MB (search)`* + +*The search index in loaded only when the user opens the search modal + +Images + Icons : `1.1 MB` + +## Fonctions & utilities + +JavaScript can be disabled and the website will still run nicely. +It only brings QoL advantages for the user. + +The function is [x] if it still runs without JavaScript enabled. + +- [x] Responsive main navigation menu (toggle) +- [x] Documentation : user can deploy or reploy ToC submenus +- [ ] Documentation : deploy only the current ToC submenu after a page change +- [ ] Documentation : sidebar focus effect on current section anchor when user scrolls +- [ ] Documentation : ToC that follows the user's scroll +- [ ] Global search + +## Screenshots + +480px + +768px + +1280px diff --git a/config.toml b/config.toml index 64cddcc..fff3bc2 100755 --- a/config.toml +++ b/config.toml @@ -9,10 +9,6 @@ ignored_content = [] generate_feed = true feed_filename = "rss.xml" hard_link_static = false -# taxonomies = [ -# { name = "categories", feed = true, paginate_by = 10 }, -# { name = "tags", feed = true, paginate_by = 10 } -# ] build_search_index = true [markdown] @@ -50,24 +46,25 @@ chart.enabled = false mermaid.enabled = true galleria.enabled = false navbar_items = [ - { code = "en", nav_items = [ + {code = "en", nav_items = [ { url = "$BASE_URL/", name = "Overview" }, { url = "$BASE_URL/documentation/", name = "Docs" }, { url = "$BASE_URL/blog/", name = "Blog" } - ] }, + ]}, ] [extra.favicon] favicon_16x16 = "/icons/favicon-16x16.png" favicon_32x32 = "/icons/favicon-32x32.png" apple_touch_icon = "/icons/apple-touch-icon.png" -safari_pinned_tab = "/icons/safari-pinned-tab.svg" webmanifest = "/icons/site.webmanifest" [extra.organization] name = "Garage" description = "An open-source distributed storage service you can self-host to fullfill many needs" logo = "/images/garage-logo.svg" +logo_simple = "/images/garage-logo-simple.svg" +logo_horizontal = "/images/garage-logo-horizontal.svg" [extra.author] name = "Garage" @@ -75,11 +72,4 @@ avatar = "/images/garage-logo.svg" [extra.social] git = "https://git.deuxfleurs.fr/Deuxfleurs/garage" -email = "contact@garagehq.com" - -[extra.analytics] -google = "UA-176984489-2" - -[extra.mapbox] -enabled = true -access_token = "pk.eyJ1IjoicmF0YW5zaHJlc2h0aGEiLCJhIjoiY2tla2s2NmM3MDd0ZzJzbXFtc3Y2YmU0NyJ9.0RhUnJPKbxHWw3xGPnnBlA" +email = "contact@garagehq.com" \ No newline at end of file diff --git a/content/documentation/_index.md b/content/documentation/_index.md index 68d1395..283c8f3 100644 --- a/content/documentation/_index.md +++ b/content/documentation/_index.md @@ -2,4 +2,4 @@ template = "documentation.html" page_template = "documentation.html" redirect_to = "documentation/quick-start/" -+++ \ No newline at end of file ++++ diff --git a/content/documentation/quick-start/_index.md b/content/documentation/quick-start/_index.md deleted file mode 100644 index b8ec473..0000000 --- a/content/documentation/quick-start/_index.md +++ /dev/null @@ -1,6 +0,0 @@ -+++ -title = "Quick Start" -weight = 1 -sort_by = "weight" -redirect_to = "documentation/quick-start/overview/" -+++ \ No newline at end of file diff --git a/content/documentation/quick-start/overview.md b/content/documentation/quick_start.md similarity index 99% rename from content/documentation/quick-start/overview.md rename to content/documentation/quick_start.md index 478e033..30cf2ee 100644 --- a/content/documentation/quick-start/overview.md +++ b/content/documentation/quick_start.md @@ -1,5 +1,5 @@ +++ -title = "Overview" +title = "Quick Start" weight = 5 +++ diff --git a/src/input.css b/src/input.css index b7582f7..1f4e978 100755 --- a/src/input.css +++ b/src/input.css @@ -2,10 +2,10 @@ @tailwind components; @tailwind utilities; -/* ARTICLES BASIC ELEMENTS */ +/* POST BASIC ELEMENTS */ article .page-content { - @apply text-lg; + @apply text-base md:text-lg; } /** Pre */ @@ -99,12 +99,60 @@ p > code, p > strong > code, li > code, li > strong > code { } .is-active { - @apply text-orange-600; + @apply text-garage-orange; } @layer utilities { - /** Global ToC */ + /** Main nav */ + + #navMenuToggleBtn { + position: absolute; + left: -100vw; + } + + #navMenuToggleBtn:checked + label { + background: white; + padding: 0.375rem; + border-radius: 0.5rem; + --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); + --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); + } + + #navMenuToggleBtn:checked ~ #navMenu { + display: block; + } + + /** Home map */ + + #map-container { + background-image: url('/images/map.svg'); + background-repeat: no-repeat; + background-position: left; + background-size: cover; + background-attachment: fixed; + height: 70vh; + } + + @media screen and (max-width: 1280px) { + #map-container { + background-position: center; + background-attachment: scroll; + height: 50vh; + } + } + + @media screen and (max-width: 768px) { + #map-container { + background-position: 25% 50%; + background-size: auto; + background-attachment: scroll; + height: 42vh; + } + } + + /** Documentation */ #global_toc .deploySubMenu { position: absolute; left: -100vw; @@ -118,4 +166,100 @@ p > code, p > strong > code, li > code, li > strong > code { transform: rotate(0deg); } + #documentation-section .page-content { + line-height: 1.9rem; + } + + #documentation-section .page-content p + p { + margin-top: 1.15rem; + } + + #documentation-section .page-content h1, + #documentation-section .page-content h2, + #documentation-section .page-content h3 { + margin-top: 2.85rem; + } + #documentation-section .page-content h4, + #documentation-section .page-content h5, + #documentation-section .page-content h6 { + margin-top: 2rem; + font-weight: 600; + } + + #documentation-section .page-content ul { + list-style-type: "➡"; + padding-left: 1.25rem; + } + + #documentation-section .page-content ol { + padding-left: 1.25rem; + } + + #documentation-section .page-content ul li, + #documentation-section .page-content ol li { + padding-left: 0.95rem; + } + #documentation-section .page-content ul li ul, + #documentation-section .page-content ul li ol, + #documentation-section .page-content ol li ul, + #documentation-section .page-content ol li ol { + padding-left: 0rem; + } + + #documentation-section .page-content ul li ul, + #documentation-section .page-content ol li ul { + list-style-type: "➜"; + } + + @media screen and (max-width: 768px) { + #documentation-section .page-content p { + font-size: 0.95rem; + } + #documentation-section .page-content p + p { + margin-top: 0.75rem; + } + #documentation-section .page-content code { + font-size: 0.9rem; + } + #documentation-section .page-content pre { + overflow-x: scroll; + font-size: 0.95rem; + } + #documentation-section .page-content ul { + padding-left: 0.25rem; + } + #documentation-section .page-content ul li { + font-size: 0.95rem; + padding-left: 0.75rem; + } + #documentation-section .page-content ul li a { + font-size: 0.95rem; + } + } + + /** Blog */ + + #blogpost-section .page-content p + p, + #blogpost-section .page-content p + #continue-reading + p { + margin-top: 2rem; + } + #blogpost-section .page-content #continue-reading { + margin: 2rem 0; + } + + #blogpost-section .page-content ul { + list-style-type: "➡"; + padding-left: 1.25rem; + margin: 2rem 0; + } + + #blogpost-section .page-content ul li { + padding-left: 0.95rem; + } + + #blogpost-section img { + display: inline-block; + margin: 2.75rem 0; + } + } \ No newline at end of file diff --git a/static/icons/android-chrome-192x192.png b/static/icons/android-chrome-192x192.png old mode 100755 new mode 100644 index aea97b9..6191d54 Binary files a/static/icons/android-chrome-192x192.png and b/static/icons/android-chrome-192x192.png differ diff --git a/static/icons/android-chrome-384x384.png b/static/icons/android-chrome-384x384.png old mode 100755 new mode 100644 index 3d37c74..6591643 Binary files a/static/icons/android-chrome-384x384.png and b/static/icons/android-chrome-384x384.png differ diff --git a/static/icons/apple-touch-icon.png b/static/icons/apple-touch-icon.png old mode 100755 new mode 100644 index 87f4544..ea31671 Binary files a/static/icons/apple-touch-icon.png and b/static/icons/apple-touch-icon.png differ diff --git a/static/icons/contact.svg b/static/icons/contact.svg new file mode 100644 index 0000000..6462178 --- /dev/null +++ b/static/icons/contact.svg @@ -0,0 +1,96 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/icons/datachunks.svg b/static/icons/datachunks.svg new file mode 100644 index 0000000..dd5f0ea --- /dev/null +++ b/static/icons/datachunks.svg @@ -0,0 +1,516 @@ + + + + Layer 1 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/icons/favicon-16x16.png b/static/icons/favicon-16x16.png old mode 100755 new mode 100644 index 3480bc7..959a4c2 Binary files a/static/icons/favicon-16x16.png and b/static/icons/favicon-16x16.png differ diff --git a/static/icons/favicon-32x32.png b/static/icons/favicon-32x32.png old mode 100755 new mode 100644 index 605b4ab..cd92e5f Binary files a/static/icons/favicon-32x32.png and b/static/icons/favicon-32x32.png differ diff --git a/static/icons/favicon.ico b/static/icons/favicon.ico old mode 100755 new mode 100644 index 77b9683..c667975 Binary files a/static/icons/favicon.ico and b/static/icons/favicon.ico differ diff --git a/static/icons/git.svg b/static/icons/git.svg new file mode 100644 index 0000000..f5f36f9 --- /dev/null +++ b/static/icons/git.svg @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/static/icons/mstile-150x150.png b/static/icons/mstile-150x150.png index ecacbb4..20b38df 100755 Binary files a/static/icons/mstile-150x150.png and b/static/icons/mstile-150x150.png differ diff --git a/static/icons/rss.svg b/static/icons/rss.svg new file mode 100644 index 0000000..99b3581 --- /dev/null +++ b/static/icons/rss.svg @@ -0,0 +1,62 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/icons/safari-pinned-tab.svg b/static/icons/safari-pinned-tab.svg deleted file mode 100755 index 9e473c4..0000000 --- a/static/icons/safari-pinned-tab.svg +++ /dev/null @@ -1,15 +0,0 @@ - - - - -Created by potrace 1.11, written by Peter Selinger 2001-2013 - - - - - diff --git a/static/icons/servers.svg b/static/icons/servers.svg new file mode 100644 index 0000000..e1534b9 --- /dev/null +++ b/static/icons/servers.svg @@ -0,0 +1,1613 @@ + + + + Layer 1 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/avatar.png b/static/images/avatar.png deleted file mode 100755 index 8b13789..0000000 --- a/static/images/avatar.png +++ /dev/null @@ -1 +0,0 @@ - diff --git a/static/images/backup.png b/static/images/backup.png index 927eccf..6227369 100755 Binary files a/static/images/backup.png and b/static/images/backup.png differ diff --git a/static/images/garage-logo-horizontal.svg b/static/images/garage-logo-horizontal.svg new file mode 100644 index 0000000..9bf3293 --- /dev/null +++ b/static/images/garage-logo-horizontal.svg @@ -0,0 +1,132 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/garage-logo-simple.svg b/static/images/garage-logo-simple.svg new file mode 100644 index 0000000..85f5e19 --- /dev/null +++ b/static/images/garage-logo-simple.svg @@ -0,0 +1,98 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/host.png b/static/images/host.png index fd57cf8..151e254 100755 Binary files a/static/images/host.png and b/static/images/host.png differ diff --git a/static/images/host2.png b/static/images/host2.png deleted file mode 100755 index 9eb9a62..0000000 Binary files a/static/images/host2.png and /dev/null differ diff --git a/static/images/map.svg b/static/images/map.svg new file mode 100644 index 0000000..17db33e --- /dev/null +++ b/static/images/map.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/ngi-pointer-eu.png b/static/images/ngi-pointer-eu.png new file mode 100644 index 0000000..97111b1 Binary files /dev/null and b/static/images/ngi-pointer-eu.png differ diff --git a/static/js/site.js b/static/js/site.js index f764289..d8e0d69 100755 --- a/static/js/site.js +++ b/static/js/site.js @@ -112,7 +112,7 @@ function makeTeaser(body, terms) { function formatSearchResultItem(item, terms) { return ( - `` + + `` + `

` + `${item.doc.title}` + `

` + `
` + `${makeTeaser(item.doc.body, terms)}` + @@ -168,9 +168,11 @@ function search() { } function openSearchModal() { + var baseUrl = window.location.protocol + "//" + window.location.host; + var indexScriptPath = baseUrl + '/search_index.en.js'; if (indexScriptLoaded === false) { var indexScript = document.createElement('script'); - indexScript.setAttribute('src', './search_index.en.js'); + indexScript.setAttribute('src', indexScriptPath); document.head.appendChild(indexScript); indexScriptLoaded = true; } diff --git a/static/screenshots/screenshot-1280.png b/static/screenshots/screenshot-1280.png new file mode 100644 index 0000000..2a866f1 Binary files /dev/null and b/static/screenshots/screenshot-1280.png differ diff --git a/static/screenshots/screenshot-480.png b/static/screenshots/screenshot-480.png new file mode 100644 index 0000000..4eb1d38 Binary files /dev/null and b/static/screenshots/screenshot-480.png differ diff --git a/static/screenshots/screenshot-768.png b/static/screenshots/screenshot-768.png new file mode 100644 index 0000000..784d705 Binary files /dev/null and b/static/screenshots/screenshot-768.png differ diff --git a/tailwind.config.js b/tailwind.config.js index 0d3f330..7c30233 100755 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -9,6 +9,13 @@ module.exports = { 'garage-orange': "#FF9329", 'garage-gray': "#4E4E4E", }, + backgroundSize: { + 'size-200': '200% 200%', + }, + backgroundPosition: { + 'pos-0': '0% 0%', + 'pos-100': '100% 100%', + }, }, }, variants: { diff --git a/templates/base.html b/templates/base.html index 8170b44..d947c50 100755 --- a/templates/base.html +++ b/templates/base.html @@ -13,36 +13,14 @@ {% include "partials/shared/nav.html" %} -
- {% block content %}{% endblock %} -
+ {% block content %}{% endblock %} {% block search %} - + {% include "partials/shared/search.html" %} {% endblock %} {% block pagination %} - {% include "partials/shared/paginator.html" %} + {% include "partials/shared/paginator.html" %} {% endblock %} {% block comment %}{% endblock %} diff --git a/templates/documentation.html b/templates/documentation.html index 70ef6a3..55a5c61 100644 --- a/templates/documentation.html +++ b/templates/documentation.html @@ -6,10 +6,10 @@ {% block content %} {% set section = get_section(path="documentation/_index.md") %} -
+
{% include "partials/doc/global_toc.html" %} -
+
diff --git a/templates/index.html b/templates/index.html index 08cce9c..d859bcb 100755 --- a/templates/index.html +++ b/templates/index.html @@ -5,28 +5,49 @@
- +

{{config.extra.organization.name}}

+ {{config.extra.organization.name}}

{{ config.extra.organization.description }}

-
-
- - Host a Website +
+
+ + Host a Website
- - Store Media + + Store Media
-
- - Backup Target +
+ + Backup Target
-
+
+
+ +
+
+
+

Each chunk of data is replicated in 3 zones

+
+
+ + Zone (multiple servers) +
+
+ + Chunks of data +
+
+
-
{% endblock %} diff --git a/templates/macros.html b/templates/macros.html index 9fab136..dc65140 100755 --- a/templates/macros.html +++ b/templates/macros.html @@ -2,24 +2,24 @@

{% if social_config.git %} - - + + {% endif %} {% if social_config.email %} - - + + {% endif %} {% if config.generate_feed %} - - + + {% endif %} diff --git a/templates/page.html b/templates/page.html index eeba7f1..67081b7 100755 --- a/templates/page.html +++ b/templates/page.html @@ -5,7 +5,7 @@ {% endblock %} {% block content %} -

+
@@ -18,17 +18,17 @@ {% if page.description %}

{{ page.description }}

{% endif %} - +
-
-
+
+
{{ macros::page_publish_metadata(page=page) }}
-
+
{{ macros::page_content_metadata(page=page) }}
@@ -43,7 +43,7 @@
-
+
{{ page.content | safe }}
diff --git a/templates/partials/doc/global_toc.html b/templates/partials/doc/global_toc.html index ebad287..f739f49 100644 --- a/templates/partials/doc/global_toc.html +++ b/templates/partials/doc/global_toc.html @@ -1,8 +1,20 @@ -