diff --git a/docs/components/cover.md b/docs/components/cover.md index 1c1f92b4a6..8b109c061e 100644 --- a/docs/components/cover.md +++ b/docs/components/cover.md @@ -1,11 +1,12 @@ - +> ## Contribute to freeCodeCamp.org -#  +## This community is possible thanks to thousands of kind volunteers like you. -# Contribute to the freeCodeCamp.org +## Here are some quick and fun ways you can help the community. -> This community is possible thanks to thousands of kind volunteers like you. +-
[Help by answering coding questions](https://www.freecodecamp.org/forum/?max_posts=1) on our community forum. +- [Give feedback on coding projects](https://www.freecodecamp.org/forum/c/project-feedback?max_posts=1) built by campers. +- [Help us add subtitles (closed captions)](https://www.youtube.com/freecodecamp) to our YouTube channel videos. +- [Contribute to our open source codebase](#contribute-to-our-open-source-codebase) on GitHub. -[Start contributing](/readme) - - \ No newline at end of file +[Read our contributing guidelines](/index.md) diff --git a/docs/components/sidebar.md b/docs/components/sidebar.md index b8f18c9554..f4a9dfdc7b 100644 --- a/docs/components/sidebar.md +++ b/docs/components/sidebar.md @@ -1,19 +1,19 @@ -- **Overview** -- [Introduction](/ 'Contribute to the freeCodeCamp.org Community') -- **Code Contribution Guides** -- [How to work on coding challenges](/how-to-work-on-coding-challenges) -- [How to setup freeCodeCamp locally](/how-to-setup-freecodecamp-locally) -- [How to open a pull request](/how-to-open-a-pull-request) -- [How to work on the news theme](/how-to-work-on-the-news-theme) -- [How to work on the docs theme](/how-to-work-on-the-docs-theme) -- **DevOps Guides** -- [Overview and Workflows](/devops.md) -- **Flight Manuals (for Staff & Mods)** -- [01 - List Virtual Machines](/flight-manuals/01-getting-list-of-virtual-machines.md) -- [02 - Provision API Instances](/flight-manuals/02-spinning-api-instances.md) -- [02 - Using Reply Templates](/flight-manuals/03-using-reply-templates.md) +- ** Getting Started** + - [Introduction](/index.md 'Contribute to the freeCodeCamp.org Community') +- ** Code Contribution Guides** + - [How to work on coding challenges](/how-to-work-on-coding-challenges) + - [How to setup freeCodeCamp locally](/how-to-setup-freecodecamp-locally) + - [How to open a pull request](/how-to-open-a-pull-request) + - [How to work on the news theme](/how-to-work-on-the-news-theme) + - [How to work on the docs theme](/how-to-work-on-the-docs-theme) +- ** DevOps Guides** + - [How we build, test and deploy](/devops.md) +- ** Flight Manuals (for Staff & Mods)** + - [01 - List Virtual Machines](/flight-manuals/01-getting-list-of-virtual-machines.md) + - [02 - Provision API Instances](/flight-manuals/02-spinning-api-instances.md) + - [02 - Using Reply Templates](/flight-manuals/03-using-reply-templates.md) ---- -- **Community** -- [GitHub Repository](https://github.com/freecodecamp/freecodecamp) -- [Contributors category on Forum](https://freecodecamp.org/forum/c/contributors) -- [Chat room for Contributors](https://gitter.im/FreeCodeCamp/Contributors) +- ** Our Community** + - [** GitHub Repository**](https://github.com/freecodecamp/freecodecamp) + - [** Contributors category on Forum**](https://freecodecamp.org/forum/c/contributors) + - [** Contributors chat room on Gitter**](https://gitter.im/FreeCodeCamp/Contributors) diff --git a/docs/components/theme.css b/docs/components/theme.css index 7abc03f6a9..ecde986f1e 100644 --- a/docs/components/theme.css +++ b/docs/components/theme.css @@ -9,22 +9,14 @@ body { font-size: 100%; - line-height: 1.5; - color: var(--text-color-base); + line-height: 2em; + color: var(--text-color); } * { text-decoration: none !important; } -a { - transition: all 0.3s linear; -} - -.github-corner { - z-index: 5; -} - /****** Universal Nav ****/ .universal-nav { @@ -52,26 +44,14 @@ a { margin-right: 0px; } -.sidebar-toggle, -.sidebar, -.content { - margin-top: 38px; -} - -.sidebar { - padding: 0px; -} - /****** Cover Page ******/ + section.cover { - padding-bottom: 112px; /* fixed footer (Netflix) height */ + padding-bottom: 112px; height: auto; min-height: 100vh; - /** - * Intended to defeat this inline style on initial boot that flashes when on page load: - * https://github.com/docsifyjs/docsify/blob/8352a1e489abc2a7b6361fe02d696e1891a031cd/src/core/render/tpl.js#L56-L70 - */ - background: #fff !important; + background: #ffffff !important; + color: var(--theme-color); } section.cover .cover-main { @@ -93,24 +73,53 @@ section.cover h1 { section.cover blockquote, section.cover blockquote p { - margin: 0; + margin: 1.5em 0; +} + +section.cover a { + text-decoration: none; + border-bottom: 0.01rem solid var(--theme-color); + transition: all 0.3s ease; +} + +section.cover a:hover { + border-color: var(--theme-color-dark); + color: var(--theme-color-dark); +} + +section.cover a.anchor { + border: none; +} + +.cover-icon { + margin-right: 0.75em; } section.cover ul { - font-size: 1.25rem; + font-size: 1.5rem; line-height: 2rem; display: grid; text-align: left; grid-column-gap: 16px; grid-row-gap: 20px; - grid-template-columns: repeat(2, 50%); list-style: none; max-width: unset; margin: 1.5em 0; } -section.cover ul li { - white-space: nowrap; +section.cover .cover-main > p:last-child a:last-child { + font-size: 1.5rem; + line-height: 2rem; + background-color: var(--theme-color); + color: #fff; +} + +section.cover .cover-main > p:last-child a:last-child:hover { + font-size: 1.5rem; + line-height: 2rem; + background-color: var(--theme-color-dark); + color: #fff; + opacity: 1; } section.cover.show ~ .sidebar, @@ -118,88 +127,6 @@ section.cover.show ~ .sidebar-toggle { display: none; } -.cover-main .netflix-logo { - position: fixed; - display: flex; - align-items: center; - background: #ffffff; - bottom: 0; - left: 0; - width: 100%; - padding: 40px; - z-index: 5; -} - -.cover-main .netflix-logo .logo { - width: 125px; - height: 32px; - background: url('images/Netflix_Logo.png'); - background-size: 100%; - background-repeat: no-repeat; - background-position: center center; -} - -.cover-main .buttons { - width: 100%; -} - -.cover-main .buttons a { - font-weight: 700; - position: relative; - display: inline-block; - padding: 12px 25px; - font-size: 14px; - text-align: center; - line-height: 18px; - color: #221f1f; - background: #fff; - outline: none; - border: none; - background-color: #fff; - -webkit-appearance: none; - -moz-appearance: none; - cursor: pointer; - margin: 0 1rem; - color: var(--theme-color); - overflow: hidden; - transition: color 0.25s cubic-bezier(0.215, 0.61, 0.355, 1); - vertical-align: baseline; - text-transform: uppercase; -} - -.cover-main .buttons a:before, -.cover-main .buttons a:after { - content: ''; - display: block; - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - border: 2px solid var(--theme-color); - box-sizing: border-box; -} - -.cover-main .buttons a:after { - background: var(--theme-color); - transform: translateX(-101%); - transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1); -} - -.cover-main .buttons a:hover { - color: white; - box-shadow: 0 5px 16px rgba(229, 9, 20, 0.3); -} - -.cover-main .buttons a:hover:after { - transform: translateX(0); -} - -.cover-main .buttons a span { - position: relative; - z-index: 1; -} - @media (max-width: 850px) { section.cover ul { grid-template-columns: 100%; @@ -232,6 +159,17 @@ section.cover.show ~ .sidebar-toggle { } /****** Sidebar Toggle ******/ + +.sidebar-toggle, +.sidebar, +.content { + margin-top: 38px; +} + +.sidebar { + padding: 0px; +} + .sidebar-toggle { cursor: pointer; } @@ -303,14 +241,25 @@ body.close .github-corner { } /****** Markdown General ******/ -.markdown-section { - padding: 30px 30px 40px; + +.markdown-section p { + font-size: 18px; + line-height: 28px; +} + +.markdown-section code { + background-color: #f8f8f8; + color: #525252; + padding: 0.05em 0.15em 0.15em 0.15em; + margin: 0.05em; + font-size: 16px; + line-height: 24px; } .markdown-section a { text-decoration: none; - border-bottom: 0.01rem solid var(--theme-color); - transition: all 0.3s ease; + color: var(--theme-color); + border-bottom: 0.1rem solid var(--theme-color); } .markdown-section a:hover { @@ -322,48 +271,22 @@ body.close .github-corner { border: none; } -/****** Markdown Table ******/ -.markdown-section table { - display: table; +.markdown-section a > code, +.markdown-section a > strong > code { + background-color: #f8f8f8; + color: #525252; + padding: 0.05em 0.15em 0 0.15em; + margin: 0.05em; } -.markdown-section table tr { - border-width: 0.15rem 0; - border-style: solid; - border-color: #f1f1f2; -} - -.markdown-section table thead tr { - text-transform: uppercase; - font-size: 90%; - border-top: none; -} - -.markdown-section table tbody tr:last-of-type { - border-bottom: none; -} - -.markdown-section table tr:nth-child(2n) { - background-color: transparent; -} - -.markdown-section table td, -.markdown-section table th { - border: none; - padding: 1.1rem 0.5rem; - text-align: left; -} - -.markdown-section table td p { - margin: 0; -} - -.markdown-section blockquote { - margin: 1em 0; -} - -.markdown-section blockquote > p { - font-weight: 500; +.markdown-section a > code:hover, +.markdown-section a > code:active, +.markdown-section a > strong > code:hover, +.markdown-section a > strong > code:active { + background-color: #525252; + color: #f8f8f8; + padding: 0.05em 0.15em 0 0.15em; + margin: 0.05em; } .markdown-section em, diff --git a/docs/devops.md b/docs/devops.md index eeb4777835..2703b8c2b1 100644 --- a/docs/devops.md +++ b/docs/devops.md @@ -196,8 +196,9 @@ We thank you for reporting bugs that you encounter and help in making freeCodeCa Currently a public beta testing version is available at: -www.freecodecamp.dev