Alternative appearance for the Gingko Fullscreen Mode


I just discoverd Gingko and I LOVE everything about it, save for the fullscreen appearance. It’s fine, but a little too “square” for me, so I tinkered a bit with the CSS.

The result:

If anyone is interested, I created a script for Tampermonkey/Greasemonkey.

// ==UserScript==
// @name         Alternative Fullscreen
// @namespace
// @version      0.1
// @description  Alternative appearance for the Gingko Fullscreen Mode
// @author       Thierno Rignoux
// @match*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    addGlobalStyle('#fullscreen-contents{background-color:#eeeeee!important;font-family:"Segoe UI"!important;}');
    addGlobalStyle('#fullscreen-contents::-webkit-scrollbar { width: 5px;}');
    addGlobalStyle('#fullscreen-contents::-webkit-scrollbar-track{background: #efefef;}');
    addGlobalStyle('#fullscreen-contents::-webkit-scrollbar-thumb {background: #e0e0e0;}');

function addGlobalStyle(css) {
    var head, style;
    head = document.getElementsByTagName('head')[0];
    if (!head) { return; }
    style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = css;



This is great - I just added it and it works perfectly. Thanks so much!

I’m really happy it’s useful for someone, even after two years!

I would be interested in learning more about how to do this. I do a lot of writing on my phone (iOS), and in full screen edit mode the font becomes very large. It’s workable, but I’d like to be able to change it to use a smaller font. Do stylesheets work on mobile (I guess specifically iOS, since that seems to have its own rules)? If so, where would I put one? I’ve done stylesheets before, so the syntax per se isn’t an issue — just that I’ve only used them on web sites where I “owned” the HTML.