fixed favicon, updated image gallery

This commit is contained in:
partisan 2024-09-03 20:12:33 +02:00
parent c81dd751e9
commit a77f93842a
18 changed files with 5485 additions and 5453 deletions

103
README.md
View file

@ -1,49 +1,54 @@
<p align="center">
<img src="https://weforgecode.xyz/Spitfire/Branding/raw/branch/main/icon5.svg" alt="Logo" width="64" height="64">
</p>
<p align="center" style="font-size: 32px;">
<strong>Spitfire Browser Website</strong>
</p>
Unlike some other browser sites flexing with their 98.8% TypeScript (yikes), i keep it cool with minimal JavaScript just enough to get the job done, no extra BS.
Spitfire Browser's website is built without Next.js, TypeScript, and Tailwind CSS or any other bullshit.
## TO-DO:
- [ ] Add browser download/screenshots for this web browser website (optional)
### Blog entries should be fromated this way:
```md
[HEADER]
t: TITLE
d: SHORT-DESC
p: 2024-08-16 15:04
a: AUTHOR
[END]
# lorem ipsum
Vestibulum fermentum tortor id mi. Nullam at arcu a est sollicitudin euismod. Nullam faucibus mi quis velit. Mauris dictum facilisis augue. Nullam sapien sem, ornare ac, nonummy non, lobortis a enim. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Etiam commodo dui eget wisi. Mauris dictum facilisis augue. Etiam posuere lacus quis dolor. In sem justo, commodo ut, suscipit at, pharetra vitae, orci.
Vivamus luctus egestas leo. Phasellus faucibus molestie nisl. Etiam commodo dui eget wisi. Donec vitae arcu. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam neque. Suspendisse sagittis ultrices augue. Suspendisse nisl. Etiam sapien elit, consequat eget, tristique non, venenatis quis, ante. Phasellus rhoncus. Maecenas libero.
```
*default path:*
```
/data/news/1.md
/data/news/2.md
...
```
### Based on:
Stellar by HTML5 UP
html5up.net | @ajlkn
### Licence:
This project is licensed under the Creative Commons Attribution 3.0 License (CCA 3.0). For more details, see the LICENSE file.
<p align="center">
<img src="https://weforgecode.xyz/Spitfire/Branding/raw/branch/main/icon5.svg" alt="Logo" width="64" height="64">
</p>
<p align="center" style="font-size: 32px;">
<strong>Spitfire Browser Website</strong>
</p>
<p align="center">
Unlike some other browser sites flexing with their 98.8% TypeScript (yikes), i keep it cool with minimal JavaScript just enough to get the job done.
</p>
<p align="center">
Spitfire Browser's website is built without Next.js, TypeScript, and Tailwind CSS or any other BS.
</p>
## TO-DO:
- [ ] Add browser download/screenshots for this web browser website (optional)
### Blog entries should be fromated this way:
```md
[HEADER]
t: TITLE
d: SHORT-DESC
p: 2024-08-16 15:04
a: AUTHOR
[END]
# lorem ipsum
Vestibulum fermentum tortor id mi. Nullam at arcu a est sollicitudin euismod. Nullam faucibus mi quis velit. Mauris dictum facilisis augue. Nullam sapien sem, ornare ac, nonummy non, lobortis a enim. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Etiam commodo dui eget wisi. Mauris dictum facilisis augue. Etiam posuere lacus quis dolor. In sem justo, commodo ut, suscipit at, pharetra vitae, orci.
Vivamus luctus egestas leo. Phasellus faucibus molestie nisl. Etiam commodo dui eget wisi. Donec vitae arcu. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam neque. Suspendisse sagittis ultrices augue. Suspendisse nisl. Etiam sapien elit, consequat eget, tristique non, venenatis quis, ante. Phasellus rhoncus. Maecenas libero.
```
*default path:*
```
/data/news/1.md
/data/news/2.md
...
```
### Based on HTML template:
[Stellar](https://html5up.net/stellar) by HTML5 UP
html5up.net | @ajlkn
### Licence:
This project is licensed under the Creative Commons Attribution 3.0 License (CCA 3.0). For more details, see the LICENSE file.

26
go.mod
View file

@ -1,13 +1,13 @@
module my-web
go 1.18
require (
github.com/fsnotify/fsnotify v1.7.0 // indirect
github.com/go-telegram-bot-api/telegram-bot-api v4.6.4+incompatible // indirect
github.com/go-telegram-bot-api/telegram-bot-api/v5 v5.5.1 // indirect
github.com/gorilla/feeds v1.2.0 // indirect
github.com/russross/blackfriday/v2 v2.1.0 // indirect
github.com/technoweenie/multipartstreamer v1.0.1 // indirect
golang.org/x/sys v0.4.0 // indirect
)
module spitfire-browser-website
go 1.18
require (
github.com/fsnotify/fsnotify v1.7.0 // indirect
github.com/go-telegram-bot-api/telegram-bot-api v4.6.4+incompatible // indirect
github.com/go-telegram-bot-api/telegram-bot-api/v5 v5.5.1 // indirect
github.com/gorilla/feeds v1.2.0 // indirect
github.com/russross/blackfriday/v2 v2.1.0 // indirect
github.com/technoweenie/multipartstreamer v1.0.1 // indirect
golang.org/x/sys v0.4.0 // indirect
)

1217
main.go

File diff suppressed because it is too large Load diff

21
run.bat Normal file
View file

@ -0,0 +1,21 @@
@echo off
REM Default values
set PORT=8080
REM Parse command-line arguments
:parse_args
if "%~1"=="" goto run_app
if "%~1"=="-p" (
set PORT=%~2
shift
shift
goto parse_args
) else (
echo Unknown parameter passed: %~1
exit /b 1
)
:run_app
REM Run the Go application with the parsed flags
go run discord.go rss.go telegram.go save.go main.go -p=%PORT%

View file

@ -1,50 +1,50 @@
/* Global settings for images and videos */
img, video {
display: block;
width: 100%;
border-radius: 10px; /* Add rounded corners */
margin-top: 20px; /* Add space above the image */
margin-bottom: 20px; /* Add space below the image */
}
/* Exclude images inside the .icons class from global settings */
ul.icons img {
display: inline; /* Override display: block */
width: auto; /* Override width: 100% */
border-radius: 0; /* Remove rounded corners */
margin-top: 0; /* Remove top margin */
margin-bottom: 0; /* Remove bottom margin */
}
/* Align blog text and links */
.align-blog p, a, em {
text-align: left;
font-size: 1em;
line-height: 1.6;
}
/* Increase margin top for all headings */
.align-blog h1,
.align-blog h2,
.align-blog h3,
.align-blog h4,
.align-blog h5,
.align-blog h6 {
margin-top: 30px; /* Adjust this value to increase space above headings */
}
/* Icons specific styles */
ul.icons {
cursor: default;
list-style: none;
padding-left: 0;
}
ul.icons li {
display: inline-block;
padding: 0 0.65em 0 0;
}
ul.icons li:last-child {
padding-right: 0 !important;
}
/* Global settings for images and videos */
img, video {
display: block;
width: 100%;
border-radius: 10px; /* Add rounded corners */
margin-top: 20px; /* Add space above the image */
margin-bottom: 20px; /* Add space below the image */
}
/* Exclude images inside the .icons class from global settings */
ul.icons img {
display: inline; /* Override display: block */
width: auto; /* Override width: 100% */
border-radius: 0; /* Remove rounded corners */
margin-top: 0; /* Remove top margin */
margin-bottom: 0; /* Remove bottom margin */
}
/* Align blog text and links */
.align-blog p, a, em {
text-align: left;
font-size: 1em;
line-height: 1.6;
}
/* Increase margin top for all headings */
.align-blog h1,
.align-blog h2,
.align-blog h3,
.align-blog h4,
.align-blog h5,
.align-blog h6 {
margin-top: 30px; /* Adjust this value to increase space above headings */
}
/* Icons specific styles */
ul.icons {
cursor: default;
list-style: none;
padding-left: 0;
}
ul.icons li {
display: inline-block;
padding: 0 0.65em 0 0;
}
ul.icons li:last-child {
padding-right: 0 !important;
}

View file

@ -1,138 +1,139 @@
/* Adjust the gallery wrapper */
.gallery-wrapper {
position: relative;
width: 100%;
max-width: 800px;
margin: 0 auto; /* Center the gallery */
overflow: hidden; /* Ensure content is within bounds */
}
.gallery-wrapper img {
display: block;
width: 100%;
height: auto;
}
/* Slick carousel specific styles */
.slick-prev, .slick-next {
background: #444; /* Button background color */
border: none; /* Remove any border */
border-radius: 50%; /* Make the buttons circular */
color: #fff; /* Text color */
font-size: 18px; /* Font size for the arrow */
height: 40px; /* Button height */
width: 40px; /* Button width */
line-height: 40px; /* Center text vertically */
text-align: center; /* Center text horizontally */
z-index: 1000; /* Make sure buttons are above the carousel images */
position: absolute;
top: 50%; /* Position vertically centered */
transform: translateY(-50%);
}
.slick-prev {
left: -50px; /* Position to the left of the carousel */
}
.slick-next {
right: -50px; /* Position to the right of the carousel */
}
/* Center the dots under the image */
.slick-dots {
text-align: center;
margin-top: 15px; /* Space between image and dots */
padding-left: 0;
list-style: none;
}
.slick-dots li {
display: inline-block; /* Align dots horizontally */
margin: 0 8px; /* Space between dots */
}
.slick-dots li button {
background: #ccc; /* Dot background color */
border: none; /* Remove any border */
border-radius: 50%; /* Make the dots circular */
width: 12px; /* Dot width */
height: 12px; /* Dot height */
position: relative;
}
.slick-dots li button::before {
content: '';
display: block;
width: 16px; /* Adjusted circle width */
height: 16px; /* Adjusted circle height */
border-radius: 50%;
background-color: transparent;
border: 2px solid #ccc; /* Circle border color */
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.slick-dots li.slick-active button::before {
background-color: #fff; /* Active dot background color */
border-color: #fff; /* Active dot border color */
}
/* This is what I get for global styling and using templates */
/* Override the border-radius to remove rounded corners */
.slick-prev, .slick-next {
border-radius: 0 !important;
background: none !important;
box-shadow: none !important;
}
/* If you want a specific shape, like a square or a different background */
.slick-prev, .slick-next {
border-radius: 0 !important;
background: transparent !important;
}
/* Ensure the active dot buttons are not rounded */
.slick-dots li button {
border-radius: 0 !important;
background: none !important;
}
.slick-dots li button::before {
border-radius: 0 !important;
}
/* General button override */
button[type="button"][role="tab"] {
border-radius: 0 !important;
background: none !important;
box-shadow: none !important;
border: none !important;
color: inherit !important;
padding: 0 !important;
}
/* Restore the round shape for the dots */
.slick-dots li button {
border-radius: 50% !important;
background: #ccc !important;
width: 12px;
height: 12px;
}
/* Ensure the pseudo-element is also circular */
.slick-dots li button::before {
border-radius: 50% !important;
background-color: transparent;
border: 2px solid #ccc;
width: 16px;
height: 16px;
}
/* Style for the active dot */
.slick-dots li.slick-active button::before {
background-color: #fff;
border-color: #fff;
}
/* Adjust the gallery wrapper */
.gallery-wrapper {
position: relative;
width: 100%;
max-width: 800px;
margin: 0 auto; /* Center the gallery */
overflow: hidden; /* Ensure content is within bounds */
}
.gallery-wrapper img {
display: block;
width: 100%;
height: auto;
border: 1px solid #dddddd3d;
}
/* Slick carousel specific styles */
.slick-prev, .slick-next {
background: #444; /* Button background color */
border: none; /* Remove any border */
border-radius: 50%; /* Make the buttons circular */
color: #fff; /* Text color */
font-size: 18px; /* Font size for the arrow */
height: 40px; /* Button height */
width: 40px; /* Button width */
line-height: 40px; /* Center text vertically */
text-align: center; /* Center text horizontally */
z-index: 1000; /* Make sure buttons are above the carousel images */
position: absolute;
top: 50%; /* Position vertically centered */
transform: translateY(-50%);
}
.slick-prev {
left: 0px;
}
.slick-next {
right: 0px;
}
/* Center the dots under the image */
.slick-dots {
text-align: center;
margin-top: 15px; /* Space between image and dots */
padding-left: 0;
list-style: none;
}
.slick-dots li {
display: inline-block; /* Align dots horizontally */
margin: 0 8px; /* Space between dots */
}
.slick-dots li button {
background: #ccc; /* Dot background color */
border: none; /* Remove any border */
border-radius: 50%; /* Make the dots circular */
width: 12px; /* Dot width */
height: 12px; /* Dot height */
position: relative;
}
.slick-dots li button::before {
content: '';
display: block;
width: 16px; /* Adjusted circle width */
height: 16px; /* Adjusted circle height */
border-radius: 50%;
background-color: transparent;
border: 2px solid #ccc; /* Circle border color */
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.slick-dots li.slick-active button::before {
background-color: #fff; /* Active dot background color */
border-color: #fff; /* Active dot border color */
}
/* This is what I get for global styling and using templates */
/* Override the border-radius to remove rounded corners */
.slick-prev, .slick-next {
border-radius: 0 !important;
background: none !important;
box-shadow: none !important;
}
/* If you want a specific shape, like a square or a different background */
.slick-prev, .slick-next {
border-radius: 0 !important;
background: transparent !important;
}
/* Ensure the active dot buttons are not rounded */
.slick-dots li button {
border-radius: 0 !important;
background: none !important;
}
.slick-dots li button::before {
border-radius: 0 !important;
}
/* General button override */
button[type="button"][role="tab"] {
border-radius: 0 !important;
background: none !important;
box-shadow: none !important;
border: none !important;
color: inherit !important;
padding: 0 !important;
}
/* Restore the round shape for the dots */
.slick-dots li button {
border-radius: 50% !important;
background: #ccc !important;
width: 12px;
height: 12px;
}
/* Ensure the pseudo-element is also circular */
.slick-dots li button::before {
border-radius: 50% !important;
background-color: transparent;
border: 2px solid #ccc;
width: 16px;
height: 16px;
}
/* Style for the active dot */
.slick-dots li.slick-active button::before {
background-color: #fff;
border-color: #fff;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

File diff suppressed because it is too large Load diff

View file

@ -1,2 +1,2 @@
.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto}.slick-track:after,.slick-track:before{display:table;content:''}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir=rtl] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}
.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto}.slick-track:after,.slick-track:before{display:table;content:''}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir=rtl] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}
/*# sourceMappingURL=/sm/fb3ed351cd5c0f1f30f88778ee1f9b056598e6d25ac4fdcab1eebcd8be521cd9.map */

