Tailwind CSS plugin to generate typography utilities and text style components

  • By Benoît Rouleau
  • Last update: Sep 15, 2022
  • Comments: 17

BLACK LIVES MATTER

Be aware. Be angry. Do better. Demand change. Show your support any way you can. Click on the link above to find protests, petitions, and other ways to help. DO NOT LET IT GO SILENT.

Typography Plugin for Tailwind CSS

Requirements

This plugin requires Tailwind CSS 1.2 or later. If your project uses an older version of Tailwind, you should install the latest 2.x version of this plugin (npm install [email protected]).

Installation

npm install tailwindcss-typography

Usage

// tailwind.config.js
module.exports = {
  theme: {
    textIndent: { // defaults to {}
      '1': '0.25rem',
      '2': '0.5rem',
    },
    textShadow: { // defaults to {}
      'default': '0 2px 5px rgba(0, 0, 0, 0.5)',
      'lg': '0 2px 10px rgba(0, 0, 0, 0.5)',
    },
    textDecorationStyle: { // defaults to these values
      'solid': 'solid',
      'double': 'double',
      'dotted': 'dotted',
      'dashed': 'dashed',
      'wavy': 'wavy',
    },
    textDecorationColor: { // defaults to theme => theme('colors')
      'red': '#f00',
      'green': '#0f0',
      'blue': '#00f',
    },
    fontVariantCaps: { // defaults to these values
      'normal': 'normal',
      'small': 'small-caps',
      'all-small': 'all-small-caps',
      'petite': 'petite-caps',
      'unicase': 'unicase',
      'titling': 'titling-caps',
    },
    fontVariantNumeric: { // defaults to these values
      'normal': 'normal',
      'ordinal': 'ordinal',
      'slashed-zero': 'slashed-zero',
      'lining': 'lining-nums',
      'oldstyle': 'oldstyle-nums',
      'proportional': 'proportional-nums',
      'tabular': 'tabular-nums',
      'diagonal-fractions': 'diagonal-fractions',
      'stacked-fractions': 'stacked-fractions',
    },
    fontVariantLigatures: { // defaults to these values
      'normal': 'normal',
      'none': 'none',
      'common': 'common-ligatures',
      'no-common': 'no-common-ligatures',
      'discretionary': 'discretionary-ligatures',
      'no-discretionary': 'no-discretionary-ligatures',
      'historical': 'historical-ligatures',
      'no-historical': 'no-historical-ligatures',
      'contextual': 'contextual',
      'no-contextual': 'no-contextual',
    },
    textRendering: { // defaults to these values
      'rendering-auto': 'auto',
      'optimize-legibility': 'optimizeLegibility',
      'optimize-speed': 'optimizeSpeed',
      'geometric-precision': 'geometricPrecision'
    },
    textStyles: theme => ({ // defaults to {}
      heading: {
        output: false, // this means there won't be a "heading" component in the CSS, but it can be extended
        fontWeight: theme('fontWeight.bold'),
        lineHeight: theme('lineHeight.tight'),
      },
      h1: {
        extends: 'heading', // this means all the styles in "heading" will be copied here; "extends" can also be an array to extend multiple text styles
        fontSize: theme('fontSize.5xl'),
        '@screen sm': {
          fontSize: theme('fontSize.6xl'),
        },
      },
      h2: {
        extends: 'heading',
        fontSize: theme('fontSize.4xl'),
        '@screen sm': {
          fontSize: theme('fontSize.5xl'),
        },
      },
      h3: {
        extends: 'heading',
        fontSize: theme('fontSize.4xl'),
      },
      h4: {
        extends: 'heading',
        fontSize: theme('fontSize.3xl'),
      },
      h5: {
        extends: 'heading',
        fontSize: theme('fontSize.2xl'),
      },
      h6: {
        extends: 'heading',
        fontSize: theme('fontSize.xl'),
      },
      link: {
        fontWeight: theme('fontWeight.bold'),
        color: theme('colors.blue.400'),
        '&:hover': {
          color: theme('colors.blue.600'),
          textDecoration: 'underline',
        },
      },
      richText: {
        fontWeight: theme('fontWeight.normal'),
        fontSize: theme('fontSize.base'),
        lineHeight: theme('lineHeight.relaxed'),
        '> * + *': {
          marginTop: '1em',
        },
        'h1': {
          extends: 'h1',
        },
        'h2': {
          extends: 'h2',
        },
        'h3': {
          extends: 'h3',
        },
        'h4': {
          extends: 'h4',
        },
        'h5': {
          extends: 'h5',
        },
        'h6': {
          extends: 'h6',
        },
        'ul': {
          listStyleType: 'disc',
        },
        'ol': {
          listStyleType: 'decimal',
        },
        'a': {
          extends: 'link',
        },
        'b, strong': {
          fontWeight: theme('fontWeight.bold'),
        },
        'i, em': {
          fontStyle: 'italic',
        },
      },
    }),
  },
  variants: { // all the following default to ['responsive']
    textIndent: ['responsive'],
    textShadow: ['responsive'],
    textDecorationStyle: ['responsive'],
    textDecorationColor: ['responsive'],
    ellipsis: ['responsive'],
    hyphens: ['responsive'],
    kerning: ['responsive'],
    textUnset: ['responsive'],
    fontVariantCaps: ['responsive'],
    fontVariantNumeric: ['responsive'],
    fontVariantLigatures: ['responsive'],
    textRendering: ['responsive'],
  },
  plugins: [
    require('tailwindcss-typography')({
      // all these options default to the values specified here
      ellipsis: true,         // whether to generate ellipsis utilities
      hyphens: true,          // whether to generate hyphenation utilities
      kerning: true,          // whether to generate kerning utilities
      textUnset: true,        // whether to generate utilities to unset text properties
      componentPrefix: 'c-',  // the prefix to use for text style classes
    }),
  ],
};

