Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@fontsource/dm-mono
Advanced tools
@fontsource/dm-mono - npm Package Compare versions
Comparing version 4.2.2 to 4.3.0
@@ -15,2 +15,18 @@ # Changelog | ||
| ## 4.3.x | ||
| ### Features | ||
| - Added 'category' key to metadata.json. [#189](https://github.com/fontsource/fontsource/pull/189) | ||
| ### Fixes | ||
| - Update dependencies. [#187](https://github.com/fontsource/fontsource/pull/187) | ||
| ### Documentation | ||
| - New website. [#186](https://github.com/fontsource/fontsource/pull/186) [#188](https://github.com/fontsource/fontsource/pull/188) [#191](https://github.com/fontsource/fontsource/pull/191) [#192](https://github.com/fontsource/fontsource/pull/192) [#193](https://github.com/fontsource/fontsource/pull/193) [#194](https://github.com/fontsource/fontsource/pull/194) [#195](https://github.com/fontsource/fontsource/pull/195) [#196](https://github.com/fontsource/fontsource/pull/196) [#197](https://github.com/fontsource/fontsource/pull/197) [#198](https://github.com/fontsource/fontsource/pull/198) | ||
| - Update READMEs with new information. [#199](https://github.com/fontsource/fontsource/pull/199) | ||
| - GitHub Actions Git configs changed to 'fontsource-bot'. [#200](https://github.com/fontsource/fontsource/pull/200) | ||
| ## 4.2.x | ||
@@ -28,2 +44,5 @@ | ||
| - Resolved incorrect unicodeMap numeric subset names that linked to the wrong files. [#167](https://github.com/fontsource/fontsource/pull/167) | ||
| - Update Material Icons [#177](https://github.com/fontsource/fontsource/pull/177) | ||
| - Apply previous SCSS Generic updates [#178](https://github.com/fontsource/fontsource/pull/178) | ||
| - Update dependencies [#168](https://github.com/fontsource/fontsource/pull/168) [#169](https://github.com/fontsource/fontsource/pull/169) | ||
@@ -33,2 +52,3 @@ ### Documentation | ||
| - Changed package.json descriptions to something more mature. [#148](https://github.com/fontsource/fontsource/pull/148) | ||
| - README updates for Sass usage. [#173](https://github.com/fontsource/fontsource/pull/173) | ||
@@ -35,0 +55,0 @@ ## 4.1.x |
@@ -9,4 +9,5 @@ { | ||
| "variable": false, | ||
| "lastModified": "2021-01-21", | ||
| "version": "v3", | ||
| "lastModified": "2021-03-19", | ||
| "version": "v5", | ||
| "category": "monospace", | ||
| "source": "https://fonts.google.com/", | ||
@@ -13,0 +14,0 @@ "license": "https://fonts.google.com/attribution", |
| { | ||
| "name": "@fontsource/dm-mono", | ||
| "version": "4.2.2", | ||
| "version": "4.3.0", | ||
| "description": "Self-host the DM Mono font in a neatly bundled NPM package.", | ||
@@ -25,3 +25,3 @@ "main": "index.css", | ||
| }, | ||
| "gitHead": "6f1ab8fd3e6c93d96a0fcd131f12409d142d9a9e" | ||
| "gitHead": "a6662f1f915c4779a5ef3f9b02efa8212a974788" | ||
| } |
@@ -5,7 +5,7 @@ # Fontsource DM Mono | ||
| The CSS and web font files to easily self-host the “DM Mono” font. Please visit the main [Fontsource monorepo](https://github.com/fontsource/fontsource) to view more details on this package. | ||
| The CSS and web font files to easily self-host the “DM Mono” font. Please visit the main [Fontsource website](https://fontsource.org/fonts/dm-mono) to view more details on this package. | ||
| ## Installation | ||
| ## Quick Installation | ||
| Fontsource assumes you are using a bundler, such as Webpack, to load in CSS. Solutions like [CRA](https://create-react-app.dev/), [Gatsby](https://www.gatsbyjs.org/) and [Next.js](https://nextjs.org/) are prebuilt examples that are compatible. | ||
| Fontsource has a variety of methods to import CSS, such as using a bundler like Webpack. Alternatively, it supports SASS. Full documentation can be found [here](https://fontsource.org/docs/introduction). | ||
@@ -16,3 +16,3 @@ ```javascript | ||
| Then within your app entry file or site component, import it in. For example in Gatsby, you could choose to import it into a layout template (`layout.js`), page component (`index.js`), or `gatsby-browser.js`. | ||
| Within your app entry file or site component, import it in. | ||
@@ -23,55 +23,2 @@ ```javascript | ||
| Fontsource allows you to select weights and even individual styles, allowing you to cut down on payload sizes to the last byte! Utilizing the CSS unicode-range selector, all language subsets are accounted for. | ||
| ```javascript | ||
| import "@fontsource/dm-mono/500.css" // Weight 500. | ||
| import "@fontsource/dm-mono/900-italic.css" // Italic variant. | ||
| ``` | ||
| Alternatively, the same solutions could be imported via SCSS! | ||
| ```scss | ||
| @import "~@fontsource/dm-mono/index.css"; // Weight 400. | ||
| @import "~@fontsource/dm-mono/300-italic.css"; | ||
| ``` | ||
| For more advanced setups, you can use our highly customisable Sass mixins that can modify many of the existing @font-face variables. | ||
| ```scss | ||
| @import "~@fontsource/dm-mono/scss/mixins"; | ||
| // Uses a unicode-range map to automatically generate multiple @font-face rules. | ||
| @include fontFace( | ||
| $weight: 500, | ||
| $display: fallback, | ||
| $fontDir: "~@fontsource/dm-mono/files" | ||
| ); | ||
| // Fully customisable single @font-face mixin. | ||
| @include fontFaceCustom( | ||
| $weight: 600, | ||
| $display: optional, | ||
| $woff2Path: "#{$fontDir}/custom-file.woff2", | ||
| $unicodeRange: false | ||
| ); | ||
| // More options available in link below. | ||
| ``` | ||
| We also have default variables that you can use! | ||
| ```scss | ||
| @import "~@fontsource/dm-mono/scss/mixins"; | ||
| $style: italic; | ||
| @include fontFace($weight: 500); | ||
| @include fontFace($weight: 600); | ||
| // Applies italic to both @includes. | ||
| ``` | ||
| You can see all of the existing inputtable mixin variables [here](https://github.com/fontsource/fontsource/tree/master/packages/dm-mono/scss/mixins.scss). | ||
| _These examples may not reflect actual compatibility. Please refer below._ | ||
| Supported variables: | ||
@@ -81,2 +28,3 @@ | ||
| - Styles: `[italic,normal]` | ||
| - Supported subsets: `[latin,latin-ext]` | ||
@@ -91,14 +39,2 @@ Finally, you can reference the font name in a CSS stylesheet, CSS Module, or CSS-in-JS. | ||
| ## Additional Options | ||
| In the rare case you need to individually select a language subset and not utilize the CSS unicode-range selector, you may specify the import as follows. This is especially not recommended for languages, such as Japanese, with a large amount of characters. | ||
| ```javascript | ||
| import "@fontsource/dm-mono/latin-ext.css" // All weights with normal style included. | ||
| import "@fontsource/dm-mono/cyrillic-ext-500.css" // Weight 500 with normal style. | ||
| import "@fontsource/dm-mono/greek-900-italic.css" // Italic variant. | ||
| ``` | ||
| - Supported subsets: `[latin,latin-ext]` | ||
| ## Licensing | ||
@@ -113,4 +49,4 @@ | ||
| Font version (provided by source): `v3`. | ||
| Font version (provided by source): `v5`. | ||
| Feel free to star and contribute new ideas to this repository that aim to improve the performance of font loading, as well as expanding the existing library we already have. Any suggestions or ideas can be voiced via an [issue](https://github.com/fontsource/fontsource/issues). |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Lines of code
- increased by0.35%
285
Worsened metrics
- Total package byte prevSize
- decreased by-0.15%
559991
- Number of lines in readme file
- decreased by-57.66%
47
No dependency changes