BIN
static/images/favicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB

View file

@ -1,7 +1,7 @@
/*
Stellar by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
Spitfire Browser by Internet Addict (https://weforgecode.xyz/Spitfire/Website)
Based on Stellar by HTML5 UP | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
(function($) {

View file

@ -1,22 +1,22 @@
///
/// Stellar by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Icons */
ul.icons {
cursor: default;
list-style: none;
padding-left: 0;
li {
display: inline-block;
padding: 0 0.65em 0 0;
&:last-child {
padding-right: 0 !important;
}
}
///
// Spitfire Browser by Internet Addict (https://weforgecode.xyz/Spitfire/Website)
// Based on Stellar by HTML5 UP | @ajlkn
// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Icons */
ul.icons {
cursor: default;
list-style: none;
padding-left: 0;
li {
display: inline-block;
padding: 0 0.65em 0 0;
&:last-child {
padding-right: 0 !important;
}
}
}

View file

@ -1,223 +1,223 @@
// breakpoints.scss v1.0 | @ajlkn | MIT licensed */
// Vars.
/// Breakpoints.
/// @var {list}
$breakpoints: () !global;
// Mixins.
/// Sets breakpoints.
/// @param {map} $x Breakpoints.
@mixin breakpoints($x: ()) {
$breakpoints: $x !global;
}
/// Wraps @content in a @media block targeting a specific orientation.
/// @param {string} $orientation Orientation.
@mixin orientation($orientation) {
@media screen and (orientation: #{$orientation}) {
@content;
}
}
/// Wraps @content in a @media block using a given query.
/// @param {string} $query Query.
@mixin breakpoint($query: null) {
$breakpoint: null;
$op: null;
$media: null;
// Determine operator, breakpoint.
// Greater than or equal.
@if (str-slice($query, 0, 2) == '>=') {
$op: 'gte';
$breakpoint: str-slice($query, 3);
}
// Less than or equal.
@elseif (str-slice($query, 0, 2) == '<=') {
$op: 'lte';
$breakpoint: str-slice($query, 3);
}
// Greater than.
@elseif (str-slice($query, 0, 1) == '>') {
$op: 'gt';
$breakpoint: str-slice($query, 2);
}
// Less than.
@elseif (str-slice($query, 0, 1) == '<') {
$op: 'lt';
$breakpoint: str-slice($query, 2);
}
// Not.
@elseif (str-slice($query, 0, 1) == '!') {
$op: 'not';
$breakpoint: str-slice($query, 2);
}
// Equal.
@else {
$op: 'eq';
$breakpoint: $query;
}
// Build media.
@if ($breakpoint and map-has-key($breakpoints, $breakpoint)) {
$a: map-get($breakpoints, $breakpoint);
// Range.
@if (type-of($a) == 'list') {
$x: nth($a, 1);
$y: nth($a, 2);
// Max only.
@if ($x == null) {
// Greater than or equal (>= 0 / anything)
@if ($op == 'gte') {
$media: 'screen';
}
// Less than or equal (<= y)
@elseif ($op == 'lte') {
$media: 'screen and (max-width: ' + $y + ')';
}
// Greater than (> y)
@elseif ($op == 'gt') {
$media: 'screen and (min-width: ' + ($y + 1) + ')';
}
// Less than (< 0 / invalid)
@elseif ($op == 'lt') {
$media: 'screen and (max-width: -1px)';
}
// Not (> y)
@elseif ($op == 'not') {
$media: 'screen and (min-width: ' + ($y + 1) + ')';
}
// Equal (<= y)
@else {
$media: 'screen and (max-width: ' + $y + ')';
}
}
// Min only.
@else if ($y == null) {
// Greater than or equal (>= x)
@if ($op == 'gte') {
$media: 'screen and (min-width: ' + $x + ')';
}
// Less than or equal (<= inf / anything)
@elseif ($op == 'lte') {
$media: 'screen';
}
// Greater than (> inf / invalid)
@elseif ($op == 'gt') {
$media: 'screen and (max-width: -1px)';
}
// Less than (< x)
@elseif ($op == 'lt') {
$media: 'screen and (max-width: ' + ($x - 1) + ')';
}
// Not (< x)
@elseif ($op == 'not') {
$media: 'screen and (max-width: ' + ($x - 1) + ')';
}
// Equal (>= x)
@else {
$media: 'screen and (min-width: ' + $x + ')';
}
}
// Min and max.
@else {
// Greater than or equal (>= x)
@if ($op == 'gte') {
$media: 'screen and (min-width: ' + $x + ')';
}
// Less than or equal (<= y)
@elseif ($op == 'lte') {
$media: 'screen and (max-width: ' + $y + ')';
}
// Greater than (> y)
@elseif ($op == 'gt') {
$media: 'screen and (min-width: ' + ($y + 1) + ')';
}
// Less than (< x)
@elseif ($op == 'lt') {
$media: 'screen and (max-width: ' + ($x - 1) + ')';
}
// Not (< x and > y)
@elseif ($op == 'not') {
$media: 'screen and (max-width: ' + ($x - 1) + '), screen and (min-width: ' + ($y + 1) + ')';
}
// Equal (>= x and <= y)
@else {
$media: 'screen and (min-width: ' + $x + ') and (max-width: ' + $y + ')';
}
}
}
// String.
@else {
// Missing a media type? Prefix with "screen".
@if (str-slice($a, 0, 1) == '(') {
$media: 'screen and ' + $a;
}
// Otherwise, use as-is.
@else {
$media: $a;
}
}
}
// Output.
@media #{$media} {
@content;
}
// breakpoints.scss v1.0 | @ajlkn | MIT licensed */
// Vars.
/// Breakpoints.
/// @var {list}
$breakpoints: () !global;
// Mixins.
/// Sets breakpoints.
/// @param {map} $x Breakpoints.
@mixin breakpoints($x: ()) {
$breakpoints: $x !global;
}
/// Wraps @content in a @media block targeting a specific orientation.
/// @param {string} $orientation Orientation.
@mixin orientation($orientation) {
@media screen and (orientation: #{$orientation}) {
@content;
}
}
/// Wraps @content in a @media block using a given query.
/// @param {string} $query Query.
@mixin breakpoint($query: null) {
$breakpoint: null;
$op: null;
$media: null;
// Determine operator, breakpoint.
// Greater than or equal.
@if (str-slice($query, 0, 2) == '>=') {
$op: 'gte';
$breakpoint: str-slice($query, 3);
}
// Less than or equal.
@elseif (str-slice($query, 0, 2) == '<=') {
$op: 'lte';
$breakpoint: str-slice($query, 3);
}
// Greater than.
@elseif (str-slice($query, 0, 1) == '>') {
$op: 'gt';
$breakpoint: str-slice($query, 2);
}
// Less than.
@elseif (str-slice($query, 0, 1) == '<') {
$op: 'lt';
$breakpoint: str-slice($query, 2);
}
// Not.
@elseif (str-slice($query, 0, 1) == '!') {
$op: 'not';
$breakpoint: str-slice($query, 2);
}
// Equal.
@else {
$op: 'eq';
$breakpoint: $query;
}
// Build media.
@if ($breakpoint and map-has-key($breakpoints, $breakpoint)) {
$a: map-get($breakpoints, $breakpoint);
// Range.
@if (type-of($a) == 'list') {
$x: nth($a, 1);
$y: nth($a, 2);
// Max only.
@if ($x == null) {
// Greater than or equal (>= 0 / anything)
@if ($op == 'gte') {
$media: 'screen';
}
// Less than or equal (<= y)
@elseif ($op == 'lte') {
$media: 'screen and (max-width: ' + $y + ')';
}
// Greater than (> y)
@elseif ($op == 'gt') {
$media: 'screen and (min-width: ' + ($y + 1) + ')';
}
// Less than (< 0 / invalid)
@elseif ($op == 'lt') {
$media: 'screen and (max-width: -1px)';
}
// Not (> y)
@elseif ($op == 'not') {
$media: 'screen and (min-width: ' + ($y + 1) + ')';
}
// Equal (<= y)
@else {
$media: 'screen and (max-width: ' + $y + ')';
}
}
// Min only.
@else if ($y == null) {
// Greater than or equal (>= x)
@if ($op == 'gte') {
$media: 'screen and (min-width: ' + $x + ')';
}
// Less than or equal (<= inf / anything)
@elseif ($op == 'lte') {
$media: 'screen';
}
// Greater than (> inf / invalid)
@elseif ($op == 'gt') {
$media: 'screen and (max-width: -1px)';
}
// Less than (< x)
@elseif ($op == 'lt') {
$media: 'screen and (max-width: ' + ($x - 1) + ')';
}
// Not (< x)
@elseif ($op == 'not') {
$media: 'screen and (max-width: ' + ($x - 1) + ')';
}
// Equal (>= x)
@else {
$media: 'screen and (min-width: ' + $x + ')';
}
}
// Min and max.
@else {
// Greater than or equal (>= x)
@if ($op == 'gte') {
$media: 'screen and (min-width: ' + $x + ')';
}
// Less than or equal (<= y)
@elseif ($op == 'lte') {
$media: 'screen and (max-width: ' + $y + ')';
}
// Greater than (> y)
@elseif ($op == 'gt') {
$media: 'screen and (min-width: ' + ($y + 1) + ')';
}
// Less than (< x)
@elseif ($op == 'lt') {
$media: 'screen and (max-width: ' + ($x - 1) + ')';
}
// Not (< x and > y)
@elseif ($op == 'not') {
$media: 'screen and (max-width: ' + ($x - 1) + '), screen and (min-width: ' + ($y + 1) + ')';
}
// Equal (>= x and <= y)
@else {
$media: 'screen and (min-width: ' + $x + ') and (max-width: ' + $y + ')';
}
}
}
// String.
@else {
// Missing a media type? Prefix with "screen".
@if (str-slice($a, 0, 1) == '(') {
$media: 'screen and ' + $a;
}
// Otherwise, use as-is.
@else {
$media: $a;
}
}
}
// Output.
@media #{$media} {
@content;
}
}

