Skip to content

Commit 148ba97

Browse files
docs: add real screenshots, full feature pages, i18n (en/es), gallery, lightbox, menu navigation guides (#5)
Co-authored-by: DistTopic <noreply@github.com>
1 parent 4b7a492 commit 148ba97

48 files changed

Lines changed: 2076 additions & 122 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
11
_site/
2+
site/
23
.sass-cache/
34
.jekyll-cache/
45
.jekyll-metadata
56
vendor/
7+
.venv/
68
node_modules/
79
.bundle/
810
.DS_Store

docs/assets/css/custom.css

Lines changed: 193 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,193 @@
1+
/* ── DistTopic custom light theme ────────────────────────────── */
2+
3+
/* Language selector button — garante visibilidade no header claro */
4+
.md-header__button {
5+
color: rgba(255,255,255,0.87) !important;
6+
}
7+
.md-header__button:hover {
8+
color: #fff !important;
9+
}
10+
11+
/* Dropdown do seletor de idioma */
12+
.md-select__inner {
13+
background-color: #fff !important;
14+
border: 1px solid #e0e0e0 !important;
15+
box-shadow: 0 4px 16px rgba(0,0,0,0.12) !important;
16+
}
17+
.md-select__link {
18+
color: #37474f !important;
19+
}
20+
.md-select__link:hover,
21+
.md-select__link--active {
22+
color: #3f51b5 !important;
23+
background-color: rgba(63,81,181,0.08) !important;
24+
}
25+
26+
/* ── Gallery grid ─────────────────────────────────────────────── */
27+
.gallery-grid {
28+
display: grid;
29+
grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
30+
gap: 1.25rem;
31+
margin: 1.5rem 0;
32+
}
33+
34+
.gallery-item {
35+
/* button reset */
36+
-webkit-appearance: none;
37+
appearance: none;
38+
padding: 0;
39+
cursor: pointer;
40+
font: inherit;
41+
width: 100%;
42+
/* card */
43+
display: block;
44+
text-decoration: none !important;
45+
border-radius: 10px;
46+
overflow: hidden;
47+
border: 1px solid #e0e0e0;
48+
background: #0d1117;
49+
box-shadow: 0 2px 8px rgba(0,0,0,0.07);
50+
transition: box-shadow .2s ease, transform .2s ease;
51+
color: inherit !important;
52+
}
53+
54+
.gallery-item:hover {
55+
box-shadow: 0 8px 28px rgba(0,0,0,0.16);
56+
transform: translateY(-3px);
57+
}
58+
59+
.gallery-item figure {
60+
margin: 0;
61+
}
62+
63+
.gallery-thumb {
64+
overflow: hidden;
65+
line-height: 0;
66+
}
67+
68+
.gallery-item img {
69+
display: block;
70+
width: 100%;
71+
height: auto;
72+
transition: transform .35s ease;
73+
border: none !important;
74+
border-radius: 0 !important;
75+
box-shadow: none !important;
76+
margin: 0 !important;
77+
}
78+
79+
.gallery-item:hover img {
80+
transform: scale(1.04);
81+
}
82+
83+
.gallery-item figcaption {
84+
padding: .75rem 1rem .85rem;
85+
background: #fff;
86+
border-top: 1px solid #e0e0e0;
87+
}
88+
89+
.gallery-item figcaption strong {
90+
display: block;
91+
color: #263238;
92+
font-size: .875rem;
93+
font-weight: 600;
94+
margin-bottom: .25rem;
95+
}
96+
97+
.gallery-item figcaption span {
98+
color: #546e7a;
99+
font-size: .78rem;
100+
line-height: 1.45;
101+
display: block;
102+
}
103+
104+
/* ── Lightbox dialog ─────────────────────────────────────────── */
105+
#gallery-lightbox {
106+
border: none;
107+
padding: 0;
108+
background: transparent;
109+
box-shadow: none;
110+
max-width: none;
111+
max-height: none;
112+
overflow: visible;
113+
}
114+
115+
#gallery-lightbox::backdrop {
116+
background: rgba(0, 0, 0, 0.88);
117+
cursor: zoom-out;
118+
}
119+
120+
.lb-wrap {
121+
position: relative;
122+
}
123+
124+
.lb-close {
125+
position: absolute;
126+
top: -2.25rem;
127+
right: 0;
128+
width: 2rem;
129+
height: 2rem;
130+
background: rgba(255, 255, 255, 0.15);
131+
border: 1px solid rgba(255, 255, 255, 0.35);
132+
border-radius: 50%;
133+
color: #fff;
134+
font-size: 1.1rem;
135+
line-height: 1;
136+
cursor: pointer;
137+
display: flex;
138+
align-items: center;
139+
justify-content: center;
140+
transition: background 0.15s;
141+
}
142+
143+
.lb-close:hover {
144+
background: rgba(255, 255, 255, 0.28);
145+
}
146+
147+
.lb-img {
148+
display: block;
149+
max-width: min(90vw, 960px);
150+
max-height: 88vh;
151+
border-radius: 8px;
152+
box-shadow: 0 12px 48px rgba(0, 0, 0, 0.55);
153+
cursor: default;
154+
}
155+
156+
/* ── Tables ──────────────────────────────────────────────────── */
157+
.md-typeset__table {
158+
width: 100%;
159+
min-width: 100%;
160+
}
161+
162+
.md-typeset__table table {
163+
display: table !important;
164+
width: 100% !important;
165+
}
166+
167+
.md-typeset table {
168+
display: table !important;
169+
width: 100% !important;
170+
}
171+
172+
.md-typeset table th {
173+
text-align: center !important;
174+
white-space: nowrap;
175+
}
176+
177+
.md-typeset table td {
178+
text-align: center !important;
179+
}
180+
181+
.md-typeset table th:first-child,
182+
.md-typeset table td:first-child {
183+
text-align: left !important;
184+
}
185+
186+
/* Scrollbar fina */
187+
* {
188+
scrollbar-width: thin;
189+
scrollbar-color: #bdbdbd transparent;
190+
}
191+
::-webkit-scrollbar { width: 6px; height: 6px; }
192+
::-webkit-scrollbar-thumb { background-color: #bdbdbd; border-radius: 3px; }
193+
::-webkit-scrollbar-track { background: transparent; }

docs/assets/css/github-dark.css

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -490,6 +490,35 @@ code, pre, kbd, samp,
490490
color: var(--gh-blue) !important;
491491
}
492492

