Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve markdown snippets #388

Merged
merged 6 commits into from
Dec 1, 2023
Merged

Improve markdown snippets #388

merged 6 commits into from
Dec 1, 2023

Conversation

Aquaj
Copy link
Collaborator

@Aquaj Aquaj commented Dec 1, 2023

Summary of changes and context

Follow-up de #342. Inclut:

  • Gestion des fences ~~~ (qui sont autorisés par la spec)
  • Optionalité des info-strings (même sans le ruby après les backticks, on colore quand même basé sur le language du snippet)
  • Styling
  • Spec
    • Avant
      Capture d’écran 2023-12-01 à 14 24 06
    • Après
      Capture d’écran 2023-12-01 à 14 21 41

Sanity checks

  • Linters pass
  • Tests pass
  • Related GitHub issues are linked in the description

@Aquaj Aquaj changed the title Chore/improve markdown handling Improve markdown snippets Dec 1, 2023
Copy link
Collaborator

@wJoenn wJoenn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code block looks so much better !
Thanks for hearing me out 🙏

@pil0u
Copy link
Owner

pil0u commented Dec 1, 2023

C'est beau !

@Aquaj Aquaj merged commit 4a49a49 into main Dec 1, 2023
5 checks passed
@Aquaj Aquaj deleted the chore/improve-markdown-handling branch December 1, 2023 17:16
Copy link
Owner

@pil0u pil0u left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Quelques détails sur le CSS (juste la syntaxe, je challenge pas le style en lui-même), mais rien de bloquant.

Très cool de voir la feature un peu plus robuste 💯

@@ -29,7 +29,21 @@
}

.code-highlight pre {
@apply px-1 border border-aoc-gray-darker rounded;
@apply px-6 py-4 border border-aoc-gray-darker rounded;
@apply bg-dark !important;
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Il est nécessaire ce !important ?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pour l'instant oui. On a du style appliqué directement sur l'élément par Commonmarker, c'est la seule façon de l'override.

Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Je l'ai constaté en faisant une passe, bien vu !

@apply px-6 py-4 border border-aoc-gray-darker rounded;
@apply bg-dark !important;

position: relative;
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tu peux utiliser @apply relative avec Tailwind 👍

Comment on lines +40 to +44
text-transform: capitalize;

position: absolute;
top: -1px;
right: -1px;
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@apply absolute -top-px -right-px capitalize

top: -1px;
right: -1px;

@apply px-2 border border-aoc-gray-darker text-aoc-gray font-medium text-sm rounded-tr;
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

On n'a pas de font-medium sur le projet, seulement font-light et font-semibold. Techniquement si tu utilises autre chose ça fallback au plus proche, mais c'est pas "correct".

@pil0u pil0u linked an issue Dec 1, 2023 that may be closed by this pull request
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Fix : Changer pour une coloration syntaxique plus contrastée des snippets
3 participants