How to make text appear in other colours than white in (iPad) night mode?

larysa · 11-27-2017, 12:30 PM

Hi, I’ve ePub with this css:
p {
line-height: 1.3em;
}
body#book div.main > p:first-letter {
font-size: 4em;
color: #bd2716;
line-height: 0.75em;
}

and this is the page with my problem:

<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>gfhgjjhvbmb</title>
<link href="css/s0_style.css" rel="stylesheet" type="text/css"/>
</head>

<body id="book">

<div class="main">

<p>Text various text</p>

</div>

</body>

</html>

On my iPad when read this book with night theme (background black and text white) the first letter have color assigned, ok, but if i want all text of this color, not work!
I’ve try to modify on css:
body#book div.main > p:first-letter {
whit:
body#book div.main > p {
but the text don’t have color!! This work correctly with classic theme, bg white, txt black, but if change theme with bg black and txt white, don’t see the color on my text!
How to set color to all paragraphs??

JSWolf · 11-27-2017, 02:08 PM

Here is the CSS code.

Code:

body {
  widows: 1;
  orphans: 1;
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 0;
  text-align: justify;
}
p {
  margin-top: 0;
  margin-bottom: 0;
  text-indent: 1.2em;
}
.first-letter {
  font-size: 2em;
  color: #bd2716;
  line-height: 0;
}
h2 {
  margin-top: 1em;
  margin-bottom: 1em;
  text-align: center;
}
.noindent {
  text-indent: 0;
}

Here is the HTML code.

Code:

<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>gfhgjjhvbmb</title>
  <link href="css/s0_style.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<h2>Chapter One</h2>
<p class="noindent"><span class="first-letter>T</span>ext various text</p>
<p>Some more text here</p>
</body>
</html>

That should work.

larysa · 11-28-2017, 05:29 AM

...mmm...
where is the color? (I want text color on night mode!)

JSWolf · 11-28-2017, 06:05 AM

Quote:

Originally Posted by larysa

...mmm...
where is the color? (I want text color on night mode!)

OK. I edited the CSS and added in the color to the first letter.

larysa · 11-28-2017, 12:25 PM

You don’t understand my problem...
I know well calibre and css, and my question isn’t add color to text...
If you read my first post, I don’t want color only to first letter, but I want color to all my paragraph on night mode!!!
If I add color to my text, I see on normal mode, but not into night mode! This is the problem!

doubleshuffle · 11-28-2017, 01:02 PM

Unfortunately, I have no idea how to do what you want to do, but perhaps it will be easier to find someone who can if you ask a moderator to change your thread title to something more descriptive, like: "How to make text appear in other colours than white in (iPad) night mode?"

larysa · 11-28-2017, 01:27 PM

The curious thing, on my first post, are that the first letter have color (on night mode) but if i correct html code on the page, or change my CSS, the full text don’t have color! Only the first letter assigned color...
This is mysteries of iPad and iBooks 4.14!

Toxaris · 11-28-2017, 01:42 PM

As night mode is a feature of the reading device and not ePUB, it needs to be handled by the reading device/app. It really depends on the implementation of the reading device/app.

JSWolf · 11-28-2017, 02:45 PM

Given that you are reading ePub on an iPad Mini, I suggest you use Marvin 3. With Marvin, you can select the background color and the text color so you'll be able to et what you want. Then you can use the code I posted (without the color code in CSS) and it will work.

larysa · 11-29-2017, 05:27 AM

@ JSWolf
tnx to your suggestion! Anyway your code at post #2 on my iPad mini not work! And anyway it’s strange that work color at first letter but not to all paragraph...!

@ doubleshuffle
yes, i agree with you... calibre work fine, and the code of ePub it’s correct, this is a bug of iBooks! Then, have another section where post my question relates to iPad?

pdurrant · 11-29-2017, 05:55 AM

Quote:

Originally Posted by doubleshuffle

it will be easier to find someone who can if you ask a moderator to change your thread title to something more descriptive, like: "How to make text appear in other colours than white in (iPad) night mode?"

An excellent suggestion. But no need for the OP to ask a moderator directly.

Thread title changed.

larysa · 11-29-2017, 12:54 PM

On my first post, on CSS, have:
body#book div.main > p:first-letter {

Existing other string to put on p:......{ ????
ex p: paragraph} or similar??
I think iBooks use assigned color only at specific string, not to all simply text...

larysa · 11-29-2017, 01:01 PM

Update:
I don’t use night mode, i have setting background black (and then text is white)...

JSWolf · 11-29-2017, 01:03 PM

Thing is, if you use iBooks and you set a text color that works with a black background, when you are not using night mode, you still get that same text color.

Using Marvin is the best solution since you can change the foreground and background colors to what you want without having to deal with a fixed text color.

najgori · 11-29-2017, 01:25 PM

have you tried this in css?

