diff --git a/services/web/frontend/extracted-translations.json b/services/web/frontend/extracted-translations.json index 80abedb18d..ddccaff26b 100644 --- a/services/web/frontend/extracted-translations.json +++ b/services/web/frontend/extracted-translations.json @@ -215,6 +215,7 @@ "clear_cached_files": "", "clear_search": "", "click_here_to_view_sl_in_lng": "", + "click_to_give_feedback": "", "clicking_delete_will_remove_sso_config_and_clear_saml_data": "", "clone_with_git": "", "close": "", @@ -934,6 +935,7 @@ "new_compile_domain_notice": "", "new_file": "", "new_folder": "", + "new_font_open_dyslexic": "", "new_name": "", "new_password": "", "new_project": "", diff --git a/services/web/frontend/fonts/README.md b/services/web/frontend/fonts/README.md index 9f08062694..c07309c0a1 100644 --- a/services/web/frontend/fonts/README.md +++ b/services/web/frontend/fonts/README.md @@ -7,6 +7,7 @@ This directory contains fonts used by the Overleaf web application. * [Merriweather](https://github.com/SorkinType/Merriweather) * [Noto Sans](https://notofonts.github.io/#latin-greek-cyrillic) * [Noto Serif](https://notofonts.github.io/#latin-greek-cyrillic) +* [OpenDyslexic Mono](https://github.com/antijingoist/opendyslexic/tree/master) * [Open Sans](https://github.com/googlefonts/opensans) * [Source Code Pro](https://github.com/adobe-fonts/source-code-pro) * [STIX Two Math](https://github.com/stipub/stixfonts/) diff --git a/services/web/frontend/fonts/build-fonts.mjs b/services/web/frontend/fonts/build-fonts.mjs index 4d5231d54c..8387509132 100644 --- a/services/web/frontend/fonts/build-fonts.mjs +++ b/services/web/frontend/fonts/build-fonts.mjs @@ -71,6 +71,14 @@ const families = [ license: 'https://raw.githubusercontent.com/notofonts/latin-greek-cyrillic/refs/heads/main/OFL.txt', }, + { + folder: 'open-dyslexic-mono', + url: 'https://github.com/antijingoist/opendyslexic', + fonts: [ + 'https://github.com/antijingoist/open-dyslexic/blob/master/otf/OpenDyslexicMono-Regular.otf', + ], + license: 'https://github.com/antijingoist/opendyslexic/blob/master/OFL.txt', + }, { folder: 'open-sans', url: 'https://github.com/googlefonts/opensans', diff --git a/services/web/frontend/fonts/open-dyslexic-mono/OFL.txt b/services/web/frontend/fonts/open-dyslexic-mono/OFL.txt new file mode 100644 index 0000000000..bb867823f2 --- /dev/null +++ b/services/web/frontend/fonts/open-dyslexic-mono/OFL.txt @@ -0,0 +1,94 @@ +Copyright (c) 2019-07-29, Abbie Gonzalez (https://abbiecod.es|support@abbiecod.es), +with Reserved Font Name OpenDyslexic. +Copyright (c) 12/2012 - 2019 +This Font Software is licensed under the SIL Open Font License, Version 1.1. +This license is copied below, and is also available with a FAQ at: +http://scripts.sil.org/OFL + + +----------------------------------------------------------- +SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007 +----------------------------------------------------------- + +PREAMBLE +The goals of the Open Font License (OFL) are to stimulate worldwide +development of collaborative font projects, to support the font creation +efforts of academic and linguistic communities, and to provide a free and +open framework in which fonts may be shared and improved in partnership +with others. + +The OFL allows the licensed fonts to be used, studied, modified and +redistributed freely as long as they are not sold by themselves. The +fonts, including any derivative works, can be bundled, embedded, +redistributed and/or sold with any software provided that any reserved +names are not used by derivative works. The fonts and derivatives, +however, cannot be released under any other type of license. The +requirement for fonts to remain under this license does not apply +to any document created using the fonts or their derivatives. + +DEFINITIONS +"Font Software" refers to the set of files released by the Copyright +Holder(s) under this license and clearly marked as such. This may +include source files, build scripts and documentation. + +"Reserved Font Name" refers to any names specified as such after the +copyright statement(s). + +"Original Version" refers to the collection of Font Software components as +distributed by the Copyright Holder(s). + +"Modified Version" refers to any derivative made by adding to, deleting, +or substituting -- in part or in whole -- any of the components of the +Original Version, by changing formats or by porting the Font Software to a +new environment. + +"Author" refers to any designer, engineer, programmer, technical +writer or other person who contributed to the Font Software. + +PERMISSION & CONDITIONS +Permission is hereby granted, free of charge, to any person obtaining +a copy of the Font Software, to use, study, copy, merge, embed, modify, +redistribute, and sell modified and unmodified copies of the Font +Software, subject to the following conditions: + +1) Neither the Font Software nor any of its individual components, +in Original or Modified Versions, may be sold by itself. + +2) Original or Modified Versions of the Font Software may be bundled, +redistributed and/or sold with any software, provided that each copy +contains the above copyright notice and this license. These can be +included either as stand-alone text files, human-readable headers or +in the appropriate machine-readable metadata fields within text or +binary files as long as those fields can be easily viewed by the user. + +3) No Modified Version of the Font Software may use the Reserved Font +Name(s) unless explicit written permission is granted by the corresponding +Copyright Holder. This restriction only applies to the primary font name as +presented to the users. + +4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font +Software shall not be used to promote, endorse or advertise any +Modified Version, except to acknowledge the contribution(s) of the +Copyright Holder(s) and the Author(s) or with their explicit written +permission. + +5) The Font Software, modified or unmodified, in part or in whole, +must be distributed entirely under this license, and must not be +distributed under any other license. The requirement for fonts to +remain under this license does not apply to any document created +using the Font Software. + +TERMINATION +This license becomes null and void if any of the above conditions are +not met. + +DISCLAIMER +THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT +OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE +COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, +INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL +DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING +FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM +OTHER DEALINGS IN THE FONT SOFTWARE. diff --git a/services/web/frontend/fonts/open-dyslexic-mono/OpenDyslexicMono-Regular.woff2 b/services/web/frontend/fonts/open-dyslexic-mono/OpenDyslexicMono-Regular.woff2 new file mode 100644 index 0000000000..19583fabd2 Binary files /dev/null and b/services/web/frontend/fonts/open-dyslexic-mono/OpenDyslexicMono-Regular.woff2 differ diff --git a/services/web/frontend/fonts/open-dyslexic-mono/open-dyslexic-mono.css b/services/web/frontend/fonts/open-dyslexic-mono/open-dyslexic-mono.css new file mode 100644 index 0000000000..b0e01c800d --- /dev/null +++ b/services/web/frontend/fonts/open-dyslexic-mono/open-dyslexic-mono.css @@ -0,0 +1,6 @@ +@font-face { + font-family: 'OpenDyslexic Mono'; + src: url('./OpenDyslexicMono-Regular.woff2') format('woff2'); + font-style: normal; + font-weight: normal; +} diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx index e239e509b7..21e2117edd 100644 --- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx +++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx @@ -2,27 +2,53 @@ import { useTranslation } from 'react-i18next' import { FontFamily } from '../../../source-editor/extensions/theme' import { useProjectSettingsContext } from '../../context/project-settings-context' import SettingsMenuSelect from './settings-menu-select' +import OLTooltip from '@/features/ui/components/ol/ol-tooltip' +import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher' +import MaterialIcon from '@/shared/components/material-icon' export default function SettingsFontFamily() { const { t } = useTranslation() const { fontFamily, setFontFamily } = useProjectSettingsContext() return ( - - onChange={setFontFamily} - value={fontFamily} - options={[ - { - value: 'monaco', - label: 'Monaco / Menlo / Consolas', - }, - { - value: 'lucida', - label: 'Lucida / Source Code Pro', - }, - ]} - label={t('font_family')} - name="fontFamily" - /> +
+ + onChange={setFontFamily} + value={fontFamily} + options={[ + { + value: 'monaco', + label: 'Monaco / Menlo / Consolas', + }, + { + value: 'lucida', + label: 'Lucida / Source Code Pro', + }, + { + value: 'opendyslexicmono', + label: 'OpenDyslexic Mono', + }, + ]} + label={t('font_family')} + name="fontFamily" + /> + + + } + bs5={} + /> + + +
) } diff --git a/services/web/frontend/js/features/history/extensions/theme.ts b/services/web/frontend/js/features/history/extensions/theme.ts index 6bf83e98ea..fda9c3185b 100644 --- a/services/web/frontend/js/features/history/extensions/theme.ts +++ b/services/web/frontend/js/features/history/extensions/theme.ts @@ -1,7 +1,7 @@ import { EditorView } from '@codemirror/view' import { Compartment, TransactionSpec } from '@codemirror/state' -export type FontFamily = 'monaco' | 'lucida' +export type FontFamily = 'monaco' | 'lucida' | 'opendyslexicmono' export type LineHeight = 'compact' | 'normal' | 'wide' export type Options = { @@ -26,6 +26,7 @@ export const lineHeights: Record = { const fontFamilies: Record = { monaco: ['Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'monospace'], lucida: ['Lucida Console', 'Source Code Pro', 'monospace'], + opendyslexicmono: ['OpenDyslexic Mono', 'monospace'], } const createThemeFromOptions = ({ diff --git a/services/web/frontend/js/features/source-editor/extensions/theme.ts b/services/web/frontend/js/features/source-editor/extensions/theme.ts index 4988743f00..f38289cce2 100644 --- a/services/web/frontend/js/features/source-editor/extensions/theme.ts +++ b/services/web/frontend/js/features/source-editor/extensions/theme.ts @@ -8,7 +8,7 @@ const optionsThemeConf = new Compartment() const selectedThemeConf = new Compartment() export const themeOptionsChange = Annotation.define() -export type FontFamily = 'monaco' | 'lucida' +export type FontFamily = 'monaco' | 'lucida' | 'opendyslexicmono' export type LineHeight = 'compact' | 'normal' | 'wide' export type OverallTheme = '' | 'light-' @@ -62,6 +62,7 @@ export const lineHeights: Record = { const fontFamilies: Record = { monaco: ['Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'monospace'], lucida: ['Lucida Console', 'Source Code Pro', 'monospace'], + opendyslexicmono: ['OpenDyslexic Mono', 'monospace'], } const createThemeFromOptions = ({ diff --git a/services/web/frontend/stylesheets/app/editor/left-menu.less b/services/web/frontend/stylesheets/app/editor/left-menu.less index f84ccc4cf7..6708783ac4 100644 --- a/services/web/frontend/stylesheets/app/editor/left-menu.less +++ b/services/web/frontend/stylesheets/app/editor/left-menu.less @@ -146,6 +146,20 @@ } } + .left-menu-setting-position { + position: relative; + + .left-menu-setting { + margin-top: 0 !important; + } + + .left-menu-setting-icon { + position: absolute; + right: 65%; + top: 25%; + } + } + .left-menu-setting { padding: 0 9px; display: flex; diff --git a/services/web/frontend/stylesheets/bootstrap-5/main-style.scss b/services/web/frontend/stylesheets/bootstrap-5/main-style.scss index 62459a9514..eb705b461d 100644 --- a/services/web/frontend/stylesheets/bootstrap-5/main-style.scss +++ b/services/web/frontend/stylesheets/bootstrap-5/main-style.scss @@ -5,6 +5,7 @@ @import '../../fonts/source-code-pro/source-code-pro.css'; @import '../../fonts/STIXTwoMath/stix-two-math.css'; @import '../../fonts/noto-serif/noto-serif.css'; +@import '../../fonts/open-dyslexic-mono/open-dyslexic-mono.css'; @import '../../fonts/material-symbols/material-symbols.css'; @import '../../fonts/font-awesome/font-awesome.css'; diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/left-menu.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/left-menu.scss index b4cb7b909b..0711652c8e 100644 --- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/left-menu.scss +++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/left-menu.scss @@ -129,6 +129,20 @@ } } + .left-menu-setting-position { + position: relative; + + .left-menu-setting { + margin-top: 0 !important; + } + + .left-menu-setting-icon { + position: absolute; + right: 65%; + top: 30%; + } + } + .left-menu-setting { padding: 0 var(--spacing-02); display: flex; diff --git a/services/web/frontend/stylesheets/main-style.less b/services/web/frontend/stylesheets/main-style.less index 81651dfb9b..ac6f36646a 100644 --- a/services/web/frontend/stylesheets/main-style.less +++ b/services/web/frontend/stylesheets/main-style.less @@ -5,6 +5,7 @@ @import (less) '../fonts/source-code-pro/source-code-pro.css'; @import (less) '../fonts/STIXTwoMath/stix-two-math.css'; @import (less) '../fonts/noto-serif/noto-serif.css'; +@import (less) '../fonts/open-dyslexic-mono/open-dyslexic-mono.css'; @import (less) '../fonts/material-symbols/material-symbols.css'; @is-overleaf-light: false; diff --git a/services/web/locales/en.json b/services/web/locales/en.json index ba2734c919..89bf1dfc9c 100644 --- a/services/web/locales/en.json +++ b/services/web/locales/en.json @@ -289,6 +289,7 @@ "clearing": "Clearing", "click_here_to_view_sl_in_lng": "Click here to use __appName__ in <0>__lngName__", "click_link_to_proceed": "Click __clickText__ below to proceed.", + "click_to_give_feedback": "Click to give feedback.", "clicking_delete_will_remove_sso_config_and_clear_saml_data": "Clicking <0>Delete will remove your SSO configuration and unlink all users. You can only do this when SSO is disabled in your Group settings.", "clone_with_git": "Clone with Git", "close": "Close", @@ -1328,6 +1329,7 @@ "new_compile_domain_notice": "We’ve recently migrated PDF downloads to a new domain. Something might be blocking your browser from accessing that new domain, <0>__compilesUserContentDomain__. This could be caused by network blocking or a strict browser plugin rule. Please follow our <1>troubleshooting guide.", "new_file": "New file", "new_folder": "New folder", + "new_font_open_dyslexic": "New font: OpenDyslexic Mono is designed to improve readability for those with dyslexia.", "new_name": "New Name", "new_password": "New Password", "new_project": "New Project", diff --git a/services/web/test/frontend/components/editor-left-menu/editor-left-menu.spec.tsx b/services/web/test/frontend/components/editor-left-menu/editor-left-menu.spec.tsx index 56eedfc462..2e465cb12f 100644 --- a/services/web/test/frontend/components/editor-left-menu/editor-left-menu.spec.tsx +++ b/services/web/test/frontend/components/editor-left-menu/editor-left-menu.spec.tsx @@ -729,12 +729,13 @@ describe('', function () { cy.get('#settings-menu-fontFamily option').then( options => { const values = [...options].map(o => o.value) - expect(values).to.deep.eq(['monaco', 'lucida']) + expect(values).to.deep.eq(['monaco', 'lucida', 'opendyslexicmono']) const texts = [...options].map(o => o.text) expect(texts).to.deep.eq([ 'Monaco / Menlo / Consolas', 'Lucida / Source Code Pro', + 'OpenDyslexic Mono', ]) } ) diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-family.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-family.test.tsx index 651006cbce..02ba0919f2 100644 --- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-family.test.tsx +++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-family.test.tsx @@ -19,5 +19,10 @@ describe('', function () { const optionLucida = within(select).getByText('Lucida / Source Code Pro') expect(optionLucida.getAttribute('value')).to.equal('lucida') + + const optionOpenDyslexicMono = within(select).getByText('OpenDyslexic Mono') + expect(optionOpenDyslexicMono.getAttribute('value')).to.equal( + 'opendyslexicmono' + ) }) })