diff options
| -rw-r--r-- | .gitignore | 1 | ||||
| -rw-r--r-- | LICENSE | 429 | ||||
| -rw-r--r-- | Makefile | 17 | ||||
| -rw-r--r-- | README.md | 15 | ||||
| -rw-r--r-- | carbslinux.css | 243 | ||||
| -rw-r--r-- | html/navbar.html | 14 | ||||
| -rw-r--r-- | sass/bar.scss | 123 | ||||
| -rw-r--r-- | sass/carbslinux.scss | 8 | ||||
| -rw-r--r-- | sass/code.scss | 15 | ||||
| -rw-r--r-- | sass/colors.scss | 68 | ||||
| -rw-r--r-- | sass/sitestyle.scss | 118 |
11 files changed, 1051 insertions, 0 deletions
diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..0d31019 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +.sass-cache/ @@ -0,0 +1,429 @@ +Copyright (c) 2019-2021 Cem Keylan <cem@ckyln.com> + +Attribution-ShareAlike 4.0 International + +======================================================================= + +Creative Commons Corporation ("Creative Commons") is not a law firm and +does not provide legal services or legal advice. Distribution of +Creative Commons public licenses does not create a lawyer-client or +other relationship. Creative Commons makes its licenses and related +information available on an "as-is" basis. Creative Commons gives no +warranties regarding its licenses, any material licensed under their +terms and conditions, or any related information. Creative Commons +disclaims all liability for damages resulting from their use to the +fullest extent possible. + +Using Creative Commons Public Licenses + +Creative Commons public licenses provide a standard set of terms and +conditions that creators and other rights holders may use to share +original works of authorship and other material subject to copyright +and certain other rights specified in the public license below. The +following considerations are for informational purposes only, are not +exhaustive, and do not form part of our licenses. + + Considerations for licensors: Our public licenses are + intended for use by those authorized to give the public + permission to use material in ways otherwise restricted by + copyright and certain other rights. Our licenses are + irrevocable. Licensors should read and understand the terms + and conditions of the license they choose before applying it. + Licensors should also secure all rights necessary before + applying our licenses so that the public can reuse the + material as expected. Licensors should clearly mark any + material not subject to the license. This includes other CC- + licensed material, or material used under an exception or + limitation to copyright. More considerations for licensors: + wiki.creativecommons.org/Considerations_for_licensors + + Considerations for the public: By using one of our public + licenses, a licensor grants the public permission to use the + licensed material under specified terms and conditions. If + the licensor's permission is not necessary for any reason--for + example, because of any applicable exception or limitation to + copyright--then that use is not regulated by the license. Our + licenses grant only permissions under copyright and certain + other rights that a licensor has authority to grant. Use of + the licensed material may still be restricted for other + reasons, including because others have copyright or other + rights in the material. A licensor may make special requests, + such as asking that all changes be marked or described. + Although not required by our licenses, you are encouraged to + respect those requests where reasonable. More considerations + for the public: + wiki.creativecommons.org/Considerations_for_licensees + +======================================================================= + +Creative Commons Attribution-ShareAlike 4.0 International Public +License + +By exercising the Licensed Rights (defined below), You accept and agree +to be bound by the terms and conditions of this Creative Commons +Attribution-ShareAlike 4.0 International Public License ("Public +License"). To the extent this Public License may be interpreted as a +contract, You are granted the Licensed Rights in consideration of Your +acceptance of these terms and conditions, and the Licensor grants You +such rights in consideration of benefits the Licensor receives from +making the Licensed Material available under these terms and +conditions. + + +Section 1 -- Definitions. + + a. Adapted Material means material subject to Copyright and Similar + Rights that is derived from or based upon the Licensed Material + and in which the Licensed Material is translated, altered, + arranged, transformed, or otherwise modified in a manner requiring + permission under the Copyright and Similar Rights held by the + Licensor. For purposes of this Public License, where the Licensed + Material is a musical work, performance, or sound recording, + Adapted Material is always produced where the Licensed Material is + synched in timed relation with a moving image. + + b. Adapter's License means the license You apply to Your Copyright + and Similar Rights in Your contributions to Adapted Material in + accordance with the terms and conditions of this Public License. + + c. BY-SA Compatible License means a license listed at + creativecommons.org/compatiblelicenses, approved by Creative + Commons as essentially the equivalent of this Public License. + + d. Copyright and Similar Rights means copyright and/or similar rights + closely related to copyright including, without limitation, + performance, broadcast, sound recording, and Sui Generis Database + Rights, without regard to how the rights are labeled or + categorized. For purposes of this Public License, the rights + specified in Section 2(b)(1)-(2) are not Copyright and Similar + Rights. + + e. Effective Technological Measures means those measures that, in the + absence of proper authority, may not be circumvented under laws + fulfilling obligations under Article 11 of the WIPO Copyright + Treaty adopted on December 20, 1996, and/or similar international + agreements. + + f. Exceptions and Limitations means fair use, fair dealing, and/or + any other exception or limitation to Copyright and Similar Rights + that applies to Your use of the Licensed Material. + + g. License Elements means the license attributes listed in the name + of a Creative Commons Public License. The License Elements of this + Public License are Attribution and ShareAlike. + + h. Licensed Material means the artistic or literary work, database, + or other material to which the Licensor applied this Public + License. + + i. Licensed Rights means the rights granted to You subject to the + terms and conditions of this Public License, which are limited to + all Copyright and Similar Rights that apply to Your use of the + Licensed Material and that the Licensor has authority to license. + + j. Licensor means the individual(s) or entity(ies) granting rights + under this Public License. + + k. Share means to provide material to the public by any means or + process that requires permission under the Licensed Rights, such + as reproduction, public display, public performance, distribution, + dissemination, communication, or importation, and to make material + available to the public including in ways that members of the + public may access the material from a place and at a time + individually chosen by them. + + l. Sui Generis Database Rights means rights other than copyright + resulting from Directive 96/9/EC of the European Parliament and of + the Council of 11 March 1996 on the legal protection of databases, + as amended and/or succeeded, as well as other essentially + equivalent rights anywhere in the world. + + m. You means the individual or entity exercising the Licensed Rights + under this Public License. Your has a corresponding meaning. + + +Section 2 -- Scope. + + a. License grant. + + 1. Subject to the terms and conditions of this Public License, + the Licensor hereby grants You a worldwide, royalty-free, + non-sublicensable, non-exclusive, irrevocable license to + exercise the Licensed Rights in the Licensed Material to: + + a. reproduce and Share the Licensed Material, in whole or + in part; and + + b. produce, reproduce, and Share Adapted Material. + + 2. Exceptions and Limitations. For the avoidance of doubt, where + Exceptions and Limitations apply to Your use, this Public + License does not apply, and You do not need to comply with + its terms and conditions. + + 3. Term. The term of this Public License is specified in Section + 6(a). + + 4. Media and formats; technical modifications allowed. The + Licensor authorizes You to exercise the Licensed Rights in + all media and formats whether now known or hereafter created, + and to make technical modifications necessary to do so. The + Licensor waives and/or agrees not to assert any right or + authority to forbid You from making technical modifications + necessary to exercise the Licensed Rights, including + technical modifications necessary to circumvent Effective + Technological Measures. For purposes of this Public License, + simply making modifications authorized by this Section 2(a) + (4) never produces Adapted Material. + + 5. Downstream recipients. + + a. Offer from the Licensor -- Licensed Material. Every + recipient of the Licensed Material automatically + receives an offer from the Licensor to exercise the + Licensed Rights under the terms and conditions of this + Public License. + + b. Additional offer from the Licensor -- Adapted Material. + Every recipient of Adapted Material from You + automatically receives an offer from the Licensor to + exercise the Licensed Rights in the Adapted Material + under the conditions of the Adapter's License You apply. + + c. No downstream restrictions. You may not offer or impose + any additional or different terms or conditions on, or + apply any Effective Technological Measures to, the + Licensed Material if doing so restricts exercise of the + Licensed Rights by any recipient of the Licensed + Material. + + 6. No endorsement. Nothing in this Public License constitutes or + may be construed as permission to assert or imply that You + are, or that Your use of the Licensed Material is, connected + with, or sponsored, endorsed, or granted official status by, + the Licensor or others designated to receive attribution as + provided in Section 3(a)(1)(A)(i). + + b. Other rights. + + 1. Moral rights, such as the right of integrity, are not + licensed under this Public License, nor are publicity, + privacy, and/or other similar personality rights; however, to + the extent possible, the Licensor waives and/or agrees not to + assert any such rights held by the Licensor to the limited + extent necessary to allow You to exercise the Licensed + Rights, but not otherwise. + + 2. Patent and trademark rights are not licensed under this + Public License. + + 3. To the extent possible, the Licensor waives any right to + collect royalties from You for the exercise of the Licensed + Rights, whether directly or through a collecting society + under any voluntary or waivable statutory or compulsory + licensing scheme. In all other cases the Licensor expressly + reserves any right to collect such royalties. + + +Section 3 -- License Conditions. + +Your exercise of the Licensed Rights is expressly made subject to the +following conditions. + + a. Attribution. + + 1. If You Share the Licensed Material (including in modified + form), You must: + + a. retain the following if it is supplied by the Licensor + with the Licensed Material: + + i. identification of the creator(s) of the Licensed + Material and any others designated to receive + attribution, in any reasonable manner requested by + the Licensor (including by pseudonym if + designated); + + ii. a copyright notice; + + iii. a notice that refers to this Public License; + + iv. a notice that refers to the disclaimer of + warranties; + + v. a URI or hyperlink to the Licensed Material to the + extent reasonably practicable; + + b. indicate if You modified the Licensed Material and + retain an indication of any previous modifications; and + + c. indicate the Licensed Material is licensed under this + Public License, and include the text of, or the URI or + hyperlink to, this Public License. + + 2. You may satisfy the conditions in Section 3(a)(1) in any + reasonable manner based on the medium, means, and context in + which You Share the Licensed Material. For example, it may be + reasonable to satisfy the conditions by providing a URI or + hyperlink to a resource that includes the required + information. + + 3. If requested by the Licensor, You must remove any of the + information required by Section 3(a)(1)(A) to the extent + reasonably practicable. + + b. ShareAlike. + + In addition to the conditions in Section 3(a), if You Share + Adapted Material You produce, the following conditions also apply. + + 1. The Adapter's License You apply must be a Creative Commons + license with the same License Elements, this version or + later, or a BY-SA Compatible License. + + 2. You must include the text of, or the URI or hyperlink to, the + Adapter's License You apply. You may satisfy this condition + in any reasonable manner based on the medium, means, and + context in which You Share Adapted Material. + + 3. You may not offer or impose any additional or different terms + or conditions on, or apply any Effective Technological + Measures to, Adapted Material that restrict exercise of the + rights granted under the Adapter's License You apply. + + +Section 4 -- Sui Generis Database Rights. + +Where the Licensed Rights include Sui Generis Database Rights that +apply to Your use of the Licensed Material: + + a. for the avoidance of doubt, Section 2(a)(1) grants You the right + to extract, reuse, reproduce, and Share all or a substantial + portion of the contents of the database; + + b. if You include all or a substantial portion of the database + contents in a database in which You have Sui Generis Database + Rights, then the database in which You have Sui Generis Database + Rights (but not its individual contents) is Adapted Material, + + including for purposes of Section 3(b); and + c. You must comply with the conditions in Section 3(a) if You Share + all or a substantial portion of the contents of the database. + +For the avoidance of doubt, this Section 4 supplements and does not +replace Your obligations under this Public License where the Licensed +Rights include other Copyright and Similar Rights. + + +Section 5 -- Disclaimer of Warranties and Limitation of Liability. + + a. UNLESS OTHERWISE SEPARATELY UNDERTAKEN BY THE LICENSOR, TO THE + EXTENT POSSIBLE, THE LICENSOR OFFERS THE LICENSED MATERIAL AS-IS + AND AS-AVAILABLE, AND MAKES NO REPRESENTATIONS OR WARRANTIES OF + ANY KIND CONCERNING THE LICENSED MATERIAL, WHETHER EXPRESS, + IMPLIED, STATUTORY, OR OTHER. THIS INCLUDES, WITHOUT LIMITATION, + WARRANTIES OF TITLE, MERCHANTABILITY, FITNESS FOR A PARTICULAR + PURPOSE, NON-INFRINGEMENT, ABSENCE OF LATENT OR OTHER DEFECTS, + ACCURACY, OR THE PRESENCE OR ABSENCE OF ERRORS, WHETHER OR NOT + KNOWN OR DISCOVERABLE. WHERE DISCLAIMERS OF WARRANTIES ARE NOT + ALLOWED IN FULL OR IN PART, THIS DISCLAIMER MAY NOT APPLY TO YOU. + + b. TO THE EXTENT POSSIBLE, IN NO EVENT WILL THE LICENSOR BE LIABLE + TO YOU ON ANY LEGAL THEORY (INCLUDING, WITHOUT LIMITATION, + NEGLIGENCE) OR OTHERWISE FOR ANY DIRECT, SPECIAL, INDIRECT, + INCIDENTAL, CONSEQUENTIAL, PUNITIVE, EXEMPLARY, OR OTHER LOSSES, + COSTS, EXPENSES, OR DAMAGES ARISING OUT OF THIS PUBLIC LICENSE OR + USE OF THE LICENSED MATERIAL, EVEN IF THE LICENSOR HAS BEEN + ADVISED OF THE POSSIBILITY OF SUCH LOSSES, COSTS, EXPENSES, OR + DAMAGES. WHERE A LIMITATION OF LIABILITY IS NOT ALLOWED IN FULL OR + IN PART, THIS LIMITATION MAY NOT APPLY TO YOU. + + c. The disclaimer of warranties and limitation of liability provided + above shall be interpreted in a manner that, to the extent + possible, most closely approximates an absolute disclaimer and + waiver of all liability. + + +Section 6 -- Term and Termination. + + a. This Public License applies for the term of the Copyright and + Similar Rights licensed here. However, if You fail to comply with + this Public License, then Your rights under this Public License + terminate automatically. + + b. Where Your right to use the Licensed Material has terminated under + Section 6(a), it reinstates: + + 1. automatically as of the date the violation is cured, provided + it is cured within 30 days of Your discovery of the + violation; or + + 2. upon express reinstatement by the Licensor. + + For the avoidance of doubt, this Section 6(b) does not affect any + right the Licensor may have to seek remedies for Your violations + of this Public License. + + c. For the avoidance of doubt, the Licensor may also offer the + Licensed Material under separate terms or conditions or stop + distributing the Licensed Material at any time; however, doing so + will not terminate this Public License. + + d. Sections 1, 5, 6, 7, and 8 survive termination of this Public + License. + + +Section 7 -- Other Terms and Conditions. + + a. The Licensor shall not be bound by any additional or different + terms or conditions communicated by You unless expressly agreed. + + b. Any arrangements, understandings, or agreements regarding the + Licensed Material not stated herein are separate from and + independent of the terms and conditions of this Public License. + + +Section 8 -- Interpretation. + + a. For the avoidance of doubt, this Public License does not, and + shall not be interpreted to, reduce, limit, restrict, or impose + conditions on any use of the Licensed Material that could lawfully + be made without permission under this Public License. + + b. To the extent possible, if any provision of this Public License is + deemed unenforceable, it shall be automatically reformed to the + minimum extent necessary to make it enforceable. If the provision + cannot be reformed, it shall be severed from this Public License + without affecting the enforceability of the remaining terms and + conditions. + + c. No term or condition of this Public License will be waived and no + failure to comply consented to unless expressly agreed to by the + Licensor. + + d. Nothing in this Public License constitutes or may be interpreted + as a limitation upon, or waiver of, any privileges and immunities + that apply to the Licensor or You, including from the legal + processes of any jurisdiction or authority. + + +======================================================================= + +Creative Commons is not a party to its public +licenses. Notwithstanding, Creative Commons may elect to apply one of +its public licenses to material it publishes and in those instances +will be considered the “Licensor.” The text of the Creative Commons +public licenses is dedicated to the public domain under the CC0 Public +Domain Dedication. Except for the limited purpose of indicating that +material is shared under a Creative Commons public license or as +otherwise permitted by the Creative Commons policies published at +creativecommons.org/policies, Creative Commons does not authorize the +use of the trademark "Creative Commons" or any other trademark or logo +of Creative Commons without its prior written consent including, +without limitation, in connection with any unauthorized modifications +to any of its public licenses or any other arrangements, +understandings, or agreements concerning use of licensed material. For +the avoidance of doubt, this paragraph does not form part of the +public licenses. + +Creative Commons may be contacted at creativecommons.org. diff --git a/Makefile b/Makefile new file mode 100644 index 0000000..5bb3496 --- /dev/null +++ b/Makefile @@ -0,0 +1,17 @@ +SASS = sassc + +SITE_SASS = sass/carbslinux.scss \ + sass/colors.scss \ + sass/sitestyle.scss \ + sass/bar.scss \ + sass/code.scss + +all: carbslinux.css + +carbslinux.css: ${SITE_SASS} + ${SASS} -Isass sass/carbslinux.scss $@ + +clean: + rm -f carbslinux.css + +.PHONY: all clean diff --git a/README.md b/README.md new file mode 100644 index 0000000..7d9f0ce --- /dev/null +++ b/README.md @@ -0,0 +1,15 @@ +Common style for Carbs Linux projects +===================================== + +This is an ongoing style project for sharing certain elements in-between +projects. This currently includes only the stylesheet for the website, but +others will be added for both `stagit` and GNU Texinfo manuals. + + +Build +----- + +Building the stylesheet requires `sassc`, which is packaged in Carbs Linux +repositories. However, the generated stylesheets are also tracked in the +repository, so there is no need to rebuild them unless you edit the `scss` +files. You can run `make` after a change to rebuild these files. diff --git a/carbslinux.css b/carbslinux.css new file mode 100644 index 0000000..d35af15 --- /dev/null +++ b/carbslinux.css @@ -0,0 +1,243 @@ +/* + * Stylesheet for Carbs Linux website + * Copyright (c) 2019-2021 Cem Keylan + */ +:root { + --color-carbs-color-bg: #F3F6F8; + --color-carbs-color-fg: #0A1E2B; + --color-carbs-highlight: #E9ECEE; + --color-carbs-pink: #BF6790; + --color-carbs-purple: #8C45D4; + --color-carbs-blue: #3F74A6; + --color-carbs-blue-alt: #3F41A6; + --color-carbs-red: #D32C2C; + --color-carbs-grey: #738B8B; + --color-carbs-green: #027A59; + --color-carbs-orange: #B45123; } + @media (prefers-color-scheme: dark) { + :root { + --color-carbs-color-bg: #0A1E2B; + --color-carbs-color-fg: #F3F6F8; + --color-carbs-highlight: #0A2830; + --color-carbs-pink: #BF6790; + --color-carbs-purple: #A6A6D2; + --color-carbs-blue: #6790BF; + --color-carbs-blue-alt: #67BCBF; + --color-carbs-red: #C34266; + --color-carbs-grey: #686868; + --color-carbs-green: #67BF96; + --color-carbs-orange: #F47A00; } } +body { + margin: 0; + background-color: var(--color-carbs-color-bg); + font-family: "Noto Sans", "Open Sans", sans-serif; + font-size: 16px; + color: var(--color-carbs-color-fg); + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; + -ms-overflow-style: scrollbar; + -webkit-tap-highlight-color: transparent; } + +/* Reasonable line-height for better readability. */ +p, pre, li, dt, dd, table, code, address { + line-height: 1.5em; } + +p { + margin-top: 1em; + margin-bottom: 1em; } + +#content { + width: 95%; + margin: 0 auto; + margin-left: auto; + margin-right: auto; + text-align: left; + max-width: 50em; } + +.subtitle { + color: var(--color-carbs-color-fg); + font-weight: normal; + font-size: 16px; + font-style: italic; } + +code, pre.src { + padding: .2em .4em; + margin: 0; + font-size: 85%; } + +code { + background-color: var(--color-carbs-highlight); + border-radius: 3px; } + +h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { + color: inherit; } + h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { + text-decoration: none; } + +h1 { + color: var(--color-carbs-pink); + font-weight: 800; } + h1 a:hover { + color: #bf6a67; } + @media (prefers-color-scheme: dark) { + h1 a:hover { + color: #bf6a67; } } +h2 { + color: var(--color-carbs-blue); + font-weight: 700; } + h2 a:hover { + color: var(--color-carbs-purple); } + +h3 { + color: var(--color-carbs-color-fg); + font-weight: 600; } + h3 a:hover { + color: var(--color-carbs-blue); } + +pre { + font: monospace; + border-radius: 3px; + border: 1px solid var(--color-carbs-highlight); + background-color: var(--color-carbs-highlight); + padding: 0.5em; + margin: 1em; } + pre code, pre.src { + display: block; + overflow: auto; } + pre code { + background: transparent; } + +a { + text-decoration: none; + font-weight: bold; + color: var(--color-carbs-pink); } + +a:hover { + text-decoration: underline; + color: var(--color-carbs-blue-alt); } + +blockquote { + border-left: 1px solid var(--color-carbs-highlight); + font-style: italic; } + +#preamble { + margin-bottom: 2em; } + +#navbar { + background: #0A1E2B none repeat scroll 0 0 !important; + border-bottom: 5px solid #BF6790 !important; + min-height: 40px; + padding: 10px 15px !important; } + #navbar label, #navbar #hamburger { + display: none; } + #navbar a.navbartitle { + margin: 0 !important; + padding: 0 !important; + color: #BF6790 !important; + float: left !important; + font-weight: bolder !important; + font-size: 200% !important; } + #navbar a.navbartitle:hover { + text-decoration: none; + color: #BF6790; } + #navbar #navbarlist li a { + color: #F3F6F8; + font-weight: bold; + text-decoration: none; } + #navbar ul { + display: block; + list-style: none; + margin: 0; + padding: 0; + text-align: right; + font-size: 0; + letter-spacing: 0; } + #navbar ul li { + display: inline-block; + font-size: 14px; + font-family: "Noto Sans", "Open Sans", sans-serif !important; + line-height: 1.4; + letter-spacing: 0; + padding-top: 14px; + padding-right: 15px; + padding-left: 15px; + margin: 0; } + #navbar ul li a:hover { + color: #A6A6D2 !important; + text-decoration: none !important; } + +@media screen and (max-width: 768px) { + #navbar label { + display: inline-block; + box-sizing: border-box; + color: #F3F6F8; + background: #BF6790; + border-radius: 0.2em; + font-style: normal; + text-align: center; + margin-right: auto; + margin-left: auto; + font-size: 1em; + padding: 0.5em 0; + font-size: 1em; + width: 2.2em; + height: 100%; + float: right; } + #navbar ul { + margin-left: 0; + margin-right: 0; + text-align: left; } + #navbar #navbarlist { + margin-top: 50px; + display: none; } + #navbar #navbarlist li { + box-sizing: border-box; + border-top: 1px solid var(--color-carbs-purple); + display: block; + width: 100%; + padding: 0.5em; } + #navbar input:checked ~ #navbarlist { + display: block; } } + +footer { + clear: both; + margin-top: 2em; + background: #0A1E2B none repeat scroll 0 0 !important; + border-top: 5px solid #BF6790 !important; + padding: 10px 15px !important; + bottom: 0; } + footer p { + text-align: center; + color: #F3F6F8; } + +/* Syntax highlighting for org-mode source block exports */ +.org-comment, .org-comment-delimiter { + color: var(--color-carbs-grey); + font-style: italic; } + +.org-builtin { + color: var(--color-carbs-blue); } + +.org-constant { + color: var(--color-carbs-pink); } + +.org-doc { + color: var(--color-carbs-grey); } + +.org-function-name { + color: var(--color-carbs-blue); } + +.org-variable-name { + color: var(--color-carbs-purple); } + +.org-keyword { + color: var(--color-carbs-blue-alt); } + +.org-string { + color: var(--color-carbs-green); } + +.org-type { + color: var(--color-carbs-orange); } + +.org-warning { + color: var(--color-carbs-red); } diff --git a/html/navbar.html b/html/navbar.html new file mode 100644 index 0000000..a822f1a --- /dev/null +++ b/html/navbar.html @@ -0,0 +1,14 @@ +<nav id="navbar"> + <a href="/" class=navbartitle>Carbs Linux</a> + + <label for="hamburger">☰</label> + <input type="checkbox" id="hamburger" /> + <ul id=navbarlist> + <li><a href="https://carbslinux.org" title="Home Page">Home</a></li> + <li><a href="https://git.carbslinux.org" title="Git Repository">Git</a></li> + <li><a href="https://carbslinux.org/download.html" title="Download Carbs Linux">Download</a></li> + <li><a href="https://carbslinux.org/blog" title="Blog Posts">Blog</a></li> + <li><a href="https://carbslinux.org/install.html" title="Installation Instructions">Installation</a></li> + <li><a href="https://carbsliinux.org/docs.html" title="Documentation">Docs</a></li> + </ul> +</nav> diff --git a/sass/bar.scss b/sass/bar.scss new file mode 100644 index 0000000..d5a217a --- /dev/null +++ b/sass/bar.scss @@ -0,0 +1,123 @@ +@import "colors.scss"; + +// Always use the dark-scheme colors for the navigation bar. +$bar-background-color: color-get('dark', 'carbs-color-bg') !default +$bar-foreground-color: color-get('dark', 'carbs-color-fg') !default; +$bar-carbs-pink: color-get('dark', 'carbs-pink') !default; + +$bar-border: 5px solid $bar-carbs-pink !default; +$bar-font-size: 14px !default; +$bar-font-text: $font-text !default; + +$bar-title-height: 40px; +$bar-title-width: 190px; + +$bar-margin: 2em; + +#preamble { margin-bottom: $bar-margin; } + +#navbar { + background: $bar-background-color none repeat scroll 0 0 !important; + border-bottom: $bar-border !important; + min-height: $bar-title-height; + padding: 10px 15px !important; + + label, #hamburger { display: none; } + + a.navbartitle { + margin: 0 !important; + padding: 0 !important; + color: $bar-carbs-pink !important; + float: left !important; + font-weight: bolder !important; + font-size: 200% !important; + &:hover { + text-decoration: none; + color: $bar-carbs-pink; + } + } + + #navbarlist li a { + color: $bar-foreground-color; + font-weight: bold; + text-decoration: none; + } + + ul { + display: block; + list-style: none; + margin: 0; + padding: 0; + text-align: right; + font-size: 0; + letter-spacing: 0; + li { + display: inline-block; + font-size: $bar-font-size; + font-family: $bar-font-text !important; + line-height: 1.4; + letter-spacing: 0; + padding-top: 14px; + padding-right: 15px; + padding-left: 15px; + margin: 0; + + a:hover { + color: color-get('dark', 'carbs-purple') !important; + text-decoration: none !important; + } + } + } +} + +@media screen and (max-width: 768px) { + #navbar { + label { + display: inline-block; + box-sizing: border-box; + color: $bar-foreground-color; + background: $bar-carbs-pink; + border-radius: 0.2em; + font-style: normal; + text-align: center; + margin-right: auto; + margin-left: auto; + font-size: 1em; + padding: 0.5em 0; + font-size: 1em; + width: 2.2em; + height: 100%; + float: right; + } + ul { + margin-left: 0; + margin-right: 0; + text-align: left; + } + #navbarlist { + margin-top: $bar-title-height + 10; + li { + box-sizing: border-box; + border-top: 1px solid $carbs-purple; + display: block; + width: 100%; + padding: 0.5em; + } + display: none; + } + input:checked ~ #navbarlist { display: block; } + } +} + +footer { + clear: both; + margin-top: $bar-margin; + background: $bar-background-color none repeat scroll 0 0 !important; + border-top: $bar-border !important; + padding: 10px 15px !important; + bottom: 0; + p { + text-align: center; + color: $bar-foreground-color; + } +} diff --git a/sass/carbslinux.scss b/sass/carbslinux.scss new file mode 100644 index 0000000..96c63dd --- /dev/null +++ b/sass/carbslinux.scss @@ -0,0 +1,8 @@ +/* + * Stylesheet for Carbs Linux website + * Copyright (c) 2019-2021 Cem Keylan + */ +@import "colors.scss"; +@import "sitestyle.scss"; +@import "bar.scss"; +@import "code.scss"; diff --git a/sass/code.scss b/sass/code.scss new file mode 100644 index 0000000..b488d88 --- /dev/null +++ b/sass/code.scss @@ -0,0 +1,15 @@ +@import "colors.scss"; + +/* Syntax highlighting for org-mode source block exports */ +.org-comment, .org-comment-delimiter { + color: $carbs-grey; font-style: italic; // font-lock-comment-face +} +.org-builtin { color: $carbs-blue; } // font-lock-builtin-face +.org-constant { color: $carbs-pink; } // font-lock-constant-face +.org-doc { color: $carbs-grey; } // font-lock-doc-face +.org-function-name { color: $carbs-blue; } // font-lock-function-name-face +.org-variable-name { color: $carbs-purple; } // font-lock-variable-name-face +.org-keyword { color: $carbs-blue-alt; } // font-lock-keyword-face +.org-string { color: $carbs-green; } // font-lock-string-face +.org-type { color: $carbs-orange; } // font-lock-type-face +.org-warning { color: $carbs-red; } // font-lock-warning-face diff --git a/sass/colors.scss b/sass/colors.scss new file mode 100644 index 0000000..dc4eff9 --- /dev/null +++ b/sass/colors.scss @@ -0,0 +1,68 @@ +$colors: ( + light: ( + carbs-color-bg: #F3F6F8, + carbs-color-fg: #0A1E2B, + carbs-highlight: #E9ECEE, + carbs-pink: #BF6790, + carbs-purple: #8C45D4, + carbs-blue: #3F74A6, + carbs-blue-alt: #3F41A6, + carbs-red: #D32C2C, + carbs-grey: #738B8B, + carbs-green: #027A59, + carbs-orange: #B45123, + ), + dark: ( + carbs-color-bg: #0A1E2B, + carbs-color-fg: #F3F6F8, + carbs-highlight: #0A2830, + carbs-pink: #BF6790, + carbs-purple: #A6A6D2, + carbs-blue: #6790BF, + carbs-blue-alt: #67BCBF, + carbs-red: #C34266, + carbs-grey: #686868, + carbs-green: #67BF96, + carbs-orange: #F47A00, + ), +); + +@function compose-color-variable($color-key) { + @return '--color-#{$color-key}'; +} + +@function color-get($theme, $color) { + $result: #{map-get(map-get($colors, $theme), $color)}; + @if $result != "" { + @return $result; + } + @else { @error "Unknown theme/color combination: '#{$theme}' '#{$color}'" } +} + +@mixin theme-adjust-hue($key, $color-name, $light-hue, $dark-hue: $light-hue) { + #{$key}: #{adjust-hue(map-get(map-get($colors, 'light'), $color-name), $light-hue)}; + @at-root @media (prefers-color-scheme: dark) { + & { + #{$key}: #{adjust-hue(map-get(map-get($colors, 'dark'), $color-name), $dark-hue)}; + } + } +} + +$carbs-color-fg: var(--color-carbs-color-fg) !default; +$carbs-color-bg: var(--color-carbs-color-bg) !default; +$carbs-highlight: var(--color-carbs-highlight) !default; +$carbs-pink: var(--color-carbs-pink) !default; +$carbs-purple: var(--color-carbs-purple) !default; +$carbs-blue: var(--color-carbs-blue) !default; +$carbs-blue-alt: var(--color-carbs-blue-alt) !default; +$carbs-red: var(--color-carbs-red) !default; +$carbs-grey: var(--color-carbs-grey) !default; +$carbs-green: var(--color-carbs-green) !default; +$carbs-orange: var(--color-carbs-orange) !default; + +$font-size: 16px; + +$font-text: 'Noto Sans', 'Open Sans', sans-serif; +$primary: $carbs-pink; +$link: $carbs-pink; +$link-alt: $carbs-blue-alt; diff --git a/sass/sitestyle.scss b/sass/sitestyle.scss new file mode 100644 index 0000000..f3e2f09 --- /dev/null +++ b/sass/sitestyle.scss @@ -0,0 +1,118 @@ +@import "colors.scss"; + +// Generate light-scheme and dark-scheme colors from the '$colors' list +:root { + @each $key, $value in map-get($colors, 'light') { + #{compose-color-variable($key)}: #{$value}; + } + @at-root @media (prefers-color-scheme: dark) { + & { + @each $key, $value in map-get($colors, 'dark') { + #{compose-color-variable($key)}: #{$value}; + } + + } + } +} + +body { + margin: 0; + background-color: $carbs-color-bg; + font-family: $font-text; + font-size: $font-size; + color: $carbs-color-fg; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; + -ms-overflow-style: scrollbar; + -webkit-tap-highlight-color: transparent; +} + +/* Reasonable line-height for better readability. */ +p, pre, li, dt, dd, table, code, address { line-height: 1.5em; } + +p { + margin-top: 1em; + margin-bottom: 1em; +} + +#content { + width: 95%; + margin: 0 auto; + margin-left: auto; + margin-right: auto; + text-align: left; + max-width: 50em; +} + +.subtitle { + color: $carbs-color-fg; + font-weight: normal; + font-size: $font-size; + font-style: italic; +} + +code, pre.src { + padding: .2em .4em; + margin: 0; + font-size: 85%; +} + +code { + background-color: $carbs-highlight; + border-radius: 3px; +} + +h1, h2, h3, h4, h5, h6 { + a { + color: inherit; + &:hover { text-decoration: none ;} + } +} + +h1 { + color: $carbs-pink; + font-weight: 800; + a:hover { @include theme-adjust-hue(color, carbs-pink, 30deg) ;} +} + +h2 { + color: $carbs-blue; + font-weight: 700; + a:hover { color: $carbs-purple; } +} + +h3 { + color: $carbs-color-fg; + font-weight: 600; + a:hover { color: $carbs-blue; } +} + +pre { + font: monospace; + border-radius: 3px; + border: 1px solid $carbs-highlight; + background-color: $carbs-highlight; + padding: 0.5em; + margin: 1em; + code, &.src { + display: block; + overflow: auto; + } + code { background: transparent; } +} + +a { + text-decoration: none; + font-weight: bold; + color: $link; +} + +a:hover { + text-decoration: underline; + color: $link-alt; +} + +blockquote { + border-left: 1px solid $carbs-highlight; + font-style: italic; +} |