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

Callout content renders in UperCases #40

Closed
tzielins opened this issue Feb 29, 2024 · 2 comments
Closed

Callout content renders in UperCases #40

tzielins opened this issue Feb 29, 2024 · 2 comments

Comments

@tzielins
Copy link

Callout elements renders as divs with 'text-transform: uppercase;'

callout

I created a fresh repository ith the template.

https://github.com/tzielins/testing-carp-template

which in its introduction empisode starts with:

::::::::::::::::::::::::::::::::::::: callout

Callout sections can highlight information.

They are sometimes used to emphasise particularly important points
but are also used in some lessons to present "asides": 
content that is not central to the narrative of the lesson,
e.g. by providing the answer to a commonly-asked question.

::::::::::::::::::::::::::::::::::::::::::::::::

But renders as all capitals.

https://tzielins.github.io/testing-carp-template/introduction.html

Looking at the html the divs have structure:


<div class="callout-square">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bell callout-icon"><path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path><path d="M13.73 21a2 2 0 0 1-3.46 0"></path></svg>
</div>
<div class="section level3 callout-title callout-inner">
<h3 class="callout-title">Callout</h3>
<div class="callout-content">
<p>Callout sections can highlight information.</p>
<p>They are sometimes used to emphasise particularly important points
but are also used in some lessons to present “asides”: content that is
not central to the narrative of the lesson, e.g.&nbsp;by providing the answer
to a commonly-asked question.</p>
</div>
</div>

there is <div class="section level3 callout-title callout-inner">

while in the template page (https://carpentries.github.io/workbench-template-md/introduction.html)
<div class="callout-inner">


<div class="callout-square">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bell callout-icon"><path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path><path d="M13.73 21a2 2 0 0 1-3.46 0"></path></svg>
</div>
<div class="callout-inner">
<h3 class="callout-title">Callout<a class="anchor" aria-label="anchor" href="#callout1"></a>
</h3>
<div class="callout-content">
<p>Callout sections can highlight information.</p>
<p>They are sometimes used to emphasise particularly important points
but are also used in some lessons to present “asides”: content that is
not central to the narrative of the lesson, e.g.&nbsp;by providing the answer
to a commonly-asked question.</p>
</div>
</div>

I belive the class callout-title on the div.callout-inner causes the problem.

@tobyhodges
Copy link
Member

Thanks for reporting @tzielins. This is a known issue, being tracked at carpentries/sandpaper#470 and indeed Rob prepped a PR to address it yesterday: carpentries/sandpaper#574

One of the tests was failing but we think that is spurious, and I hope we will get it merged later today.

@tobyhodges
Copy link
Member

sandpaper version 0.16.3 was released today and this problem has been fixed. The issue can be closed.

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

No branches or pull requests

3 participants