:root[__ibooks_internal_theme*="Night"] {
-webkit-text-fill-color: #bd2716;}

11-27-2017, 12:30 PM	#1
larysa Zealot Posts: 117 Karma: 10 Join Date: Feb 2016 Device: iPad mini 4	How to make text appear in other colours than white in (iPad) night mode? Hi, I’ve ePub with this css: p { line-height: 1.3em; } body#book div.main > p:first-letter { font-size: 4em; color: #bd2716; line-height: 0.75em; } and this is the page with my problem: <?xml version='1.0' encoding='utf-8'?> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>gfhgjjhvbmb</title> <link href="css/s0_style.css" rel="stylesheet" type="text/css"/> </head> <body id="book"> <div class="main"> <p>Text various text</p> </div> </body> </html> On my iPad when read this book with night theme (background black and text white) the first letter have color assigned, ok, but if i want all text of this color, not work! I’ve try to modify on css: body#book div.main > p:first-letter { whit: body#book div.main > p { but the text don’t have color!! This work correctly with classic theme, bg white, txt black, but if change theme with bg black and txt white, don’t see the color on my text! How to set color to all paragraphs??

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
ePub color text on night mode on iPad	larysa	Apple Devices	1	11-29-2017 05:54 AM
Aura HD on/off in night mode: white diagonals	barutanseijin	Kobo Reader	2	10-04-2014 07:55 AM
Text stays black in white on black mode.	bizzybody	Kindle Formats	7	11-25-2013 07:54 AM
Creating a 'Night Mode' epub for viewing in iBook on an iPad ???	slayda	Calibre	2	07-23-2011 04:43 PM
Book doesn't display text in night mode	Valkrider	Conversion	6	06-18-2011 09:25 AM

11-28-2017, 05:29 AM	#3
larysa Zealot Posts: 117 Karma: 10 Join Date: Feb 2016 Device: iPad mini 4	...mmm... where is the color? (I want text color on night mode!)

11-28-2017, 12:25 PM	#5
larysa Zealot Posts: 117 Karma: 10 Join Date: Feb 2016 Device: iPad mini 4	You don’t understand my problem... I know well calibre and css, and my question isn’t add color to text... If you read my first post, I don’t want color only to first letter, but I want color to all my paragraph on night mode!!! If I add color to my text, I see on normal mode, but not into night mode! This is the problem!

11-28-2017, 01:02 PM	#6
doubleshuffle Unicycle Daredevil Posts: 13,923 Karma: 185041098 Join Date: Jan 2011 Location: Planet of the Pudding Brains Device: Aura HD (R.I.P. After six years the USB socket died.) tolino shine 3	Unfortunately, I have no idea how to do what you want to do, but perhaps it will be easier to find someone who can if you ask a moderator to change your thread title to something more descriptive, like: "How to make text appear in other colours than white in (iPad) night mode?"

11-28-2017, 01:27 PM	#7
larysa Zealot Posts: 117 Karma: 10 Join Date: Feb 2016 Device: iPad mini 4	The curious thing, on my first post, are that the first letter have color (on night mode) but if i correct html code on the page, or change my CSS, the full text don’t have color! Only the first letter assigned color... This is mysteries of iPad and iBooks 4.14!

11-28-2017, 01:42 PM	#8
Toxaris Wizard Posts: 4,520 Karma: 121692313 Join Date: Oct 2009 Location: Heemskerk, NL Device: PRS-T1, Kobo Touch, Kobo Aura	As night mode is a feature of the reading device and not ePUB, it needs to be handled by the reading device/app. It really depends on the implementation of the reading device/app.

11-28-2017, 02:45 PM	#9
JSWolf Resident Curmudgeon Posts: 73,983 Karma: 128903378 Join Date: Nov 2006 Location: Roslindale, Massachusetts Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3	Given that you are reading ePub on an iPad Mini, I suggest you use Marvin 3. With Marvin, you can select the background color and the text color so you'll be able to et what you want. Then you can use the code I posted (without the color code in CSS) and it will work.

11-29-2017, 05:27 AM	#10
larysa Zealot Posts: 117 Karma: 10 Join Date: Feb 2016 Device: iPad mini 4	@ JSWolf tnx to your suggestion! Anyway your code at post #2 on my iPad mini not work! And anyway it’s strange that work color at first letter but not to all paragraph...! @ doubleshuffle yes, i agree with you... calibre work fine, and the code of ePub it’s correct, this is a bug of iBooks! Then, have another section where post my question relates to iPad?

11-29-2017, 12:54 PM	#12
larysa Zealot Posts: 117 Karma: 10 Join Date: Feb 2016 Device: iPad mini 4	On my first post, on CSS, have: body#book div.main > p:first-letter { Existing other string to put on p:......{ ???? ex p: paragraph} or similar?? I think iBooks use assigned color only at specific string, not to all simply text...

11-29-2017, 01:01 PM	#13
larysa Zealot Posts: 117 Karma: 10 Join Date: Feb 2016 Device: iPad mini 4	Update: I don’t use night mode, i have setting background black (and then text is white)...

11-29-2017, 01:03 PM	#14
JSWolf Resident Curmudgeon Posts: 73,983 Karma: 128903378 Join Date: Nov 2006 Location: Roslindale, Massachusetts Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3	Thing is, if you use iBooks and you set a text color that works with a black background, when you are not using night mode, you still get that same text color. Using Marvin is the best solution since you can change the foreground and background colors to what you want without having to deal with a fixed text color.

Advert

Advert

11-29-2017, 01:25 PM	#15
najgori Klak Posts: 174 Karma: 150374 Join Date: Sep 2011 Location: Belgrade, Serbia Device: many	have you tried this in css? :root[__ibooks_internal_theme*="Night"] { -webkit-text-fill-color: #bd2716;}