Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add wiki for installation on code-server #1600

Open
pujan-modha opened this issue Jul 11, 2024 · 6 comments
Open

Add wiki for installation on code-server #1600

pujan-modha opened this issue Jul 11, 2024 · 6 comments

Comments

@pujan-modha
Copy link

pujan-modha commented Jul 11, 2024

Seems like can't edit wiki directly.

For Home.md

### Installing font

- [OS Install instructions](https://github.com/tonsky/FiraCode/wiki/Installing)

### Enabling ligatures

You need to explicitly enable ligatures support in following editors:

- [Atom](https://github.com/tonsky/FiraCode/wiki/Atom-instructions)
- [BBEdit](https://github.com/tonsky/FiraCode/wiki/BBEdit-instructions)
- [Brackets](https://github.com/tonsky/FiraCode/wiki/Brackets-Instructions/)
- [ChromeOS Terminal](https://github.com/tonsky/FiraCode/wiki/ChromeOS-Terminal)
- [Cloud9](https://github.com/tonsky/FiraCode/wiki/cloud9-instructions)
- [Code Server - (VS Code for Web)](https://github.com/tonsky/FiraCode/wiki/code-server-instructions)
- [Emacs](https://github.com/tonsky/FiraCode/wiki/Emacs-instructions)
- [JetBrains' products](https://github.com/tonsky/FiraCode/wiki/Intellij-products-instructions) (IntelliJ, etc)
- [LaTeX](https://github.com/tonsky/FiraCode/wiki/LaTeX-instructions)
- [LightTable](https://github.com/tonsky/FiraCode/wiki/LightTable-instructions)
- [MacVim](https://github.com/tonsky/FiraCode/wiki/MacVim-instructions)
- [MATLAB Install instructions](https://github.com/tonsky/FiraCode/wiki/MATLAB-for-Windows-Instructions)
- [Notepad++](https://github.com/tonsky/FiraCode/wiki/Notepad-Plus-Plus-instructions)
- [Sublime Text](https://github.com/tonsky/FiraCode/wiki/Sublime-Text-Instructions)
- [VS Code](https://github.com/tonsky/FiraCode/wiki/VS-Code-Instructions)
- [Windows Terminal & Windows Terminal Preview](https://github.com/tonsky/FiraCode/wiki/Windows-Terminal-&-Windows-Terminal-Preview)

For other editors it should be enough to simply select Fira Code as your font of choice. [Full list of compatible editors](https://github.com/tonsky/FiraCode#editor-compatibility-list)

New wiki page: Code-Server-Instructions.md

## Requirements

Make sure you [install the font](https://github.com/tonsky/FiraCode/wiki/Linux-instructions).

Install [Stylus for Chrome](https://chromewebstore.google.com/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne) or [Stylus for Firefox](https://addons.mozilla.org/en-US/firefox/addon/styl-us/) and add this user style to the domain/URLs of code-server:

<code>@import url('https://fonts.googleapis.com/css2?family=Fira+Code:[email protected]&display=swap');
</code>

## Using the visual Settings Editor

To open the settings editor: from the `Code` menu, choose `Preferences` > `Settings`, or use keyboard shortcut <kbd>Ctrl</kbd>+<kbd>,</kbd> (<kbd>Cmd</kbd>+<kbd>,</kbd> on Mac).

To enable FiraCode in the settings editor: under "Commonly Used", expand the "Text Editor" settings and then click on "Font". In the "Font Family" input box type `Fira Code`, replacing any content. Tick the check box "Enables/Disables font ligatures" under "Font Ligatures" to enable the special ligatures.

## Manually editing `settings.json`

Visual Studio Code allows you to also edit the underlying `settings.json` config file. First open the settings editor as described above, then click the "curly brackets" icon to open the `settings.json` file.

Then paste the following lines and save the file.

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

If this doesn't work for you, you can try:

1. restarting VS Code;
1. wrapping the "Fira Code" section with additional apostrophes:
   ```json
   "editor.fontFamily": "'Fira Code'",
   "editor.fontLigatures": true,
   ```

### Font weights

To achieve different weights, add one of the following (verified on Mac/Windows 10):

```json
    "editor.fontWeight": "300" // Light
    "editor.fontWeight": "400" // Regular
    "editor.fontWeight": "500" // Medium
    "editor.fontWeight": "600" // Bold
    "editor.fontWeight": "700" // Extra Bold
```

### Stylistic sets

Since version [1.40](https://code.visualstudio.com/updates/v1_40#_font-feature-settings), you can define stylistic sets in `settings.json`:

```json
"editor.fontLigatures": "'calt', 'ss01', 'ss02', 'ss03', 'ss04', 'ss05', 'ss06', 'zero', 'onum'"
```

To avoid possible bugs, you must uninstall Fira Code 1.x before installing Fira Code 2+.

### Useful extensions

- [Disable ligatures in unwanted contexts](https://marketplace.visualstudio.com/items?itemName=kshetline.ligatures-limited) (be aware [of the issues](https://github.com/kshetline/ligatures-limited/issues))

@tonsky
Copy link
Owner

tonsky commented Jul 11, 2024

  • Looks like "install the font" part isn’t necessary, if you are using Google Fonts version?
  • Are the instructions the same as for VS Code? We should reference VS Code page then instead of copying it

@pujan-modha
Copy link
Author

pujan-modha commented Jul 11, 2024

  • Looks like "install the font" part isn’t necessary, if you are using Google Fonts version?
  • Are the instructions the same as for VS Code? We should reference VS Code page then instead of copying it
  • I tried the @import method first and it didn't seems to work so I installed the fonts and it worked.
  • Yes, we can add these instruction in VS Code page too.

@tonsky
Copy link
Owner

tonsky commented Jul 11, 2024

I tried the @import method first and it didn't seems to work so I installed the fonts and it worked.

This can’t be right. Besides, I think not all browsers support local fonts (I don’t think Safari does?). Please figure it out before we can add these instructions to the wiki

@pujan-modha
Copy link
Author

I tried the @import method first and it didn't seems to work so I installed the fonts and it worked.

This can’t be right. Besides, I think not all browsers support local fonts (I don’t think Safari does?). Please figure it out before we can add these instructions to the wiki

Looks like you're right, I tried the @import method on fresh instance of code-server and it works fine, so I think there is no need for font installation.

@tonsky
Copy link
Owner

tonsky commented Jul 11, 2024

So you removed locally installed font, reset font cache and it continued to work?

@pujan-modha
Copy link
Author

pujan-modha commented Jul 11, 2024

So you removed locally installed font, reset font cache and it continued to work?

Let me try that out real quick!!

And the new instance I ran is on another machine (actually on cloud) so yeah it do work without installing the fonts but I ain't tried removing the fonts from my first instance so I'll update once I try that out.

Update: It works even after removing the fonts from OS and clearing the cache!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants