Font Ligatures not working after installing System76 Pop Theme in Ubuntu using Gnome

[jakehockey10]

Hello,

I can't seem to get the font ligatures to work in VS Code anymore but only on one of my machines. I tried to narrow down the differences between this machine where they are not working and the rest that have font ligatures working just fine.

I'm not sure how to trouble shoot this and would love to provide more useful info in this issue if someone could direct me to what information might be useful.

I don't know whether the new Gnome theme is the culprit, but those running the repo for that theme seem to be under the impression that since VS Code is an Electron app, the theme wouldn't have anything to do with it. Yet, the same version of VS Code on any machine for me has worked accept for this one and only after I started using the theme. Another reason I thought the theme might be involved is that the recommended fonts to use are Fira Code fonts in the operating system's settings.

I would really like to have font ligatures working again as this is my main development machine and I found them extremely useful

[tonsky]

Please make sure that you have correct settings:

"editor.fontFamily": "Fira Code",
"editor.fontLigatures": true,

Also make sure that the font displayed is actually Fira Code (there were cases where people reported broken ligatures but in fact system was using different font). Easiest way to do so is to look at @, & and lowercase r:

[jakehockey10]

Here is the two versions of my settings that both don't change what I'm seeing:

// Place your settings in this file to overwrite the default settings
// No quotes inside quotes
{
    "editor.fontFamily": "Fira Code",
    "editor.fontSize": 14,
    "editor.fontLigatures": true,
    "files.autoSave": "afterDelay",
    "window.zoomLevel": 0,
    "files.autoSaveDelay": 3000,
    "workbench.iconTheme": "vs-seti",
    "files.exclude": {
        "**/*.js": {
            "when": "$(basename).ts"
        },
        "**/*.map": {
            "when": "$(basename).map"
        }
    },
    "typescript.tsdk": "./node_modules/typescript/lib",
    "editor.formatOnSave": true,
    "html.format.wrapLineLength": 60,
    "html.format.wrapAttributes": "auto",
    "html.format.unformatted": "",
    "typescript.referencesCodeLens.enabled": true
}

// Place your settings in this file to overwrite the default settings
// Quotes inside quotes
{
    "editor.fontFamily": "'Fira Code'",
    "editor.fontSize": 14,
    "editor.fontLigatures": true,
    "files.autoSave": "afterDelay",
    "window.zoomLevel": 0,
    "files.autoSaveDelay": 3000,
    "workbench.iconTheme": "vs-seti",
    "files.exclude": {
        "**/*.js": {
            "when": "$(basename).ts"
        },
        "**/*.map": {
            "when": "$(basename).map"
        }
    },
    "typescript.tsdk": "./node_modules/typescript/lib",
    "editor.formatOnSave": true,
    "html.format.wrapLineLength": 60,
    "html.format.wrapAttributes": "auto",
    "html.format.unformatted": "",
    "typescript.referencesCodeLens.enabled": true
}

Here is a screenshot, which I believe to be showing that I am using Fira Code as it looks extremely similar to your screenshot:

[tonsky]

Can you try setting file syntax to plain text? It’s an another common issue when syntax parser interferes with the ligatures

[jakehockey10]

I'm not sure how to do that. Can you point me in the right direction? Is this an operating system level operation or one for Visual Studio Code?

[jakehockey10]

I changed the file syntax to plaintext in visual studio code with Ctrl+K M, and the font ligatures still aren't showing up. Thank goodness that didn't solve it too because I would have been bummed to decide between ligatures and code highlighting.

[tonsky]

I’m out of ideas then :( Sorry. Try reinstalling fonts, rebuilding font cache, rebooting?

[jakehockey10]

I've tried reinstalling fonts (without uninstalling them first) and have rebooted tens of times by now. How do I rebuild a font cache?

[jakehockey10]

I just ran sudo fc-cache -f -v to completion, restarted Visual Studio Code and no ligatures still. I wish I knew better what COULD be affecting the display of ligatures. I just don't know what all the pieces involved are.

[jakehockey10]

The System76 Pop theme builders were under the impression that their theme couldn't have anything to do with this because Visual Studio Code is an electron app. But I do find the coincidence funny that as soon as I start using Fira Code fonts at the operating system level (using the Tweak tool), the Fira Code ligatures stop working in Visual Studio Code. Granted, restoring the fonts to something else doesn't seem to solve the problem I'm seeing, but I guess I'm completely out of ideas as well otherwise.

[antonpaisov]

@jakehockey10 I also had ligatures working before I've installed System76 Pop. This is how I got them back:

• reset all system fonts to default like that

  gsettings reset org.gnome.desktop.interface monospace-font-name 
  gsettings reset org.gnome.desktop.interface document-font-name
  gsettings reset org.gnome.desktop.interface font-name 
  gsettings reset org.gnome.desktop.wm.preferences titlebar-font 

• removed fira fonts folder from the system (I had it in /usr/share/fonts/opentype/, not in truetype but it may vary for you)
• installed fira fonts from this repo
• ligatures are back :)

PS: Originally I've installed Pop! theme following instructions from here http://www.omgubuntu.co.uk/2017/04/system76-pop-gtk-theme-ubuntu and I think that everything breaks when one installs provided fonts package, maybe Fira Code font is just old or broken in here.

Hope this helps :)

[antonpaisov]

In addition, IMO I'd say that this is not a Fira Code issue probably, but rather a Pop! theme fonts distribution one, so I would close this issue and re-open this one https://github.com/system76/pop-gtk-theme/issues/30

[dhouck]

Can you see ligatures with other coding fonts (such as Iosevka, DejaVu Sans Code)?

[ericdouglas]

@jakehockey10 I was with the same problem. My solution:

1. Remove all folders fira_mono, fira_sans, fira_code from /usr/share/fonts/opentype
2. Download Fira Code font here
3. Unzip it
4. Open the folder ttf
5. Open each file (double click) and Install
6. Done :tada:

[1danjordan]

I had this exact same problem (System76 Pop on Ubuntu 16.04 + VS Code without ligatures). @ericdouglas your fix worked for me perfectly, thanks a million!

[b2m9]

This is still an issue. Is this a problem with Pop_OS or the otf files/the package?

[wmpedersen]

Please make sure that you have correct settings:

"editor.fontFamily": "Fira Code",
"editor.fontLigatures": true,

Came here because of Cascadia ligatures, forgot to enable font ligatures