Skip to content

Commit 6e1bd9e

Browse files
Done
1 parent 945ac80 commit 6e1bd9e

12 files changed

Lines changed: 332 additions & 94 deletions

File tree

.codio

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@
77
},
88
// Preview button configuration
99
"preview": {
10-
"Preview": "https://{{domain}}/build/html/index.html",
10+
"Instructor": "https://{{domain}}/build/html/index.html",
11+
"Student": "https://{{domain}}/build/html/student.html",
1112
"Visit Ungit": "https://{{domain4000}}/#/repository?path=%2Fhome%2Fcodio%2Fworkspace"
1213

1314

.github/workflows/deploy.yaml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ jobs:
1010
runs-on: ubuntu-latest
1111
steps:
1212
- name: Setup env
13-
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
13+
run: pip install sphinx==8.2.0 sphinxawesome-theme==5.3.2 sphinx-docsearch sphinx-sitemap sphinx_code_tabs recommonmark
1414

1515
- name: Checkout
1616
uses: actions/checkout@v1

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ If using Codio, put on the certified Python stack `Python Ubuntu 22.04 (pyenv)`.
88
### Install
99

1010
```
11-
pip install sphinx==8.2.0 sphinxawesome-theme=5.3.2 sphinx-sitemap sphinx_code_tabs recommonmark
11+
pip install sphinx==8.2.0 sphinxawesome-theme==5.3.2 sphinx-docsearch sphinx-sitemap sphinx_code_tabs recommonmark
1212
```
1313

1414
### Build

source/_static/css/codio.css

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -225,24 +225,25 @@
225225
.bd-content a.reference {
226226
font-weight: 600;
227227
}
228+
228229
.small-text {
229230
font-size: 0.85em;
230231
}
232+
231233
.tiny {
232234
font-size: 0.75em;
233-
}
235+
}
234236

235237
.float-right {
236238
float: right; width: 300px; margin-left: 50px;
237-
}
239+
}
238240

239241
header img[src$="logo-white.svg"],
240242
header img[src$="logo-dark.svg"] {
241243
height: 32px !important;
242244
width: auto !important;
243245
}
244246

245-
/* header .brand .site-name, */
246247
header span.font-bold {
247248
display: none !important;
248249
}

source/conf.py

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@
1919
from sphinxawesome_theme.postprocess import Icons
2020
from sphinxawesome_theme import ThemeOptions
2121
from datetime import date
22-
2322
from dataclasses import asdict
2423

2524
# -- Project information -----------------------------------------------------
@@ -33,7 +32,7 @@
3332
":tocdepth: 3",
3433
" ",
3534
".. meta::",
36-
" :keywords: Documentation,Sphinx,Python,Tailwind",
35+
" :keywords: Documentation,Codio",
3736
".. |rst| replace:: reStructuredText",
3837
".. |product| replace:: Documentation",
3938
".. |conf| replace:: File: conf.py",
@@ -62,6 +61,7 @@
6261
'sphinx.ext.todo',
6362
'sphinx.ext.coverage',
6463
'sphinx.ext.mathjax',
64+
'sphinx_docsearch',
6565
'sphinx.ext.ifconfig',
6666
'sphinx.ext.viewcode',
6767
'sphinx.ext.githubpages',
@@ -266,3 +266,7 @@
266266
html_extra_path = ['robots.txt']
267267
html_permalinks_icon = Icons.permalinks_icon
268268
html_show_sphinx = False
269+
270+
docsearch_app_id = "0MJO9504F8"
271+
docsearch_api_key = "7e59277e32050e11c2e8915f1b09d6e2"
272+
docsearch_index_name = "CodioDocs"

