Transforming a marked text

[roger64]

Hi

It is possible I misunderstood something and what I wish to do is not possible.

I marked -yellow highligh- short pieces of text (of variable length), one for each html file, about 30 overall, and I intended to give them a specific span (i'ts for the small text which follows a drop-cap and is usually wirtten in small-caps).

Though it is possible to select "marked text" (like "all text files") I do not know how to write what I wish to do in the fields Search and Replace.

It seems I can't write something like this:

<marked text> (nor the usual (.*?))
<span class="smcp">\1</span>

I know I can perform, for all marked text, a standard regex, changing a tag for another one, but this is slightly different.

[kovidgoyal]

Search: (.+)
Replace: XXX\1XXX

But, IIRC replace all with marked text only replaces the marked text in the current file. So your workflow will be mark all occurences in the current file, then click replace all, then switch to next file, mark the occurrences in that file, then click replace all and so on.

[roger64]

Thanks for your help.

I can proceed now easily but one file at a time as you said above.

I had though that marked text could be processed globally (on all files) i.e. beyond the current file. I had not thought of this limitation. But that's not so important because, anyway, we have to mark file, one at a time.

[Brett Merkey]

@roger64:
<<I intended to give them a specific span (i'ts for the small text which follows a drop-cap and is usually wirtten in small-caps)>>

Lots of people code the first line like that and I wonder why. It appears to be a lot of bother and the result is clumsy and ugly. Your device is the PW3. All Kindles I have coded for support the CSS pseudo elements.

Why not just give the first paragraph in the chapter a class — and let the device do the hard work seamlessly with ::first-line and ::first-letter pseudo elements based on that class?

[retiredbiker]

Originally Posted by Brett Merkey

Why not just give the first paragraph in the chapter a class — and let the device do the hard work seamlessly with ::first-line and ::first-letter pseudo elements based on that class?

I think that is a really excellent suggestion. First lines that are hard-coded to try and emulate paper books often fail on a reader. Depending on the font size the user is reading with, that first line appearance may be half the line, or one-and-a-half lines, and not look at all as intended. It's almost never exactly the first line. I need to read at a rather huge font-size, so if If I'm editing a book just for my own reading, I simply take out anything like that supposed first-line <span> code anyway.

[roger64]

Originally Posted by Brett Merkey

@roger64:
<<I intended to give them a specific span (i'ts for the small text which follows a drop-cap and is usually wirtten in small-caps)>>

Lots of people code the first line like that and I wonder why. It appears to be a lot of bother and the result is clumsy and ugly. Your device is the PW3. All Kindles I have coded for support the CSS pseudo elements.

Why not just give the first paragraph in the chapter a class — and let the device do the hard work seamlessly with ::first-line and ::first-letter pseudo elements based on that class?

Thanks for your interest. There are indeed some reasons...

- I have a PW3 but it happens that I am an exclusive Koreader user (and ePub user). Long life to jailbreaks! So, I have absolutely no experience with Amazon formats.
- ::first-line and ::first-letter were far from being universally supported among ebook readers when I looked for a way to do it. Admittedly, this may have changed.
- I use a special Display font for drop-caps only.
- You may judge it "clumsy and ugly" and this may be so but, please, wait to see it before judging it.
- I embed fonts and I set up a line-height for paragraphs. Obviously, the end result will vary if you modify any of these two elements.

clumsy:

1. drop-caps.
I select between a two lines or a three lines display.
I use just one regex to set up all the drop-caps by inserting simultaneously a double span. I just need the closing tag of an h2 title to start with. Once it's done, I like to differentiate between capitals because some of them have a peculiar shape. "Long" capitals (Q, Ç, J) deserve a special span (from let2 to let4).

2. additional text (small-caps).
As this is a variable text, unhappily I need to proceed one file at a time... It can't be much different elsewhere. I also use a peculiar span with A and L drop-caps, to move this text slightly on the left and avoid a disgraceful white space (from smcpTypeV to smcpTypeA).

Here are the two regex I use in .json format (Calibre editor)

ugly

Now you can judge from the following screenshots, one example with a drop-cap on two lines, a second with a three-lines drop-cap.

[Brett Merkey]

@roger,
<<I have a PW3 but it happens that I am an exclusive Koreader user (and ePub user)>>

I figured that was a factor since I noticed your posts in the Koreader forum. Your dropcaps look very nice. However, I still think having part of a line in small-caps and the last part in some other style is not elegant because the anomaly calls attention to itself. There is also the issue of the greater care needed in coding.

Yes, I totally agree that it would be nice if most e-readers had a decent level of support to html and css standards. For instance, my edited books look fine in my Kindle PW3 and in Kindle for Android on my Samsung tablet. However, the same books look far worse than "clumsy" in other e-readers on the same tablet!

[Brett Merkey]

@retiredbiker,
After classing the first paragraph, I paste into the CSS file a set of styles that I then modify for color, special fonts, shadowing to fit that particular book. This adds visual interest you can never seem to find in any Amazon delivered book.

p.first-para::first-line {
font-style: italic;
font-size: 1.1em;
}
p.first-para::first-letter {
font-weight: bold;
font-style: italic;
color: #cdcdcd;
font-size: 2em;
text-shadow: 3px 1px 3px #000;
float: left;
margin-top: -0.3em;
margin-bottom: -0.3em;
padding-right: .2em;
}

[roger64]

Originally Posted by Brett Merkey

@roger,
<<I have a PW3 but it happens that I am an exclusive Koreader user (and ePub user)>>

I figured that was a factor since I noticed your posts in the Koreader forum. Your dropcaps look very nice. However, I still think having part of a line in small-caps and the last part in some other style is not elegant because the anomaly calls attention to itself. There is also the issue of the greater care needed in coding.

As you can imagine, this use of small-caps is intended. It respects -French- typographic rules of the Imprimerie Nationale. But in matters of taste, everyone has its own.

@Brett Merkey

Can you share screenshots?

[Brett Merkey]

<<As you can imagine, this use of small-caps is intended. It respects -French- typographic rules of the Imprimerie Nationale.>>

I used small-caps originally for all my books in the Spanish language but even this never did acclimate me to situations where I wanted a super-large swirling dropcap in a cursive font that lead into the block-like small-caps to finish the first line. I developed a prejudice!

Sorry about lack of screenshot. If there is a way to easily upload an image from my drive to the forum, I cannot find it. In any case the code above is easy to test and tweak in ePub in the Calibre viewer.

[roger64]

The text written in small-caps never applies to a full line. It's two or three words, sometimes a little more. Anyway the use of "first line" does not seem very convenient for a flowing ePub... You can get strange results.

Before leaving this thread, I noted that using a double span to control the display of a drop-cap is more flexible and precise than using a single one. I do not say that it is impossible to do it with a single span, just that it's more difficult and fragile.

To upload an image here, you just use Edit, then, "Go advanced", then "Manage attachments".

[BetterRed]

Originally Posted by roger64

To upload an image here, you just use Edit, then, "Go advanced", then "Manage attachments".

Or click the paper clip icon, it has an option to go to Manage attachments, and links to uploaded images which you can post inline.

BR

[retiredbiker]

@Brett Merkey -- Thanks for that code, I'll play with it!

[retiredbiker]

@Brett Merkey - I've experimented with your code and it works very well on my Kindles. However, if I use

.firstp::first-line {
  color: blue;
  font-variant: small-caps;

it works as it should, but if I try, for example,

.firstpuc::first-line {
  color: red;
  text-transform: uppercase;

it ignores the text-transform. Do you know if this is somehow excluded from use with ::first-line? I've hunted around, but can't find anything.

Thanks!

[Brett Merkey]

@retiredbiker,

it ignores the text-transform. Do you know if this is somehow excluded from use with ::first-line?

I know that the first-line pseudo element supports text-transform — but you are right, I see no transform while testing in Calibre. However, browsers and Kindles should have no trouble.