diff --git a/docs/index.md b/docs/index.md index 314799f36..aac26859b 100644 --- a/docs/index.md +++ b/docs/index.md @@ -1,4 +1,4 @@ -## General +# General * [About](about.md)
About Boriel BASIC SDK @@ -74,7 +74,7 @@ Boriel BASIC was designed from the base as a Retargeable Compiler, so it should it to other architectures. This is `work in progress`. See [other architectures](other_architectures.md) for more info. ## Contributing -You can issue a Pull Request to the [GitHub repository](https://github.com/boriel/zxbasic), report bugs in the forum +You can issue a Pull Request to the [GitHub repository](https://github.com/boriel-basic/zxbasic), report bugs in the forum when using the compiler, suggest new features... [![ko-fi](https://www.ko-fi.com/img/githubbutton_sm.svg)](https://ko-fi.com/H2H81J0OU) diff --git a/docs/overrides/stylesheets/extra.css b/docs/overrides/stylesheets/extra.css index dccafe9bb..166c3ec81 100644 --- a/docs/overrides/stylesheets/extra.css +++ b/docs/overrides/stylesheets/extra.css @@ -1,19 +1,9 @@ -/* Import Sinclair Logo font */ -/*@font-face {*/ -/* font-family: 'Sinclair Logo';*/ -/* src: url('../fonts/sinclair-logo.otf.woff2') format('woff2');*/ -/* font-weight: normal;*/ -/* font-style: normal;*/ -/*}*/ - -/* Apply Sinclair Logo font to the main header */ /* Light mode - very light yellow header */ [data-md-color-scheme="default"] .md-header { background-color: #d0d6da; /* Very light yellow background color */ height: 4rem; } - [data-md-color-scheme="default"] .md-header__title { color: #23231c; padding-left: 2rem; @@ -38,11 +28,51 @@ font-family: 'Press Start 2P', cursive; } -/* Ensure the site name maintains its size */ +/* Make the site name responsive */ .md-header__title .md-header__ellipsis { font-size: 1.2rem; } +/* Responsive adjustments for smaller screens */ +@media screen and (max-width: 768px) { + [data-md-color-scheme="default"] .md-header { + height: 3.5rem; + } + + [data-md-color-scheme="slate"] .md-header { + height: 3.5rem; + } + + [data-md-color-scheme="default"] .md-header__title { + padding-left: 3.0rem; + } + + [data-md-color-scheme="slate"] .md-header__title { + padding-left: 3.0rem; + } + + .md-header__title .md-header__ellipsis { + font-size: 1rem; + } + + .md-header__inner { + display: flex; + } + + .md-header__button { + margin: 0; + padding: 0.5rem; + } + + .md-header__button[for="__drawer"] { + order: 3; + } + + label[for="__search"] { + order: 2; + } +} + .md-header__inner { background-image: url('../img/zxbasic_logo.png'); background-repeat: no-repeat; @@ -51,6 +81,45 @@ height: 100%; } +@media screen and (max-width: 480px) { + [data-md-color-scheme="default"] .md-header { + height: 3rem; + } + + [data-md-color-scheme="slate"] .md-header { + height: 3rem; + } + + [data-md-color-scheme="default"] .md-header__title { + padding-left: 48px; + } + + [data-md-color-scheme="slate"] .md-header__title { + padding-left: 48px; + } + + .md-header__title .md-header__ellipsis { + font-size: 0.8rem; + } + + .md-header__inner { + display: flex; + } + + .md-header__button { + margin: 0; + padding: 2px; + } + + .md-header__button[for="__drawer"] { + order: 3; /* Ponlo al final (tras tema y búsqueda) */ + } + + label[for="__search"] { + order: 2; + } +} + /*!* Make the logo size 100% of the header *!*/ .md-header__button.md-logo { color: #ff000000;