493+
/* ── Language selector ────────────────────────────────────────── */
494+
/* Material uses --md-primary-bg-color for header icons, which in our
495+
custom palette equals the header background → invisible. Force fg. */
496+
.md-header__button,
497+
.md-header__option .md-header__button {
498+
color: var(--gh-fg-muted) !important;
499+
}
500+
501+
.md-header__button:hover {
502+
color: var(--gh-fg) !important;
503+
}
504+
505+
/* Language picker dropdown */
506+
.md-select__inner {
507+
background-color: var(--gh-canvas-subtle) !important;
508+
border: 1px solid var(--gh-border) !important;
509+
box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
510+
}
511+
512+
.md-select__link {
513+
color: var(--gh-fg-muted) !important;
514+
}
515+
516+
.md-select__link:hover,
517+
.md-select__link--active {
518+
color: var(--gh-blue) !important;
519+
background-color: var(--gh-blue-muted) !important;
520+
}
521+
493522
/* ── Scrollbar ────────────────────────────────────────────────── */
494523
* {
495524
scrollbar-width: thin;
173 KB
Loading
2.3 MB
Loading
2.83 MB
Loading
25.7 KB
Loading
44.2 KB
Loading
88.5 KB
Loading
54.2 KB
Loading

0 commit comments

Comments
 (0)