Skip to content

Commit

Permalink
test multiple adjusts
Browse files Browse the repository at this point in the history
  • Loading branch information
cosmoscalibur committed May 25, 2024
1 parent b17cbb7 commit b49ca46
Show file tree
Hide file tree
Showing 613 changed files with 7,285 additions and 10,235 deletions.
19 changes: 16 additions & 3 deletions conf.py
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,9 @@

# OpenGraph config
ogp_site_url = 'https://www.cosmoscalibur.com'
ogp_custom_meta_tags = [
'<meta name="twitter:creator" content="@cosmoscalibur" />',
]

# -- Blog Post Related --------------------------------------------------------
post_date_format = '%Y-%m-%d'
Expand Down Expand Up @@ -38,7 +41,8 @@
"sphinxcontrib.youtube",
'ablog',
'sphinx_sitemap',
'sphinx_copybutton'
'sphinx_copybutton',
'sphinx_tippy',
]

sitemap_url_scheme = '{link}'
Expand Down Expand Up @@ -77,7 +81,7 @@
'github_url': 'https://github.com/cosmoscalibur/',
}
# Después, esto servirá para separar local de desplegado con Action
html_theme_options['analytics'] = {'google_analytics_id': 'G-4YFQBC69LB'}
#html_theme_options['analytics'] = {'google_analytics_id': 'G-4YFQBC69LB'}
html_title = 'Cosmoscalibur'
html_short_title = 'Cosmoscalibur'

Expand All @@ -89,7 +93,7 @@
# pixels large.
# html_favicon = None

html_static_path = ["static"]
html_static_path = ['static']
html_extra_path = ['files']
ablog_website = 'docs'
templates_path = ["templates"]
Expand All @@ -110,6 +114,15 @@

html_show_sourcelink = False

html_css_files = ['tippy.css']
tippy_enable_mathjax = True
tippy_anchor_parent_selector = "article.bd-article"
tippy_enable_wikitips = True
tippy_enable_doitips = False
tippy_enable_mathjax= False
tippy_rtd_urls = []
tippy_skip_anchor_classes = ("headerlink", "sd-stretched-link")

# If true, an OpenSearch description file will be output, and all pages will
# contain a <link> tag referring to it. The value of this option must be the
# base URL from which the finished HTML is served.
Expand Down
2 changes: 1 addition & 1 deletion docs/.buildinfo
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# Sphinx build info version 1
# This file hashes the configuration used when building these files. When it is not found, a full rebuild will be done.
config: e1358357a01f00a6794b8d8aab941991
config: 8fffee3debf53e56d9a5dcd86e99ffd5
tags: d77d1c0d9ca2f4c8421862c7c5a0d620
62 changes: 52 additions & 10 deletions docs/_sources/es/blog/2024/crear-un-blog-con-sphinx.md.txt
Original file line number Diff line number Diff line change
Expand Up @@ -71,19 +71,20 @@ internacionalización que deseo, tendré que cambiarlo en el futuro.
Copy button nos ayudará a crear la opción de copiar al portapapeles los bloques
de código.

Y finalmente, Tippy, me encanta la opción de mostrar un _hover_ sobre los enlaces.

Con estos detalles, nuestro archivo `requirements.txt` lucirá de la siguiente forma:

```
# Generación estática blog
# Generación estática blog y tema
sphinx
ablog

# Tema y componentes
pydata-sphinx-theme

# Componentes
sphinx-design
sphinx-copybutton

# Mostrar Youtube
sphinx-tippy
sphinxcontrib-youtube

# Metadatos para compartir en redes
Expand All @@ -94,6 +95,7 @@ sphinx-sitemap
# Soporte de Markdown y Notebook
myst-parser
jupyterlab
jupyterlab_myst
myst-nb
```

Expand All @@ -120,6 +122,7 @@ Si usamos además VSCode, vale la pena las siguientes extensiones:
- Jupyter: Para manipular notebooks
- Emoji: Para insertar emoji con la paleta de comandos 😀
- Spell Right: Para corrección de ortografía.
- Font Awesome Gallery: Para buscar la notación de los íconos {fa}`rocket`
:::

