Skip to content

Commit 3275ee7

Browse files
author
pixelead0
committed
Se cambian emoticones por FontAwesome Icons
1 parent 059197c commit 3275ee7

File tree

2 files changed

+149
-73
lines changed

2 files changed

+149
-73
lines changed

‎docs/css/custom.css‎

Lines changed: 143 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
1+
/* Import FontAwesome CSS */
2+
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css');
3+
14
/* Python CDMX Custom Styles */
25
:root {
36
--python-green: #269f46;
@@ -9,6 +12,40 @@
912
--python-light-gray: #f5f5f5;
1013
}
1114

15+
/* FontAwesome Icons Support */
16+
.fab, .fas, .far, .fal {
17+
font-family: "Font Awesome 6 Free", "Font Awesome 6 Brands", "Font Awesome 6 Solid", "Font Awesome 6 Regular", "Font Awesome 6 Light";
18+
font-weight: 900;
19+
font-style: normal;
20+
font-variant: normal;
21+
text-rendering: auto;
22+
-webkit-font-smoothing: antialiased;
23+
}
24+
25+
.fab {
26+
font-family: "Font Awesome 6 Brands";
27+
font-weight: 400;
28+
}
29+
30+
.fas {
31+
font-family: "Font Awesome 6 Free";
32+
font-weight: 900;
33+
}
34+
35+
.far {
36+
font-family: "Font Awesome 6 Free";
37+
font-weight: 400;
38+
}
39+
40+
/* Ensure FontAwesome icons are visible */
41+
i[class*="fa-"] {
42+
display: inline-block;
43+
font-style: normal;
44+
font-variant: normal;
45+
text-rendering: auto;
46+
-webkit-font-smoothing: antialiased;
47+
}
48+
1249
/* Hero Section */
1350
.hero-section {
1451
background: linear-gradient(135deg, var(--python-green) 0%, var(--python-black) 100%);
@@ -211,12 +248,12 @@
211248
}
212249

213250
.btn-secondary {
214-
background: var(--python-light-gray);
215-
color: var(--python-gray);
251+
background: var(--python-gray);
252+
color: white;
216253
}
217254

218255
.btn-secondary:hover {
219-
background: #e0e0e0;
256+
background: #555;
220257
transform: translateY(-2px);
221258
}
222259

@@ -233,25 +270,25 @@
233270
/* Status badges */
234271
.status-badge {
235272
display: inline-block;
236-
padding: 0.3rem 0.8rem;
273+
padding: 0.25rem 0.75rem;
237274
border-radius: 15px;
238275
font-size: 0.8rem;
239-
font-weight: 500;
276+
font-weight: 600;
240277
}
241278

242279
.status-completed {
243-
background: rgba(38, 159, 70, 0.1);
244-
color: var(--python-green);
280+
background: var(--python-green);
281+
color: white;
245282
}
246283

247284
.status-upcoming {
248-
background: rgba(227, 47, 66, 0.1);
249-
color: var(--python-red);
285+
background: var(--python-red);
286+
color: white;
250287
}
251288

252289
.status-planned {
253-
background: rgba(102, 102, 102, 0.1);
254-
color: var(--python-gray);
290+
background: var(--python-gray);
291+
color: white;
255292
}
256293

257294
/* Responsive Design */
@@ -278,24 +315,25 @@
278315
}
279316
}
280317

281-
/* Dark mode adjustments */
318+
/* Dark mode support */
282319
[data-md-color-scheme="slate"] {
283-
--python-light-gray: #2d3748;
320+
--python-light-gray: #2d2d2d;
284321
}
285322

286323
[data-md-color-scheme="slate"] .stat-card,
287324
[data-md-color-scheme="slate"] .feature-card,
288325
[data-md-color-scheme="slate"] .meetup-card,
289326
[data-md-color-scheme="slate"] .community-stats {
290-
background: var(--md-default-bg-color);
291-
border-color: var(--md-default-fg-color--lightest);
327+
background: #2d2d2d;
328+
border-color: #444;
329+
color: #fff;
292330
}
293331

