diff --git a/.codio b/.codio
index 54542513..4d189add 100644
--- a/.codio
+++ b/.codio
@@ -2,12 +2,13 @@
// This file is used to configure the three buttons along Codio's top menu.
// Run button configuration
"commands": {
- "Make": "make html",
+ "Make": "clear && make html",
"Start Ungit":"ungit --port=4000 --ungitBindIp 0.0.0.0"
},
// Preview button configuration
"preview": {
- "Preview": "https://{{domain}}/build/html/index.html",
+ "Instructor": "https://{{domain}}/build/html/index.html",
+ "Student": "https://{{domain}}/build/html/student.html",
"Visit Ungit": "https://{{domain4000}}/#/repository?path=%2Fhome%2Fcodio%2Fworkspace"
diff --git a/.github/workflows/deploy.yaml b/.github/workflows/deploy.yaml
index 76a18753..2b4b1fce 100644
--- a/.github/workflows/deploy.yaml
+++ b/.github/workflows/deploy.yaml
@@ -10,7 +10,7 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Setup env
- run: pip install sphinxcontrib-applehelp==1.0.4 sphinxcontrib-devhelp==1.0.2 sphinxcontrib-htmlhelp==2.0.1 sphinxcontrib-qthelp==1.0.3 sphinxcontrib-serializinghtml==1.1.5 sphinx==4.2.0 sphinx-sitemap sphinx_code_tabs recommonmark git+https://github.com/codio/pydata-sphinx-theme.git@master
+ run: pip install sphinx==8.2.0 sphinxawesome-theme==5.3.2 sphinx-docsearch sphinx-sitemap sphinx_code_tabs recommonmark
- name: Checkout
uses: actions/checkout@v1
diff --git a/README.md b/README.md
index a2910b89..b67ba7bd 100644
--- a/README.md
+++ b/README.md
@@ -8,13 +8,7 @@ If using Codio, put on the certified Python stack `Python Ubuntu 22.04 (pyenv)`.
### Install
```
-pip install sphinx==4.2.0 sphinx-sitemap sphinx_code_tabs recommonmark git+https://github.com/codio/pydata-sphinx-theme.git@master
-```
-
-Due to some versions being outdated, temporarily you will need to use this command to install dependencies:
-
-```
-pip install sphinxcontrib-applehelp==1.0.4 sphinxcontrib-devhelp==1.0.2 sphinxcontrib-htmlhelp==2.0.1 sphinxcontrib-qthelp==1.0.3 sphinxcontrib-serializinghtml==1.1.5 sphinx==4.2.0 sphinx-sitemap sphinx_code_tabs recommonmark git+https://github.com/codio/pydata-sphinx-theme.git@master
+pip install sphinx==8.2.0 sphinxawesome-theme==5.3.2 sphinx-docsearch sphinx-sitemap sphinx_code_tabs recommonmark
```
### Build
diff --git a/source/_static/css/codio.css b/source/_static/css/codio.css
index d58bf2a5..cd9bd4a1 100644
--- a/source/_static/css/codio.css
+++ b/source/_static/css/codio.css
@@ -225,13 +225,32 @@
.bd-content a.reference {
font-weight: 600;
}
+
.small-text {
font-size: 0.85em;
}
+
.tiny {
font-size: 0.75em;
- }
+}
.float-right {
float: right; width: 300px; margin-left: 50px;
- }
\ No newline at end of file
+}
+
+header img[src$="logo-white.svg"],
+header img[src$="logo-dark.svg"] {
+ height: 32px !important;
+ width: auto !important;
+}
+
+header span.font-bold {
+ display: none !important;
+}
+
+@media (prefers-color-scheme: dark) {
+ html { background: #0b0d17; }
+}
+@media (prefers-color-scheme: light) {
+ html { background: #ffffff; }
+}
diff --git a/source/_static/css/custom_body.css b/source/_static/css/custom_body.css
index 5e9114f1..ae5fae8c 100644
--- a/source/_static/css/custom_body.css
+++ b/source/_static/css/custom_body.css
@@ -1,19 +1,138 @@
-body {
- background-color: #02064e;
+/* =========================================
+ Codio Docs — Home (index) only
+ Pure theme background, centered layout
+ ========================================= */
+
+/* Hide sidebars on the homepage and center content */
+.index-page .bd-sidebar-primary,
+.index-page .bd-sidebar-secondary { display: none !important; }
+
+.index-page .bd-content,
+.index-page .bd-article-container {
+ max-width: 100%;
+ margin-inline: auto !important;
+ padding-inline: 1rem;
}
-.footer {
- border-top: none;
+/* Make every wrapper transparent so there is NO boxed panel */
+.index-page,
+.index-page .bd-main,
+.index-page .bd-content,
+.index-page .bd-article-container,
+.index-page .bd-article {
+ background: transparent !important;
}
-.container-xl .row {
- justify-content: center;
+/* ------- Theme tokens (only for the homepage components) ------- */
+html[data-theme="dark"] .index-page,
+[data-theme="dark"] .index-page {
+ --text: #e6eaf2;
+ --muted: #9aa3b2;
+ --border: rgba(255,255,255,0.14);
+ --surface-hover: rgba(255,255,255,0.06);
+ --brand: #6ee7ff;
+ --brand-strong: #3dd8ff;
+ --ring: #9feaff;
+ --shadow: 0 10px 26px rgba(3,8,48,0.35);
}
-.container-xl .no-sidebar {
- display: none !important;
+html[data-theme="light"] .index-page,
+[data-theme="light"] .index-page {
+ --text: #0b1020;
+ --muted: #475569;
+ --border: rgba(0,0,0,0.12);
+ --surface-hover: rgba(2,132,199,0.05);
+ --brand: #0ea5e9;
+ --brand-strong: #0284c7;
+ --ring: #38bdf8;
+ --shadow: 0 10px 24px rgba(2,132,199,0.08);
+}
+
+/* Fallback to OS pref if the site doesn't set data-theme */
+@media (prefers-color-scheme: light) {
+ html:not([data-theme="dark"]) .index-page {
+ --text: #0b1020;
+ --muted: #475569;
+ --border: rgba(0,0,0,0.12);
+ --surface-hover: rgba(2,132,199,0.05);
+ --brand: #0ea5e9;
+ --brand-strong: #0284c7;
+ --ring: #38bdf8;
+ --shadow: 0 10px 24px rgba(2,132,199,0.08);
+ }
+}
+
+/* ------- Hero ------- */
+.home-hero { padding: 5rem 1rem 1.5rem; text-align: center; }
+.home-title { color: var(--text); font-size: clamp(2rem, 2.8vw + 1rem, 3rem); margin: 0 0 .6rem; }
+.home-subtitle { color: var(--muted); margin: 0 auto 1.8rem; max-width: 62ch; }
+
+/* (Search form is commented out in your HTML, but styles left here in case you re-enable) */
+.home-search {
+ display: inline-flex; gap: .5rem; align-items: center;
+ background: transparent; /* no panel */
+ border: 1px solid var(--border);
+ border-radius: 999px; padding: .5rem;
+ box-shadow: none;
+}
+.home-search input[type="search"] {
+ min-width: clamp(260px, 42vw, 560px);
+ background: transparent; border: none; color: var(--text);
+ outline: none; padding: .75rem 1rem; font-size: 1rem;
+}
+.home-search input::placeholder { color: var(--muted); }
+.search-btn {
+ display: inline-flex; align-items: center; gap: .5rem;
+ border: 1px solid transparent;
+ background: linear-gradient(180deg, var(--brand), var(--brand-strong));
+ color: #001; font-weight: 700; padding: .7rem 1rem;
+ border-radius: 999px; cursor: pointer;
+ box-shadow: 0 10px 24px rgba(0, 190, 255, .18);
}
+.search-btn:focus-visible { outline: 3px solid var(--ring); outline-offset: 2px; }
+.search-btn .icon { width: 20px; height: 20px; }
+
+/* ------- Sections ------- */
+.home-main { padding: .5rem 0 3rem; }
+.home-container { max-width: 1100px; margin-inline: auto; padding-inline: 1rem; }
+.section { margin-top: 1.25rem; }
+.section-title { color: var(--muted); font-weight: 600; letter-spacing: .2px; margin: 0 0 1rem; }
+
+/* ------- Cards: transparent by default (no fill), subtle outline ------- */
+.card-grid {
+ --min: 260px;
+ display: grid; grid-template-columns: repeat(auto-fit, minmax(var(--min), 1fr));
+ gap: 1rem; align-items: stretch;
+}
+.card {
+ display: grid; grid-template-rows: auto auto 1fr auto; gap: .5rem;
+ padding: 1rem; border-radius: 16px; text-decoration: none; color: var(--text);
+ background: transparent; /* <- no box */
+ border: 1px solid var(--border);
+ box-shadow: none;
+ transition: transform .2s ease, background-color .15s ease, border-color .15s ease;
+}
+.card:hover { transform: translateY(-2px); background: var(--surface-hover); border-color: var(--brand); }
+.card:focus-visible { outline: 3px solid var(--ring); outline-offset: 2px; }
+
+.card-icon {
+ width: 36px; height: 36px; display: grid; place-items: center;
+ border-radius: 12px;
+ background: linear-gradient(180deg, var(--brand), var(--brand-strong));
+ box-shadow: 0 8px 18px rgba(0, 190, 255, .2);
+}
+.card-icon svg { width: 22px; height: 22px; fill: #001; }
+
+.card-title { font-size: 1.05rem; margin: .25rem 0; }
+.card-desc { margin: 0; color: var(--muted); }
+.card-cta { margin-top: .5rem; font-weight: 700; color: var(--brand); display: inline-flex; gap: .35rem; }
+.card-cta::after { content: "›"; font-size: 1.2em; transform: translateY(-1px); }
+
+/* Reduced motion */
+@media (prefers-reduced-motion: reduce) { .card, .search-btn { transition: none; } }
-.container-xl .d-none {
- display: none !important;
+/* Small screens */
+@media (max-width: 480px) {
+ .home-search { width: 100%; }
+ .home-search input[type="search"] { min-width: 0; width: 100%; }
}
diff --git a/source/_static/css/custom_index.css b/source/_static/css/custom_index.css
index f010d044..729bfd77 100644
--- a/source/_static/css/custom_index.css
+++ b/source/_static/css/custom_index.css
@@ -1,6 +1,12 @@
+/* Slight width nudge only (kept minimal) */
+.index-page .home-container { max-width: 100%; }
+
+/* Ensure any Bootstrap-like main column stays centered on the homepage */
@media (min-width: 1200px) {
- .col-xl-8 {
- flex: 0 0 91.66667% !important;
- max-width: 91.66667% !important;
- }
+ .index-page .col-xl-8 {
+ flex: 0 0 91.66667% !important;
+ max-width: 91.66667% !important;
+ margin-left: auto !important;
+ margin-right: auto !important;
+ }
}
diff --git a/source/_static/favicon.ico b/source/_static/favicon.ico
index 8d393ea6..fae4ef68 100644
Binary files a/source/_static/favicon.ico and b/source/_static/favicon.ico differ
diff --git a/source/_static/js/algolia.js b/source/_static/js/algolia.js
index 3434bcab..6951b014 100644
--- a/source/_static/js/algolia.js
+++ b/source/_static/js/algolia.js
@@ -1,12 +1,14 @@
-docsearch({
- // Your apiKey and indexName will be given to you once
- // we create your config
- apiKey: '7e59277e32050e11c2e8915f1b09d6e2',
- indexName: 'CodioDocs',
- appId: '0MJO9504F8', // Should be only included if you are running DocSearch on your own.
- container: '#docsearch',
- // Set debug to true to inspect the dropdown
- searchParameters: {
- hitsPerPage: 20,
- }
+window.addEventListener('DOMContentLoaded', () => {
+ docsearch({
+ // Your apiKey and indexName will be given to you once
+ // we create your config
+ apiKey: '7e59277e32050e11c2e8915f1b09d6e2',
+ indexName: 'CodioDocs',
+ appId: '0MJO9504F8', // Should be only included if you are running DocSearch on your own.
+ container: '#docsearch',
+ // Set debug to true to inspect the dropdown
+ searchParameters: {
+ hitsPerPage: 20,
+ }
+ });
});
diff --git a/source/_static/logo-dark.svg b/source/_static/logo-dark.svg
new file mode 100644
index 00000000..6a5e5a65
--- /dev/null
+++ b/source/_static/logo-dark.svg
@@ -0,0 +1,7 @@
+
diff --git a/source/_templates/index.html b/source/_templates/index.html
index 04c25d7c..2836d239 100644
--- a/source/_templates/index.html
+++ b/source/_templates/index.html
@@ -1,97 +1,102 @@
{% extends "layout.html" %}
{% set title = _('Codio') %}
{% block body %}
+
+
-
-
- Codio Instructor Help Center
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Overview: Getting Started
+ Videos, tutorials, and key concepts to hit the ground running.
+ Explore
+
+
+
+
+ Content Authoring
+ Author instructional content and build auto-graded assessments.
+ Explore
+
+
+
+
+ Developing Code
+ Use the Codio IDE, terminal, and environment features.
+ Explore
+
+
+
+
+ Course Configuration
+ Create courses, add students, and connect to your LMS.
+ Explore
+
+
+
+
+ Teaching in Codio
+ Monitor progress, grade efficiently, and use the remote toolkit.
+ Explore
+
+
+
+
+ Admin
+ LMS integrations, org settings, FERPA, and accessibility.
+ Explore
+
+
+
+
+
-{% endblock %}
\ No newline at end of file
+
+{% endblock %}
diff --git a/source/_templates/layout.html b/source/_templates/layout.html
index df4a026a..7ecb168e 100644
--- a/source/_templates/layout.html
+++ b/source/_templates/layout.html
@@ -1,5 +1,26 @@
{% extends "!layout.html" %}
+{% block extrahead %}
+ {{ super() }}
+
+{% endblock %}
+
{% block footer %}
{{ super() }}
diff --git a/source/admin.rst b/source/admin.rst
index 9219bbe4..437cd46f 100644
--- a/source/admin.rst
+++ b/source/admin.rst
@@ -8,7 +8,7 @@
Admin
=====
.. toctree::
- :maxdepth: 1
+ :maxdepth: 3
:hidden:
instructors/admin/integration/intro
diff --git a/source/authoring.rst b/source/authoring.rst
index c307817b..24dd5ca9 100644
--- a/source/authoring.rst
+++ b/source/authoring.rst
@@ -8,7 +8,7 @@ Authoring
---------
.. toctree::
- :maxdepth: 1
+ :maxdepth: 3
:hidden:
diff --git a/source/common.rst b/source/common.rst
index 43302d58..9dc7e275 100644
--- a/source/common.rst
+++ b/source/common.rst
@@ -8,7 +8,7 @@ Developing Code
===============
.. toctree::
- :maxdepth: 1
+ :maxdepth: 3
:hidden:
common/develop/projects/projects
diff --git a/source/common/develop/projects/projects.rst b/source/common/develop/projects/projects.rst
index 98296cbc..8bbd4166 100644
--- a/source/common/develop/projects/projects.rst
+++ b/source/common/develop/projects/projects.rst
@@ -8,6 +8,7 @@ Developing Code
.. toctree::
:caption: Projects
+ :maxdepth: 3
:hidden:
project-settings
diff --git a/source/conf.py b/source/conf.py
index e2fdd742..43f6d07e 100644
--- a/source/conf.py
+++ b/source/conf.py
@@ -16,13 +16,29 @@
# import sys
# sys.path.insert(0, os.path.abspath('.'))
+from sphinxawesome_theme.postprocess import Icons
+from sphinxawesome_theme import ThemeOptions
+from datetime import date
+from dataclasses import asdict
# -- Project information -----------------------------------------------------
project = u''
-copyright = u'Codio 2025. All Rights Reserved'
+copyright = f"Codio {date.today().year}. All rights reserved."
author = u''
+# Global substitutions for reStructuredText files
+substitutions = [
+ ":tocdepth: 3",
+ " ",
+ ".. meta::",
+ " :keywords: Documentation,Codio",
+ ".. |rst| replace:: reStructuredText",
+ ".. |product| replace:: Documentation",
+ ".. |conf| replace:: File: conf.py",
+]
+rst_prolog = "\n".join(substitutions)
+
# The short X.Y version
version = u''
# The full version, including alpha/beta/rc tags
@@ -45,6 +61,7 @@
'sphinx.ext.todo',
'sphinx.ext.coverage',
'sphinx.ext.mathjax',
+ 'sphinx_docsearch',
'sphinx.ext.ifconfig',
'sphinx.ext.viewcode',
'sphinx.ext.githubpages',
@@ -88,29 +105,36 @@
# The theme to use for HTML and HTML Help pages. See the documentation for
# a list of builtin themes.
#
-html_theme = 'pydata_sphinx_theme'
+html_theme = "sphinxawesome_theme"
# Theme options are theme-specific and customize the look and feel of a theme
# further. For a list of options available for each theme, see the
# documentation.
#
-html_theme_options = {
- "show_prev_next": True,
- "footer_items": ["copyright"],
- "navbar_end": ["navbar-icon-links", "search-field"],
- "navbar_align": "none",
- "search_bar_text": "Search ...",
- "show_toc_level": 2,
- "page_sidebar_items": [],
-# "external_links": [
-# {"name": "Overview", "url": "/instructors/getstarted"},
-# {"name": "Authoring", "url": "/instructors/authoring"},
-# {"name": "IDE", "url": "/common"},
-# {"name": "Course Set Up", "url": "/instructors/setupcourses"},
-# {"name": "Teaching", "url": "/instructors/teaching"},
-# {"name": "Admin", "url": "/instructors/admin"}
-# ]
-}
+
+theme_options = ThemeOptions(
+ show_prev_next=True,
+ awesome_external_links=True,
+ main_nav_links={"Changelog": "/instructors/getstarted/support/changelog.html"},
+ logo_light="logo-dark.svg",
+ logo_dark="logo-white.svg",
+)
+
+html_theme_options = asdict(theme_options)
+
+# html_theme_options = {
+# "show_prev_next": True,
+# "logo_light": "_static/logo-white.svg",
+# "logo_dark": "_static/logo-white.svg",
+# # "external_links": [
+# # {"name": "Overview", "url": "/instructors/getstarted"},
+# # {"name": "Authoring", "url": "/instructors/authoring"},
+# # {"name": "IDE", "url": "/common"},
+# # {"name": "Course Set Up", "url": "/instructors/setupcourses"},
+# # {"name": "Teaching", "url": "/instructors/teaching"},
+# # {"name": "Admin", "url": "/instructors/admin"}
+# # ]
+# }
# Add any paths that contain custom static files (such as style sheets) here,
# relative to this directory. They are copied after the builtin static files,
@@ -127,7 +151,7 @@
#
html_sidebars = {
"index": [],
- "**": ['sidebar-nav-bs.html'],
+ # "**": ['sidebar-nav-bs.html'],
}
@@ -211,7 +235,9 @@
# -- Options for intersphinx extension ---------------------------------------
# Example configuration for intersphinx: refer to the Python standard library.
-intersphinx_mapping = {'https://docs.python.org/': None}
+intersphinx_mapping = {
+ 'python': ('https://docs.python.org/3', None),
+}
# -- Options for todo extension ----------------------------------------------
@@ -220,12 +246,12 @@
html_additional_pages = {
'index': 'index.html'
- }
+}
+
html_css_files = [
'css/codio.css',
'css/search.css',
'https://cdn.jsdelivr.net/npm/@docsearch/css@3'
-
]
html_js_files = [
@@ -233,6 +259,14 @@
('js/algolia.js', {'defer': 'defer'})
]
-html_logo = "_static/logo-white.svg"
+# html_logo = "_static/logo-white.svg"
+html_logo = None
+html_title = "Codio"
html_favicon = "_static/favicon.ico"
html_extra_path = ['robots.txt']
+html_permalinks_icon = Icons.permalinks_icon
+html_show_sphinx = False
+
+docsearch_app_id = "0MJO9504F8"
+docsearch_api_key = "7e59277e32050e11c2e8915f1b09d6e2"
+docsearch_index_name = "CodioDocs"
diff --git a/source/getstarted.rst b/source/getstarted.rst
index fdc59cbd..1efb1036 100644
--- a/source/getstarted.rst
+++ b/source/getstarted.rst
@@ -1,13 +1,13 @@
.. meta::
:description: Getting started with Codio including videos and tutorials
-:name: getstarted
+.. :name: getstarted
Getting Started
---------------
.. toctree::
- :maxdepth: 1
+ :maxdepth: 3
:hidden:
instructors/getstarted/startlist
diff --git a/source/index.rst b/source/index.rst
index 1a215e52..14b6b5c8 100644
--- a/source/index.rst
+++ b/source/index.rst
@@ -3,8 +3,8 @@ Welcome to CodioDocs's documentation!
.. toctree::
- :caption: Theme Documentation
- :maxdepth: 2
+ :caption: Documentation
+ :maxdepth: 3
Overview
Authoring
diff --git a/source/setupcourses.rst b/source/setupcourses.rst
index 9fc9ed10..23231cc9 100644
--- a/source/setupcourses.rst
+++ b/source/setupcourses.rst
@@ -8,7 +8,7 @@ Courses Set up
--------------
.. toctree::
- :maxdepth: 1
+ :maxdepth: 3
:hidden:
instructors/setupcourses/courses
diff --git a/source/teaching.rst b/source/teaching.rst
index 75d41f26..77fbb0cf 100644
--- a/source/teaching.rst
+++ b/source/teaching.rst
@@ -8,7 +8,7 @@ Teaching
========
.. toctree::
- :maxdepth: 1
+ :maxdepth: 3
:hidden:
instructors/teaching/viewstudentwork
diff --git a/student-source/_static/css/codio.css b/student-source/_static/css/codio.css
index 043e59e3..072fb8b7 100644
--- a/student-source/_static/css/codio.css
+++ b/student-source/_static/css/codio.css
@@ -225,3 +225,32 @@
.bd-content a.reference {
font-weight: 600;
}
+
+.small-text {
+ font-size: 0.85em;
+}
+
+.tiny {
+ font-size: 0.75em;
+}
+
+.float-right {
+ float: right; width: 300px; margin-left: 50px;
+}
+
+header img[src$="logo-white.svg"],
+header img[src$="logo-dark.svg"] {
+ height: 32px !important;
+ width: auto !important;
+}
+
+header span.font-bold {
+ display: none !important;
+}
+
+@media (prefers-color-scheme: dark) {
+ html { background: #0b0d17; }
+}
+@media (prefers-color-scheme: light) {
+ html { background: #ffffff; }
+}
diff --git a/student-source/_static/css/custom_body.css b/student-source/_static/css/custom_body.css
index 5e9114f1..456eaea6 100644
--- a/student-source/_static/css/custom_body.css
+++ b/student-source/_static/css/custom_body.css
@@ -1,19 +1,174 @@
-body {
- background-color: #02064e;
+/* =========================================
+ Codio Docs — Home (index) only
+ Pure theme background, centered layout
+ ========================================= */
+
+/* Hide sidebars on the homepage and center content */
+/* Center & unbox the student page just like the home page */
+.student-page .bd-sidebar-primary,
+.student-page .bd-sidebar-secondary { display: none !important; }
+
+.student-page .bd-content,
+.student-page .bd-article-container {
+ max-width: 1200px;
+ margin-inline: auto !important;
+ padding-inline: 1rem;
+ background: transparent !important;
+}
+
+/* Share the same theme tokens */
+html[data-theme="dark"] .student-page,
+[data-theme="dark"] .student-page {
+ --text: #e6eaf2;
+ --muted: #9aa3b2;
+ --border: rgba(255,255,255,0.14);
+ --surface-hover: rgba(255,255,255,0.06);
+ --brand: #6ee7ff;
+ --brand-strong: #3dd8ff;
+ --ring: #9feaff;
+ --shadow: 0 10px 26px rgba(3,8,48,0.35);
+}
+html[data-theme="light"] .student-page,
+[data-theme="light"] .student-page {
+ --text: #0b1020;
+ --muted: #475569;
+ --border: rgba(0,0,0,0.12);
+ --surface-hover: rgba(2,132,199,0.05);
+ --brand: #0ea5e9;
+ --brand-strong: #0284c7;
+ --ring: #38bdf8;
+ --shadow: 0 10px 24px rgba(2,132,199,0.08);
+}
+
+.index-page .bd-sidebar-primary,
+.index-page .bd-sidebar-secondary { display: none !important; }
+
+.index-page .bd-content,
+.index-page .bd-article-container {
+ max-width: 100%;
+ margin-inline: auto !important;
+ padding-inline: 1rem;
+}
+
+/* Make every wrapper transparent so there is NO boxed panel */
+.index-page,
+.index-page .bd-main,
+.index-page .bd-content,
+.index-page .bd-article-container,
+.index-page .bd-article {
+ background: transparent !important;
}
-.footer {
- border-top: none;
+/* ------- Theme tokens (only for the homepage components) ------- */
+html[data-theme="dark"] .index-page,
+[data-theme="dark"] .index-page {
+ --text: #e6eaf2;
+ --muted: #9aa3b2;
+ --border: rgba(255,255,255,0.14);
+ --surface-hover: rgba(255,255,255,0.06);
+ --brand: #6ee7ff;
+ --brand-strong: #3dd8ff;
+ --ring: #9feaff;
+ --shadow: 0 10px 26px rgba(3,8,48,0.35);
}
-.container-xl .row {
- justify-content: center;
+html[data-theme="light"] .index-page,
+[data-theme="light"] .index-page {
+ --text: #0b1020;
+ --muted: #475569;
+ --border: rgba(0,0,0,0.12);
+ --surface-hover: rgba(2,132,199,0.05);
+ --brand: #0ea5e9;
+ --brand-strong: #0284c7;
+ --ring: #38bdf8;
+ --shadow: 0 10px 24px rgba(2,132,199,0.08);
}
-.container-xl .no-sidebar {
- display: none !important;
+/* Fallback to OS pref if the site doesn't set data-theme */
+@media (prefers-color-scheme: light) {
+ html:not([data-theme="dark"]) .index-page {
+ --text: #0b1020;
+ --muted: #475569;
+ --border: rgba(0,0,0,0.12);
+ --surface-hover: rgba(2,132,199,0.05);
+ --brand: #0ea5e9;
+ --brand-strong: #0284c7;
+ --ring: #38bdf8;
+ --shadow: 0 10px 24px rgba(2,132,199,0.08);
+ }
}
-.container-xl .d-none {
- display: none !important;
+/* ------- Hero ------- */
+.home-hero { padding: 5rem 1rem 1.5rem; text-align: center; }
+.home-title { color: var(--text); font-size: clamp(2rem, 2.8vw + 1rem, 3rem); margin: 0 0 .6rem; }
+.home-subtitle { color: var(--muted); margin: 0 auto 1.8rem; max-width: 62ch; }
+
+/* (Search form is commented out in your HTML, but styles left here in case you re-enable) */
+.home-search {
+ display: inline-flex; gap: .5rem; align-items: center;
+ background: transparent; /* no panel */
+ border: 1px solid var(--border);
+ border-radius: 999px; padding: .5rem;
+ box-shadow: none;
+}
+.home-search input[type="search"] {
+ min-width: clamp(260px, 42vw, 560px);
+ background: transparent; border: none; color: var(--text);
+ outline: none; padding: .75rem 1rem; font-size: 1rem;
+}
+.home-search input::placeholder { color: var(--muted); }
+.search-btn {
+ display: inline-flex; align-items: center; gap: .5rem;
+ border: 1px solid transparent;
+ background: linear-gradient(180deg, var(--brand), var(--brand-strong));
+ color: #001; font-weight: 700; padding: .7rem 1rem;
+ border-radius: 999px; cursor: pointer;
+ box-shadow: 0 10px 24px rgba(0, 190, 255, .18);
+}
+.search-btn:focus-visible { outline: 3px solid var(--ring); outline-offset: 2px; }
+.search-btn .icon { width: 20px; height: 20px; }
+
+/* ------- Sections ------- */
+.home-main { padding: .5rem 0 3rem; }
+.home-container { max-width: 1100px; margin-inline: auto; padding-inline: 1rem; }
+.section { margin-top: 1.25rem; }
+.section-title { color: var(--muted); font-weight: 600; letter-spacing: .2px; margin: 0 0 1rem; }
+
+/* ------- Cards: transparent by default (no fill), subtle outline ------- */
+.card-grid {
+ --min: 260px;
+ display: grid; grid-template-columns: repeat(auto-fit, minmax(var(--min), 1fr));
+ gap: 1rem; align-items: stretch;
+}
+.card {
+ display: grid; grid-template-rows: auto auto 1fr auto; gap: .5rem;
+ padding: 1rem; border-radius: 16px; text-decoration: none; color: var(--text);
+ background: transparent; /* <- no box */
+ border: 1px solid var(--border);
+ box-shadow: none;
+ transition: transform .2s ease, background-color .15s ease, border-color .15s ease;
+}
+.card:hover { transform: translateY(-2px); background: var(--surface-hover); border-color: var(--brand); }
+.card:focus-visible { outline: 3px solid var(--ring); outline-offset: 2px; }
+
+.card-icon {
+ width: 36px; height: 36px; display: grid; place-items: center;
+ border-radius: 12px;
+ background: linear-gradient(180deg, var(--brand), var(--brand-strong));
+ box-shadow: 0 8px 18px rgba(0, 190, 255, .2);
+}
+.card-icon svg { width: 22px; height: 22px; fill: #001; }
+
+.card-title { font-size: 1.05rem; margin: .25rem 0; }
+.card-desc { margin: 0; color: var(--muted); }
+.card-cta { margin-top: .5rem; font-weight: 700; color: var(--brand); display: inline-flex; gap: .35rem; }
+.card-cta::after { content: "›"; font-size: 1.2em; transform: translateY(-1px); }
+
+/* Reduced motion */
+@media (prefers-reduced-motion: reduce) { .card, .search-btn { transition: none; } }
+
+/* Small screens */
+@media (max-width: 480px) {
+ .home-search { width: 100%; }
+ .home-search input[type="search"] { min-width: 0; width: 100%; }
}
diff --git a/student-source/_static/css/custom_index.css b/student-source/_static/css/custom_index.css
new file mode 100644
index 00000000..729bfd77
--- /dev/null
+++ b/student-source/_static/css/custom_index.css
@@ -0,0 +1,12 @@
+/* Slight width nudge only (kept minimal) */
+.index-page .home-container { max-width: 100%; }
+
+/* Ensure any Bootstrap-like main column stays centered on the homepage */
+@media (min-width: 1200px) {
+ .index-page .col-xl-8 {
+ flex: 0 0 91.66667% !important;
+ max-width: 91.66667% !important;
+ margin-left: auto !important;
+ margin-right: auto !important;
+ }
+}
diff --git a/student-source/_static/favicon.ico b/student-source/_static/favicon.ico
index 8d393ea6..fae4ef68 100644
Binary files a/student-source/_static/favicon.ico and b/student-source/_static/favicon.ico differ
diff --git a/student-source/_static/logo-dark.svg b/student-source/_static/logo-dark.svg
new file mode 100644
index 00000000..6a5e5a65
--- /dev/null
+++ b/student-source/_static/logo-dark.svg
@@ -0,0 +1,7 @@
+
diff --git a/student-source/_templates/student.html b/student-source/_templates/student.html
index e4976b6e..772b17e0 100644
--- a/student-source/_templates/student.html
+++ b/student-source/_templates/student.html
@@ -2,67 +2,60 @@
{% set title = _('Student') %}
{% block body %}
-
-
- Codio Student Help Center
-
-
+
+
+
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/student-source/accessing-codio.rst b/student-source/accessing-codio.rst
index 70bd926d..2567861f 100644
--- a/student-source/accessing-codio.rst
+++ b/student-source/accessing-codio.rst
@@ -8,7 +8,7 @@ Accessing Codio
===============
.. toctree::
- :maxdepth: 1
+ :maxdepth: 3
:hidden:
diff --git a/student-source/conf.py b/student-source/conf.py
index 397d0572..ac5fa02b 100644
--- a/student-source/conf.py
+++ b/student-source/conf.py
@@ -16,13 +16,29 @@
# import sys
# sys.path.insert(0, os.path.abspath('.'))
+from sphinxawesome_theme.postprocess import Icons
+from sphinxawesome_theme import ThemeOptions
+from datetime import date
+from dataclasses import asdict
# -- Project information -----------------------------------------------------
project = u''
-copyright = u'Codio 2025. All Rights Reserved'
+copyright = f"Codio {date.today().year}. All rights reserved."
author = u''
+# Global substitutions for reStructuredText files
+substitutions = [
+ ":tocdepth: 3",
+ " ",
+ ".. meta::",
+ " :keywords: Documentation,Codio",
+ ".. |rst| replace:: reStructuredText",
+ ".. |product| replace:: Documentation",
+ ".. |conf| replace:: File: conf.py",
+]
+rst_prolog = "\n".join(substitutions)
+
# The short X.Y version
version = u''
# The full version, including alpha/beta/rc tags
@@ -45,6 +61,7 @@
'sphinx.ext.todo',
'sphinx.ext.coverage',
'sphinx.ext.mathjax',
+ 'sphinx_docsearch',
'sphinx.ext.ifconfig',
'sphinx.ext.viewcode',
'sphinx.ext.githubpages',
@@ -88,29 +105,34 @@
# The theme to use for HTML and HTML Help pages. See the documentation for
# a list of builtin themes.
#
-html_theme = 'pydata_sphinx_theme'
+html_theme = "sphinxawesome_theme"
# Theme options are theme-specific and customize the look and feel of a theme
# further. For a list of options available for each theme, see the
# documentation.
#
-html_theme_options = {
- "show_prev_next": True,
- "footer_items": ["copyright"],
- "navbar_end": ["navbar-icon-links", "search-field"],
- "navbar_align": "none",
- "search_bar_text": "Search ...",
- "show_toc_level": 2,
- "page_sidebar_items": [],
-# "external_links": [
-# {"name": "Overview", "url": "/instructors/getstarted"},
-# {"name": "Authoring", "url": "/instructors/authoring"},
-# {"name": "IDE", "url": "/common"},
-# {"name": "Course Set Up", "url": "/instructors/setupcourses"},
-# {"name": "Teaching", "url": "/instructors/teaching"},
-# {"name": "Admin", "url": "/instructors/admin"}
-# ]
-}
+
+theme_options = ThemeOptions(
+ show_prev_next=True,
+ awesome_external_links=True,
+ main_nav_links={"Changelog": "/instructors/getstarted/support/changelog.html"},
+ logo_light="logo-dark.svg",
+ logo_dark="logo-white.svg",
+)
+
+html_theme_options = asdict(theme_options)
+
+# html_theme_options = {
+# "show_prev_next": True,
+# # "external_links": [
+# # {"name": "Overview", "url": "/instructors/getstarted"},
+# # {"name": "Authoring", "url": "/instructors/authoring"},
+# # {"name": "IDE", "url": "/common"},
+# # {"name": "Course Set Up", "url": "/instructors/setupcourses"},
+# # {"name": "Teaching", "url": "/instructors/teaching"},
+# # {"name": "Admin", "url": "/instructors/admin"}
+# # ]
+# }
# Add any paths that contain custom static files (such as style sheets) here,
# relative to this directory. They are copied after the builtin static files,
@@ -128,7 +150,7 @@
html_sidebars = {
"index": [],
"student": [],
- "**": ['sidebar-nav-bs.html'],
+ # "**": ['sidebar-nav-bs.html'],
}
@@ -212,7 +234,9 @@
# -- Options for intersphinx extension ---------------------------------------
# Example configuration for intersphinx: refer to the Python standard library.
-intersphinx_mapping = {'https://docs.python.org/': None}
+intersphinx_mapping = {
+ 'python': ('https://docs.python.org/3', None),
+}
# -- Options for todo extension ----------------------------------------------
@@ -234,6 +258,14 @@
('js/algolia.js', {'defer': 'defer'})
]
-html_logo = "_static/logo-white.svg"
+# html_logo = "_static/logo-white.svg"
+html_logo = None
+html_title = "Codio"
html_favicon = "_static/favicon.ico"
html_extra_path = ['robots.txt']
+html_permalinks_icon = Icons.permalinks_icon
+html_show_sphinx = False
+
+docsearch_app_id = "0MJO9504F8"
+docsearch_api_key = "7e59277e32050e11c2e8915f1b09d6e2"
+docsearch_index_name = "CodioDocs"
diff --git a/student-source/courses.rst b/student-source/courses.rst
index 07e2584a..a0d361de 100644
--- a/student-source/courses.rst
+++ b/student-source/courses.rst
@@ -8,7 +8,7 @@ Your Courses
------------
.. toctree::
- :maxdepth: 2
+ :maxdepth: 3
:hidden:
students/courses/courses
diff --git a/student-source/develop.rst b/student-source/develop.rst
index 2e6d6027..410b36d4 100644
--- a/student-source/develop.rst
+++ b/student-source/develop.rst
@@ -8,7 +8,7 @@ Developing Code
===============
.. toctree::
- :maxdepth: 1
+ :maxdepth: 3
:hidden:
develop/develop/projects/projects
diff --git a/student-source/student.rst b/student-source/student.rst
index 98f65283..70ed4e68 100644
--- a/student-source/student.rst
+++ b/student-source/student.rst
@@ -3,8 +3,8 @@ Welcome to CodioDocs's documentation!
.. toctree::
- :caption: Theme Documentation
- :maxdepth: 2
+ :caption: Documentation
+ :maxdepth: 3
Accessing Codio
Your Courses