diff --git a/assets/fonts/unifont.otf b/assets/fonts/unifont.otf deleted file mode 100644 index 9140053..0000000 Binary files a/assets/fonts/unifont.otf and /dev/null differ diff --git a/assets/style.css b/assets/style.css index dc0ea42..3b1a0a8 100644 --- a/assets/style.css +++ b/assets/style.css @@ -3,75 +3,423 @@ font-family: 'dos'; src: url('fonts/dosvga.ttf'); } + @font-face { font-family: 'unifont'; src: url('fonts/unifont.otf'); } -:root +@media (prefers-color-scheme: light) { - --font-header: 'unifont'; - --font-body: 'dos'; + :root + { + --page-bg-color: #ece3cc; + --page-text-color: #53676d; + --title-color: #53676d; + --title-bg-color: transparent; + --content-bg-color: #fbf3db; + --content-border-color: #0072d4; + --link-color: #0072d4; + --link-color-visited: #8762c6; + --link-color-hover: #d2212d; + --nav-button-bg-color: #fbf3db; + --nav-button-text-color: #3a4d53; + --nav-dropdown-bg-color: rgba(251, 243, 219, 0.85); + + --content-width: 65em; + --main-flex-basis: 70%; + --col-flex-basis: 10%; + --hr-width: 2px; + --hr-color: #53676d; + --hr-style: solid; + + --body-font: 'Nimbus Mono PS', 'Courier New', monospace; + --header-font: 'dos', 'Nimbus Mono PS', 'Courier New', monospace; + --body-line-height: 1.4; + --body-font-size: 1.2rem; + --header-font-size: 1.7rem; + --title-font-size: 2rem; + + --noscroll-topbottom: 10vh; + --noscroll-height: 80%; + + --bg-image: none; + --bg-image-repeat: repeat; + --bg-image-size: auto; + --bg-image-position: 0 0; + --bg-image-scroll: scroll; + + --content-border-style: solid; + --content-border-radius: 0px; + --content-border-width: 3px; + --block-border-style: none; + --block-border-radius: 0px; + --block-border-width: 1px; + --block-margin-bottom: 0px; + --col-header-margin: 0.65em; + } +} + +@media (prefers-color-scheme: dark) +{ + :root + { + --page-bg-color: #252525; + --page-text-color: #b9b9b9; + --title-color: #b9b9b9; + --title-bg-color: transparent; + --content-bg-color: #181818; + --content-border-color: #368aeb; + --link-color: #368aeb; + --link-color-visited: #a580e2; + --link-color-hover: #ed4a46; + --nav-button-bg-color: #181818; + --nav-button-text-color: #dedede; + --nav-dropdown-bg-color: rgba(24, 24, 24, 0.85); + + --content-width: 65em; + --main-flex-basis: 70%; + --col-flex-basis: 10%; + --hr-width: 2px; + --hr-color: #b9b9b9; + --hr-style: solid; + + --body-font: 'Nimbus Mono PS', 'Courier New', monospace; + --header-font: 'dos', 'Nimbus Mono PS', 'Courier New', monospace; + --body-line-height: 1.4; + --body-font-size: 1.2rem; + --header-font-size: 1.7rem; + --title-font-size: 2rem; + + --noscroll-topbottom: 10vh; + --noscroll-height: 80%; + + --bg-image: none; + --bg-image-repeat: repeat; + --bg-image-size: auto; + --bg-image-position: 0 0; + --bg-image-scroll: scroll; + + --content-border-style: solid; + --content-border-radius: 0px; + --content-border-width: 3px; + --block-border-style: none; + --block-border-radius: 0px; + --block-border-width: 1px; + --block-margin-bottom: 0px; + --col-header-margin: 0.65em; + } } body { - margin: 0; - padding: 0; + background-color: var(--page-bg-color); + color: var(--page-text-color); + font-family: var(--body-font); + line-height: var(--body-line-height); + font-size: var(--body-font-size); + background-image: var(--bg-image); + background-repeat: var(--bg-image-repeat); + background-size: var(--bg-image-size); + background-position: var(--bg-image-position); + background-attachment: var(--bg-image-scroll); } -html +h1, +h2, +h3, +h4, +h5, +h6 { - background-color: black; + font-family: var(--header-font); + background-color: var(--title-bg-color); + color: var(--title-color); + position: relative; + z-index: 1; } -.navbar ul +h2, +h3, +h4, +h5, +h6 +{ + font-size: var(--header-font-size); +} + +h1 +{ + text-align: center; + font-size: var(--title-font-size); +} + +a +{ + color: var(--link-color); +} + +a:visited +{ + color: var(--link-color-visited); +} + +a:hover +{ + color: var(--link-color-hover); + +} + +header +{ + text-align: center; + padding-bottom: 0.5em; +} + +main +{ + background-color: var(--content-bg-color); + border-color: var(--content-border-color); + border-width: var(--content-border-width); + border-radius: var(--content-border-radius); + border-style: var(--content-border-style); +} + +.horizontal /* use in a ul li list, to lay out +elements horizontally */ { - background-color: darkred; display: flex; list-style-type: none; - justify-content: center; - left: 0; + justify-content: space-evenly; + max-width: max-content; + flex-wrap: wrap; + gap: var(--margin); +} + +/* CONTENT IMAGES */ + +.img-resize /* Use this for individual images */ +{ + object-fit: contain; + max-width: 100%; +} + +.img-mirror /* Mirrors an image */ +{ + -webkit-transform: scaleX(-1); + -moz-transform: scaleX(-1); + -o-transform: scaleX(-1); + transform: scaleX(-1); +} + +.img-border /* Adds border to image */ +{ + border-width: 2px; + border-style: solid; + border-color: var(--content-border-color); +} + +.images /* use in a div, to make the images appear +horizontally */ +{ + display: flex; + width: calc(100% + 5px + 5px); + margin-left: -5px; + margin-right: -5px; +} + +.images img +{ + width: 100%; + height: auto; + padding: 5px; margin: 0; overflow: hidden; - padding: 0; - position: fixed; - top: 0; - width: 100%; } -.navbar ul li +nav#topmenu { - float: left; -} - -.navbar ul li a -{ - color: white; - display: block; - padding: 14px 16px; text-align: center; - text-decoration: none; - font-size: 1.5em; - font-family: var(--font-header); + position: static; + background-color: var(--page-bg-color); + z-index: 10; + left: 0px; + margin-left: auto; + margin-right: auto; + top: 0px; + right: 0px; + padding: 0.75em; } -.navbar ul li a:hover +nav#topmenu ul { - background-color: blue; -} - -.text-block -{ - border: 2px solid blue; - color: white; - font-family: var(--font-body); + padding: 0px; + margin: 0px; + display: flex; + flex-wrap: wrap; justify-content: center; - margin-bottom: 5%; - margin-left: 25%; - margin-right: 25%; - margin-top: 5%; - padding: 10px 15px; - text-align: center; + gap: 0.75em; +} + +nav#topmenu ul li +{ + list-style-type: none; + padding: 0.1em; + margin-top: 0px; + margin-bottom: 0px; + margin-left: 0px; + background-color: var(--nav-button-bg-color); + color: var(--nav-button-text-color); + border-radius: 0px; + border-style: solid; + border-width: var(--content-border-width); + border-color: var(--content-border-color); + text-decoration: underline; + position: relative; +} + +nav#topmenu li a +{ + text-decoration: none; + color: var(--nav-button-text-color); + padding: 0.1em; + display: block; +} + +nav#topmenu a:link +{ + color: var(--nav-button-text-color); +} + +nav#topmenu a:visited +{ + color: var(--nav-button-text-color); +} + +nav#topmenu a:hover +{ + color: var(--link-color-hover); +} + +nav#topmenu ul li::before {} + +nav#topmenu ul li:first-child::before +{ + content: ""; +} + +nav#topmenu ul ul +{ + display: none; + position: absolute; + top: calc(100% + 0.8rem); + left: 0; + background-color: var(--nav-dropdown-bg-color); + border-style: var(--content-border-style); + border-width: var(--content-border-width); + border-color: var(--content-border-color); + border-radius: var(--content-border-radius); + padding: 0.25em 0; + margin: 0; + list-style-type: none; + min-width: 12em; + z-index: 20; +} + +nav#topmenu ul li:hover > ul +{ + display: block; +} + + +nav#topmenu ul li::after +{ + content: ""; + position: absolute; + top: 100%; + left: 0; + width: 100%; + height: 0.4rem; + background: transparent; + z-index: 19; +} + +nav#topmenu ul ul li +{ + padding: 0; + margin: 0; + background-color: transparent; + border: none; +} + +nav#topmenu ul ul li a +{ + display: block; + padding: 0.5em 1em; + color: var(--nav-button-text-color); + text-decoration: none; + white-space: nowrap; +} + +div.flex_container +{ + display: flex; + flex-flow: wrap; + max-width: var(--content-width); + margin-left: auto; + margin-right: auto; +} + +.flex_container main +{ + order: 2; + flex-grow: 5; + flex-basis: var(--main-flex-basis); + padding: 10px; + min-width: 15em; +} + +@media screen and (max-width: 35em) +{ + + main + { + order: 1; + } +} + +#noscroll-body +{ +margin-left: auto; +margin-right: auto; +margin-top: var(--noscroll-topbottom); +margin-bottom: var(--noscroll-topbottom); +height: var(--noscroll-height); +padding: 1em; +display: grid; +grid-template-rows: min-content min-content 1fr min-content; +border-color: var(--content-border-color); +border-width: var(--content-border-width); +border-radius: var(--content-border-radius); +} + +#noscroll-body .flex_container +{ +height: 100%; +overflow: hidden; +} + +#noscroll-body main, +{ + padding: 3px; + height: 100%; + overflow: auto; +} + +hr +{ + border-top-width: var(--hr-width); + border-color: var(--hr-color); + border-style: var(--hr-style); } diff --git a/index.html b/index.html index c43c7a2..588d1d2 100644 --- a/index.html +++ b/index.html @@ -1,35 +1,45 @@ - - - + + - + + Neo-Sekai Club - - + + - + +

Neo-Sekai Club

+
-
- +
+
+

Welcome to Neo-Sekai Club

+

We are a multinational, non-profit organization that advocates for the development of Free and Open + Source Software (FOSS) and the right to anonymity for software and the internet. Our ideology is based + on "The Hacker Manifesto" by Phrack. Our goal is to facilitate access to more secure options for + everyday internet use written under open source licenses that respect the end user in their entirety, + and to foster creativity among developers of all skill sets.

+
-
-

Welcome to Neo-Sekai Club

+ -

- We are a multinational, non-profit organization that advocates for the development of Free and Open Source Software (FOSS) and the right to anonymity for software and the internet. Our ideology is based on "The Hacker Manifesto" by Phrack. Our goal is to facilitate access to more secure options for everyday internet use written under open source licenses that respect the end user in their entirety, and to foster creativity among developers of all skill sets. -

-
- - - diff --git a/index_es.html b/index_es.html index 6c5032c..6a43777 100644 --- a/index_es.html +++ b/index_es.html @@ -1,35 +1,41 @@ - - - + + - + + Neo-Sekai Club - - + + - + +

Neo-Sekai Club

+
-
- +
+
+

Bienvenido a Neo-Sekai Club

+

Somos una organización multinacional, sin fines de lucro, que aboga por el desarrollo del software libre y de código abierto y por el derecho al anonimato en el software y el internet. Nuestra ideología se basa en el "The Hacker Manifesto" de Phrack. Nuestro objetivo es facilitar el acceso al software y otras alternativas seguras para el uso cotidiano del internet, priorizando que estén bajo licencias de software libre que respeten la identidad del usuario íntegramente y que fomenten la creatividad de los desarrolladores sin importar sus habilidades.

+
-
-

Bienvenido a Neo-Sekai Club

+ -

- Somos una organización multinacional, sin fines de lucro, que aboga por el desarrollo del software libre y de código abierto y por el derecho al anonimato en el software y el internet. Nuestra ideología se basa en el "The Hacker Manifesto" de Phrack. Nuestro objetivo es facilitar el acceso al software y otras alternativas seguras para el uso cotidiano del internet, priorizando que estén bajo licencias de software libre que respeten la identidad del usuario íntegramente y que fomenten la creatividad de los desarrolladores sin importar sus habilidades. -

-
- - - diff --git a/index_fil.html b/index_fil.html index 93fec00..ec6ec3e 100644 --- a/index_fil.html +++ b/index_fil.html @@ -1,37 +1,41 @@ - + - - - + + - + + Neo-Sekai Club - - + + - + +

Neo-Sekai Club

+
-
- +
+
+

Mabuhay!

+

Kami ay ang Neo-Sekai Club, isang multinational na non-profit organisasyon na nag-adbokasya sa pagbuo ng tinatawag na 'Free and Open Source Software', o tinatawag na FOSS, at ang karapatan na maging anonymous, o ang pagiging hindi kilalanin para sa software at ang Internet. Ang ating ideolohiya ay base sa librong "The Hacker Manifesto" na isinulat ni Phrack. Ang layuning namin ay ipadali ang paggamit ng mga option na nakakaprotekta sa atin para sa araw-araw na gawain sa Internet na open source na rumerespeto sa gumagamit nito, at itaguyod ang likhain ng mga software developer sa lahat ng kasanayan.

+
-
-

Mabuhay!

+ -

- Kami ay ang Neo-Sekai Club, isang multinational na non-profit organisasyon na nag-adbokasya sa pagbuo ng tinatawag na 'Free and Open Source Software', o tinatawag na FOSS, at ang karapatan na maging anonymous, o ang pagiging hindi kilalanin para sa software at ang Internet. - - Ang ating ideolohiya ay base sa librong "The Hacker Manifesto" na isinulat ni Phrack. Ang layuning namin ay ipadali ang paggamit ng mga option na nakakaprotekta sa atin para sa araw-araw na gawain sa Internet na open source na rumerespeto sa gumagamit nito, at itaguyod ang likhain ng mga software developer sa lahat ng kasanayan. -

-
- - - diff --git a/index_fr.html b/index_fr.html index 8064ddf..03ba182 100644 --- a/index_fr.html +++ b/index_fr.html @@ -1,35 +1,41 @@ - - - + + - + + Neo-Sekai Club - - + + - + +

Neo-Sekai Club

+
-
- +
+
+

Bienvenue au Neo-Sekai Club

+

Nous somme une organization multinationale, non lucrative qui plaide pour le dévéloppement de logiciel FOSS (Free and Open Source Software) et du droit à l'anonymat pour logiciels et Internet. Notre idéologie est basée sur "The Hacker Manifesto" par Phrack. Notre but est de faciliter l'accès à des options plus securisée pour une utilisation banale sur Internet, De meilleurs licences qui respectent l'utilisateur final et pour et de susciter la créativité pour des développeurs (amateur ou expert) et pour tous genre de passionés du milieu de l'informatique.

+
-
-

Bienvenue au Neo-Sekai Club

+ -

- Nous somme une organization multinationale, non lucrative qui plaide pour le dévéloppement de logiciel FOSS (Free and Open Source Software) et du droit à l'anonymat pour logiciels et Internet. Notre idéologie est basée sur "The Hacker Manifesto" par Phrack. Notre but est de faciliter l'accès à des options plus securisée pour une utilisation banale sur Internet, De meilleurs licences qui respectent l'utilisateur final et pour et de susciter la créativité pour des développeurs (amateur ou expert) et pour tous genre de passionés du milieu de l'informatique. -

-
- - - diff --git a/index_src.html b/index_src.html index 0aaff66..783c8c1 100644 --- a/index_src.html +++ b/index_src.html @@ -1,35 +1,41 @@ - + - - - + + - + + Нео-Секаи Клуб - - + + - + +

Нео-Секаи Клуб

+
-
- +
+
+

Добродошли у Нео-Секаи Клуб

+

Ми смо мултинационална, непрофитна организација која гура за развој Слободног Софтвера (FOSS) и право на анонимитет за софтвер и интернет. Наша иделогија се базира на "Манифесто Хакера" од Phrack. Наш циљ је да дозволимо већи приступ више сигурним опцијама за свакодневно коришћење интернета, развијено лиценцама које поштују крајњег корисника у потпуности, и да негујемо кретаивност програмериме и технолошки оријентисаним људима свих вештина.

+
-
-

Добродошли у Нео-Секаи Клуб

+ -

- Ми смо мултинационална, непрофитна организација која гура за развој Слободног Софтвера (FOSS) и право на анонимитет за софтвер и интернет. Наша иделогија се базира на "Манифесто Хакера" од Phrack. Наш циљ је да дозволимо већи приступ више сигурним опцијама за свакодневно коришћење интернета, развијено лиценцама које поштују крајњег корисника у потпуности, и да негујемо кретаивност програмериме и технолошки оријентисаним људима свих вештина. -

-
- - - diff --git a/index_srl.html b/index_srl.html index 059c274..2f3e04c 100644 --- a/index_srl.html +++ b/index_srl.html @@ -1,35 +1,41 @@ - + - - - + + - + + Neo-Sekai Club - - + + - + +

Neo-Sekai Club

+
-
- +
+
+

Dobrodošli u Neo-Sekai Klub

+

Mi smo multinacionalna, neprofitna organizacija koja gura za razvoj Slobodnog Softvera (FOSS) i pravo na anonimitet za softver i internet. Naša idelogija se bazira na "Manifesto Hakera" od Phrack. Naš cilj je da dozvolimo veći pristup više sigurnim opcijama za svakodnevno korišćenje interneta, razvijeno licencama koje poštuju krajnjeg korisnika u potpunosti, i da negujemo kretaivnost programerime i tehnološki orijentisanim ljudima svih veština.

+
-
-

Dobrodošli u Neo-Sekai Klub

+ -

- Mi smo multinacionalna, neprofitna organizacija koja gura za razvoj Slobodnog Softvera (FOSS) i pravo na anonimitet za softver i internet. Naša idelogija se bazira na "Manifesto Hakera" od Phrack. Naš cilj je da dozvolimo veći pristup više sigurnim opcijama za svakodnevno korišćenje interneta, razvijeno licencama koje poštuju krajnjeg korisnika u potpunosti, i da negujemo kretaivnost programerime i tehnološki orijentisanim ljudima svih veština. -

-
- - -