Sage Custom CSS for broken screen

[Legrumsx]

Yesterday I broke my Kobo Sage screen, so now the bottom left corner is not rendering anymore (affected area: 5.5 cm height, 4.5 cm width). But this did not affect the touch capability.

Since I couldn't find any replacement screen anywhere, I was wondering if I could simply modify the CSS of the epub I am reading via Calibre to put a big margin in that area, so the text would avoid rendering in the defective corner, that way I could still somehow use my broken ereader.

Thank you for your suggestions.

[Quoth]

Not easily.
Also more of the screen will fail. Yes, it's sad.

[JSWolf]

Use this CSS code...

[code].buy {
buy a new Kobo;
}[code]

[lumping-sugar66]

Hey, I'm sorry to hear that.

I can't think of a quick solution with CSS, but you can experiment with Kobopatch to make the rendered area smaller.

There's this Kobopatch patch that is typically intended to reduce the header and footer sizes. Still, in your case, I think you can use it to increase the footer size (make it large enough to cover the broken area) and shrink the area used for text.

Reduce new header/footer height:
- Enabled: no
- Description: |
Reduce new reading header/footer heights when they are enabled.
Affects both ePubs and KePubs.
This patch may be of interest to those who used to enable the old
"Custom menubar - reduce height by 33%."
- FindZlib: "ReadingFooter" # qss/ReadingFooter.qss
- ReplaceZlibGroup:
# Adjust the Replace values of min-height/max-height as you wish.
# Keep min-height=max-height
Replacements:
# ReadingFooter Reduce min/max height by 33%
# Touch/Mini (Trilogy)
- Find: "ReadingFooter[qApp_deviceIsTrilogy=true] {\n min-height: 56;\n max-height: 56px;\n}"
Replace: "ReadingFooter[qApp_deviceIsTrilogy=true] {\n min-height: 37px;\n max-height: 37px;\n}"
# Glo/Aura/Aura2/Nia (Phoenix)
- Find: "ReadingFooter[qApp_deviceIsPhoenix=true] {\n min-height: 71px;\n max-height: 71px;\n}"
Replace: "ReadingFooter[qApp_deviceIsPhoenix=true] {\n min-height: 47px;\n max-height: 47px;\n}"
# AuraHD/AuraH2O/AuraH202/GloHD/ClaraHD/Clara2E (Dragon)
- Find: "ReadingFooter[qApp_deviceIsDragon=true] {\n min-height: 101px;\n max-height: 101px;\n}"
Replace: "ReadingFooter[qApp_deviceIsDragon=true] {\n min-height: 66px;\n max-height: 66px;\n}"
# AuraOne/Forma/Sage/Elipsa/Elipsa2E (Daylight)
- Find: "ReadingFooter[qApp_deviceIsDaylight=true] {\n min-height: 131px;\n max-height: 131px;\n}"
Replace: "ReadingFooter[qApp_deviceIsDaylight=true] {\n min-height: 86px;\n max-height: 86px;\n}"
# LibraH2O/Libra2 (Storm)
- Find: "ReadingFooter[qApp_deviceIsStorm=true] {\n min-height: 118px;\n max-height: 118px;\n}"
Replace: "ReadingFooter[qApp_deviceIsStorm=true] {\n min-height: 78px;\n max-height: 78px;\n}"

See the minimum and maximum height values. You can increase the values in the YAML file and then turn off the header (which iirc is another patch). This should at least give you a reduced usable reading area.

You need to do a bit of research on Kobopatch, if you're not familiar. Here are a few starting points:
* https://pgaskin.net/kobopatch-patche...tch-13651.html
* https://github.com/pgaskin/kobopatch...leases/tag/v84

[PHughes]

Originally Posted by JSWolf

Use this CSS code...

[code].buy {
buy a new Kobo;
}[code]

I verify this works for a broken screen. It is the code I used when I broke the screen on my H20.