:::{dropdown} Otros
Expand Down Expand Up @@ -172,10 +175,16 @@ usaremos el tema de PyData y podemos retirar alabaster del _import_.
html_theme = 'pydata_sphinx_theme'
```

Para incluir los metadatos de OpenGraph, añadiremos la dirección base.
Para incluir los metadatos de OpenGraph, añadiremos la dirección base y podemos
añadir marcas personalizadas. Así, que aprovecharé a incluir la de creador para
Twitter {fa}`twitter-square` (ahora X), y la especificación de tipo viene por defecto
en `summary_large_image` (esto no encontré como cambiarlo).

```python
ogp_site_url = 'https://www.cosmoscalibur.com'
ogp_custom_meta_tags = [
'<meta name="twitter:creator" content="@cosmoscalibur" />',
]
```

Para configurar el idioma por defecto, usamos la variable respectiva con el
Expand Down Expand Up @@ -213,11 +222,29 @@ el archivo CNAME).
Importante para la generación con GitHub Pages, el directorio de salida debe
ser `docs`.

Para usar _tippy_ necesitamos incluir un ajuste de CSS, pero esto es dependiente
del tema. En Pydata es

:::{code-block} css

.tippy-box {
background-color:var(--pst-color-surface);
color:var(--pst-color-text-base);
border: 1px solid var(--pst-color-border);
}
:::

Finalmente, las variables de configuración en `conf.py`.

```python
templates_path = ['templates']
html_static_path = ['static']
html_extra_path = ['files']
ablog_website = 'docs'

html_css_files = ['tippy.css']
tippy_skip_anchor_classes = ("headerlink", "sd-stretched-link", "sd-rounded-pill")
tippy_anchor_parent_selector = "article.bd-article"
```

Ahora vamos a definir los archivos que no deben ser procesados. Esto es
Expand Down Expand Up @@ -273,7 +300,8 @@ extensions = [
"sphinxcontrib.youtube",
'ablog',
'sphinx_sitemap',
'sphinx_copybutton'
'sphinx_copybutton',
'sphinx_tippy',
]
```

Expand Down Expand Up @@ -325,14 +353,18 @@ configuración del tema.
:::{code} python
html_theme_options = {
'show_toc_level': 2,
'analytics': {
'google_analytics_id': 'G-XXXXXXXXXX'
},
'twitter_url': 'https://twitter.com/cosmoscalibur',
'github_url': 'https://github.com/cosmoscalibur/',
}
# Después, esto servirá para separar local de desplegado con Action
html_theme_options['analytics'] = {'google_analytics_id': 'G-4YFQBC69LB'}
:::

Hemos separado la línea de _analytics_ con el fin de deshabilitarla
fácilmente en pruebas, para que esto no afecte métricas (más adelante, el
ideal es hacerlo con despliegue automático en GitHub Actions y así dependiente
de una variable de entorno).

Respecto a los paneles laterales, haremos la siguiente configuración de momento