View file

@ -1,376 +1,376 @@
// vendor.scss v1.0 | @ajlkn | MIT licensed */
// Vars.
/// Vendor prefixes.
/// @var {list}
$vendor-prefixes: (
'-moz-',
'-webkit-',
'-ms-',
''
);
/// Properties that should be vendorized.
/// Data via caniuse.com, github.com/postcss/autoprefixer, and developer.mozilla.org
/// @var {list}
$vendor-properties: (
// Animation.
'animation',
'animation-delay',
'animation-direction',
'animation-duration',
'animation-fill-mode',
'animation-iteration-count',
'animation-name',
'animation-play-state',
'animation-timing-function',
// Appearance.
'appearance',
// Backdrop filter.
'backdrop-filter',
// Background image options.
'background-clip',
'background-origin',
'background-size',
// Box sizing.
'box-sizing',
// Clip path.
'clip-path',
// Filter effects.
'filter',
// Flexbox.
'align-content',
'align-items',
'align-self',
'flex',
'flex-basis',
'flex-direction',
'flex-flow',
'flex-grow',
'flex-shrink',
'flex-wrap',
'justify-content',
'order',
// Font feature.
'font-feature-settings',
'font-language-override',
'font-variant-ligatures',
// Font kerning.
'font-kerning',
// Fragmented borders and backgrounds.
'box-decoration-break',
// Grid layout.
'grid-column',
'grid-column-align',
'grid-column-end',
'grid-column-start',
'grid-row',
'grid-row-align',
'grid-row-end',
'grid-row-start',
'grid-template-columns',
'grid-template-rows',
// Hyphens.
'hyphens',
'word-break',
// Masks.
'mask',
'mask-border',
'mask-border-outset',
'mask-border-repeat',
'mask-border-slice',
'mask-border-source',
'mask-border-width',
'mask-clip',
'mask-composite',
'mask-image',
'mask-origin',
'mask-position',
'mask-repeat',
'mask-size',
// Multicolumn.
'break-after',
'break-before',
'break-inside',
'column-count',
'column-fill',
'column-gap',
'column-rule',
'column-rule-color',
'column-rule-style',
'column-rule-width',
'column-span',
'column-width',
'columns',
// Object fit.
'object-fit',
'object-position',
// Regions.
'flow-from',
'flow-into',
'region-fragment',
// Scroll snap points.
'scroll-snap-coordinate',
'scroll-snap-destination',
'scroll-snap-points-x',
'scroll-snap-points-y',
'scroll-snap-type',
// Shapes.
'shape-image-threshold',
'shape-margin',
'shape-outside',
// Tab size.
'tab-size',
// Text align last.
'text-align-last',
// Text decoration.
'text-decoration-color',
'text-decoration-line',
'text-decoration-skip',
'text-decoration-style',
// Text emphasis.
'text-emphasis',
'text-emphasis-color',
'text-emphasis-position',
'text-emphasis-style',
// Text size adjust.
'text-size-adjust',
// Text spacing.
'text-spacing',
// Transform.
'transform',
'transform-origin',
// Transform 3D.
'backface-visibility',
'perspective',
'perspective-origin',
'transform-style',
// Transition.
'transition',
'transition-delay',
'transition-duration',
'transition-property',
'transition-timing-function',
// Unicode bidi.
'unicode-bidi',
// User select.
'user-select',
// Writing mode.
'writing-mode',
);
/// Values that should be vendorized.
/// Data via caniuse.com, github.com/postcss/autoprefixer, and developer.mozilla.org
/// @var {list}
$vendor-values: (
// Cross fade.
'cross-fade',
// Element function.
'element',
// Filter function.
'filter',
// Flexbox.
'flex',
'inline-flex',
// Grab cursors.
'grab',
'grabbing',
// Gradients.
'linear-gradient',
'repeating-linear-gradient',
'radial-gradient',
'repeating-radial-gradient',
// Grid layout.
'grid',
'inline-grid',
// Image set.
'image-set',
// Intrinsic width.
'max-content',
'min-content',
'fit-content',
'fill',
'fill-available',
'stretch',
// Sticky position.
'sticky',
// Transform.
'transform',
// Zoom cursors.
'zoom-in',
'zoom-out',
);
// Functions.
/// Removes a specific item from a list.
/// @author Hugo Giraudel
/// @param {list} $list List.
/// @param {integer} $index Index.
/// @return {list} Updated list.
@function remove-nth($list, $index) {
$result: null;
@if type-of($index) != number {
@warn "$index: #{quote($index)} is not a number for `remove-nth`.";
}
@else if $index == 0 {
@warn "List index 0 must be a non-zero integer for `remove-nth`.";
}
@else if abs($index) > length($list) {
@warn "List index is #{$index} but list is only #{length($list)} item long for `remove-nth`.";
}
@else {
$result: ();
$index: if($index < 0, length($list) + $index + 1, $index);
@for $i from 1 through length($list) {
@if $i != $index {
$result: append($result, nth($list, $i));
}
}
}
@return $result;
}
/// Replaces a substring within another string.
/// @author Hugo Giraudel
/// @param {string} $string String.
/// @param {string} $search Substring.
/// @param {string} $replace Replacement.
/// @return {string} Updated string.
@function str-replace($string, $search, $replace: '') {
$index: str-index($string, $search);
@if $index {
@return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
}
@return $string;
}
/// Replaces a substring within each string in a list.
/// @param {list} $strings List of strings.
/// @param {string} $search Substring.
/// @param {string} $replace Replacement.
/// @return {list} Updated list of strings.
@function str-replace-all($strings, $search, $replace: '') {
@each $string in $strings {
$strings: set-nth($strings, index($strings, $string), str-replace($string, $search, $replace));
}
@return $strings;
}
// Mixins.
/// Wraps @content in vendorized keyframe blocks.
/// @param {string} $name Name.
@mixin keyframes($name) {
@-moz-keyframes #{$name} { @content; }
@-webkit-keyframes #{$name} { @content; }
@-ms-keyframes #{$name} { @content; }
@keyframes #{$name} { @content; }
}
/// Vendorizes a declaration's property and/or value(s).
/// @param {string} $property Property.
/// @param {mixed} $value String/list of value(s).
@mixin vendor($property, $value) {
// Determine if property should expand.
$expandProperty: index($vendor-properties, $property);
// Determine if value should expand (and if so, add '-prefix-' placeholder).
$expandValue: false;
@each $x in $value {
@each $y in $vendor-values {
@if $y == str-slice($x, 1, str-length($y)) {
$value: set-nth($value, index($value, $x), '-prefix-' + $x);
$expandValue: true;
}
}
}
// Expand property?
@if $expandProperty {
@each $vendor in $vendor-prefixes {
#{$vendor}#{$property}: #{str-replace-all($value, '-prefix-', $vendor)};
}
}
// Expand just the value?
@elseif $expandValue {
@each $vendor in $vendor-prefixes {
#{$property}: #{str-replace-all($value, '-prefix-', $vendor)};
}
}
// Neither? Treat them as a normal declaration.
@else {
#{$property}: #{$value};
}
// vendor.scss v1.0 | @ajlkn | MIT licensed */
// Vars.
/// Vendor prefixes.
/// @var {list}
$vendor-prefixes: (
'-moz-',
'-webkit-',
'-ms-',
''
);
/// Properties that should be vendorized.
/// Data via caniuse.com, github.com/postcss/autoprefixer, and developer.mozilla.org
/// @var {list}
$vendor-properties: (
// Animation.
'animation',
'animation-delay',
'animation-direction',
'animation-duration',
'animation-fill-mode',
'animation-iteration-count',
'animation-name',
'animation-play-state',
'animation-timing-function',
// Appearance.
'appearance',
// Backdrop filter.
'backdrop-filter',
// Background image options.
'background-clip',
'background-origin',
'background-size',
// Box sizing.
'box-sizing',
// Clip path.
'clip-path',
// Filter effects.
'filter',
// Flexbox.
'align-content',
'align-items',
'align-self',
'flex',
'flex-basis',
'flex-direction',
'flex-flow',
'flex-grow',
'flex-shrink',
'flex-wrap',
'justify-content',
'order',
// Font feature.
'font-feature-settings',
'font-language-override',
'font-variant-ligatures',
// Font kerning.
'font-kerning',
// Fragmented borders and backgrounds.
'box-decoration-break',
// Grid layout.
'grid-column',
'grid-column-align',
'grid-column-end',
'grid-column-start',
'grid-row',
'grid-row-align',
'grid-row-end',
'grid-row-start',
'grid-template-columns',
'grid-template-rows',
// Hyphens.
'hyphens',
'word-break',
// Masks.
'mask',
'mask-border',
'mask-border-outset',
'mask-border-repeat',
'mask-border-slice',
'mask-border-source',
'mask-border-width',
'mask-clip',
'mask-composite',
'mask-image',
'mask-origin',
'mask-position',
'mask-repeat',
'mask-size',
// Multicolumn.
'break-after',
'break-before',
'break-inside',
'column-count',
'column-fill',
'column-gap',
'column-rule',
'column-rule-color',
'column-rule-style',
'column-rule-width',
'column-span',
'column-width',
'columns',
// Object fit.
'object-fit',
'object-position',
// Regions.
'flow-from',
'flow-into',
'region-fragment',
// Scroll snap points.
'scroll-snap-coordinate',
'scroll-snap-destination',
'scroll-snap-points-x',
'scroll-snap-points-y',
'scroll-snap-type',
// Shapes.
'shape-image-threshold',
'shape-margin',
'shape-outside',
// Tab size.
'tab-size',
// Text align last.
'text-align-last',
// Text decoration.
'text-decoration-color',
'text-decoration-line',
'text-decoration-skip',
'text-decoration-style',
// Text emphasis.
'text-emphasis',
'text-emphasis-color',
'text-emphasis-position',
'text-emphasis-style',
// Text size adjust.
'text-size-adjust',
// Text spacing.
'text-spacing',
// Transform.
'transform',
'transform-origin',
// Transform 3D.
'backface-visibility',
'perspective',
'perspective-origin',
'transform-style',
// Transition.
'transition',
'transition-delay',
'transition-duration',
'transition-property',
'transition-timing-function',
// Unicode bidi.
'unicode-bidi',
// User select.
'user-select',
// Writing mode.
'writing-mode',
);
/// Values that should be vendorized.
/// Data via caniuse.com, github.com/postcss/autoprefixer, and developer.mozilla.org
/// @var {list}
$vendor-values: (
// Cross fade.
'cross-fade',
// Element function.
'element',
// Filter function.
'filter',
// Flexbox.
'flex',
'inline-flex',
// Grab cursors.
'grab',
'grabbing',
// Gradients.
'linear-gradient',
'repeating-linear-gradient',
'radial-gradient',
'repeating-radial-gradient',
// Grid layout.
'grid',
'inline-grid',
// Image set.
'image-set',
// Intrinsic width.
'max-content',
'min-content',
'fit-content',
'fill',
'fill-available',
'stretch',
// Sticky position.
'sticky',
// Transform.
'transform',
// Zoom cursors.
'zoom-in',
'zoom-out',
);
// Functions.
/// Removes a specific item from a list.
/// @author Hugo Giraudel
/// @param {list} $list List.
/// @param {integer} $index Index.
/// @return {list} Updated list.
@function remove-nth($list, $index) {
$result: null;
@if type-of($index) != number {
@warn "$index: #{quote($index)} is not a number for `remove-nth`.";
}
@else if $index == 0 {
@warn "List index 0 must be a non-zero integer for `remove-nth`.";
}
@else if abs($index) > length($list) {
@warn "List index is #{$index} but list is only #{length($list)} item long for `remove-nth`.";
}
@else {
$result: ();
$index: if($index < 0, length($list) + $index + 1, $index);
@for $i from 1 through length($list) {
@if $i != $index {
$result: append($result, nth($list, $i));
}
}
}
@return $result;
}
/// Replaces a substring within another string.
/// @author Hugo Giraudel
/// @param {string} $string String.
/// @param {string} $search Substring.
/// @param {string} $replace Replacement.
/// @return {string} Updated string.
@function str-replace($string, $search, $replace: '') {
$index: str-index($string, $search);
@if $index {
@return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
}
@return $string;
}
/// Replaces a substring within each string in a list.
/// @param {list} $strings List of strings.
/// @param {string} $search Substring.
/// @param {string} $replace Replacement.
/// @return {list} Updated list of strings.
@function str-replace-all($strings, $search, $replace: '') {
@each $string in $strings {
$strings: set-nth($strings, index($strings, $string), str-replace($string, $search, $replace));
}
@return $strings;
}
// Mixins.
/// Wraps @content in vendorized keyframe blocks.
/// @param {string} $name Name.
@mixin keyframes($name) {
@-moz-keyframes #{$name} { @content; }
@-webkit-keyframes #{$name} { @content; }
@-ms-keyframes #{$name} { @content; }
@keyframes #{$name} { @content; }
}
/// Vendorizes a declaration's property and/or value(s).
/// @param {string} $property Property.
/// @param {mixed} $value String/list of value(s).
@mixin vendor($property, $value) {
// Determine if property should expand.
$expandProperty: index($vendor-properties, $property);
// Determine if value should expand (and if so, add '-prefix-' placeholder).
$expandValue: false;
@each $x in $value {
@each $y in $vendor-values {
@if $y == str-slice($x, 1, str-length($y)) {
$value: set-nth($value, index($value, $x), '-prefix-' + $x);
$expandValue: true;
}
}
}
// Expand property?
@if $expandProperty {
@each $vendor in $vendor-prefixes {
#{$vendor}#{$property}: #{str-replace-all($value, '-prefix-', $vendor)};
}
}
// Expand just the value?
@elseif $expandValue {
@each $vendor in $vendor-prefixes {
#{$property}: #{str-replace-all($value, '-prefix-', $vendor)};
}
}
// Neither? Treat them as a normal declaration.
@else {
#{$property}: #{$value};
}
}

View file

@ -1,17 +1,17 @@
<!DOCTYPE HTML>
<!--
Stellar by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
Spitfire Browser by Internet Addict (https://weforgecode.xyz/Spitfire/Website)
Based on Stellar by HTML5 UP | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<link rel="icon" type="image/png" href="favicon.png">
<link rel="icon" type="image/png" href="static/images/favicon.png">
<title>Spitfire Browser - Downloads</title>
<meta content="🌐 Spitfire Browser" property="og:title" />
<meta content="Privacy respecting user friendly web browser." property="og:description" />
<meta content="https://spitfirebrowser.com/" property="og:url" />
<meta content="https://spitfirebrowser.com/favicon.png" property="og:image" />
<meta content="https://spitfirebrowser.com/static/images/favicon.png" property="og:image" />
<meta content="#f1f1f1" data-react-helmet="true" name="theme-color" />
<meta name="darkreader-lock">

View file

@ -1,63 +1,63 @@
<!DOCTYPE HTML>
<!--
Stellar by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
Spitfire Browser by Internet Addict (https://weforgecode.xyz/Spitfire/Website)
Based on Stellar by HTML5 UP | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<link rel="icon" type="image/png" href="favicon.png">
<title>Spitfire Browser - Downloads</title>
<meta content="🌐 Spitfire Browser" property="og:title" />
<meta content="Privacy respecting user friendly web browser." property="og:description" />
<meta content="https://spitfirebrowser.com/" property="og:url" />
<meta content="https://spitfirebrowser.com/favicon.png" property="og:image" />
<meta content="#f1f1f1" data-react-helmet="true" name="theme-color" />
<meta name="darkreader-lock">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="static/css/main.css" />
<link rel="stylesheet" href="static/css/stars.css" />
<noscript><link rel="stylesheet" href="static/css/noscript.css" /></noscript>
<style>
.download-section {
text-align: center;
padding: 2em 0;
}
<head>
<link rel="icon" type="image/png" href="static/images/favicon.png">
<title>Spitfire Browser - Downloads</title>
<meta content="🌐 Spitfire Browser" property="og:title" />
<meta content="Privacy respecting user friendly web browser." property="og:description" />
<meta content="https://spitfirebrowser.com/" property="og:url" />
<meta content="https://spitfirebrowser.com/static/images/favicon.png" property="og:image" />
<meta content="#f1f1f1" data-react-helmet="true" name="theme-color" />
<meta name="darkreader-lock">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="static/css/main.css" />
<link rel="stylesheet" href="static/css/stars.css" />
<noscript><link rel="stylesheet" href="static/css/noscript.css" /></noscript>
<style>
.download-section {
text-align: center;
padding: 2em 0;
}
.download-buttons {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 1em;
}
.download-buttons {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 1em;
}
.download-button {
border-radius: 0.5em;
padding: 1em;
width: 220px;
height: 220px;
text-align: center;
transition: background-color 0.3s ease;
}
.download-button {
border-radius: 0.5em;
padding: 1em;
width: 220px;
height: 220px;
text-align: center;
transition: background-color 0.3s ease;
}
.download-button:hover {
background-color: #444;
}
.download-button:hover {
background-color: #444;
}
.download-button img {
width: 48px;
height: 48px;
}
.download-button img {
width: 48px;
height: 48px;
}
.download-button span {
display: block;
margin-top: 0.5em;
font-size: 1.2em;
}
</style>
</head>
.download-button span {
display: block;
margin-top: 0.5em;
font-size: 1.2em;
}
</style>
</head>
<body class="is-preload">
<!-- Star Background Divs -->

View file

@ -1,17 +1,17 @@
<!DOCTYPE HTML>
<!--
Spitfire Browser by Internet Addict
Based on Stellar by HTML5 UP
Spitfire Browser by Internet Addict (https://weforgecode.xyz/Spitfire/Website)
Based on Stellar by HTML5 UP | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<link rel="icon" type="image/png" href="favicon.png">
<link rel="icon" type="image/png" href="static/images/favicon.png">
<title>Spitfire Browser - Fast. Secure. Elegant.</title>
<meta content="🌐 Spitfire Browser" property="og:title" />
<meta content="Privacy respecting user friendly web browser." property="og:description" />
<meta content="https://spitfirebrowser.com/" property="og:url" />
<meta content="https://spitfirebrowser.com/favicon.png" property="og:image" />
<meta content="https://spitfirebrowser.com/static/images/favicon.png" property="og:image" />
<meta content="#f1f1f1" data-react-helmet="true" name="theme-color" />
<meta name="darkreader-lock">

View file

@ -1,115 +1,115 @@
<!DOCTYPE HTML>
<!--
Stellar by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<link rel="icon" type="image/png" href="favicon.png">
<title>{{.Title}}</title>
<meta content="🌐 {{.Title}}" property="og:title" />
<meta content="Privacy respecting user friendly web browser." property="og:description" />
<meta content="https://spitfirebrowser.com/" property="og:url" />
<meta content="https://spitfirebrowser.com/favicon.png" property="og:image" />
<meta content="#f1f1f1" data-react-helmet="true" name="theme-color" />
<meta name="darkreader-lock">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="/static/css/main.css" />
<link rel="stylesheet" href="/static/css/stars.css" />
<link rel="stylesheet" href="/static/css/extras.css" />
<link rel="stylesheet" href="/static/css/blog.css" />
<noscript><link rel="stylesheet" href="/static/css/noscript.css" /></noscript>
</head>
<body class="is-preload">
<!-- Star Background Divs -->
<div id="star-background">
<div id="stars"></div>
<div id="stars2"></div>
<div id="stars3"></div>
</div>
<!-- Top Floater Footer -->
<div style="background-color: red; color: white; text-align: center; padding: 10px 0; position: fixed; top: 0; width: 100%; z-index: 1000;">
🚧👷‍♂️ This site is under construction! Please check back later. 👷‍♀️🚧
</div>
<!-- Wrapper -->
<div id="wrapper">
<!-- Header -->
<header id="header" class="alt">
<span class="logo">
<a href="/"><img src="/static/images/logo.svg" alt="Spitfire Logo" /></a>
</span>
<h1>Spitfire Browser News</h1>
</header>
<!-- Main -->
<div id="main">
<!-- Stable Release Section -->
<section id="cta" class="main">
<div class="center-text">
<header class="major">
<div class="align-blog"> <p>{{.Content}}</p> </div>
</header>
<footer class="major">
<ul class="actions special">
{{if .PrevLink}}
<li><a href="{{.PrevLink}}" class="button primary small">Previous</a></li>
{{end}}
<li><a href="/" class="button primary small">Home</a></li>
{{if .NextLink}}
<li><a href="{{.NextLink}}" class="button primary small">Next</a></li>
{{end}}
</ul>
</footer>
</div>
</section>
</div>
<!-- Footer -->
<footer id="footer">
<section>
<h2>Support me</h2>
<ul class="icons">
<li>
<a href="#" class="icon alt">
<img src="/static/images/icons/regular/heart.svg" alt="LibrePay">
<span class="label">LibrePay</span>
</a>
</li>
<li>
<a href="https://weforgecode.xyz/Spitfire/" class="icon alt">
<img src="/static/images/icons/brands/git-alt.svg" alt="Forgejo">
<span class="label">Forgejo</span>
</a>
</li>
<li>
<a href="#" class="icon alt">
<img src="/static/images/icons/brands/youtube.svg" alt="YouTube">
<span class="label">YouTube</span>
</a>
</li>
</ul>
</section>
<section>
<p class="copyright">&copy; Spitfire Browser. Design based on <a href="https://html5up.net">HTML5 UP</a>.</p>
</section>
</footer>
</div>
<!-- Scripts -->
<script src="/static/js/jquery.min.js" defer></script>
<script src="/static/js/jquery.scrollex.min.js" defer></script>
<script src="/static/js/jquery.scrolly.min.js" defer></script>
<script src="/static/js/browser.min.js" defer></script>
<script src="/static/js/breakpoints.min.js" defer></script>
<script src="/static/js/util.js" defer></script>
<script src="/static/js/main.js" defer></script>
</body>
</html>
<!DOCTYPE HTML>
<!--
Spitfire Browser by Internet Addict (https://weforgecode.xyz/Spitfire/Website)
Based on Stellar by HTML5 UP | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<link rel="icon" type="image/png" href="static/images/favicon.png">
<title>{{.Title}}</title>
<meta content="🌐 {{.Title}}" property="og:title" />
<meta content="Privacy respecting user friendly web browser." property="og:description" />
<meta content="https://spitfirebrowser.com/" property="og:url" />
<meta content="https://spitfirebrowser.com/static/images/favicon.png" property="og:image" />
<meta content="#f1f1f1" data-react-helmet="true" name="theme-color" />
<meta name="darkreader-lock">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="/static/css/main.css" />
<link rel="stylesheet" href="/static/css/stars.css" />
<link rel="stylesheet" href="/static/css/extras.css" />
<link rel="stylesheet" href="/static/css/blog.css" />
<noscript><link rel="stylesheet" href="/static/css/noscript.css" /></noscript>
</head>
<body class="is-preload">
<!-- Star Background Divs -->
<div id="star-background">
<div id="stars"></div>
<div id="stars2"></div>
<div id="stars3"></div>
</div>
<!-- Top Floater Footer -->
<div style="background-color: red; color: white; text-align: center; padding: 10px 0; position: fixed; top: 0; width: 100%; z-index: 1000;">
🚧👷‍♂️ This site is under construction! Please check back later. 👷‍♀️🚧
</div>
<!-- Wrapper -->
<div id="wrapper">
<!-- Header -->
<header id="header" class="alt">
<span class="logo">
<a href="/"><img src="/static/images/logo.svg" alt="Spitfire Logo" /></a>
</span>
<h1>Spitfire Browser News</h1>
</header>
<!-- Main -->
<div id="main">
<!-- Stable Release Section -->
<section id="cta" class="main">
<div class="center-text">
<header class="major">
<div class="align-blog"> <p>{{.Content}}</p> </div>
</header>
<footer class="major">
<ul class="actions special">
{{if .PrevLink}}
<li><a href="{{.PrevLink}}" class="button primary small">Previous</a></li>
{{end}}
<li><a href="/" class="button primary small">Home</a></li>
{{if .NextLink}}
<li><a href="{{.NextLink}}" class="button primary small">Next</a></li>
{{end}}
</ul>
</footer>
</div>
</section>
</div>
<!-- Footer -->
<footer id="footer">
<section>
<h2>Support me</h2>
<ul class="icons">
<li>
<a href="#" class="icon alt">
<img src="/static/images/icons/regular/heart.svg" alt="LibrePay">
<span class="label">LibrePay</span>
</a>
</li>
<li>
<a href="https://weforgecode.xyz/Spitfire/" class="icon alt">
<img src="/static/images/icons/brands/git-alt.svg" alt="Forgejo">
<span class="label">Forgejo</span>
</a>
</li>
<li>
<a href="#" class="icon alt">
<img src="/static/images/icons/brands/youtube.svg" alt="YouTube">
<span class="label">YouTube</span>
</a>
</li>
</ul>
</section>
<section>
<p class="copyright">&copy; Spitfire Browser. Design based on <a href="https://html5up.net">HTML5 UP</a>.</p>
</section>
</footer>
</div>
<!-- Scripts -->
<script src="/static/js/jquery.min.js" defer></script>
<script src="/static/js/jquery.scrollex.min.js" defer></script>
<script src="/static/js/jquery.scrolly.min.js" defer></script>
<script src="/static/js/browser.min.js" defer></script>
<script src="/static/js/breakpoints.min.js" defer></script>
<script src="/static/js/util.js" defer></script>
<script src="/static/js/main.js" defer></script>
</body>
</html>