student-source/_static/css/codio.css

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -225,3 +225,32 @@
225225
.bd-content a.reference {
226226
font-weight: 600;
227227
}
228+
229+
.small-text {
230+
font-size: 0.85em;
231+
}
232+
233+
.tiny {
234+
font-size: 0.75em;
235+
}
236+
237+
.float-right {
238+
float: right; width: 300px; margin-left: 50px;
239+
}
240+
241+
header img[src$="logo-white.svg"],
242+
header img[src$="logo-dark.svg"] {
243+
height: 32px !important;
244+
width: auto !important;
245+
}
246+
247+
header span.font-bold {
248+
display: none !important;
249+
}
250+
251+
@media (prefers-color-scheme: dark) {
252+
html { background: #0b0d17; }
253+
}
254+
@media (prefers-color-scheme: light) {
255+
html { background: #ffffff; }
256+
}
Lines changed: 165 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,174 @@
1-
body {
2-
background-color: #02064e;
1+
/* =========================================
2+
Codio Docs — Home (index) only
3+
Pure theme background, centered layout
4+
========================================= */
5+
6+
/* Hide sidebars on the homepage and center content */
7+
/* Center & unbox the student page just like the home page */
8+
.student-page .bd-sidebar-primary,
9+
.student-page .bd-sidebar-secondary { display: none !important; }
10+
11+
.student-page .bd-content,
12+
.student-page .bd-article-container {
13+
max-width: 1200px;
14+
margin-inline: auto !important;
15+
padding-inline: 1rem;
16+
background: transparent !important;
17+
}
18+
19+
/* Share the same theme tokens */
20+
html[data-theme="dark"] .student-page,
21+
[data-theme="dark"] .student-page {
22+
--text: #e6eaf2;
23+
--muted: #9aa3b2;
24+
--border: rgba(255,255,255,0.14);
25+
--surface-hover: rgba(255,255,255,0.06);
26+
--brand: #6ee7ff;
27+
--brand-strong: #3dd8ff;
28+
--ring: #9feaff;
29+
--shadow: 0 10px 26px rgba(3,8,48,0.35);
30+
}
31+
html[data-theme="light"] .student-page,
32+
[data-theme="light"] .student-page {
33+
--text: #0b1020;
34+
--muted: #475569;
35+
--border: rgba(0,0,0,0.12);
36+
--surface-hover: rgba(2,132,199,0.05);
37+
--brand: #0ea5e9;
38+
--brand-strong: #0284c7;
39+
--ring: #38bdf8;
40+
--shadow: 0 10px 24px rgba(2,132,199,0.08);
41+
}
42+
43+
.index-page .bd-sidebar-primary,
44+
.index-page .bd-sidebar-secondary { display: none !important; }
45+
46+
.index-page .bd-content,
47+
.index-page .bd-article-container {
48+
max-width: 100%;
49+
margin-inline: auto !important;
50+
padding-inline: 1rem;
51+
}
52+
53+
/* Make every wrapper transparent so there is NO boxed panel */
54+
.index-page,
55+
.index-page .bd-main,
56+
.index-page .bd-content,
57+
.index-page .bd-article-container,
58+
.index-page .bd-article {
59+
background: transparent !important;
360
}
461

5-
.footer {
6-
border-top: none;
62+
/* ------- Theme tokens (only for the homepage components) ------- */
63+
html[data-theme="dark"] .index-page,
64+
[data-theme="dark"] .index-page {
65+
--text: #e6eaf2;
66+
--muted: #9aa3b2;
67+
--border: rgba(255,255,255,0.14);
68+
--surface-hover: rgba(255,255,255,0.06);
69+
--brand: #6ee7ff;
70+
--brand-strong: #3dd8ff;
71+
--ring: #9feaff;
72+
--shadow: 0 10px 26px rgba(3,8,48,0.35);
773
}
874

9-
.container-xl .row {
10-
justify-content: center;
75+
html[data-theme="light"] .index-page,
76+
[data-theme="light"] .index-page {
77+
--text: #0b1020;
78+
--muted: #475569;
79+
--border: rgba(0,0,0,0.12);
80+
--surface-hover: rgba(2,132,199,0.05);
81+
--brand: #0ea5e9;
82+
--brand-strong: #0284c7;
83+
--ring: #38bdf8;
84+
--shadow: 0 10px 24px rgba(2,132,199,0.08);
1185
}
1286

13-
.container-xl .no-sidebar {
14-
display: none !important;
87+
/* Fallback to OS pref if the site doesn't set data-theme */
88+
@media (prefers-color-scheme: light) {
89+
html:not([data-theme="dark"]) .index-page {
90+
--text: #0b1020;
91+
--muted: #475569;
92+
--border: rgba(0,0,0,0.12);
93+
--surface-hover: rgba(2,132,199,0.05);
94+
--brand: #0ea5e9;
95+
--brand-strong: #0284c7;
96+
--ring: #38bdf8;
97+
--shadow: 0 10px 24px rgba(2,132,199,0.08);
98+
}
1599
}
16100

17-
.container-xl .d-none {
18-
display: none !important;
101+
/* ------- Hero ------- */
102+
.home-hero { padding: 5rem 1rem 1.5rem; text-align: center; }
103+
.home-title { color: var(--text); font-size: clamp(2rem, 2.8vw + 1rem, 3rem); margin: 0 0 .6rem; }
104+
.home-subtitle { color: var(--muted); margin: 0 auto 1.8rem; max-width: 62ch; }
105+
106+
/* (Search form is commented out in your HTML, but styles left here in case you re-enable) */
107+
.home-search {
108+
display: inline-flex; gap: .5rem; align-items: center;
109+
background: transparent; /* no panel */
110+
border: 1px solid var(--border);
111+
border-radius: 999px; padding: .5rem;
112+
box-shadow: none;
113+
}
114+
.home-search input[type="search"] {
115+
min-width: clamp(260px, 42vw, 560px);
116+
background: transparent; border: none; color: var(--text);
117+
outline: none; padding: .75rem 1rem; font-size: 1rem;
118+
}
119+
.home-search input::placeholder { color: var(--muted); }
120+
.search-btn {
121+
display: inline-flex; align-items: center; gap: .5rem;
122+
border: 1px solid transparent;
123+
background: linear-gradient(180deg, var(--brand), var(--brand-strong));
124+
color: #001; font-weight: 700; padding: .7rem 1rem;
125+
border-radius: 999px; cursor: pointer;
126+
box-shadow: 0 10px 24px rgba(0, 190, 255, .18);
127+
}
128+
.search-btn:focus-visible { outline: 3px solid var(--ring); outline-offset: 2px; }
129+
.search-btn .icon { width: 20px; height: 20px; }
130+
131+
/* ------- Sections ------- */
132+
.home-main { padding: .5rem 0 3rem; }
133+
.home-container { max-width: 1100px; margin-inline: auto; padding-inline: 1rem; }
134+
.section { margin-top: 1.25rem; }
135+
.section-title { color: var(--muted); font-weight: 600; letter-spacing: .2px; margin: 0 0 1rem; }
136+
137+
/* ------- Cards: transparent by default (no fill), subtle outline ------- */
138+
.card-grid {
139+
--min: 260px;
140+
display: grid; grid-template-columns: repeat(auto-fit, minmax(var(--min), 1fr));
141+
gap: 1rem; align-items: stretch;
142+
}
143+
.card {
144+
display: grid; grid-template-rows: auto auto 1fr auto; gap: .5rem;
145+
padding: 1rem; border-radius: 16px; text-decoration: none; color: var(--text);
146+
background: transparent; /* <- no box */
147+
border: 1px solid var(--border);
148+
box-shadow: none;
149+
transition: transform .2s ease, background-color .15s ease, border-color .15s ease;
150+
}
151+
.card:hover { transform: translateY(-2px); background: var(--surface-hover); border-color: var(--brand); }
152+
.card:focus-visible { outline: 3px solid var(--ring); outline-offset: 2px; }
153+
154+
.card-icon {
155+
width: 36px; height: 36px; display: grid; place-items: center;
156+
border-radius: 12px;
157+
background: linear-gradient(180deg, var(--brand), var(--brand-strong));
158+
box-shadow: 0 8px 18px rgba(0, 190, 255, .2);
159+
}
160+
.card-icon svg { width: 22px; height: 22px; fill: #001; }
161+
162+
.card-title { font-size: 1.05rem; margin: .25rem 0; }
163+
.card-desc { margin: 0; color: var(--muted); }
164+
.card-cta { margin-top: .5rem; font-weight: 700; color: var(--brand); display: inline-flex; gap: .35rem; }
165+
.card-cta::after { content: "›"; font-size: 1.2em; transform: translateY(-1px); }
166+
167+
/* Reduced motion */
168+
@media (prefers-reduced-motion: reduce) { .card, .search-btn { transition: none; } }
169+
170+
/* Small screens */
171+
@media (max-width: 480px) {
172+
.home-search { width: 100%; }
173+
.home-search input[type="search"] { min-width: 0; width: 100%; }
19174
}
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
/* Slight width nudge only (kept minimal) */
2+
.index-page .home-container { max-width: 100%; }
3+
4+
/* Ensure any Bootstrap-like main column stays centered on the homepage */
5+
@media (min-width: 1200px) {
6+
.index-page .col-xl-8 {
7+
flex: 0 0 91.66667% !important;
8+
max-width: 91.66667% !important;
9+
margin-left: auto !important;
10+
margin-right: auto !important;
11+
}
12+
}

student-source/_static/favicon.ico

-1.63 KB
Binary file not shown.
Lines changed: 7 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)