:::{code} python
Expand Down Expand Up @@ -499,3 +531,13 @@ De mi parte, algunos detalles que quiero próximamente
- [Myst Parser](https://myst-parser.readthedocs.io/en/latest/)
- [Migrating the website to Sphinx + ABlog](https://adriaanrol.com/posts/2023/sphinx_migration/)
- [Migration to Cloudflare Pages](https://dailystuff.nl/blog/2021/migration-to-cloudflare-pages)

:::{update} 2024-05-25

- Se agrega información extra sobre open graph para incluir marca de creador.
- Se agrega Tippy para incluir _hover_ en los enlaces (dependencia y extensión).
- Se incluye información sobre todas las extensiones de Myst Parser a la fecha.
- Se incluye extensión VSCode de Font Awesome Gallery.
- Explicación extra de analytics para deshabilitar en pruebas
- Se añaden más referencias.
:::
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,8 @@ número asociado en orden de aparición en la publicación. Esto se puede dejar
por defecto acorde a la variable en el archivo de configuración de `post_auto_image`.

El atributo de `.. description:` es tomado por defecto por truncamiento del primer
párrafo de la publicación (esto se usa en los metadatos de la publicación).
párrafo de la publicación (esto se usa en los metadatos de la publicación), pero también
podemos dejarlo si lo queremos personalizado (esto se hace con la extensión de open-graph).

El caso de `.. link:` se debe convertir en `:external_link:`.

Expand Down
5 changes: 5 additions & 0 deletions docs/_static/tippy.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
.tippy-box {
background-color:var(--pst-color-surface);
color:var(--pst-color-text-base);
border: 1px solid var(--pst-color-border);
}

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
selector_to_html = {"a[href=\"#la-flecha-temporal\"]": "<h1 class=\"tippy-header\" style=\"margin-top: 0;\">La flecha temporal<a class=\"headerlink\" href=\"#la-flecha-temporal\" title=\"Link to this heading\">#</a></h1><p>La flecha temporal es la designaci\u00f3n al flujo irreversible del tiempo,\nla representaci\u00f3n de la asimetr\u00eda del tiempo. Lo que se hizo, hecho\nesta y no hay vuelta atr\u00e1s. Solo podemos realizar acciones que\namortig\u00fcen los efectos producidos por el acontecimiento mas nunca\ncambiarlo o evitar haberlo hecho, o al menos por ahora a cuerpos\nmacrosc\u00f3picos como nosotros nos es imposible hacerlo.</p><p>Por esto pensaba yo, tambi\u00e9n que en ese transcurrir inexorable del\ntiempo, debemos preocuparnos por dejar algo trazado en el tiempo, en la\nhistoria, que no sea una simple flecha volando en el espacio vaci\u00f3 sin\nning\u00fan mensaje.</p>"}
skip_classes = ["headerlink", "sd-stretched-link"]

window.onload = function () {
for (const [select, tip_html] of Object.entries(selector_to_html)) {
const links = document.querySelectorAll(`article.bd-article ${select}`);
for (const link of links) {
if (skip_classes.some(c => link.classList.contains(c))) {
continue;
}

tippy(link, {
content: tip_html,
allowHTML: true,
arrow: true,
placement: 'auto-start', maxWidth: 500, interactive: false,

});
};
};
console.log("tippy tips loaded!");
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
selector_to_html = {"a[href=\"#nuestra-nariz-mas-vieja-que-los-pies\"]": "<h1 class=\"tippy-header\" style=\"margin-top: 0;\">Nuestra nariz m\u00e1s vieja que los pies<a class=\"headerlink\" href=\"#nuestra-nariz-mas-vieja-que-los-pies\" title=\"Link to this heading\">#</a></h1><p>La relatividad de Einstein abri\u00f3 un nuevo cap\u00edtulo en la f\u00edsica desde sus primeros apuntes en un tratado de la electrodin\u00e1mica de la luz. Desde la relatividad especial plantea ya un punto que separa rotundamente la nueva f\u00edsica a la f\u00edsica tradicional de Newton, y es la concepci\u00f3n no absoluta del espacio y el tiempo.</p><p>Ya en la relatividad especial encontramos que a mayor velocidad el tiempo nos transcurre mas lentamente que si estuvi\u00e9semos en reposo, as\u00ed dos gemelos, uno astronauta y otro un civil, el astronauta seria menor que su hermano (claro esta, por nanosegundos). Pero con la relatividad general, la exposici\u00f3n a campos gravitacionales produce el mismo efecto. A mayor campo gravitacional, el tiempo avanza mas lentamente.</p>"}
skip_classes = ["headerlink", "sd-stretched-link"]

window.onload = function () {
for (const [select, tip_html] of Object.entries(selector_to_html)) {
const links = document.querySelectorAll(`article.bd-article ${select}`);
for (const link of links) {
if (skip_classes.some(c => link.classList.contains(c))) {
continue;
}

tippy(link, {
content: tip_html,
allowHTML: true,
arrow: true,
placement: 'auto-start', maxWidth: 500, interactive: false,

});
};
};
console.log("tippy tips loaded!");
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
selector_to_html = {"a[href=\"#pensando-en-el-grafeno\"]": "<h1 class=\"tippy-header\" style=\"margin-top: 0;\">Pensando en el grafeno<a class=\"headerlink\" href=\"#pensando-en-el-grafeno\" title=\"Link to this heading\">#</a></h1><p>Aunque este material fue noticia ya hace un rato, vengo a pensar ahora en el porque sera mi tema de trabajo de grado.\nEste material fue noticia ya que por estudios de este material fue concedido el premio nobel de f\u00edsica a 2 f\u00edsicos rusos que trabajan en la Universidad de Manchester.</p><p>Este material tiene muchas caracter\u00edsticas muy peculiares, que atraen el inter\u00e9s no solo de la comunidad cient\u00edfica sino tambi\u00e9n ingenieril/industrial. Desde la industria resulta bastante interesante que sea un material extremadamente resistente y al mismo tiempo muy liviano (son capas formadas por estructuras de carbono hexagonal, estructuralmente con gran similaridad al grafito, de lo que esta hecho la mina de los lapices).</p>"}
skip_classes = ["headerlink", "sd-stretched-link"]

window.onload = function () {
for (const [select, tip_html] of Object.entries(selector_to_html)) {
const links = document.querySelectorAll(`article.bd-article ${select}`);
for (const link of links) {
if (skip_classes.some(c => link.classList.contains(c))) {
continue;
}

tippy(link, {
content: tip_html,
allowHTML: true,
arrow: true,
placement: 'auto-start', maxWidth: 500, interactive: false,

});
};
};
console.log("tippy tips loaded!");
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
selector_to_html = {"a[href=\"#bio\"]": "<aside class=\"footnote brackets\" id=\"bio\" role=\"doc-footnote\">\n<span class=\"label\"><span class=\"fn-bracket\">[</span><a href=\"#id2\" role=\"doc-backlink\">2</a><span class=\"fn-bracket\">]</span></span>\n<p><a class=\"reference external\" href=\"http://multimedia.mcb.harvard.edu/\">BioVisions</a>.</p>\n</aside>", "a[href=\"#recorrido-por-la-celula\"]": "<h1 class=\"tippy-header\" style=\"margin-top: 0;\">Recorrido por la c\u00e9lula<a class=\"headerlink\" href=\"#recorrido-por-la-celula\" title=\"Link to this heading\">#</a></h1><p>Creo que el mundo vivo a cualquier escala puede exhibir una majestuosa belleza, y que esta es inspiraci\u00f3n para que el arte cree una copia de la misma y la transmita.\nParte de esta belleza de la vida no solo esta en sus formas (reconstruidas por curvas matem\u00e1ticas, muchas de naturaleza fractal) sino tambi\u00e9n por su din\u00e1mica, compleja y precisa.</p>", "a[href=\"#ted\"]": "<aside class=\"footnote brackets\" id=\"ted\" role=\"doc-footnote\">\n<span class=\"label\"><span class=\"fn-bracket\">[</span><a href=\"#id3\" role=\"doc-backlink\">3</a><span class=\"fn-bracket\">]</span></span>\n<p><a class=\"reference external\" href=\"https://www.ted.com/talks/david_bolinsky_animates_a_cell\">Visualizing the wonder of a living cell</a> (Marzo de 2007).</p>\n</aside>", "a[href=\"#news\"]": "<aside class=\"footnote brackets\" id=\"news\" role=\"doc-footnote\">\n<span class=\"label\"><span class=\"fn-bracket\">[</span><a href=\"#id1\" role=\"doc-backlink\">1</a><span class=\"fn-bracket\">]</span></span>\n<p><a class=\"reference external\" href=\"http://www.studiodaily.com/2006/07/cellular-visions-the-inner-life-of-a-cell/\">StudioDaily</a> Cellular Visions: The Inner Life of a Cell (July 20, 2006).</p>\n</aside>"}
skip_classes = ["headerlink", "sd-stretched-link"]

window.onload = function () {
for (const [select, tip_html] of Object.entries(selector_to_html)) {
const links = document.querySelectorAll(`article.bd-article ${select}`);
for (const link of links) {
if (skip_classes.some(c => link.classList.contains(c))) {
continue;
}

tippy(link, {
content: tip_html,
allowHTML: true,
arrow: true,
placement: 'auto-start', maxWidth: 500, interactive: false,

});
};
};
console.log("tippy tips loaded!");
};
Loading

0 comments on commit b49ca46

Please sign in to comment.