-
-
Notifications
You must be signed in to change notification settings - Fork 2.4k
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
Added feature in Preferences to allow user to chose the font of the page #1962
base: main
Are you sure you want to change the base?
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks to working on this feature. I've left a few suggestions/questions.
@@ -152,6 +154,11 @@ class app.Settings | |||
@updateColorMeta() | |||
return | |||
|
|||
setFont: (font) -> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think you're missing a @setFont(@get('font'))
in line 141?
<option value="arial" #{if (settings.font == 'Arial' or not settings.font) then ' selected' else ''}>Arial (default)</option> | ||
<option value="cascadia" #{if settings.font == 'Cascadia' then ' selected' else ''}>Cascadia</option> | ||
<option value="fira-code" #{if settings.font == 'Fira Code' then ' selected' else ''}>Fira Code</option> | ||
<option value="proxima-nova" #{if settings.font == 'Proxima Nova' then ' selected' else ''}>Proxima Nova</option> | ||
<option value="verdana" #{if settings.font == 'Verdana' then ' selected' else ''}>Verdana</option> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't get the selection of the fonts. Some seem to be targetting the user interface (such as Arial). Some seem to be targetting the code blocks (such as Fira Code)?
body { | ||
height: 100%; | ||
margin: 0; | ||
overflow: auto; | ||
font-size: 1em; | ||
font-weight: normal; | ||
font-family: $baseFont; | ||
font-family: var(--selectedFont, $baseFont); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
In _variables.scss, we already define the variables --baseFont
and --monoFont
– I think we should re-use them instead of introducing another one.
Created a drop down of font options that allows the user to chose the type of font used for the app, within the Preferences page. The font changes the entire page automatically when user clicks on a font option. I chose 5 fonts randomly (Arial, Cascadia, Fira Code, Proxima Nova, Verdana) but can change them to different fonts easily if desired.