This plugin generates the following utilities:

/* configurable with the "textIndent" theme object */
.indent-[key] {
  text-indent: [value];
}

/* configurable with the "textShadow" theme object */
/* note: the "default" key generates a simple "text-shadow" class (instead of "text-shadow-default") */
.text-shadow-[key] {
  text-shadow: [value];
}

/* configurable with the "textDecorationStyle" theme object */
.line-[key] {
  text-decoration-style: [value];
}

/* configurable with the "textDecorationColor" theme object */
.line-[key] {
  text-decoration-color: [value];
}

/* generated when the "ellipsis" option is set to true */
.ellipsis {
  text-overflow: ellipsis;
}
.no-ellipsis {
  text-overflow: clip;
}

/* generated when the "hyphens" option is set to true */
.hyphens-none {
  hyphens: none;
}
.hyphens-manual {
  hyphens: manual;
}
.hyphens-auto {
  hyphens: auto;
}

/* generated when the "kerning" option is set to true */
.kerning {
  font-kerning: normal;
}
.kerning-none {
  font-kerning: none;
}
.kerning-auto {
  font-kerning: auto;
}

/* generated when the "textUnset" option is set to true */
.font-family-unset {
  font-family: inherit;
}
.font-weight-unset {
  font-weight: inherit;
}
.font-style-unset {
  font-style: inherit;
}
.text-size-unset {
  font-size: inherit;
}
.text-align-unset {
  text-align: inherit;
}
.leading-unset {
  line-height: inherit;
}
.tracking-unset {
  letter-spacing: inherit;
}
.text-color-unset {
  color: inherit;
}
.text-transform-unset {
  text-transform: inherit;
}

/* configurable with the "fontVariantCaps" theme object */
.caps-normal {
  font-variant-caps: normal;
}
.caps-small {
  font-variant-caps: small-caps;
}
.caps-all-small {
  font-variant-caps: all-small-caps;
}
.caps-petite {
  font-variant-caps: petite-caps;
}
.caps-unicase {
  font-variant-caps: unicase;
}
.caps-titling {
  font-variant-caps: titling-caps;
}

/* configurable with the "fontVariantNumeric" theme object */
.nums-normal {
  font-variant-numeric: normal;
}
.nums-ordinal {
  font-variant-numeric: ordinal;
}
.nums-slashed-zero {
  font-variant-numeric: slashed-zero;
}
.nums-lining {
  font-variant-numeric: lining-nums;
}
.nums-oldstyle {
  font-variant-numeric: oldstyle-nums;
}
.nums-proportional {
  font-variant-numeric: proportional-nums;
}
.nums-tabular {
  font-variant-numeric: tabular-nums;
}
.nums-diagonal-fractions {
  font-variant-numeric: diagonal-fractions;
}
.nums-stacked-fractions {
  font-variant-numeric: stacked-fractions;
}

