A (across) and D (down) aren't translatable

The involved lines in the default.css file are the following.

.active-clues .across .numeral:after {
  content: "A";
}
.active-clues .down .numeral:after {
  content: "D";
}

It's not only A that isn't translatable, but also D.

In Italian, for example, 32A would not make sense, as we say 32 orizzontale (32A) or 2 verticale (2D).

Move the string from default.css to Drupal code.

Does anyone have any thoughts on how to move this into code? Would this be part of global configuration for the Crossword module? Or would this be handled by interface translation?

Thanks for the patch, @afagioli!

I really want to make sure that whatever we do won't cause any regression or changes on existing sites. Currently the direction letter (D or A) only appears when a clue is in the "active clue" section. The attached patch would add the letter into the main clue listings. It would also fail to get the letter to appear with the active clue if the site builder has configured the field formatter not to display the clues lists. See https://git.drupalcode.org/project/crossword/-/blob/8.x-1.x/js/crossword...

I wonder if we could get away with a style tag like this in the crossword-active-clues.html.twig template:

<style>
.active-clues .across .numeral:after {
  content: "{% trans with {'context': 'Crossword direction short'} %}A{% endtrans %}";
}
.active-clues .down .numeral:after {
  content: "{% trans with {'context': 'Crossword direction short'} %}D{% endtrans %}";
}
</style>

Would that work?

Here's a patch that makes A and D translatable!

I think this is the least disruptive way that this can be done for these reasons:

1. Any site relying on purely default styles and templates will not see any changes.
2. Any current site that is hiding these letters will continue to hide the letters unless they are hiding the letters by setting the content to none. 500foods will not have a problem, though, and that's kind of my go-to test. They hide the letters by hiding the numeral.
3. Any site overriding the template I am changing will not be affected because I am leaving the identical CSS in the stylesheet.

If there is ever a 2.x release, the letters should not be handled through CSS. That was a bad decision, but we're stuck with it in this branch.

Glad to hear I don't have to change anything! But if something comes up that requires a breaking change, just be sure to make a note about it and I'll be happy to make the necessary updates. I like that my site is a good test but I don't want it to be an indirect impediment to progress in any way.

Having content in CSS is as you say perhaps not the best approach, but on the other hand having things in CSS makes it possible to make changes, versus having things not in CSS that are often far more difficult to adjust.

should we maybe use double colon "::" before pseudo-elements?

Interesting thought. I did a little search in core and found that sometimes they use single colon and sometimes they use double colon. I'll leave it like it is with the single colon for now, even though the double colon is probably more technically correct.

500foods is so cool.

100% true, even when the puzzles don't mention Italy! The work @GNUMatrix did on that site has played a HUGE role in making this module better.

Thanks to you both. The only reason my site even has crosswords at all is because it was originally so quick to setup and get working, and worked so well out of the gate. Lots of tweaks since then, but the core bit was pretty great already. Now I have to go and figure out what that black line at the top of the puzzle from that screenshot is doing there ;-)

A true perfectionist, @GNUMatrix!

Aha.... Seems someone snuck in some borders when I wasn't looking.

.crossword-row:first-child .crossword-square {
  border-top: 0px;
}
.crossword-row:last-child .crossword-square {
  border-bottom: 0px;
}

This is in the 8.x-1.4 release, which will be out shortly!