294332
/* Animations */
295333
@keyframes fadeInUp {
296334
from {
297335
opacity: 0;
298-
transform: translateY(20px);
336+
transform: translateY(30px);
299337
}
300338
to {
301339
opacity: 1;
@@ -315,7 +353,7 @@
315353
}
316354

317355
::-webkit-scrollbar-track {
318-
background: var(--python-light-gray);
356+
background: #f1f1f1;
319357
}
320358

321359
::-webkit-scrollbar-thumb {
@@ -327,120 +365,152 @@
327365
background: var(--python-light-green);
328366
}
329367

330-
/* Estilos adaptados del ejemplo Materialize/website.css */
331-
368+
/* Utility classes */
332369
.pyred {
333-
background-color: #E25D60 !important;
370+
color: var(--python-red);
334371
}
335372

336373
.pygreen {
337-
background-color: #468A2E !important;
374+
color: var(--python-green);
338375
}
339376

377+
/* Parallax effect for hero sections */
340378
.parallax-container {
341-
min-height: 380px;
342-
line-height: 0;
343-
height: auto;
344-
color: rgba(255, 255, 255, .9);
345-
background: #000000AA;
346379
position: relative;
347380
overflow: hidden;
348-
border-radius: 16px;
349-
margin-bottom: 2rem;
381+
background: linear-gradient(135deg, var(--python-green) 0%, var(--python-black) 100%);
382+
color: white;
383+
padding: 4rem 2rem;
384+
margin: 2rem 0;
385+
border-radius: 15px;
350386
}
351387

352388
.parallax-container .section {
353-
width: 100%;
389+
position: relative;
390+
z-index: 2;
354391
}
355392

356393
.parallax-img {
357-
opacity: 0.5;
358-
width: 100%;
359-
height: auto;
360-
object-fit: cover;
361394
position: absolute;
362395
top: 0;
363396
left: 0;
364-
z-index: 0;
397+
width: 100%;
398+
height: 100%;
399+
background-size: cover;
400+
background-position: center;
401+
opacity: 0.1;
402+
z-index: 1;
365403
}
366404

405+
/* Floating action button with SVG */
367406
.btn-floating-svg {
368-
padding-left: 10px;
369-
padding-right: 10px;
370-
padding-top: 5px;
407+
position: fixed;
408+
bottom: 2rem;
409+
right: 2rem;
410+
width: 60px;
411+
height: 60px;
412+
border-radius: 50%;
413+
background: var(--python-green);
414+
color: white;
415+
display: flex;
416+
align-items: center;
417+
justify-content: center;
418+
text-decoration: none;
419+
box-shadow: 0 4px 12px rgba(0,0,0,0.3);
420+
transition: all 0.3s ease;
421+
z-index: 1000;
371422
}
372423

373-
/* Responsive tweaks for parallax */
424+
/* Responsive adjustments */
374425
@media only screen and (max-width : 992px) {
375426
.parallax-container .section {
376-
position: absolute;
377-
top: 40%;
427+
padding: 2rem 1rem;
378428
}
429+
379430
#index-banner .section {
380-
top: 10%;
431+
margin-top: 10%;
381432
}
382433
}
434+
383435
@media only screen and (max-width : 600px) {
384436
#index-banner .section {
385-
top: 0;
437+
margin-top: 15%;
438+
}
439+
440+
.btn-floating-svg {
441+
width: 50px;
442+
height: 50px;
443+
bottom: 1rem;
444+
right: 1rem;
386445
}
387446
}
388447

389-
/* Clickable tags */
448+
/* Tag filtering styles */
390449
.tag-filter {
391-
cursor: pointer;
392-
transition: all 0.3s ease;
393-
text-decoration: none;
394-
display: inline-block;
450+
display: inline-block;
451+
padding: 0.5rem 1rem;
452+
margin: 0.25rem;
453+
background: var(--python-light-gray);
454+
color: var(--python-green);
455+
border: 2px solid var(--python-green);
456+
border-radius: 25px;
457+
text-decoration: none;
458+
font-weight: 600;
459+
transition: all 0.3s ease;
460+
cursor: pointer;
395461
}
396462

397463
.tag-filter:hover {
398-
transform: translateY(-2px);
399-
box-shadow: 0 4px 12px rgba(0,0,0,0.2);
464+
background: var(--python-green);
465+
color: white;
466+
transform: translateY(-2px);
400467
}
401468

402469
.tag-filter.active {
403-
border: 2px solid #fff;
404-
box-shadow: 0 0 0 2px #007bff;
470+
background: var(--python-green);
471+
color: white;
472+
box-shadow: 0 4px 12px rgba(38, 159, 70, 0.3);
405473
}
406474

407-
/* Meetup cards for filtering */
475+
/* Meetup card filtering */
408476
.meetup-card {
409-
transition: all 0.3s ease;
477+
transition: all 0.3s ease;
410478
}
411479

412480
.meetup-card.hidden {
413-
display: none;
481+
display: none;
414482
}
415483

416-
/* Tag filter container */
484+
/* Tag filters container */
417485
.tag-filters {
418-
text-align: center;
419-
margin: 2rem 0;
420-
padding: 1rem;
421-
background: #f8f9fa;
422-
border-radius: 12px;
486+
text-align: center;
487+
margin: 2rem 0;
488+
padding: 1rem;
489+
background: white;
490+
border-radius: 15px;
491+
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
423492
}
424493

425494
.tag-filters h3 {
426-
margin-bottom: 1rem;
427-
color: #333;
495+
margin-bottom: 1rem;
496+
color: var(--python-green);
428497
}
429498

430499
/* Clear filters button */
431500
.clear-filters {
432-
background: #6c757d;
433-
color: white;
434-
padding: 0.5rem 1rem;
435-
border-radius: 20px;
436-
text-decoration: none;
437-
font-weight: 600;
438-
margin-left: 1rem;
439-
transition: all 0.3s ease;
501+
display: inline-block;
502+
padding: 0.5rem 1rem;
503+
background: var(--python-gray);
504+
color: white;
505+
border: none;
506+
border-radius: 20px;
507+
text-decoration: none;
508+
font-weight: 600;
509+
margin-left: 1rem;
510+
transition: all 0.3s ease;
440511
}
441512

442513
.clear-filters:hover {
443-
background: #5a6268;
444-
color: white;
445-
text-decoration: none;
514+
background: #555;
515+
transform: translateY(-2px);
446516
}

‎mkdocs.yml‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -70,6 +70,12 @@ theme:
7070
- search.suggest
7171
- toc.follow
7272

73+
# FontAwesome configuration
74+
icon:
75+
repo: fontawesome/brands/github
76+
edit: fontawesome/solid/pen-to-square
77+
view: fontawesome/solid/eye
78+
7379
# Navigation
7480
nav:
7581
- Inicio: index.md

0 commit comments

Comments
 (0)