/* configurable with the "fontVariantLigatures" theme object */
.ligatures-normal {
  font-variant-ligatures: normal;
}
.ligatures-none {
  font-variant-ligatures: none;
}
.ligatures-common {
  font-variant-ligatures: common-ligatures;
}
.ligatures-no-common {
  font-variant-ligatures: no-common-ligatures;
}
.ligatures-discretionary {
  font-variant-ligatures: discretionary-ligatures;
}
.ligatures-no-discretionary {
  font-variant-ligatures: no-discretionary-ligatures;
}
.ligatures-historical {
  font-variant-ligatures: historical-ligatures;
}
.ligatures-no-historical {
  font-variant-ligatures: no-historical-ligatures;
}
.ligatures-contextual {
  font-variant-ligatures: contextual;
}
.ligatures-no-contextual {
  font-variant-ligatures: no-contextual;
}

/* configurable with the "textRendering" theme object */
.text-rendering-auto {
  text-rendering: auto;
}
.text-optimize-legibility {
  text-rendering: optimizeLegibility;
}
.text-optimize-speed {
  text-rendering: optimizeSpeed;
}
.text-geometric-precision {
  text-rendering: geometricPrecision;
}

The plugin also generates components for text styles. The above config example would generate something like this:

.c-h1 {
  font-weight: 700;
  line-height: 1.25;
  font-size: 3rem;
}
@media (min-width: 640px) {
  .c-h1 {
    font-size: 4rem;
  }
}
.c-h2 {
  font-weight: 800;
  line-height: 1.25;
  font-size: 2.25rem;
}
@media (min-width: 640px) {
  .c-h2 {
    font-size: 3rem;
  }
}
.c-h3 {
  font-weight: 700;
  line-height: 1.25;
  font-size: 2.25rem;
}
.c-h4 {
  font-weight: 700;
  line-height: 1.25;
  font-size: 1.875rem;
}
.c-h5 {
  font-weight: 700;
  line-height: 1.25;
  font-size: 1.5rem;
}
.c-h6 {
  font-weight: 700;
  line-height: 1.25;
  font-size: 1.25rem;
}

.c-link {
  font-weight: 700;
  color: #63b3ed;
}
.c-link:hover {
  color: #3182ce;
  text-decoration: underline;
}

.c-rich-text {
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.625;
}
.c-rich-text > * + * {
  margin-top: 1em;
}
.c-rich-text h1 {
  font-weight: 700;
  line-height: 1.25;
  font-size: 3rem;
}
@media (min-width: 640px) {
  .c-rich-text h1 {
    font-size: 4rem;
  }
}
.c-rich-text h2 {
  font-weight: 800;
  line-height: 1.25;
  font-size: 2.25rem;
}
@media (min-width: 640px) {
  .c-rich-text h2 {
    font-size: 3rem;
  }
}
.c-rich-text h3 {
  font-weight: 700;
  line-height: 1.25;
  font-size: 2.25rem;
}
.c-rich-text h4 {
  font-weight: 700;
  line-height: 1.25;
  font-size: 1.875rem;
}
.c-rich-text h5 {
  font-weight: 700;
  line-height: 1.25;
  font-size: 1.5rem;
}
.c-rich-text h6 {
  font-weight: 700;
  line-height: 1.25;
  font-size: 1.25rem;
}
.c-rich-text ul {
  list-style-type: disc;
}
.c-rich-text ol {
  list-style-type: decimal;
}
.c-rich-text a {
  font-weight: 700;
  color: #63b3ed;
}
.c-rich-text a:hover {
  color: #3182ce;
  text-decoration: underline;
}
.c-rich-text b, .c-rich-text strong {
  font-weight: 700;
}
.c-rich-text i, .c-rich-text em {
  font-style: italic;
}

Github

https://github.com/benface/tailwindcss-typography

