diff --git a/.gitignore b/.gitignore index 2ca8682..e43b0f9 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1 @@ -_site/ -.sass-cache/ -.jekyll-cache/ -.jekyll-metadata +.DS_Store diff --git a/.nojekyll b/.nojekyll new file mode 100644 index 0000000..8b13789 --- /dev/null +++ b/.nojekyll @@ -0,0 +1 @@ + diff --git a/404.html b/404.html deleted file mode 100644 index 1590ef2..0000000 --- a/404.html +++ /dev/null @@ -1,6 +0,0 @@ ---- -title: Not Found -description: This does not exist -permalink: /404.html -sitemap: false ---- diff --git a/Gemfile b/Gemfile deleted file mode 100644 index 895c2d8..0000000 --- a/Gemfile +++ /dev/null @@ -1,14 +0,0 @@ -source 'https://rubygems.org' - -gem 'jekyll', '4.1.1' - - -group :jekyll_plugins do - gem 'jekyll-seo-tag', '2.6.1' - gem 'jekyll-sitemap', '1.3.1' -end - -gem 'tzinfo', '>= 2.0' if Gem.win_platform? -gem 'tzinfo-data', '>= 1.2020' if Gem.win_platform? -gem 'wdm', '>= 0.1.0' if Gem.win_platform? -gem "webrick", "~> 1.9" diff --git a/Gemfile.lock b/Gemfile.lock deleted file mode 100644 index 54fd409..0000000 --- a/Gemfile.lock +++ /dev/null @@ -1,80 +0,0 @@ -GEM - remote: https://rubygems.org/ - specs: - addressable (2.8.7) - public_suffix (>= 2.0.2, < 7.0) - colorator (1.1.0) - concurrent-ruby (1.3.5) - em-websocket (0.5.3) - eventmachine (>= 0.12.9) - http_parser.rb (~> 0) - eventmachine (1.2.7) - eventmachine (1.2.7-x64-mingw32) - ffi (1.15.5) - ffi (1.15.5-x64-mingw32) - forwardable-extended (2.6.0) - http_parser.rb (0.8.0) - i18n (1.14.7) - concurrent-ruby (~> 1.0) - jekyll (4.1.1) - addressable (~> 2.4) - colorator (~> 1.0) - em-websocket (~> 0.5) - i18n (~> 1.0) - jekyll-sass-converter (~> 2.0) - jekyll-watch (~> 2.0) - kramdown (~> 2.1) - kramdown-parser-gfm (~> 1.0) - liquid (~> 4.0) - mercenary (~> 0.4.0) - pathutil (~> 0.9) - rouge (~> 3.0) - safe_yaml (~> 1.0) - terminal-table (~> 1.8) - jekyll-sass-converter (2.2.0) - sassc (> 2.0.1, < 3.0) - jekyll-seo-tag (2.6.1) - jekyll (>= 3.3, < 5.0) - jekyll-sitemap (1.3.1) - jekyll (>= 3.7, < 5.0) - jekyll-watch (2.2.1) - listen (~> 3.0) - kramdown (2.5.1) - rexml (>= 3.3.9) - kramdown-parser-gfm (1.1.0) - kramdown (~> 2.0) - liquid (4.0.4) - listen (3.9.0) - rb-fsevent (~> 0.10, >= 0.10.3) - rb-inotify (~> 0.9, >= 0.9.10) - mercenary (0.4.0) - pathutil (0.16.2) - forwardable-extended (~> 2.6) - public_suffix (6.0.1) - rb-fsevent (0.11.2) - rb-inotify (0.11.1) - ffi (~> 1.0) - rexml (3.4.0) - rouge (3.30.0) - safe_yaml (1.0.5) - sassc (2.4.0) - ffi (~> 1.9) - sassc (2.4.0-x64-mingw32) - ffi (~> 1.9) - terminal-table (1.8.0) - unicode-display_width (~> 1.1, >= 1.1.1) - unicode-display_width (1.8.0) - webrick (1.9.1) - -PLATFORMS - ruby - x64-mingw32 - -DEPENDENCIES - jekyll (= 4.1.1) - jekyll-seo-tag (= 2.6.1) - jekyll-sitemap (= 1.3.1) - webrick (~> 1.9) - -BUNDLED WITH - 2.1.4 diff --git a/README.md b/README.md index 05b88cf..49d1122 100644 --- a/README.md +++ b/README.md @@ -1,12 +1,13 @@ # Path of Building Community website -Made with https://github.com/CloudCannon/hydra-jekyll-template +Static website for https://pathofbuilding.community. -### Developement -To run the project locally simply run: +## Local preview -``` -$ docker compose up -``` +Open `index.html` directly in a browser. -Then go to http://127.0.0.1:4000 \ No newline at end of file +No build step or local server is required. If you want to preview it through a local HTTP URL that matches GitHub Pages behavior more closely, any static file server can serve the repository root. + +## GitHub Pages + +This repository is designed to deploy directly from the repository root with GitHub Pages. diff --git a/_config.yml b/_config.yml deleted file mode 100644 index eea8605..0000000 --- a/_config.yml +++ /dev/null @@ -1,62 +0,0 @@ -# ---- -# Site - -title: Path of Building Community -url: "https://pathofbuilding.community" -baseurl: -google_analytics_key: -google_maps_javascript_api_key: -disqus_shortname: - -# Values for the jekyll-seo-tag gem (https://github.com/jekyll/jekyll-seo-tag) -logo: /favicon.ico -description: Informational site for the Path of Exile building tool, Path of Building. -author: - name: The Path of Building Community - email: - twitter: # twitter username without the @ symbol -social: - name: Path of Building - links: - - https://github.com/PathOfBuildingCommunity/PathOfBuilding - -# ----- -# Build - -timezone: Etc/UTC - -collections: - -permalink: pretty - -defaults: - - - scope: - path: "" - values: - layout: "page" - - - scope: - path: "index.html" - values: - layout: "default" - -plugins: - - jekyll-sitemap - -exclude: - - Gemfile - - Gemfile.lock - - README.md - - LICENCE - -# ----------- -# CloudCannon - -social_icons: - - Github - -_comments: - highlight: Emphasis the text - color: The background colour used in the plan name and call to action. - new_window: Open link in new window diff --git a/_data/footer.yml b/_data/footer.yml deleted file mode 100644 index 0a22853..0000000 --- a/_data/footer.yml +++ /dev/null @@ -1,18 +0,0 @@ -- links: - - name: Project page - link: https://github.com/PathOfBuildingCommunity/PathOfBuilding - social_icon: GitHub - new_window: true -- links: - - name: Improve this website - link: https://github.com/PathOfBuildingCommunity/pathofbuildingcommunity.github.io - social_icon: GitHub - new_window: true -- links: - - name: Imprint - link: /imprint/ - new_window: false -- links: - - name: Privacy - link: /privacy/ - new_window: false \ No newline at end of file diff --git a/_data/navigation.yml b/_data/navigation.yml deleted file mode 100644 index c420d0b..0000000 --- a/_data/navigation.yml +++ /dev/null @@ -1,16 +0,0 @@ -- name: Main page - link: / - new_window: false - highlight: false -- name: Contributors - link: https://github.com/PathOfBuildingCommunity/PathOfBuilding/graphs/contributors - new_window: true - highlight: false -- name: Report an issue - link: https://github.com/PathOfBuildingCommunity/PathOfBuilding/issues/new/choose - new_window: true - highlight: false -- name: See the project on github - link: https://github.com/PathOfBuildingCommunity/PathOfBuilding - new_window: true - highlight: true \ No newline at end of file diff --git a/_includes/navigation.html b/_includes/navigation.html deleted file mode 100644 index 19153d8..0000000 --- a/_includes/navigation.html +++ /dev/null @@ -1,15 +0,0 @@ - diff --git a/_includes/relative-src.html b/_includes/relative-src.html deleted file mode 100644 index fb32308..0000000 --- a/_includes/relative-src.html +++ /dev/null @@ -1 +0,0 @@ -{% assign prefix = include.src | slice: 0, 2 %}{% assign protocol = include.src | slice: 0, 4 %}{% unless protocol == 'http' or prefix == "//" %}{{ site.baseurl }}{% endunless %}{{ include.src }} diff --git a/_includes/social-icon.html b/_includes/social-icon.html deleted file mode 100644 index ad96a63..0000000 --- a/_includes/social-icon.html +++ /dev/null @@ -1,24 +0,0 @@ -{% case include.icon %} - {% when "Facebook" %} - - {% when "Google Plus" %} - - {% when "Instagram" %} - - {% when "LinkedIn" %} - - {% when "Pinterest" %} - - {% when "Tumblr" %} - - {% when "Twitter" %} - - {% when "YouTube" %} - - {% when "RSS" %} - - {% when "GitHub" %} - - - -{% endcase %} diff --git a/_layouts/default.html b/_layouts/default.html deleted file mode 100644 index 8598367..0000000 --- a/_layouts/default.html +++ /dev/null @@ -1,50 +0,0 @@ - - - - - - - {% seo %} - - - - - -
-
- {% include navigation.html %} -
-
- {{ content }} - - - - diff --git a/_layouts/page.html b/_layouts/page.html deleted file mode 100644 index 1a1c737..0000000 --- a/_layouts/page.html +++ /dev/null @@ -1,18 +0,0 @@ ---- -layout: default ---- -
-
-
- {% if page.heading %} -

{{ page.heading }}

- {% elsif page.title and page.layout != 'archive' %} -

{{ page.title }}

- {% endif %} - {% if page.description %} -

{{ page.description }}