Comments(17)

  • 1

    A way to reset `ellipsis` on larger screens?

    text-overflow's default value is clip; there should be a utility to set it to that value so we can reset/remove ellipsis on larger screens.

    Three options:

    • Rename ellipsis to overflow-ellipsis and introduce overflow-clip
    • Rename ellipsis to text-ellipsis and introduce text-clip
    • Keep ellipsis as-is and introduce no-ellipsis

    I think I'm leaning towards option 3.

  • 2

    Not working with @screen in TW 2

    Code:

    theme: {
		textStyles: theme => ({
			heading: {
				output: false, // this means there won't be a "heading" component in the CSS, but it can be extended
				fontWeight: theme('fontWeight.bold'),
				lineHeight: theme('lineHeight.tight'),
			},

			h5: {
				extends: 'heading',
				fontSize: theme('fontSize.4xl'),
				'@screen md': {
					fontSize: theme('fontSize.3xl'),
				},
				'@screen sm': {
					fontSize: theme('fontSize.2xl'),
				},
			},
			h6: {
				extends: 'heading',
				fontSize: theme('fontSize.xl'),
			},
		})

    And output is SCREEN[]

    How to solve it? is this plugin still maintained?

  • 3

    Support for text-decoration-color

    Would be nice to see text-decoration-color supported. This is useful for example when striking text, to have the strike color different from the underlying text color.

    Could also be helpful/applicable to something more common like link underlines? But I have not tested (or needed) that.

  • 4

    No prefix

    Is it possible to have the plugin eject no prefix? It's possible I'm missing something obvious here.

    I've tried using componentPrefix: '',, but that just ejects it as .h1, .p, etc...

    I also tried doing componentPrefix: 'typography ', and adding a class to the body, but it escapes the space, so that's not possible either.

    Basically, just looking to get it to eject the styling as h1 instead of .c-h1.

  • 5

    Support font-feature-setting: 'kern'

    Since we have font-variant-* for most the the features that font-feature-setting covers, we could add one rule for kern without worrying about overwriting with other features:

    .kern {
    font-feature-settings: 'kern';
    font-kerning: normal;
}

    Happy to submit a PR.

  • 6

    Bump ws from 7.3.1 to 7.4.6

    Bumps ws from 7.3.1 to 7.4.6.

    Release notes

    Sourced from ws's releases.

    7.4.6

    Bug fixes

    • Fixed a ReDoS vulnerability (00c425ec).

    A specially crafted value of the Sec-Websocket-Protocol header could be used to significantly slow down a ws server.

    for (const length of [1000, 2000, 4000, 8000, 16000, 32000]) {
  const value = 'b' + ' '.repeat(length) + 'x';
  const start = process.hrtime.bigint();

    value.trim().split(/ *, */);
    

    const end = process.hrtime.bigint();
    

    console.log('length = %d, time = %f ns', length, end - start);
}

    The vulnerability was responsibly disclosed along with a fix in private by Robert McLaughlin from University of California, Santa Barbara.

    In vulnerable versions of ws, the issue can be mitigated by reducing the maximum allowed length of the request headers using the --max-http-header-size=size and/or the maxHeaderSize options.

    7.4.5

    Bug fixes

    • UTF-8 validation is now done even if utf-8-validate is not installed (23ba6b29).
    • Fixed an edge case where websocket.close() and websocket.terminate() did not close the connection (67e25ff5).

    7.4.4

    Bug fixes

    • Fixed a bug that could cause the process to crash when using the permessage-deflate extension (92774377).

    7.4.3

    Bug fixes

    • The deflate/inflate stream is now reset instead of reinitialized when context takeover is disabled (#1840).

    7.4.2

    Bug fixes

    ... (truncated)

    Commits
    • f5297f7 [dist] 7.4.6
    • 00c425e [security] Fix ReDoS vulnerability
    • 990306d [lint] Fix prettier error
    • 32e3a84 [security] Remove reference to Node Security Project
    • 8c914d1 [minor] Fix nits
    • fc7e27d [ci] Test on node 16
    • 587c201 [ci] Do not test on node 15
    • f672710 [dist] 7.4.5
    • 67e25ff [fix] Fix case where abortHandshake() does not close the connection
    • 23ba6b2 [fix] Make UTF-8 validation work even if utf-8-validate is not installed
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

  • 7

    Bump postcss from 7.0.32 to 8.2.10

    Bumps postcss from 7.0.32 to 8.2.10.

    Release notes

    Sourced from postcss's releases.

    8.2.10

    8.2.9

    8.2.8

    8.2.7

    8.2.6

    • Fixed Maximum call stack size exceeded in Node#toJSON.
    • Fixed docs (by @​inokawa).

    8.2.5

    • Fixed escaped characters handling in list.split (by @​nex3).

    8.2.4

    8.2.3

    8.2.2

    8.2.1

    • Fixed Node#toJSON() and postcss.fromJSON() (by @​mischnic).

    8.2 “Prince Orobas”

    PostCSS 8.2 added a new API to serialize and deserialize CSS AST to JSON.

    import { parse, fromJSON } from 'postcss'

    let root = parse('a{}', { from: 'input.css' })
let json = root.toJSON()
// save to file, send by network, etc
let root2 = fromJSON(json)

    ... (truncated)

    Changelog

    Sourced from postcss's changelog.

    8.2.10

    • Fixed ReDoS vulnerabilities in source map parsing.
    • Fixed webpack 5 support (by Barak Igal).
    • Fixed docs (by Roeland Moors).

    8.2.9

    • Exported NodeErrorOptions type (by Rouven Weßling).

    8.2.8

    • Fixed browser builds in webpack 4 (by Matt Jones).

    8.2.7

    • Fixed browser builds in webpack 5 (by Matt Jones).

    8.2.6

    • Fixed Maximum call stack size exceeded in Node#toJSON.
    • Fixed docs (by inokawa).

    8.2.5

    • Fixed escaped characters handling in list.split (by Natalie Weizenbaum).

    8.2.4

    • Added plugin name to postcss.plugin() warning (by Tom Williams).
    • Fixed docs (by Bill Columbia).

    8.2.3

    • Fixed JSON.stringify(Node[]) support (by Niklas Mischkulnig).

    8.2.2

    • Fixed CSS-in-JS support (by James Garbutt).
    • Fixed plugin types (by Ludovico Fischer).
    • Fixed Result#warn() types.

    8.2.1

    • Fixed Node#toJSON() and postcss.fromJSON() (by Niklas Mischkulnig).

    8.2 “Prince Orobas”

    • Added Node#toJSON() and postcss.fromJSON() (by Niklas Mischkulnig).

    8.1.14

    • Fixed parser performance regression.

    8.1.13

    • Fixed broken AST after moving nodes in visitor API.

    8.1.12

    • Fixed Autoprefixer regression.

    8.1.11

    • Added PostCSS update suggestion on unknown event in plugin.

    ... (truncated)

    Commits
    • 8395d9f Release 8.2.10 version
    • f2baaa7 Update ESLint config
    • b6f3e4d Fix unsafe regexp in getAnnotationURL() too
    • 4bcd727 Merge pull request #1553 from barak007/patch-2
    • 7c2e97a Add covrage ignore on error paths
    • 8c58434 Apply suggestions from code review
    • ff2fd57 add error for sourcePath
    • 8f02bdc disable url based features
    • a54d020 Fix browser bundling with webpack 5
    • 8682b1e Fix unsafe regexp
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

  • 8

    Support Tailwind v2

    Currently it throws an error after upgrading to Tailwind v2.0.2: ~~TypeError: target is not a function~~ Edit: Sorry, that error was related to another plugin tailwindcss-gap. This one throws PostCSS plugin postcss-nested requires PostCSS 8.

  • 9

    Bump node-fetch from 2.6.0 to 2.6.1

    Bumps node-fetch from 2.6.0 to 2.6.1.

    Release notes

    Sourced from node-fetch's releases.

    v2.6.1

    This is an important security release. It is strongly recommended to update as soon as possible.

    See CHANGELOG for details.

    Changelog

    Sourced from node-fetch's changelog.

    v2.6.1

    This is an important security release. It is strongly recommended to update as soon as possible.

    • Fix: honor the size option after following a redirect.
    Commits
    • b5e2e41 update version number
    • 2358a6c Honor the size option after following a redirect and revert data uri support
    • 8c197f8 docs: Fix typos and grammatical errors in README.md (#686)
    • 1e99050 fix: Change error message thrown with redirect mode set to error (#653)
    • 244e6f6 docs: Show backers in README
    • 6a5d192 fix: Properly parse meta tag when parameters are reversed (#682)
    • 47a24a0 chore: Add opencollective badge
    • 7b13662 chore: Add funding link
    • 5535c2e fix: Check for global.fetch before binding it (#674)
    • 1d5778a docs: Add Discord badge
    • Additional commits viewable in compare view
    Maintainer changes

    This version was pushed to npm by akepinski, a new releaser for node-fetch since your current version.


    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

  • 10

    Bump lodash from 4.17.15 to 4.17.19

    Bumps lodash from 4.17.15 to 4.17.19.

    Release notes

    Sourced from lodash's releases.

    4.17.16

    Commits
    Maintainer changes

    This version was pushed to npm by mathias, a new releaser for lodash since your current version.


    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

  • 11

    Font Size + Line Height

    When using something like:

    fontSize: theme('fontSize.2xl')

    And the settings for that font size are:

    '2xl': ['1.875rem', '1.2']

    It outputs:

    font-size: 1.875rem,1.2;

    Is there anyway to make this work better with 1.3.0 and line heights? https://tailwindcss.com/docs/font-size/#providing-a-default-line-height-v1-3-0

  • 12

    Bump node-fetch from 2.6.0 to 2.6.7

    Bumps node-fetch from 2.6.0 to 2.6.7.

    Release notes

    Sourced from node-fetch's releases.

    v2.6.7

    Security patch release

    Recommended to upgrade, to not leak sensitive cookie and authentication header information to 3th party host while a redirect occurred

    What's Changed

    Full Changelog: https://github.com/node-fetch/node-fetch/compare/v2.6.6...v2.6.7

    v2.6.6

    What's Changed

    Full Changelog: https://github.com/node-fetch/node-fetch/compare/v2.6.5...v2.6.6

    v2.6.2

    fixed main path in package.json

    v2.6.1

    This is an important security release. It is strongly recommended to update as soon as possible.

    See CHANGELOG for details.

    Changelog

    Sourced from node-fetch's changelog.

    Changelog

    All notable changes will be recorded here.

    The format is based on Keep a Changelog, and this project adheres to Semantic Versioning.

    What's Changed

    New Contributors

    Full Changelog: https://github.com/node-fetch/node-fetch/compare/v3.1.0...v3.1.2

    3.1.0

    What's Changed

    ... (truncated)

    Commits
    • 1ef4b56 backport of #1449 (#1453)
    • 8fe5c4e 2.x: Specify encoding as an optional peer dependency in package.json (#1310)
    • f56b0c6 fix(URL): prefer built in URL version when available and fallback to whatwg (...
    • b5417ae fix: import whatwg-url in a way compatible with ESM Node (#1303)
    • 18193c5 fix v2.6.3 that did not sending query params (#1301)
    • ace7536 fix: properly encode url with unicode characters (#1291)
    • 152214c Fix(package.json): Corrected main file path in package.json (#1274)
    • b5e2e41 update version number
    • 2358a6c Honor the size option after following a redirect and revert data uri support
    • 8c197f8 docs: Fix typos and grammatical errors in README.md (#686)
    • Additional commits viewable in compare view
    Maintainer changes

    This version was pushed to npm by endless, a new releaser for node-fetch since your current version.


    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

  • 13

    Bump color-string from 1.5.3 to 1.9.0

    Bumps color-string from 1.5.3 to 1.9.0.

    Release notes

    Sourced from color-string's releases.

    1.9.0

    Minor Release 1.9.0

    • Add parsing of exponential alpha values for HWB and HSL (#66)

    Thanks to @​babycannotsay for their contribution!

    1.8.2

    Patch release 1.8.2

    • Fix incorrect handling of optional comma in rgb() regex (#65)

    Thanks to @​gerdasi and @​mastertheblaster for reporting and confirming the bug!

    1.8.1

    Patch release 1.8.1

    • Fix rgb alpha percentage parsing from int to float (#61)

    Thanks to @​clytras for their contribution!

    1.8.0

    Minor release 1.8.0

    • Add anchors to keyword regex (#64)

    Thanks to @​cq360767996 for their contribution!

    1.7.4

    Patch Release 1.7.4

    • Fix bug in .to.hex() output if the inputs aren't rounded numbers (#25)

    1.7.3

    Patch Release 1.7.3

    • Fix hue modulo operation (#50)

    Thanks to @​adroitwhiz for their contributions.

    1.7.2

    Patch Release 1.7.2

    • Fix issue where color-string with incorrectly return a color for properties on Object's prototype like "constructor". (#45)

    Thanks to @​tolmasky for their contributions.

    1.7.1

    Patch release 1.7.1

    ... (truncated)

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

  • 14

    Bump ws from 7.3.1 to 7.5.6

    Bumps ws from 7.3.1 to 7.5.6.

    Release notes

    Sourced from ws's releases.

    7.5.6

    Bug fixes

    • Backported b8186dd1 to the 7.x release line (73dec34b).
    • Backported ed2b8039 to the 7.x release line (22a26afb).

    7.5.5

    Bug fixes

    • Backported ec9377ca to the 7.x release line (0e274acd).

    7.5.4

    Bug fixes

    • Backported 6a72da3e to the 7.x release line (76087fbf).
    • Backported 869c9892 to the 7.x release line (27997933).

    7.5.3

    Bug fixes

    • The WebSocketServer constructor now throws an error if more than one of the noServer, server, and port options are specefied (66e58d27).
    • Fixed a bug where a 'close' event was emitted by a WebSocketServer before the internal HTTP/S server was actually closed (5a587304).
    • Fixed a bug that allowed WebSocket connections to be established after WebSocketServer.prototype.close() was called (772236a1).

    7.5.2

    Bug fixes

    • The opening handshake is now aborted if the client receives a Sec-WebSocket-Extensions header but no extension was requested or if the server indicates an extension not requested by the client (aca94c86).

    7.5.1

    Bug fixes

    • Fixed an issue that prevented the connection from being closed properly if an error occurred simultaneously on both peers (b434b9f1).

    7.5.0

    Features

    • Some errors now have a code property describing the specific type of error that has occurred (#1901).

    Bug fixes

    • A close frame is now sent to the remote peer if an error (such as a data framing error) occurs (8806aa9a).

    ... (truncated)

    Commits
    • 8ecd890 [dist] 7.5.6
    • 22a26af [fix] Resume the socket in the CLOSING state
    • 73dec34 [fix] Do not throw if the redirect URL is invalid
    • 2d968a6 [dist] 7.5.5
    • ab5fcd6 [doc] Change label text to CI
    • aa21e70 [ci] Use Github Actions for Windows x86 testing
    • e519810 [pkg] Update eslint-plugin-prettier to version 4.0.0
    • 0e274ac [minor] Skip unnecessary operations if the socket is already closed
    • 075752d [dist] 7.5.4
    • 2799793 [fix] Resume the socket in the next tick
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

  • 15

    Bump tmpl from 1.0.4 to 1.0.5

    Bumps tmpl from 1.0.4 to 1.0.5.

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

  • 16

    Bump path-parse from 1.0.6 to 1.0.7

    Bumps path-parse from 1.0.6 to 1.0.7.

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

  • 17

    Bump postcss from 7.0.32 to 7.0.36

    Bumps postcss from 7.0.32 to 7.0.36.

    Release notes

    Sourced from postcss's releases.

    7.0.36

    • Backport ReDoS vulnerabilities from PostCSS 8.

    7.0.35

    7.0.34

    • Fix compatibility with postcss-scss 2.

    7.0.33

    • Add error message for PostCSS 8 plugins.
    Changelog

    Sourced from postcss's changelog.

    7.0.36

    • Backport ReDoS vulnerabilities from PostCSS 8.

    7.0.35

    • Add migration guide link to PostCSS 8 error text.

    7.0.34

    • Fix compatibility with postcss-scss 2.

    7.0.33

    • Add error message for PostCSS 8 plugins.

    7.0.36

    • Backport ReDoS vulnerabilities from PostCSS 8.

    7.0.35

    • Add migration guide link to PostCSS 8 error text.

    7.0.34

    • Fix compatibility with postcss-scss 2.

    7.0.33

    • Add error message for PostCSS 8 plugins.
    Commits
    • 67e3d7b Release 7.0.36 version
    • 54cbf3c Backport ReDoS vulnerabilities from PostCSS 8
    • 12832f3 Release 7.0.35 version
    • 4455ef6 Use OpenCollective in funding
    • e867c79 Add migration guide to PostCSS 8 error
    • 32a22a9 Release 7.0.34 version
    • 2293982 Lock build targets
    • 2c3a111 Release 7.0.33 version
    • 4105f21 Use yaspeller instead of yaspeller-ci
    • c8d02a0 Revert yaspeller-ci removal
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

Popular Tag

Related