- {% endif %} - {{ content }} -
-
-
diff --git a/_sass/cloudcannon.scss b/_sass/cloudcannon.scss deleted file mode 100644 index 0c27b69..0000000 --- a/_sass/cloudcannon.scss +++ /dev/null @@ -1,37 +0,0 @@ -.editor-link, .nav-open nav .editor-link { - display: none; - margin-top: 0; - - .btn { - border: 0; - border-radius: 2px; - width: 100%; - max-width: 500px; - box-sizing: border-box; - font-size: 2rem; - text-decoration: none; - padding: 10px 15px; - margin: 0; - font-size: 18px; - } - - nav &, .btn { - cursor: pointer; - background-color: #f7e064; - color: #333; - box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.2); - - &:hover { - background-color: #f4d525; - color: #333; - } - } -} - -.cms-editor-active .editor-link { - display: block; -} - -.cms-editor-active nav .editor-link { - display: inline; -} diff --git a/_sass/elements.scss b/_sass/elements.scss deleted file mode 100644 index d478b78..0000000 --- a/_sass/elements.scss +++ /dev/null @@ -1,68 +0,0 @@ -html { - background: #2b2b40; - min-width: 300px; -} - -html, body { - margin: 0; - padding: 0; -} - -body { - font-family: 'Lato', "San Francisco", "Helvetica Neue", "Helvetica", "Arial"; -} - -a { - color: #00a4ca; - text-decoration: none; -} - -a:hover { - text-decoration: underline; -} - -div.button a div { - word-break:break-all; - margin: 2%; - span { - white-space: nowrap; - display: inline-block; - } -} - -img { - width: 100%; -} - -h1 strong, h2 strong { - font-weight: 700; -} - -h1 { - font-weight: 300; - font-size: 2.3em; - margin: 0; - font-family: 'Lato'; - font-weight: 900; -} - -h2 { - font-weight: 300; - font-size: 2.2em; - margin: 0 0 30px 0; - font-family: 'Lato'; - font-weight: 900; -} - -h3 { - margin: 20px 0 10px 0; -} - - -p, address { - font-size: 1.38em; - color: #666; - margin-bottom: 20px; - font-weight: 300; - line-height: 1.4em; -} diff --git a/_sass/footer.scss b/_sass/footer.scss deleted file mode 100644 index 1749409..0000000 --- a/_sass/footer.scss +++ /dev/null @@ -1,111 +0,0 @@ -.footer-links { - width: 100%; - margin: 10px; - padding: 0; - - @media #{$tablet} { - -webkit-flex: 1 0 180px; - flex: 1 0 180px; - } - - li { - list-style: none; - margin: 15px auto; - - @media #{$tablet} { - text-align: center; - } - a { - - svg { - fill: #999; - margin-right: 10px; - transition: fill 0.2s ease; - vertical-align: middle; - position: relative; - top: -2px; - width: 22px; - height: 22px; - } - - &:hover svg { - fill: #fff; - } - - &.twitter-icon:hover svg { - fill: #55acee; - } - - &.google-plus-icon:hover svg { - fill: #db4437; - } - - &.youtube-icon:hover svg { - fill: #cd201f; - } - - &.instagram-icon:hover svg { - fill: #f167f5; - } - - &.linkedin-icon:hover svg { - fill: #0077b5; - } - - &.pinterest-icon:hover svg { - fill: #bd081c; - } - - &.rss-icon:hover svg { - fill: #f26522; - } - } - } -} - -footer { - padding: 50px 0 50px 0; - font-size: 1.1em; - position: relative; - background: #2b2b40; - color: #fff; - - .copyright { - font-size: .8em; - margin: 0 auto; - - @media #{$tablet} { - text-align: center; - } - a { - color: #999; - } - } - - h2 { - font-size: 1.4em; - margin: 30px 0; - color: #ccc; - } - - .footer-columns { - @extend %flexbox; - @include flex-flow(wrap); - margin: -10px -10px 10px -10px; - - a { - color: #fff; - } - } - - .legal-line { - width: 100%; - padding: 30px 0; - margin: 0; - background-color: #222527; - - a { - font-weight: 600; - } - } -} diff --git a/_sass/forms.scss b/_sass/forms.scss deleted file mode 100644 index 6779063..0000000 --- a/_sass/forms.scss +++ /dev/null @@ -1,65 +0,0 @@ -.button a, input[type=submit] { - color: #fff; - text-decoration: none; - background: $brand-color; - border-radius: 3px; - border: 1px solid rgba(255,255,255,.5); - transition: .2s ease-in-out; -} - -.button a:hover, input[type=submit]:hover { - border: 1px solid #fff; - background: $secondary-brand-color; - cursor: pointer; -} - -.button.alt a { - background: rgba(255,255,255,0.15); - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.3); -} - -.button.alt a:hover { - background: #fff; - color: $brand-color; -} - -textarea, input, button, select { font-family: inherit; font-size: inherit; } - -input[type=submit] { - margin: 20px 0 0 0; -} - -label, input, textarea { - display: block; - width: 100%; - box-sizing: border-box; -} - -textarea { - resize: vertical; - height: 150px; -} - -label { - margin: 20px 0 5px 0; -} - -input, textarea { - padding: 10px; - font-size: 1em; -} - -input, textarea { - -webkit-transition: all 0.30s ease-in-out; - -moz-transition: all 0.30s ease-in-out; - -ms-transition: all 0.30s ease-in-out; - -o-transition: all 0.30s ease-in-out; - outline: none; - border: 1px solid #DDDDDD; -} - -input[type=text]:focus, input[type=email]:focus, input[type=password]:focus, textarea:focus { - box-shadow: 0 0 5px rgba(81, 203, 238, 1); - border: 1px solid rgba(81, 203, 238, 1); -} diff --git a/_sass/landing-page.scss b/_sass/landing-page.scss deleted file mode 100644 index 6ab3b5c..0000000 --- a/_sass/landing-page.scss +++ /dev/null @@ -1,148 +0,0 @@ -@import "mixins/columns"; - -.app-title { - text-transform: uppercase; - letter-spacing: 8px; -} -.app-subtitle { - text-transform: uppercase; - letter-spacing: 2px; - font-size: 0.8em; -} - -.bottom-faq { - color: white; - background: linear-gradient(to bottom, $brand-color 0%, $middle-gradient-color 100%); - - h2 { - margin-bottom: 50px; - text-align: center; - } - - .faq-container { - max-width: 1000px; - padding: 0 20px; - margin: 0 auto; - } -} - -.cta.button.alt a { - margin: 0 auto; - display: flex; - width: fit-content; - justify-content: center; - align-items: center; - - .social-icon { - margin: 2%; - width: 80px; - } -} - -.releases { - color: inherit; -} - -.bottom-cta { - background: linear-gradient(to bottom, $brand-color 0%, $middle-gradient-color 100%); - color: #fff; - margin: 0; - padding: 100px 0; - - h2 { - margin-bottom: 50px; - text-align: center - } - - .feature-list { - max-width: fit-content; - margin-left: auto; - margin-right: auto; - display: flex; - justify-content: center; - - ul { - list-style-type: disc; - width: 38%; - } - - li { - line-height: 2em; - list-style-type: disc; - } - } -} - -.testimonial { - background: #f5f5f5; - margin: 0; - padding: 100px 0; - - .testimonial-block { - max-width: 750px; - width: 98%; - margin: 0 auto; - - @media #{$tablet} { - @include flexbox; - - blockquote { - -webkit-flex: 1; - flex: 1; - } - } - } -} - -.hero { - color: #ffffff; - text-align: center; - background: linear-gradient(to bottom, $middle-gradient-color 0%, $secondary-brand-color 100%) no-repeat #a05fb7; - padding-top: 50px; - p { - color: #fff; - } - - .text-container { - max-width: 2280px; - } -} - - -@media #{$desktop} { - .flex { - @include flexbox; - align-items: center; - flex-direction: row; - - .text, .image { - -webkit-flex: 1; - flex: 1; - padding: 0 20px; - } - } - - .content section:nth-child(even) .flex { - flex-direction: row-reverse; - } -} - -#ahead-commit-count::before { - content: "Ahead by"; - background-color: #222222; - height: 100%; - padding: 8px; - font-weight: bold; - margin-right: 12px; - letter-spacing: 4px; -} - -#ahead-commit-count { - display: inline-block; - background-color: #111111; - color: white; - padding-right: 12px; - text-transform: uppercase; - font-weight: bold; - margin: 16px; -} diff --git a/_sass/layout.scss b/_sass/layout.scss deleted file mode 100644 index 6036518..0000000 --- a/_sass/layout.scss +++ /dev/null @@ -1,187 +0,0 @@ -.container, .text-container { - margin: 0 auto; - position: relative; - padding: 0 20px; -} - -.text-container { - max-width: 750px; -} - -.container { - max-width: 1140px; - &.max-container { - max-width: 100%; - padding: 0; - } -} - -.what-is-this { - font-size: 1.1em; - display: flex; - padding-top: 50px; - color: white; -} - -header { - color: #fff; - padding: 32px 0; - background: $brand-color; /* Old browsers */ - background: linear-gradient(to bottom, $brand-color 0%, $middle-gradient-color 100%) no-repeat $brand-color; - - a { - color: #fff; - text-decoration: none; - z-index: 1; - position: relative; - - &:hover { - text-decoration: none; - } - } - - .container { - display: flex; - flex-direction: row; - } - - .company-name { - font-size: 1.7em; - line-height: 0; - font-weight: 900; - - a { - display: inline-block; - } - - img { - display: block; - width: auto; - } - } -} - -.content { - background: #fff; - padding: 1px 0 0 0; - position: relative; -} - -.screenshot{ - max-width: 100%; - height: auto; - display: block; - box-shadow: 0 1px 0 #ccc, 0 1px 0 1px #eee; - border-radius: 2px; - margin-left: auto; - margin-right: auto; - background: #DDD url('data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%20standalone%3D%22no%22%3F%3E%0A%3Csvg%0A%20%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20viewBox%3D%220%200%2051.899834%207.3467851%22%0A%20%20%20height%3D%227.3467851%22%0A%20%20%20width%3D%2251.899834%22%3E%0A%20%20%3Cpath%0A%20%20%20%20%20id%3D%22path38%22%0A%20%20%20%20%20d%3D%22M%2037.898404%2C6.9644807%2043.518142%2C0.32297109%22%0A%20%20%20%20%20style%3D%22fill%3Anone%3Bstroke%3A%23000000%3Bstroke-width%3A1px%3Bstroke-linecap%3Abutt%3Bstroke-linejoin%3Amiter%3Bstroke-opacity%3A1%22%20%2F%3E%0A%20%20%3Cpath%0A%20%20%20%20%20id%3D%22path40%22%0A%20%20%20%20%20d%3D%22M%2037.834975%2C0.30637739%2043.502244%2C7.0097907%22%0A%20%20%20%20%20style%3D%22fill%3Anone%3Bstroke%3A%23000000%3Bstroke-width%3A0.914212px%3Bstroke-linecap%3Abutt%3Bstroke-linejoin%3Amiter%3Bstroke-opacity%3A1%22%20%2F%3E%0A%20%20%3Crect%0A%20%20%20%20%20y%3D%220.5080052%22%0A%20%20%20%20%20x%3D%2218.79323%22%0A%20%20%20%20%20height%3D%226.37778%22%0A%20%20%20%20%20width%3D%228.3611345%22%0A%20%20%20%20%20id%3D%22rect42%22%0A%20%20%20%20%20style%3D%22fill%3Anone%3Bfill-rule%3Aevenodd%3Bstroke%3A%23000000%3Bstroke-width%3A0.797323%3Bstroke-miterlimit%3A4%3Bstroke-dasharray%3Anone%3Bstroke-opacity%3A1%22%20%2F%3E%0A%20%20%3Cpath%0A%20%20%20%20%20id%3D%22path871%22%0A%20%20%20%20%20d%3D%22M%200%2C6.7888497%20H%209.068215%22%0A%20%20%20%20%20style%3D%22fill%3Anone%3Bstroke%3A%23000000%3Bstroke-width%3A1px%3Bstroke-linecap%3Abutt%3Bstroke-linejoin%3Amiter%3Bstroke-opacity%3A1%22%20%2F%3E%0A%3C%2Fsvg%3E%0A') right 6px no-repeat; - padding: 20px 0 0 0; - position: relative; - box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 12px 20px 4px rgba(0,0,0,0.56), 0 0 0 1px rgba(0, 0, 0, 0.3); -} - -section { - padding: 50px 0; -} - -section + section { - padding-top: 0; -} - -.subtext { - margin-top: 10px; - text-align: center; -} - - -.cta { - padding: 0.6em; -} - -.page h2 { - text-align: center; -} - -blockquote { - padding: 18px 25px; - margin: 0; - quotes: "\201C""\201D""\2018""\2019"; - font-style: italic; - - .author { - display: block; - font-weight: bold; - margin: 10px 0 0 0; - font-size: .85em; - font-style: normal; - } - - p { - display: inline; - } -} - -blockquote:before { - color: #ccc; - content: open-quote; - font-size: 4em; - line-height: 0.1em; - margin-right: 0.25em; - vertical-align: -0.4em; -} - -.square-image { - width: 150px; - height: 150px; - overflow: hidden; - margin: 25px auto 0 auto; - position: relative; - border-radius: 200px; - - img { - position: absolute; - left: -1000%; - right: -1000%; - top: -1000%; - bottom: -1000%; - margin: auto; - width: 300px; - } -} - -.page { - margin-bottom: 0; - padding-bottom: 80px; -} - -.center-text { - text-align: center; -} - -.editor-link { - display: none; - margin-top: 0; - .btn { - border: 0; - border-radius: 2px; - width: 100%; - max-width: 500px; - box-sizing: border-box; - font-size: 2rem; - text-decoration: none; - padding: 10px 15px; - margin: 0; - font-size: 18px; - cursor: pointer; - background-color: #f7e064; - color: #333; - box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.2); - - &:hover { - background-color: #f4d525; - color: #333; - } - } - -} diff --git a/_sass/mixins/columns.scss b/_sass/mixins/columns.scss deleted file mode 100644 index 010eae9..0000000 --- a/_sass/mixins/columns.scss +++ /dev/null @@ -1,5 +0,0 @@ -@mixin columns($value) { - columns: $value; - -webkit-columns: $value; - -moz-columns: $value; -} diff --git a/_sass/mixins/flexbox.scss b/_sass/mixins/flexbox.scss deleted file mode 100644 index 92a03fd..0000000 --- a/_sass/mixins/flexbox.scss +++ /dev/null @@ -1,394 +0,0 @@ -// Flexbox Mixins -// http://philipwalton.github.io/solved-by-flexbox/ -// https://github.com/philipwalton/solved-by-flexbox -// -// Copyright (c) 2013 Brian Franco -// -// Permission is hereby granted, free of charge, to any person obtaining a -// copy of this software and associated documentation files (the -// "Software"), to deal in the Software without restriction, including -// without limitation the rights to use, copy, modify, merge, publish, -// distribute, sublicense, and/or sell copies of the Software, and to -// permit persons to whom the Software is furnished to do so, subject to -// the following conditions: -// The above copyright notice and this permission notice shall be included -// in all copies or substantial portions of the Software. -// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS -// OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF -// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. -// IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY -// CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, -// TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE -// SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -// -// This is a set of mixins for those who want to mess around with flexbox -// using the native support of current browsers. For full support table -// check: http://caniuse.com/flexbox -// -// Basically this will use: -// -// * Fallback, old syntax (IE10, mobile webkit browsers - no wrapping) -// * Final standards syntax (FF, Safari, Chrome, IE11, Opera) -// -// This was inspired by: -// -// * http://dev.opera.com/articles/view/advanced-cross-browser-flexbox/ -// -// With help from: -// -// * http://w3.org/tr/css3-flexbox/ -// * http://the-echoplex.net/flexyboxes/ -// * http://msdn.microsoft.com/en-us/library/ie/hh772069(v=vs.85).aspx -// * http://css-tricks.com/using-flexbox/ -// * http://dev.opera.com/articles/view/advanced-cross-browser-flexbox/ -// * https://developer.mozilla.org/en-us/docs/web/guide/css/flexible_boxes - -//---------------------------------------------------------------------- - -// Flexbox Containers -// -// The 'flex' value causes an element to generate a block-level flex -// container box. -// -// The 'inline-flex' value causes an element to generate a inline-level -// flex container box. -// -// display: flex | inline-flex -// -// http://w3.org/tr/css3-flexbox/#flex-containers -// -// (Placeholder selectors for each type, for those who rather @extend) - -@mixin flexbox { - display: -webkit-box; - display: -webkit-flex; - display: -moz-flex; - display: -ms-flexbox; - display: flex; -} - -%flexbox { @include flexbox; } - -//---------------------------------- - -@mixin inline-flex { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -moz-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; -} - -%inline-flex { @include inline-flex; } - -//---------------------------------------------------------------------- - -// Flexbox Direction -// -// The 'flex-direction' property specifies how flex items are placed in -// the flex container, by setting the direction of the flex container's -// main axis. This determines the direction that flex items are laid out in. -// -// Values: row | row-reverse | column | column-reverse -// Default: row -// -// http://w3.org/tr/css3-flexbox/#flex-direction-property - -@mixin flex-direction($value: row) { - @if $value == row-reverse { - -webkit-box-direction: reverse; - -webkit-box-orient: horizontal; - } @else if $value == column { - -webkit-box-direction: normal; - -webkit-box-orient: vertical; - } @else if $value == column-reverse { - -webkit-box-direction: reverse; - -webkit-box-orient: vertical; - } @else { - -webkit-box-direction: normal; - -webkit-box-orient: horizontal; - } - -webkit-flex-direction: $value; - -moz-flex-direction: $value; - -ms-flex-direction: $value; - flex-direction: $value; -} - // Shorter version: - @mixin flex-dir($args...) { @include flex-direction($args...); } - -//---------------------------------------------------------------------- - -// Flexbox Wrap -// -// The 'flex-wrap' property controls whether the flex container is single-line -// or multi-line, and the direction of the cross-axis, which determines -// the direction new lines are stacked in. -// -// Values: nowrap | wrap | wrap-reverse -// Default: nowrap -// -// http://w3.org/tr/css3-flexbox/#flex-wrap-property - -@mixin flex-wrap($value: nowrap) { - // No Webkit Box fallback. - -webkit-flex-wrap: $value; - -moz-flex-wrap: $value; - @if $value == nowrap { - -ms-flex-wrap: none; - } @else { - -ms-flex-wrap: $value; - } - flex-wrap: $value; -} - -//---------------------------------------------------------------------- - -// Flexbox Flow (shorthand) -// -// The 'flex-flow' property is a shorthand for setting the 'flex-direction' -// and 'flex-wrap' properties, which together define the flex container's -// main and cross axes. -// -// Values: | -// Default: row nowrap -// -// http://w3.org/tr/css3-flexbox/#flex-flow-property - -@mixin flex-flow($values: (row nowrap)) { - // No Webkit Box fallback. - -webkit-flex-flow: $values; - -moz-flex-flow: $values; - -ms-flex-flow: $values; - flex-flow: $values; -} - -//---------------------------------------------------------------------- - -// Flexbox Order -// -// The 'order' property controls the order in which flex items appear within -// their flex container, by assigning them to ordinal groups. -// -// Default: 0 -// -// http://w3.org/tr/css3-flexbox/#order-property - -@mixin order($int: 0) { - -webkit-box-ordinal-group: $int + 1; - -webkit-order: $int; - -moz-order: $int; - -ms-flex-order: $int; - order: $int; -} - -//---------------------------------------------------------------------- - -// Flexbox Grow -// -// The 'flex-grow' property sets the flex grow factor. Negative numbers -// are invalid. -// -// Default: 0 -// -// http://w3.org/tr/css3-flexbox/#flex-grow-property - -@mixin flex-grow($int: 0) { - -webkit-box-flex: $int; - -webkit-flex-grow: $int; - -moz-flex-grow: $int; - -ms-flex-positive: $int; - flex-grow: $int; -} - -//---------------------------------------------------------------------- - -// Flexbox Shrink -// -// The 'flex-shrink' property sets the flex shrink factor. Negative numbers -// are invalid. -// -// Default: 1 -// -// http://w3.org/tr/css3-flexbox/#flex-shrink-property - -@mixin flex-shrink($int: 1) { - -webkit-flex-shrink: $int; - -moz-flex-shrink: $int; - -ms-flex-negative: $int; - flex-shrink: $int; -} - -//---------------------------------------------------------------------- - -// Flexbox Basis -// -// The 'flex-basis' property sets the flex basis. Negative lengths are invalid. -// -// Values: Like "width" -// Default: auto -// -// http://www.w3.org/TR/css3-flexbox/#flex-basis-property - -@mixin flex-basis($value: auto) { - -webkit-flex-basis: $value; - -moz-flex-basis: $value; - -ms-flex-preferred-size: $value; - flex-basis: $value; -} - -//---------------------------------------------------------------------- - -// Flexbox "Flex" (shorthand) -// -// The 'flex' property specifies the components of a flexible length: the -// flex grow factor and flex shrink factor, and the flex basis. When an -// element is a flex item, 'flex' is consulted instead of the main size -// property to determine the main size of the element. If an element is -// not a flex item, 'flex' has no effect. -// -// Values: none | || -// Default: See individual properties (1 1 0). -// -// http://w3.org/tr/css3-flexbox/#flex-property - -@mixin flex($fg: 1, $fs: null, $fb: null) { - - // Set a variable to be used by box-flex properties - $fg-boxflex: $fg; - - // Box-Flex only supports a flex-grow value so let's grab the - // first item in the list and just return that. - @if type-of($fg) == 'list' { - $fg-boxflex: nth($fg, 1); - } - - -webkit-box-flex: $fg-boxflex; - -webkit-flex: $fg $fs $fb; - -moz-box-flex: $fg-boxflex; - -moz-flex: $fg $fs $fb; - -ms-flex: $fg $fs $fb; - flex: $fg $fs $fb; -} - -//---------------------------------------------------------------------- - -// Flexbox Justify Content -// -// The 'justify-content' property aligns flex items along the main axis -// of the current line of the flex container. This is done after any flexible -// lengths and any auto margins have been resolved. Typically it helps distribute -// extra free space leftover when either all the flex items on a line are -// inflexible, or are flexible but have reached their maximum size. It also -// exerts some control over the alignment of items when they overflow the line. -// -// Note: 'space-*' values not supported in older syntaxes. -// -// Values: flex-start | flex-end | center | space-between | space-around -// Default: flex-start -// -// http://w3.org/tr/css3-flexbox/#justify-content-property - -@mixin justify-content($value: flex-start) { - @if $value == flex-start { - -webkit-box-pack: start; - -ms-flex-pack: start; - } @else if $value == flex-end { - -webkit-box-pack: end; - -ms-flex-pack: end; - } @else if $value == space-between { - -webkit-box-pack: justify; - -ms-flex-pack: justify; - } @else if $value == space-around { - -ms-flex-pack: distribute; - } @else { - -webkit-box-pack: $value; - -ms-flex-pack: $value; - } - -webkit-justify-content: $value; - -moz-justify-content: $value; - justify-content: $value; -} - // Shorter version: - @mixin flex-just($args...) { @include justify-content($args...); } - -//---------------------------------------------------------------------- - -// Flexbox Align Items -// -// Flex items can be aligned in the cross axis of the current line of the -// flex container, similar to 'justify-content' but in the perpendicular -// direction. 'align-items' sets the default alignment for all of the flex -// container's items, including anonymous flex items. 'align-self' allows -// this default alignment to be overridden for individual flex items. (For -// anonymous flex items, 'align-self' always matches the value of 'align-items' -// on their associated flex container.) -// -// Values: flex-start | flex-end | center | baseline | stretch -// Default: stretch -// -// http://w3.org/tr/css3-flexbox/#align-items-property - -@mixin align-items($value: stretch) { - @if $value == flex-start { - -webkit-box-align: start; - -ms-flex-align: start; - } @else if $value == flex-end { - -webkit-box-align: end; - -ms-flex-align: end; - } @else { - -webkit-box-align: $value; - -ms-flex-align: $value; - } - -webkit-align-items: $value; - -moz-align-items: $value; - align-items: $value; -} - -//---------------------------------- - -// Flexbox Align Self -// -// Values: auto | flex-start | flex-end | center | baseline | stretch -// Default: auto - -@mixin align-self($value: auto) { - // No Webkit Box Fallback. - -webkit-align-self: $value; - -moz-align-self: $value; - @if $value == flex-start { - -ms-flex-item-align: start; - } @else if $value == flex-end { - -ms-flex-item-align: end; - } @else { - -ms-flex-item-align: $value; - } - align-self: $value; -} - -//---------------------------------------------------------------------- - -// Flexbox Align Content -// -// The 'align-content' property aligns a flex container's lines within the -// flex container when there is extra space in the cross-axis, similar to -// how 'justify-content' aligns individual items within the main-axis. Note, -// this property has no effect when the flexbox has only a single line. -// -// Values: flex-start | flex-end | center | space-between | space-around | stretch -// Default: stretch -// -// http://w3.org/tr/css3-flexbox/#align-content-property - -@mixin align-content($value: stretch) { - // No Webkit Box Fallback. - -webkit-align-content: $value; - -moz-align-content: $value; - @if $value == flex-start { - -ms-flex-line-pack: start; - } @else if $value == flex-end { - -ms-flex-line-pack: end; - } @else { - -ms-flex-line-pack: $value; - } - align-content: $value; -} diff --git a/_sass/navigation.scss b/_sass/navigation.scss deleted file mode 100644 index 39a0922..0000000 --- a/_sass/navigation.scss +++ /dev/null @@ -1,85 +0,0 @@ -.nav-open nav { - border-bottom: 1px dotted rgba(255, 255, 255, .2); - padding: 10px 0; - a { - display: block; - } - - @media #{$mid-point} { - border: 0; - padding: 0 20px; - - a { - display: inline; - } - } -} - -nav { - text-transform: uppercase; - font-size: .8em; - width: 100%; - - @media #{$mid-point} { - text-align: right; - top: 13px; - right: 0; - padding: 0 20px; - } - - - a { - margin: 0 3px; - padding: 20px 10px; - border-bottom: 1px solid rgba(255,255,255,0); - color: rgba(255,255,255,.8); - transition: .2s ease-in-out; - display: none; - - @media #{$mid-point} { - display: inline; - padding: 10px; - } - - - &.nav-toggle { - display: inline; - position: absolute; - right: 10px; - top: -22px; - font-size: 1.9em; - border: 0; - - @media #{$mid-point} { - display: none; - } - - &:hover { - border: 0; - } - } - } - - a:hover { - - border-bottom: 1px solid rgba(255,255,255,.3); - color: #fff; - } - - @media #{$mid-point} { - a.highlight { - border: 1px #ccc solid; - border-radius: 5px; - - &:hover { - background: #fff; - color: $brand-color; - } - } - } - - a.active { - color: #fff; - } - -} diff --git a/_sass/variables.scss b/_sass/variables.scss deleted file mode 100644 index 460105e..0000000 --- a/_sass/variables.scss +++ /dev/null @@ -1,11 +0,0 @@ -$brand-color: #1a1423; -$secondary-brand-color: #372549; -$middle-gradient-color: mix($brand-color, $secondary-brand-color, 95%); - -// Breakpoints -$tablet: "(min-width: 450px)"; -$mid-point: "(min-width: 620px)"; -$desktop: "(min-width: 768px)"; - -// Imported Google Fonts -@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;900&display=swap'); \ No newline at end of file diff --git a/favicon.ico b/assets/favicon.ico similarity index 100% rename from favicon.ico rename to assets/favicon.ico diff --git a/assets/gem-status.jpg b/assets/gem-status.jpg new file mode 100644 index 0000000..3c1bf6c Binary files /dev/null and b/assets/gem-status.jpg differ diff --git a/assets/github-release-data.js b/assets/github-release-data.js new file mode 100644 index 0000000..fcae7c2 --- /dev/null +++ b/assets/github-release-data.js @@ -0,0 +1,168 @@ +(function () { + const repos = { + poe1: { + latestApi: "https://api.github.com/repos/PathOfBuildingCommunity/PathOfBuilding/releases/latest", + releases: "https://github.com/PathOfBuildingCommunity/PathOfBuilding/releases", + latest: "https://github.com/PathOfBuildingCommunity/PathOfBuilding/releases/latest", + setupName: /setup\.exe$/i, + portableName: /portable\.zip$/i + }, + poe2: { + latestApi: "https://api.github.com/repos/PathOfBuildingCommunity/PathOfBuilding-PoE2/releases/latest", + releases: "https://github.com/PathOfBuildingCommunity/PathOfBuilding-PoE2/releases", + latest: "https://github.com/PathOfBuildingCommunity/PathOfBuilding-PoE2/releases/latest", + setupName: /setup\.exe$/i, + portableName: /portable\.zip$/i + } + }; + + const dateFormat = new Intl.DateTimeFormat("en", { + month: "short", + day: "numeric", + year: "numeric" + }); + + const cacheKey = "pob-release-data-v3"; + const cacheTtl = 5 * 60 * 1000; + + const cleanVersion = (tag) => String(tag || "").replace(/^v/i, ""); + + const unavailableText = { + "poe1-version": "Unavailable", + "poe2-version": "Unavailable", + "poe1-release-label": "Release unavailable", + "poe2-release-label": "Release unavailable", + "poe1-published": "Unavailable", + "poe2-published": "Unavailable" + }; + + const formatDate = (value) => { + const date = new Date(value); + return Number.isNaN(date.valueOf()) ? "Unavailable" : dateFormat.format(date); + }; + + const assetUrl = (release, pattern) => { + const asset = release?.assets?.find((item) => pattern.test(item.name)); + return asset?.browser_download_url || release?.html_url; + }; + + const fetchJson = async (url) => { + const response = await fetch(url, { + headers: { Accept: "application/vnd.github+json" } + }); + if (!response.ok) throw new Error(`GitHub request failed: ${response.status}`); + return response.json(); + }; + + const loadBranch = async (branch) => { + const config = repos[branch]; + const release = await fetchJson(config.latestApi); + + return { + release, + version: cleanVersion(release.tag_name), + published: formatDate(release.published_at), + setupUrl: assetUrl(release, config.setupName), + portableUrl: assetUrl(release, config.portableName), + releaseUrl: release.html_url || config.latest, + releasesUrl: config.releases + }; + }; + + const readCache = () => { + try { + const cached = JSON.parse(sessionStorage.getItem(cacheKey) || "null"); + if (!cached || Date.now() - cached.savedAt > cacheTtl) return null; + return cached.data; + } catch (error) { + return null; + } + }; + + const writeCache = (data) => { + try { + sessionStorage.setItem(cacheKey, JSON.stringify({ savedAt: Date.now(), data })); + } catch (error) { + /* Ignore storage failures; live data still rendered for this page. */ + } + }; + + const setText = (key, value) => { + document.querySelectorAll(`[data-live="${key}"]`).forEach((node) => { + node.textContent = value; + }); + }; + + const setInput = (key, value) => { + document.querySelectorAll(`[data-live-value="${key}"]`).forEach((node) => { + node.value = value; + }); + }; + + const setHref = (key, value) => { + document.querySelectorAll(`[data-download="${key}"]`).forEach((node) => { + if (value) node.href = value; + }); + }; + + const markUnavailable = () => { + Object.entries(unavailableText).forEach(([key, value]) => setText(key, value)); + setInput("poe1-release-url", repos.poe1.latest); + setInput("poe2-release-url", repos.poe2.latest); + setHref("poe1-setup", repos.poe1.latest); + setHref("poe1-portable", repos.poe1.latest); + setHref("poe1-latest", repos.poe1.latest); + setHref("poe1-releases", repos.poe1.releases); + setHref("poe2-setup", repos.poe2.latest); + setHref("poe2-portable", repos.poe2.latest); + setHref("poe2-latest", repos.poe2.latest); + setHref("poe2-releases", repos.poe2.releases); + }; + + const applyData = ({ poe1, poe2 }) => { + setText("poe1-version", `v${poe1.version}`); + setText("poe2-version", `v${poe2.version}`); + setText("poe1-release-label", `Release v${poe1.version}`); + setText("poe2-release-label", `Release v${poe2.version}`); + setText("poe1-published", poe1.published); + setText("poe2-published", poe2.published); + + setHref("poe1-setup", poe1.setupUrl); + setHref("poe1-portable", poe1.portableUrl); + setHref("poe1-latest", poe1.releaseUrl); + setHref("poe1-releases", poe1.releasesUrl); + setHref("poe2-setup", poe2.setupUrl); + setHref("poe2-portable", poe2.portableUrl); + setHref("poe2-latest", poe2.releaseUrl); + setHref("poe2-releases", poe2.releasesUrl); + + setInput("poe1-release-url", poe1.releaseUrl); + setInput("poe2-release-url", poe2.releaseUrl); + document.documentElement.dataset.liveData = "ready"; + }; + + const hydrate = async () => { + try { + const cached = readCache(); + if (cached) { + applyData(cached); + return; + } + + const [poe1, poe2] = await Promise.all([loadBranch("poe1"), loadBranch("poe2")]); + const data = { poe1, poe2 }; + writeCache(data); + applyData(data); + } catch (error) { + markUnavailable(); + document.documentElement.dataset.liveData = "unavailable"; + console.warn("Path of Building live release data unavailable.", error); + } + }; + + if (document.readyState === "loading") { + document.addEventListener("DOMContentLoaded", hydrate); + } else { + hydrate(); + } +})(); diff --git a/assets/github.svg b/assets/github.svg new file mode 100644 index 0000000..f36f10f --- /dev/null +++ b/assets/github.svg @@ -0,0 +1,3 @@ + diff --git a/assets/item-crafting.jpg b/assets/item-crafting.jpg new file mode 100644 index 0000000..7b98345 Binary files /dev/null and b/assets/item-crafting.jpg differ diff --git a/assets/og-image.jpg b/assets/og-image.jpg new file mode 100644 index 0000000..11aaaf4 Binary files /dev/null and b/assets/og-image.jpg differ diff --git a/assets/pob2-overview.jpg b/assets/pob2-overview.jpg new file mode 100644 index 0000000..02c0ce2 Binary files /dev/null and b/assets/pob2-overview.jpg differ diff --git a/images/poe1_icon.png b/assets/poe1-icon.png similarity index 100% rename from images/poe1_icon.png rename to assets/poe1-icon.png diff --git a/assets/poe2-bg.webp b/assets/poe2-bg.webp new file mode 100644 index 0000000..ee1ed6b Binary files /dev/null and b/assets/poe2-bg.webp differ diff --git a/assets/poe2-footer-bg.webp b/assets/poe2-footer-bg.webp new file mode 100644 index 0000000..e532785 Binary files /dev/null and b/assets/poe2-footer-bg.webp differ diff --git a/images/poe2_icon.png b/assets/poe2-icon.png similarity index 100% rename from images/poe2_icon.png rename to assets/poe2-icon.png diff --git a/assets/power-preview.jpg b/assets/power-preview.jpg new file mode 100644 index 0000000..fa69e4f Binary files /dev/null and b/assets/power-preview.jpg differ diff --git a/assets/redirect.js b/assets/redirect.js deleted file mode 100644 index 82b1750..0000000 --- a/assets/redirect.js +++ /dev/null @@ -1,10 +0,0 @@ -function redirect() { - const params = new URL(location.href).searchParams; - // There should only be one site to redirect, so just grab the first one and load it - const [site, hash] = params.entries().next().value ?? []; - const whitelist = new Set(["pastebin", "pobbin", "poeninja"]); - if (whitelist.has(site)) { - window.location.href = `pob:${site}/${hash}`; - } -} -redirect(); \ No newline at end of file diff --git a/assets/site.css b/assets/site.css new file mode 100644 index 0000000..938e04c --- /dev/null +++ b/assets/site.css @@ -0,0 +1,1242 @@ +:root { + --bg: #0c0c0e; + --surface: #1d1d23; + --surface-inset: #16161b; + --surface-2: #252529; + --fg: #f1f4f6; + --fg-secondary: #edf0da; + --muted: #888888; + --border: #3d3d3d; + --primary: #91bfbe; + --primary-hover: #67b3b0; + --secondary: #af6025; + --focus: #af6025; + --magic: #8888ff; + --crimson: #9c0606; + --green: #2ecc71; + --gem: #1aa29b; + --radius: 3px; + --font-display: + -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", system-ui, + sans-serif; + --font-body: + -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, + sans-serif; + --font-mono: + "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, + Consolas, monospace; + color-scheme: dark; +} + +* { + box-sizing: border-box; +} +html { + scroll-behavior: smooth; + background: var(--bg); +} +body { + margin: 0; + min-width: 320px; + position: relative; + isolation: isolate; + background: var(--bg); + color: var(--fg); + font-family: var(--font-body); + line-height: 1.45; +} + +body.home { + overflow-x: hidden; +} + +body.home .status-row, +body.home .addition-summary, +body.home .contrib-list, +body.downloads .compare { + list-style: none; + margin-block: 0; + padding-inline: 0; +} + +.github-link { + display: inline-flex; + align-items: center; + gap: 8px; +} + +.github-icon { + display: inline-block; + width: 16px; + height: 16px; + flex: 0 0 auto; + background-color: currentColor; + mask: url("github.svg") center / contain no-repeat; + -webkit-mask: url("github.svg") center / contain no-repeat; +} + +/* Home page */ +body.home::before { + content: ""; + position: fixed; + inset: 0; + z-index: 0; + pointer-events: none; + background: url("poe2-footer-bg.webp") center top / 1920px auto repeat-y; + opacity: 0.78; +} +body.home .topbar, +body.home main, +body.home .footer { + position: relative; + z-index: 2; +} +body.home a { + color: inherit; + text-decoration: none; +} +body.home img { + display: block; + max-width: 100%; +} +body.home button, +body.home a { + -webkit-tap-highlight-color: transparent; +} +body.home .shell { + width: min(1180px, calc(100% - 32px)); + margin-inline: auto; +} +body.home .topbar { + position: sticky; + top: 0; + z-index: 20; + border-bottom: 1px solid color-mix(in oklch, var(--border), transparent 18%); + background: rgb(12 12 14 / 0.88); + backdrop-filter: blur(18px); +} +body.home .nav { + min-height: 64px; + display: flex; + align-items: center; + justify-content: space-between; + gap: 24px; +} +body.home .brand { + display: flex; + align-items: center; + gap: 12px; + font-weight: 740; + letter-spacing: 0.01em; +} +body.home .brand-logo { + width: 24px; + height: 24px; + object-fit: contain; +} +body.home .navlinks { + display: flex; + align-items: center; + gap: 4px; + color: var(--muted); + font-size: 13px; +} +body.home .navlinks a { + display: inline-flex; + align-items: center; + gap: 8px; + padding: 10px 12px; + border: 1px solid transparent; + border-radius: var(--radius); +} +body.home .navlinks a:hover { + color: var(--fg); + border-color: color-mix(in oklch, var(--border), transparent 28%); + background: color-mix(in srgb, var(--surface) 66%, transparent); +} +body.home .hero { + position: relative; + min-height: calc(100svh - 64px); + display: flex; + align-items: center; + padding: clamp(44px, 6vw, 84px) 0 clamp(58px, 7vw, 96px); + overflow: hidden; + background: var(--bg); +} +body.home .hero::before { + content: ""; + position: absolute; + inset: 0; + z-index: 0; + pointer-events: none; + background: url("poe2-bg.webp") center top / cover no-repeat; + opacity: 1; +} +body.home .hero-grid { + position: relative; + z-index: 1; + display: grid; + grid-template-columns: 1fr; + gap: clamp(30px, 5vw, 54px); + align-items: start; + justify-items: center; +} +body.home .hero-copy { + width: min(940px, 100%); + display: grid; + justify-items: center; + text-align: center; +} +body.home .kicker, +body.home .eyebrow { + font-family: var(--font-mono); + font-size: 11px; + line-height: 1; + letter-spacing: 0.16em; + text-transform: uppercase; + color: var(--secondary); +} +body.home .hero .kicker, +body.home .hero h1, +body.home .hero .subtitle { + text-shadow: 0 2px 18px rgb(0 0 0 / 0.72); +} +body.home h1, +body.home h2, +body.home h3, +body.home p { + margin: 0; +} +body.home h1 { + margin-top: 16px; + max-width: 18ch; + font-family: var(--font-display); + font-size: clamp(46px, 6vw, 76px); + line-height: 0.9; + letter-spacing: -0.035em; + text-wrap: balance; +} +body.home .subtitle { + margin-top: 18px; + max-width: 590px; + color: color-mix(in oklch, var(--fg), var(--muted) 38%); + font-size: clamp(18px, 2vw, 23px); + line-height: 1.28; + text-wrap: pretty; +} +body.home .cta-row { + display: flex; + flex-wrap: wrap; + gap: 10px; + margin-top: 30px; +} +body.home .hero-downloads { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 12px; + width: min(840px, 100%); + max-width: 840px; + padding: 12px; + border: 1px solid color-mix(in srgb, var(--border) 72%, var(--surface-2)); + background: linear-gradient( + 180deg, + rgb(37 37 41 / 0.86), + rgb(22 22 27 / 0.94) + ); + border-radius: var(--radius); + box-shadow: + 0 30px 90px rgb(0 0 0 / 0.54), + inset 0 1px 0 rgb(241 244 246 / 0.04); +} +body.home .btn { + position: relative; + display: inline-flex; + min-height: 46px; + align-items: center; + justify-content: center; + gap: 10px; + padding: 0 16px; + border: 1px solid color-mix(in oklch, var(--border), transparent 16%); + background: color-mix(in srgb, var(--surface) 84%, transparent); + color: var(--fg); + font-weight: 720; + font-size: 14px; + letter-spacing: 0.005em; + border-radius: var(--radius); + overflow: hidden; +} +body.home .btn img { + width: 22px; + height: 22px; + object-fit: contain; + flex: 0 0 auto; +} +body.home .hero-downloads .btn { + min-height: 124px; + justify-content: flex-start; + padding: 20px; + background: linear-gradient( + 180deg, + rgb(29 29 35 / 0.9), + rgb(22 22 27 / 0.88) + ); +} +body.home .hero-downloads .btn img { + width: clamp(46px, 5vw, 58px); + height: clamp(46px, 5vw, 58px); +} +body.home .hero-downloads .btn.poe2 { + border-color: color-mix(in srgb, var(--primary) 72%, var(--border)); + color: var(--primary); + box-shadow: + inset 0 0 0 1px rgb(145 191 190 / 0.12), + 0 0 24px rgb(145 191 190 / 0.08); +} +body.home .hero-downloads .btn.poe1 { + border-color: color-mix(in srgb, var(--secondary) 76%, var(--border)); + color: color-mix(in srgb, var(--secondary) 86%, var(--fg)); + box-shadow: + inset 0 0 0 1px rgb(175 96 37 / 0.14), + 0 0 24px rgb(175 96 37 / 0.08); +} +body.home .hero-downloads .btn.poe2:hover { + border-color: var(--primary-hover); + background: linear-gradient( + 180deg, + rgb(37 45 46 / 0.78), + rgb(22 27 28 / 0.9) + ); +} +body.home .hero-downloads .btn.poe1:hover { + border-color: color-mix(in srgb, var(--secondary) 92%, var(--fg)); + background: linear-gradient( + 180deg, + rgb(47 34 26 / 0.82), + rgb(27 22 18 / 0.9) + ); +} +body.home .btn-copy { + display: grid; + gap: 5px; + min-width: 0; +} +body.home .btn-copy strong { + font-size: clamp(16px, 1.55vw, 20px); + line-height: 1.08; + color: currentColor; +} +body.home .btn-copy small { + color: color-mix(in srgb, currentColor 74%, var(--muted)); + font-size: 14px; + line-height: 1.15; +} +body.home .btn.primary { + border-color: color-mix(in srgb, var(--primary) 72%, var(--border)); + background: linear-gradient(180deg, var(--surface-2), var(--surface)); + color: var(--primary); + box-shadow: + inset 0 0 0 1px color-mix(in oklch, var(--primary), transparent 68%), + 0 0 30px color-mix(in oklch, var(--primary), transparent 84%); +} +body.home .btn.blue { + border-color: color-mix(in srgb, var(--secondary) 76%, var(--border)); + background: var(--surface-2); + color: color-mix(in srgb, var(--secondary) 86%, var(--fg)); + box-shadow: + inset 0 0 0 1px rgb(175 96 37 / 0.14), + 0 0 24px rgb(175 96 37 / 0.08); +} +body.home .btn:hover { + transform: translateY(-1px); +} +body.home .secondary-links { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 14px; + margin-top: 16px; + color: var(--muted); + font-size: 13px; +} +body.home .secondary-links a { + display: inline-flex; + align-items: center; + gap: 6px; + border-bottom: 1px solid color-mix(in oklch, currentColor, transparent 40%); +} +body.home .github-icon, +body.home .download-icon { + width: 16px; + height: 16px; + flex: 0 0 auto; +} +body.home .download-icon { + fill: none; + stroke: currentColor; +} +body.home .release-micro { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 8px 14px; + margin-top: 15px; + color: var(--muted); + font-family: var(--font-mono); + font-size: 11px; + line-height: 1.5; +} +body.home .release-micro span { + display: inline-flex; + align-items: baseline; + gap: 6px; +} +body.home .release-micro b { + color: var(--primary); + font-weight: 700; + font-variant-numeric: tabular-nums; +} +body.home .workstation { + position: relative; + min-width: 0; + align-self: start; + justify-self: center; + width: min(1080px, 100%); +} +body.home .screen-frame { + position: relative; + overflow: hidden; + border: 1px solid color-mix(in oklch, var(--primary), transparent 48%); + background: var(--surface-inset); + border-radius: var(--radius); + box-shadow: + 0 34px 110px rgb(0 0 0 / 0.6), + 0 0 36px color-mix(in oklch, var(--primary), transparent 90%); +} +body.home .screen-frame img { + width: 100%; + aspect-ratio: 16 / 8.7; + object-fit: cover; + object-position: center top; + filter: saturate(0.95) contrast(1.05); +} +body.home .screenshot-trigger { + display: block; + width: 100%; + padding: 0; + border: 0; + background: transparent; + color: inherit; + cursor: zoom-in; + text-align: inherit; + border-radius: var(--radius); +} +body.home .screenshot-trigger:focus-visible { + outline: 2px solid var(--primary); + outline-offset: 3px; +} +body.home .screen-frame::after { + content: ""; + position: absolute; + inset: 0; + background: linear-gradient( + 90deg, + rgb(0 0 0 / 0.16), + transparent 28%, + transparent 72%, + rgb(0 0 0 / 0.22) + ); + pointer-events: none; +} +body.home .status-row { + display: grid; + grid-template-columns: repeat(4, minmax(0, 1fr)); + gap: 1px; + border: 0; + background: color-mix(in srgb, var(--border) 82%, transparent); + margin-top: 0; + border-radius: 0; + overflow: hidden; +} +body.home .trust-section { + padding: 0; + border-top: 1px solid color-mix(in srgb, var(--border) 86%, transparent); + border-bottom: 1px solid color-mix(in srgb, var(--border) 86%, transparent); + background: rgb(22 22 27 / 0.88); +} +body.home .status-item { + min-height: 86px; + padding: 18px; + background: rgb(22 22 27 / 0.92); +} +body.home .status-item b { + display: block; + font-size: 14px; +} +body.home .status-item span { + display: block; + margin-top: 4px; + color: var(--muted); + font-size: 12px; +} +body.home .status-item span span { + display: inline; + margin-top: 0; +} +body.home section { + padding: clamp(54px, 8vw, 96px) 0; +} +body.home .section-head { + display: grid; + grid-template-columns: minmax(0, 0.8fr) minmax(280px, 0.52fr); + gap: 28px; + align-items: end; + margin-bottom: 26px; +} +body.home h2 { + max-width: 740px; + font-size: clamp(34px, 5vw, 64px); + line-height: 0.96; + letter-spacing: -0.03em; + text-wrap: balance; +} +body.home .section-head p, +body.home .lead { + color: var(--muted); + font-size: 15px; + text-wrap: pretty; +} +body.home .features { + display: grid; + grid-template-columns: repeat(4, minmax(0, 1fr)); + border: 1px solid var(--border); + background: var(--border); + gap: 1px; + border-radius: var(--radius); + overflow: hidden; +} +body.home .feature { + min-height: 310px; + display: grid; + grid-template-rows: auto 1fr auto; + padding: 18px; + background: var(--surface); +} +body.home .feature h3 { + margin-top: 0; + font-size: 20px; + letter-spacing: -0.015em; +} +body.home .feature p { + margin-top: 10px; + color: var(--muted); + font-size: 14px; +} +body.home .feature .screenshot-trigger { + align-self: end; + margin-top: 18px; +} +body.home .feature img, +body.home .feature .screenshot-trigger img { + aspect-ratio: 16 / 9; + object-fit: cover; + border: 1px solid color-mix(in oklch, var(--border), white 8%); + border-radius: var(--radius); + filter: saturate(0.88) contrast(1.06); +} +body.home .maintenance-actions { + display: flex; + flex-wrap: wrap; + gap: 10px; + margin-top: 22px; +} +body.home .maintenance-actions .btn { + min-height: 44px; +} +body.home .contrib-list { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 1px; + border: 1px solid var(--border); + background: var(--border); + border-radius: var(--radius); + overflow: hidden; +} +body.home .contrib-item { + display: grid; + gap: 14px; + min-height: 148px; + padding: clamp(18px, 2.4vw, 26px); + background: var(--surface); + align-content: start; +} +body.home .contrib-item b { + display: block; +} +body.home .contrib-item span { + display: block; + margin-top: 4px; + color: var(--muted); + font-size: 13px; +} +body.home .legacy-copy { + border: 0; + background: transparent; + border-radius: 0; + overflow: visible; +} +body.home .legacy-intro { + display: grid; + grid-template-columns: minmax(0, 0.8fr) minmax(280px, 0.52fr); + gap: 28px; + align-items: end; + margin-bottom: 26px; +} +body.home .legacy-intro p { + color: var(--muted); + max-width: 760px; + font-size: 16px; + line-height: 1.55; +} +body.home .addition-summary { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 1px; + margin-bottom: 14px; + border: 1px solid var(--border); + border-radius: var(--radius); + background: var(--border); + overflow: hidden; +} +body.home .addition-summary li { + padding: 18px 20px; + background: var(--surface-inset); +} +body.home .addition-summary b { + display: block; + color: var(--primary); + font-family: var(--font-mono); + font-size: 12px; + font-variant-numeric: tabular-nums; + letter-spacing: 0.04em; +} +body.home .addition-summary span { + display: block; + margin-top: 5px; + color: var(--muted); + font-size: 13px; +} +body.home .addition-grid { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 1px; + border: 1px solid var(--border); + border-radius: var(--radius); + background: var(--border); + overflow: hidden; +} +body.home .addition-card { + display: grid; + align-content: start; + gap: 18px; + min-height: 292px; + padding: clamp(18px, 2.8vw, 28px); + background: linear-gradient( + 180deg, + rgb(22 22 27 / 0.96), + rgb(29 29 35 / 0.98) + ); + border-radius: 0; +} +body.home .addition-card h3 { + margin: 0; + font-size: clamp(22px, 2.4vw, 30px); + line-height: 1.05; + letter-spacing: -0.02em; +} +body.home .addition-card p { + color: color-mix(in srgb, var(--fg) 72%, var(--muted)); + font-size: 15px; + line-height: 1.48; +} +body.home .addition-card ul { + margin: 0; + padding: 0; + list-style: none; + display: grid; + gap: 12px; +} +body.home .addition-card li { + position: relative; + padding-left: 17px; + color: var(--muted); + font-size: 14px; + line-height: 1.45; +} +body.home .addition-card li::before { + content: ""; + position: absolute; + left: 0; + top: 0.7em; + width: 5px; + height: 5px; + background: var(--secondary); + border-radius: var(--radius); +} +body.home .addition-card strong { + color: var(--fg-secondary); +} +body.home .image-viewer { + position: fixed; + inset: 0; + z-index: 80; + display: none; + place-items: center; + padding: clamp(12px, 3vw, 34px); + background: rgb(0 0 0 / 0.82); +} +body.home .image-viewer.open { + display: grid; +} +body.home .viewer-panel { + width: min(1480px, 100%); + max-height: calc(100vh - 40px); + border: 1px solid var(--border); + background: var(--surface-inset); + border-radius: var(--radius); + box-shadow: 0 24px 90px rgb(0 0 0 / 0.62); + overflow: hidden; +} +body.home .viewer-bar { + min-height: 42px; + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; + padding: 0 12px; + border-bottom: 1px solid var(--border); + color: var(--muted); + font-family: var(--font-mono); + font-size: 11px; + background: var(--surface); +} +body.home .viewer-close { + width: 32px; + height: 32px; + border: 1px solid var(--border); + background: var(--surface-2); + color: var(--fg); + border-radius: var(--radius); + cursor: pointer; + font-size: 18px; + line-height: 1; +} +body.home .viewer-image { + width: 100%; + max-height: calc(100vh - 84px); + object-fit: contain; + background: #050506; +} +body.home .footer { + padding: 36px 0; + border-top: 1px solid var(--border); + color: var(--muted); +} +body.home .footer-inner { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + gap: 18px; + align-items: center; + font-size: 13px; +} +body.home .footer nav { + display: flex; + flex-wrap: wrap; + gap: 14px; +} +body.home .footer a { + color: color-mix(in oklch, var(--fg), var(--muted) 30%); +} +body.home .reveal { + opacity: 1; + transform: none; + transition: + opacity 0.7s ease, + transform 0.7s ease; +} +@media (max-width: 1050px) { + body.home .hero-grid, + body.home .section-head, + body.home .legacy-intro { + grid-template-columns: 1fr; + } + body.home .hero-grid { + gap: 34px; + } + body.home .hero { + min-height: auto; + align-items: start; + } + body.home .workstation { + width: min(960px, 100%); + } + body.home h1 { + max-width: 18ch; + } + body.home .status-row, + body.home .features, + body.home .addition-grid, + body.home .contrib-list { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } +} +@media (max-width: 720px) { + body.home .shell { + width: min(100% - 22px, 1180px); + } + body.home .nav { + min-height: 58px; + } + body.home .navlinks { + display: none; + } + body.home .hero { + padding-top: 22px; + } + body.home .screen-frame img { + aspect-ratio: 4 / 3; + } + body.home .status-row, + body.home .features, + body.home .addition-summary, + body.home .addition-grid, + body.home .contrib-list { + grid-template-columns: 1fr; + } + body.home .feature { + min-height: 310px; + grid-template-rows: auto 1fr auto; + } + body.home .hero-downloads { + grid-template-columns: 1fr; + } + body.home .hero-downloads { + padding: 10px; + gap: 10px; + } + body.home .hero-downloads .btn { + min-height: 78px; + padding: 14px; + } + body.home .cta-row .btn { + width: 100%; + } +} +@media (max-width: 720px) { + body.home .addition-card { + min-height: auto; + } +} + +/* Downloads page */ +body.downloads::before { + content: ""; + position: fixed; + inset: 0; + z-index: 0; + pointer-events: none; + background: url("poe2-footer-bg.webp") center top / 1920px auto repeat-y; + opacity: 0.78; +} +body.downloads .topbar, +body.downloads main { + position: relative; + z-index: 2; +} +body.downloads a { + color: inherit; + text-decoration: none; +} +body.downloads .shell { + width: min(1120px, calc(100% - 32px)); + margin-inline: auto; +} +body.downloads .topbar { + position: sticky; + top: 0; + z-index: 10; + border-bottom: 1px solid var(--border); + background: rgb(12 12 14 / 0.9); + backdrop-filter: blur(18px); +} +body.downloads .nav { + min-height: 64px; + display: flex; + justify-content: space-between; + align-items: center; + gap: 18px; + font-size: 13px; +} +body.downloads .nav a { + color: var(--muted); +} +body.downloads .nav b { + color: var(--fg); + font-size: 15px; +} +body.downloads .brand-link { + display: inline-flex; + align-items: center; + gap: 10px; +} +body.downloads .brand-link img { + width: 24px; + height: 24px; + object-fit: contain; +} +body.downloads .nav-links { + display: flex; + gap: 16px; + flex-wrap: wrap; +} +body.downloads main { + position: relative; + padding: clamp(44px, 7vw, 92px) 0 72px; +} +body.downloads .hero { + display: grid; + grid-template-columns: minmax(0, 0.95fr) minmax(360px, 0.58fr); + gap: clamp(28px, 6vw, 86px); + align-items: end; + margin-bottom: 34px; +} +body.downloads .eyebrow { + font-family: var(--font-mono); + font-size: 11px; + letter-spacing: 0.16em; + text-transform: uppercase; + color: var(--secondary); +} +body.downloads h1, +body.downloads h2, +body.downloads h3, +body.downloads p { + margin: 0; +} +body.downloads h1 { + margin-top: 14px; + max-width: 780px; + font-size: clamp(42px, 6.2vw, 74px); + line-height: 0.92; + letter-spacing: -0.035em; + text-wrap: balance; +} +body.downloads .lead { + margin-top: 16px; + color: var(--muted); + font-size: clamp(15px, 1.55vw, 18px); + line-height: 1.45; + text-wrap: pretty; +} +body.downloads .hero-side { + display: grid; + gap: 16px; + align-self: end; + padding-bottom: 8px; +} +body.downloads .release-status { + border: 1px solid color-mix(in srgb, var(--primary) 46%, var(--border)); + background: linear-gradient( + 180deg, + rgb(29 29 35 / 0.86), + rgb(22 22 27 / 0.94) + ); + padding: 18px; + border-radius: var(--radius); + box-shadow: + 0 24px 70px rgb(0 0 0 / 0.34), + inset 0 1px 0 rgb(241 244 246 / 0.04); +} +body.downloads .release-status dl { + display: grid; + grid-template-columns: 1fr auto; + gap: 12px 18px; + margin: 0; + font-family: var(--font-mono); + font-size: 12px; +} +body.downloads .release-status a { + color: var(--primary); + text-decoration: underline; + text-underline-offset: 3px; +} +body.downloads dt { + color: var(--muted); +} +body.downloads dd { + margin: 0; + color: var(--fg); +} +body.downloads .tabs { + display: flex; + gap: 8px; + margin: 0 0 16px; + border-bottom: 1px solid var(--border); + overflow-x: auto; +} +body.downloads .tab { + min-height: 44px; + padding: 0 16px; + border: 1px solid var(--border); + border-bottom: 0; + background: var(--surface); + color: var(--muted); + font: 720 13px var(--font-body); + cursor: pointer; + white-space: nowrap; + border-radius: var(--radius) var(--radius) 0 0; +} +body.downloads .tab[aria-selected="true"] { + color: var(--fg); + border-color: color-mix(in oklch, var(--primary), transparent 35%); + background: linear-gradient(180deg, var(--surface-2), var(--surface)); +} +body.downloads .tab img { + width: 24px; + height: 24px; + object-fit: contain; + margin-right: 8px; + vertical-align: middle; +} +body.downloads .release-grid { + display: none; + grid-template-columns: minmax(0, 0.72fr) minmax(320px, 0.44fr); + gap: 18px; + align-items: stretch; +} +body.downloads .release-grid.active { + display: grid; +} +body.downloads .panel { + border: 1px solid var(--border); + background: linear-gradient( + 180deg, + rgb(29 29 35 / 0.92), + rgb(22 22 27 / 0.96) + ); + border-radius: var(--radius); + overflow: hidden; +} +body.downloads .panel-head { + display: flex; + justify-content: space-between; + gap: 16px; + padding: 18px; + border-bottom: 1px solid var(--border); +} +body.downloads .panel-head h2 { + font-size: clamp(28px, 4vw, 44px); + line-height: 1; + letter-spacing: -0.025em; +} +body.downloads .title-with-logo { + display: flex; + align-items: center; + gap: 14px; +} +body.downloads .title-with-logo img { + width: 56px; + height: 56px; + object-fit: contain; + flex: 0 0 auto; +} +body.downloads .badge { + align-self: start; + padding: 7px 9px; + border: 1px solid color-mix(in oklch, var(--green), transparent 38%); + color: var(--green); + font-family: var(--font-mono); + font-size: 11px; + white-space: nowrap; + border-radius: var(--radius); +} +body.downloads .download-list { + display: grid; + gap: 1px; + background: var(--border); +} +body.downloads .download-option { + display: grid; + grid-template-columns: 1fr auto; + gap: 18px; + padding: 18px; + background: var(--surface); + align-items: center; +} +body.downloads .download-option h3 { + font-size: 18px; +} +body.downloads .download-option p { + margin-top: 4px; + color: var(--muted); + font-size: 13px; +} +body.downloads .btn { + display: inline-flex; + min-height: 42px; + align-items: center; + justify-content: center; + gap: 9px; + padding: 0 14px; + border: 1px solid color-mix(in srgb, var(--primary) 72%, var(--border)); + background: linear-gradient(180deg, var(--surface-2), var(--surface)); + color: var(--primary); + font-weight: 760; + font-size: 13px; + white-space: nowrap; + border-radius: var(--radius); + box-shadow: + inset 0 0 0 1px rgb(145 191 190 / 0.12), + 0 0 20px rgb(145 191 190 / 0.07); +} +body.downloads .btn:hover { + border-color: var(--primary-hover); + background: linear-gradient( + 180deg, + rgb(37 45 46 / 0.78), + rgb(22 27 28 / 0.9) + ); +} +body.downloads .btn img { + width: 20px; + height: 20px; + object-fit: contain; + flex: 0 0 auto; +} +body.downloads .btn.secondary { + background: linear-gradient(180deg, var(--surface-2), var(--surface)); + color: color-mix(in srgb, var(--secondary) 86%, var(--fg)); + border-color: color-mix(in srgb, var(--secondary) 76%, var(--border)); + box-shadow: + inset 0 0 0 1px rgb(175 96 37 / 0.14), + 0 0 20px rgb(175 96 37 / 0.07); +} +body.downloads .btn.secondary:hover { + border-color: color-mix(in srgb, var(--secondary) 92%, var(--fg)); + background: linear-gradient( + 180deg, + rgb(47 34 26 / 0.82), + rgb(27 22 18 / 0.9) + ); +} +body.downloads .side { + display: grid; + gap: 16px; +} +body.downloads .side .release-status { + border-color: var(--border); + box-shadow: none; +} +body.downloads .notes { + padding: 18px; + border: 1px solid var(--border); + background: rgb(22 22 27 / 0.9); + border-radius: var(--radius); +} +body.downloads .notes h3 { + font-size: 18px; +} +body.downloads .copy-row { + display: grid; + grid-template-columns: 1fr auto; + gap: 8px; + margin-top: 16px; +} +body.downloads input { + min-width: 0; + height: 42px; + border: 1px solid var(--border); + background: var(--surface-inset); + color: var(--muted); + padding: 0 10px; + font-family: var(--font-mono); + font-size: 12px; + border-radius: var(--radius); +} +body.downloads .compare { + margin-top: 22px; + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 1px; + background: var(--border); + border: 1px solid var(--border); + border-radius: var(--radius); + overflow: hidden; +} +body.downloads .compare li { + padding: 16px; + background: rgb(22 22 27 / 0.9); +} +body.downloads .compare b { + display: block; + font-family: var(--font-mono); + font-size: 16px; + color: var(--primary); +} +body.downloads .compare span { + display: block; + margin-top: 5px; + color: var(--muted); + font-size: 12px; +} +body.downloads footer { + border-top: 1px solid var(--border); + color: var(--muted); + padding: 28px 0; + font-size: 13px; +} +body.downloads .footer-inner { + display: flex; + justify-content: space-between; + gap: 16px; + flex-wrap: wrap; +} +body.downloads .footer-inner nav { + display: flex; + flex-wrap: wrap; + gap: 14px; +} +@media (max-width: 900px) { + body.downloads .hero, + body.downloads .release-grid { + grid-template-columns: 1fr; + } + body.downloads .hero-side { + padding-bottom: 0; + } + body.downloads .release-status { + max-width: none; + } +} +@media (max-width: 620px) { + body.downloads .shell { + width: min(100% - 22px, 1120px); + } + body.downloads .nav { + align-items: flex-start; + flex-direction: column; + justify-content: center; + padding: 12px 0; + } + body.downloads .download-option, + body.downloads .copy-row, + body.downloads .compare { + grid-template-columns: 1fr; + } + body.downloads .download-option .btn { + width: 100%; + } + body.downloads .panel-head { + display: grid; + } +} diff --git a/css/screen.scss b/css/screen.scss deleted file mode 100644 index 87cb6c2..0000000 --- a/css/screen.scss +++ /dev/null @@ -1,12 +0,0 @@ ---- ---- -@import "mixins/flexbox"; -@import "mixins/columns"; -@import "variables"; -@import "elements"; -@import "landing-page"; -@import "layout"; -@import "forms"; -@import "navigation"; -@import "footer"; -@import "cloudcannon"; diff --git a/docker-compose.yml b/docker-compose.yml deleted file mode 100644 index 9d13eb6..0000000 --- a/docker-compose.yml +++ /dev/null @@ -1,10 +0,0 @@ -services: - jekyll: - image: jekyll/jekyll:4 - ports: - - "4000:4000" - - "35729:35729" - volumes: - - .:/srv/jekyll - - ./_site:/srv/jekyll/_site - command: jekyll serve --host 0.0.0.0 --port 4000 --livereload --force_polling diff --git a/downloads.html b/downloads.html new file mode 100644 index 0000000..926aa4a --- /dev/null +++ b/downloads.html @@ -0,0 +1,177 @@ + + + + + + Download Path of Building | PoE 1 and PoE 2 Releases + + + + + + + + + + + + + + + + + + + +
+
+ Path of Building + +
+
+ +
+
+
+
+
Download center
+

Choose the Path of Building release for your game.

+
+
+

Path of Building has separate releases for Path of Exile 1 and 2. Each release stream includes an installer, portable archive, changelogs, and public issue flow.

+
+
+ +
+ + +
+ +
+
+
Checking GitHub
+
+

Windows setup installer

Installer release for the Path of Exile 1 community fork.

Download setup
+

Portable archive

Portable release for manual installs or separate folders.

Download portable
+

All PoE1 releases

Review changelogs, older versions, and release assets for the PoE1 branch.

View releases
+
+
+
+ +
+

Release URL

+
+ + +
+
+
+
+ + + +
    +
  • Open sourcePublic code, public changelogs, public issues.
    • +
  • Setup + portableBoth branches expose installer and archive assets.
    • +
  • Auto updatesUpdates are delivered through each branch's release stream.
    • +
+
+
+ + + + + + + diff --git a/images/gem_status.png b/images/gem_status.png deleted file mode 100644 index c475522..0000000 Binary files a/images/gem_status.png and /dev/null differ diff --git a/images/item_crafting.png b/images/item_crafting.png deleted file mode 100644 index 3872be7..0000000 Binary files a/images/item_crafting.png and /dev/null differ diff --git a/images/pob2_overview.png b/images/pob2_overview.png deleted file mode 100644 index 42d61a6..0000000 Binary files a/images/pob2_overview.png and /dev/null differ diff --git a/images/pob_overview.png b/images/pob_overview.png deleted file mode 100644 index e7ba101..0000000 Binary files a/images/pob_overview.png and /dev/null differ diff --git a/images/power_preview.png b/images/power_preview.png deleted file mode 100644 index d043ab7..0000000 Binary files a/images/power_preview.png and /dev/null differ diff --git a/imprint.md b/imprint.md deleted file mode 100644 index 2484551..0000000 --- a/imprint.md +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: Impressum -layout: page -sitemap: false ---- -### Informationspflicht laut § 5 E-Commerce-Gesetz und Offenlegungspflicht laut § 25 Mediengesetz - -Peter Pölzl -Kupkagasse 6, -1080 Wien, -Österreich - -E-Mail: pob@mailbox.org - -### Blattlinie - -Informationen über die PathOfBuildingCommunity Organisation und deren Software, Förderung des Bekanntheitsgrades deren Software und Vergleich gegenüber Alternativen zu deren Software. - -### Haftung für Inhalte dieser Webseite - -Die Inhalte dieser Webseite werden ständig weiterentwickelt und wir bemühen uns, korrekte und aktuelle Informationen bereitzustellen. -Wir können keine Haftung für die Korrektheit aller Inhalte auf dieser Webseite übernehmen, insbesonder für jene Inhalte, die uns seitens Dritter bereitgestellt wurden. - -Sollten Ihnen problematische oder rechtswidrige Inhalte auffallen, so bitten wir Sie, uns umgehend zu kontaktieren. Sie finden die Kontaktdaten im Impressum. - -### Haftung für Links auf dieser Webseite - -Unsere Webseite enthält Links zu anderen Webseiten, für deren Inhalte wir keine Verantwortung übernehmen können. -Laut §17 E-Commerce-Gesetz besteht für uns keine Haftung für verlinkte Webseiten, da wir keine Kenntnis rechtswidriger Tätigkeiten hatten und haben, uns solche Rechtswidrigkeiten auch bisher nicht aufgefallen sind und wir Links sofort entfernen werden, wenn uns Rechtswidrigkeiten bekannt werden würden. - -Sollten Ihnen problematische oder rechtswidrige Inhalte auffallen, so bitten wir Sie, uns umgehend zu kontaktieren. Sie finden die Kontaktdaten im Impressum. - -### Urheberrechtshinweis - -Alle Inhalte dieser Webseite (Bilder, Fotos, Texte, Videos) unterliegen dem Urheberrecht. Wir behalten uns vor, die unerlaubte Nutzung von Teilen der Inhalte unserer Webseite rechtlich zu verfolgen. - -### Bildernachweis - -Die Bilder, Fotos und Grafiken auf dieser Webseite sind urheberrechtlich geschützt. Wir behalten uns vor, die unerlaubte Nutzung von Teilen der Inhalte unserer Webseite rechtlich zu verfolgen. \ No newline at end of file diff --git a/index.html b/index.html index 1604df2..0b8b543 100644 --- a/index.html +++ b/index.html @@ -1,124 +1,278 @@ ---- -title: Path of Building Community Fork -description: A powerful build planner for Path of Exile ---- -
-
-

Path of Building

-

A powerful build planner for Path of Exile

-
-
-
- Screenshot -
-
- - -
- Download - for - Path of Exile 2! -
- -
- - See all releases - -
-
-
- Screenshot -
-
- - -
- Download - for - Path of Exile! -
- -
- - See all releases - -
-
-
-
+ + + + + + Path of Building Community | Build Planner for Path of Exile + + + + + + + + + + + + + + + + + + + +
+
+ Path of Building + +
+
-
-
- This project is open source and needs your skills! - Take a look here to see how you can help out. -
- Don't worry, you don't have to be a programmer to contribute to issues or documentation. -
-
+
+
+
+
+
Community fork · Open source planner
+

Path of Building

+

The community build planner for Path of Exile 1 and 2.

+
+ + + Download Path of Buildingfor Path of Exile 1 + + + + Download Path of Buildingfor Path of Exile 2 + +
+
+ All releases + Path of Building PoE1 GitHub + Path of Building PoE2 GitHub +
+
+ Checking GitHubPoE1 + Checking GitHubPoE2 + 5k+GitHub stars +
+
+
+
+ +
+
+
+
-
-
-
-
-

Plan out your skill tree

-

See which paths are more efficient, let Path of Building advise you on which nodes are the most beneficial to your current build, observe how taking a notable passive point would change your stats.

-
-
- Screenshot -
-
-
+
+
    +
  • Open sourceMIT-licensed community fork with public code and releases.
    • +
  • Community maintainedBuilt by players who understand league mechanics.
    • +
  • GitHub projectIssues, pull requests, and changelogs stay public.
    • +
  • Automatic updatesAll update checks run from inside the planner, with release assets published through GitHub.
    • +
+
-
-
-
-

Which gems would benefit your build the most?

-

Prepare your skill gem links, watch the benefits of socketing them in different items, have suggestions for the most powerful gems to add to your setup.

-
-
- Screenshot -
-
-
+
+
+
+
+
Planning surface
+

Plan the tree, gems, items, and calculations in one workspace.

+
+

Use the tree, skills, items, and defenses together while checking build changes.

+
+
+
+

Plan out your skill tree

Compare pathing options, review node impact, and check how passive changes affect your stats.

+ +
+
+

Detailed build calculations

View damage, life, energy shield, resistances, armour, recovery, and effective health in the same planning surface as the tree and equipment you are testing.

+ +
+
+

Compare skill and support gem setups

Set up skill links, compare socketed supports, and review gem changes against your character stats.

+ +
+
+

Create, edit, and compare items

Path of Building understands most item modifiers and supports anointments, crafting, corruptions, gear sets, and item comparisons.

+ +
+
+
+
-
-
-
-

Build your dream items, and your current self found gear

-

Path of Building is able to understand most mods that can be found on items and lets you perform anointments, crafting, corruptions, and more. Set up gear sets and compare the effects of your changes.

-
-
- Screenshot -
-
-
+
+
+
+
+
Community additions
+

What has the community added so far?

+
+

Path of Building Community is a fork of the original Path of Building by Openarl. It is actively maintained by Path of Exile community members, with new mechanics supported regularly and original project work integrated as well.

+
+
    +
  • MechanicsLeague systems, ailments, warcries, brands, spectres, and keystone mechanics.
    • +
  • OptimizationPower Report, Timeless Jewel seeds, Trade API searches, and item comparison workflows.
    • +
  • SharingImport, export, build links, character API support, and community-tool integration.
    • +
+
+
+

Defenses and combat mechanics

+

Community updates add support for league mechanics, defensive systems, ailments, and combat interactions.

+
    +
  • Pantheon gods for planning defensive power choices.
    • +
  • Impale, Exposure, Elusive, Warcries, Exerted Attacks, Bonechill, and more.
    • +
  • Alternative Ailments: Scorch, Brittle, and Sap.
    • +
  • eHP estimation gives you a quick overview of your build's real survivability.
    • +
+
+
+

Passive tree intelligence

+

Passive tree tools help compare notables, cluster jewels, opportunity cost, node power, and jewel seeds in context.

+
    +
  • Power Report ranks passive skills and cluster jewels to prioritise upgrades.
    • +
  • Oil combinations on notables, node power highlights, and opportunity-cost analysis.
    • +
  • Keystone mechanics including The Agnostic, Crimson Dance, Eternal Youth, Glancing Blows, and Imbalanced Guard.
    • +
  • Timeless Jewel tools find the right seed, visualize tree modifications in your build, and generate trade searches.
    • +
+
+
+

Items, uniques, and crafting

+

Gear planning includes item modifiers, unique mechanics, crafting options, and comparison workflows.

+
    +
  • All uniques available, steadily updated, with most mods supported.
    • +
  • Trade API integration helps search the real game market for item upgrades that fit your build.
    • +
  • Perquil's Toe, Thread of Hope, Split Personality, and more unique mechanics.
    • +
  • Apply Catalysts, craft influenced items, and filter mods by Prefix or Suffix.
    • +
+
+
+

Skills, gems, and minions

+

Skill and support planning stays close to the rest of the build, so gem changes can be judged against real character stats.

+
    +
  • Alternate Quality skill gems, with most effects already supported.
    • +
  • Warcries and Brands, Awakened Spell Echo, Vaal Arc, Carrion Golem, and more.
    • +
  • Added many spectres, including Redemption Sentry, Baranite Thaumaturge, and Baranite Sister.
    • +
+
+
+

Calculation model and workflow polish

+

Workflow updates improve search, breakdowns, parsing, sorting, and calculation modes.

+
    +
  • Configurable Shock, with guaranteed sources of Shock applying automatically.
    • +
  • Minimum and average calculation modes for Ailments, Regeneration, Armour, and effective health.
    • +
  • Searchable drop-downs, more jewels in comparison view, extra sorting, broad mod parsing, and bug fixes.
    • +
+
+
+

Import, export, and community sharing

+

Import, export, and sharing tools help move builds between the game, Path of Building, and community resources.

+
    +
  • Import builds through shared links or the character API.
    • +
  • Export and share builds with the community for guides, reviews, and upgrade planning.
    • +
  • Integrate with other community tools so planner data can move through the wider Path of Exile ecosystem.
    • +
+
+
+
+
-
-

What has the community added so far?

-
-
    -
  • Pantheon gods: Plan out your defenses better by picking your Pantheon powers.
    • -
  • Mechanics: Impale, Exposure, Elusive, Warcries and Exerted Attacks, Bonechill, and more.
    • -
  • All uniques available: Steadily updated, and with most of their mods supported.
    • -
  • Unique mechanics: Timeless Jewels, Perquil's Toe, Thread of Hope, Split Personality, and more.
    • -
  • Alternate Quality skill gems: Most effects are already supported.
    • -
  • Skill mechanics: Warcries and Brands, Awakened Spell Echo, Vaal Arc, Carrion Golem, and more.
    • -
  • Skill Tree: Added oil combinations to notables on the passive skill tree, highlight nodes by per-point power and opportunity cost.
    • -
  • Keystones: The Agnostic, Crimson Dance, Eternal Youth, Glancing Blows, Imbalanced Guard, and more.
    • -
  • Alternative Ailments: Scorch, Brittle and Sap.
    • -
  • Added many spectres: Redemption Sentry, Baranite Thaumaturge, Baranite Sister, and more.
    • -
-
    -
  • UI for anointing items: Search notables, sort them by node power, and preview their effects. -
  • Power Report: Rank all passive skills on the tree and cluster jewels to prioritise upgrades.
    • -
  • Apply Catalysts to rare and unique items, craft (double) influenced items, filter mods by Prefix or Suffix.
    • -
  • Configurable Shock value, with guaranteed sources of Shock applying automatically.
    • -
  • Minimum and average calculation modes for Ailments, Regeneration, Armour, and effective health.
    • -
  • More detailed breakdowns: View your effective health pool against all types of damage, Aura and Curse Effect, effective Recovery, and more.
    • -
  • Plenty of quality of life: Search in drop-down lists, fit more jewels into the comparison view, use additional sorting options for skill gems, unique items, and node power.
    • -
  • Parsing for various mods on the passive tree, cluster jewels, skill gems, ascendancies, and uniques.
    • -
  • Lots of small improvements and bug fixes.
    • -
-
-
-
+
+
+
+
+
Community maintenance
+

Help keep mechanics and data current.

+
+
+

The project is open source and accepts bug reports, documentation updates, and code contributions. Reproduction builds, clear issue reports, documentation edits, and tested pull requests help maintain support for both game branches.

+
+ Report an issue + Contribution guide +
+
+
+
    +
  • Bug reportsAttach builds, steps, and expected calculations so maintainers can reproduce the issue.
    • +
  • Documentation helpUpdate install notes, mechanics explanations, and release guidance.
    • +
  • Code contributionsAdd mechanics, fix calculations, update game data, and maintain both branches.
    • +
+
+
+
+ + + + + + + diff --git a/privacy.md b/privacy.md deleted file mode 100644 index bc875d0..0000000 --- a/privacy.md +++ /dev/null @@ -1,62 +0,0 @@ ---- -title: Datenschutzerklärung -layout: page -sitemap: false ---- -### Datenschutz - -Wir haben diese Datenschutzerklärung (Fassung 30.06.2018-211066307) verfasst, um Ihnen gemäß der Vorgaben der Datenschutz-Grundverordnung (EU) 2016/679 und des Datenschutzgesetzes (DSG) zu erklären, welche Informationen wir sammeln, wie wir Daten verwenden und welche Entscheidungsmöglichkeiten Sie als Besucher dieser Webseite haben. - -Wir haben uns bei der Erstellung bemüht, die wichtigsten Dinge so einfach und klar wie möglich zu beschreiben. - -### Automatische Datenspeicherung - -Wenn Sie Webseiten besuchen, werden gewisse Informationen automatisch erstellt und gespeichert. - -Wenn Sie diese Webseite besuchen, speichert ein Webserver (Computer, von dem aus diese Webseite ausgeliefert wird) automatisch Daten wie -* die Adresse (URL) der aufgerufenen Webseite -* Browser und Browserversion -* das verwendete Betriebssystem -* die Adresse (URL) der zuvor besuchten Seite (Referrer URL) -* den Hostname und die IP-Adresse des Geräts, von welchem aus zugegriffen wird -* Datum und Uhrzeit - -in Dateien (Webserver-Logfiles). - -Die Rechtsgrundlage besteht nach Artikel 6 Absatz 1 f DSGVO (Rechtmäßigkeit der Verarbeitung) darin, dass berechtigtes Interesse daran besteht, den fehlerfreien Betrieb dieser Webseite durch das Erfassen von Webserver-Logfiles zu ermöglichen. - -### Datenerhebung - -Diese Webseite ist darauf optimiert, keine Daten zu erheben. Es werden keine Cookies erzeugt. Sollten Sie uns per E-Mail kontaktieren, wird die E-Mail auf einem Mail-Server gespeichert. - -### Daten-Erhebung durch Dritte (GitHub Pages) - -Da wir diese Webseite bei GitHub Pages betreiben, werden diese Daten von GitHub Inc. verwaltet. Welche Daten von GitHub erfasst werden und wofür diese Daten verwendet werden, können Sie im [GitHub Privacy Statement](https://help.github.com/articles/github-privacy-statement/) nachlesen. - -Github Inc. -88 Colin P Kelly Jr St -San Francisco -CA 94107 -USA - -Bitte beachten Sie zudem die [GitHub Privacy Policy](https://help.github.com/articles/github-privacy-policy/) und [GitHub Global Privacy Practices](https://help.github.com/articles/global-privacy-practices/). - -### Ihre Rechte laut Datenschutzgrundverordnung - -Ihnen stehen laut den Bestimmungen der DSGVO und des österreichischen Datenschutzgesetzes (DSG) grundsätzlich die folgende Rechte zu: - -* Recht auf Berichtung (Artikel 16 DSGVO) -* Recht auf Löschung („Recht auf Vergessenwerden“) (Artikel 17 DSGVO) -* Recht auf Einschränkung der Verarbeitung (Artikel 18 DSGVO) -* Recht auf Benachrichtigung – Mitteilungspflicht im Zusammenhang mit der Berichtigung oder Löschung personenbezogener Daten oder der Einschränkung der Verarbeitung (Artikel 19 DSGVO) -* Recht auf Datenübertragbarkeit (Artikel 20 DSGVO) -* Widerspruchsrecht (Artikel 21 DSGVO) -* Recht, nicht einer ausschließlich auf einer automatisierten Verarbeitung — einschließlich Profiling — beruhenden Entscheidung unterworfen zu werden (Artikel 22 DSGVO) - -Wenn Sie glauben, dass die Verarbeitung Ihrer Daten gegen das Datenschutzrecht verstößt oder Ihre datenschutzrechtlichen Ansprüche in sonstiger Weise verletzt worden sind, können Sie sich bei der Datenschutzbehörde beschweren, deren Webseite Sie unter [https://www.dsb.gv.at](https://www.dsb.gv.at/) finden. - -### TLS-Verschlüsselung per HTTPS - -Wir verwenden TLS, um Daten abhörsicher im Internet zu übertragen (Datenschutz durch Technikgestaltung Artikel 25 Absatz 1 DSGVO). Durch den Einsatz von TLS (Transport Layer Security), einem Verschlüsselungsprotokoll zur sicheren Datenübertragung im Internet können wir den Schutz vertraulicher Daten sicherstellen. Sie erkennen die Benutzung dieser Absicherung der Datenübertragung an der Verwendung des Schemas `https://` (anstelle von `http://`) als Teil unserer Internetadresse. - -Quelle: Erstellt mit dem [Datenschutz-Generator](https://www.adsimple.at/datenschutz-generator/) von AdSimple \ No newline at end of file diff --git a/robots.txt b/robots.txt index aa0e4cd..98416c3 100644 --- a/robots.txt +++ b/robots.txt @@ -1,8 +1,4 @@ ---- -layout: null -sitemap: false ---- User-agent: * -Sitemap: {{ site.url }}/sitemap.xml -Disallow: {{ site.url }}/imprint/ -Disallow: {{ site.url }}/privacy/ \ No newline at end of file +Allow: / + +Sitemap: https://pathofbuilding.community/sitemap.xml diff --git a/sitemap.xml b/sitemap.xml new file mode 100644 index 0000000..e7b8563 --- /dev/null +++ b/sitemap.xml @@ -0,0 +1,15 @@ + + + + https://pathofbuilding.community/ + 2026-05-23 + weekly + 1.0 + + + https://pathofbuilding.community/downloads.html + 2026-05-23 + weekly + 0.8 + +