search

pixelastic / norska

🏔️ Custom SSG using Pug, Webpack, PostCSS and Tailwind.
https://projects.pixelastic.com/norska/
MIT License
8 stars 0 forks source link

chore(deps): update external dependencies #33

Closed renovate[bot] closed 4 years ago

renovate[bot] commented 4 years ago

This PR contains the following updates:

Package Type Update Change
autoprefixer dependencies patch 9.7.5 -> 9.7.6
tailwindcss (source) dependencies minor 1.2.0 -> 1.3.3

Release Notes

postcss/autoprefixer ### [`v9.7.6`](https://togithub.com/postcss/autoprefixer/blob/master/CHANGELOG.md#​976) [Compare Source](https://togithub.com/postcss/autoprefixer/compare/9.7.5...9.7.6) - Revert `-webkit-stretch` fix.
tailwindcss/tailwindcss ### [`v1.3.3`](https://togithub.com/tailwindcss/tailwindcss/compare/v1.3.2...v1.3.3) [Compare Source](https://togithub.com/tailwindcss/tailwindcss/compare/v1.3.2...v1.3.3) ### [`v1.3.2`](https://togithub.com/tailwindcss/tailwindcss/releases/v1.3.2) [Compare Source](https://togithub.com/tailwindcss/tailwindcss/compare/v1.3.1...v1.3.2) - Add forgotten `responsive` variants for `space`, `divideWidth`, and `divideColor` utilities ### [`v1.3.1`](https://togithub.com/tailwindcss/tailwindcss/releases/v1.3.1) [Compare Source](https://togithub.com/tailwindcss/tailwindcss/compare/v1.3.0...v1.3.1) - Fix bug where the `space-x` utilities were not being applied correctly due to referencing `--space-y-reverse` instead of `--space-x-reverse` ### [`v1.3.0`](https://togithub.com/tailwindcss/tailwindcss/releases/v1.3.0) [Compare Source](https://togithub.com/tailwindcss/tailwindcss/compare/v1.2.0...v1.3.0) ### Tailwind CSS v1.3.0 Holy crap a new Tailwind CSS release! We've got a few new goodies in this one, and I've made sure to put the most exciting ones at the top 🚀 #### New Features - [New `space` and `divide` layout utilities](#new-space-and-divide-layout-utilities) - [New `transition-delay` utilities](#new-transition-delay-utilities) - [New `group-focus` variant](#new-group-focus-variant) - [Support for specifying a default line-height for each font-size utility](#support-for-specifying-a-default-line-height-for-each-font-size-utility) - [Support for breakpoint-specific padding for `container` class](#support-for-breakpoint-specific-padding-for-container-class) - [Added `current` to the default color palette](#added-current-to-the-default-color-palette) - [New `inline-grid` utility](#new-inline-grid-utility) - [New `flow-root` display utility](#new-flow-root-display-utility) - [New `clear-none` utility](#new-clear-none-utility) ##### New `space` and `divide` layout utilities (#​1584, #​1594) Prior to Tailwind v1.3, if you wanted to add some space or a border between elements, you had to manually add the necessary margin/border to all but one of the children: ```html
  • One
  • Two
  • Three
``` Tailwind v1.3 introduces new `space-{x/y}-{n}`, `divide-{x/y}-{n}`, and `divide-{color}` utilities for controlling this at the parent level instead, simplifying this common pattern into something concise and declarative that doesn't require all of that annoying duplication: ```html
  • One
  • Two
  • Three
``` The `space-x-{n}` utilities add a left margin to all but the first element, and the `space-y-{n}` utilities add a top margin to all but the first element: ```html
  • One
  • Two
  • Three
  • One
  • Two
  • Three
``` The `space` utilities inherit their configuration from the global `spacing` configuration by default, and include negative variations like `-space-x-2` to create overlapping effects. The `divide-x-{n}` utilities add a left border to all but the first element, and the `divide-y-{n}` utilities add a top border to all but the first element: ```html
  • One
  • Two
  • Three
  • One
  • Two
  • Three
``` The `divide` utilities inherit their configuration from the `borderWidth` configuration, and support the `default` keyword (set to 1px out of the box, like with `borderWidth`) so you can use `divide-y` instead of `divide-y-1`. The `divide-{color}` utilities are used to set the color of the dividing borders: ```html
  • One
  • Two
  • Three
``` We've also included `space-{x/y}-reverse` and `divide-{x/y}-reverse` utilities which can be useful if you are reversing the direction of items in a container using either `flex-row-reverse` or `flex-col-reverse`. These utilities swap left margins for right margins, top margins for bottom margins, left borders for right borders, and top borders for bottom borders to account for the items being in reverse order: ```html
  • One
  • Two
  • Three
``` There are a couple limitations of our implementation that are worth pointing out: - They break down if your items wrap, you'll want to do something complicated with negative margins if you need to handle this - They break down if you start manually changing the order of things using the `order` property Despite these limitations, I think you'll still find these incredibly useful. Eventually `gap` will have universal support in flexbox layouts and we can all rejoice. All of these utilities include `responsive` variants by default, and their values and variants can be customized using the `space`, `divideWidth`, and `divideColor` configuration keys respectively. ##### New `transition-delay` utilities (#​1462) Tailwind v1.3 introduces new `delay-{amount}` utilities for the `transition-delay` property: ```html
``` We include the same values we do for the `duration-{amount}` utilities and generate `responsive` variants by default: ```js // tailwind.config.js module.exports = { theme: { // ... transitionDelay: { '75': '75ms', '100': '100ms', '150': '150ms', '200': '200ms', '300': '300ms', '500': '500ms', '700': '700ms', '1000': '1000ms', }, }, variants: { // ... transitionDelay: ['responsive'], }, // ... } ``` ##### New `group-focus` variant (#​1577) We've added a new `group-focus` variant that works just like the existing `group-hover` variant, but for focus states. This is useful when you want to add custom focus style to a button or link that has some nested child you want to style in a specific way, for example, changing the color of an icon inside of a button when the button is focused: ```html ``` This variant not enabled for any utilities by default, but can be enabled in the `variants` section of your config file. ##### Support for specifying a default line-height for each font-size utility (#​1532) A common pattern we've run into in our own Tailwind projects is repeatedly pairing a font-size utility with a particular line-height utility, for example always using `text-sm` with `leading-5`. Tailwind v1.3 now lets you specify a default line-height for each font-size utility in your config file, using a tuple of the form `[fontSize, lineHeight]`: ```js // tailwind.config.js module.exports = { theme: { fontSize: { // Will embed no line-height value sm: '12px', // Will use `font-size: 16px` and `line-height: 24px` md: ['16px', '24px'], }, }, } ``` ```css .text-sm { font-size: 12px; } .text-md { font-size: 16px; line-height: 24px; } ``` The font-size utilities are generated before the line-height utilities in the final CSS, so you can still override the line-height for a particular font-size by simply adding a `leading-{size}` utility: ```html
``` We haven't changed the default config to include default line-heights as that would be a breaking change, but this is a feature we will likely take advantage of in Tailwind 2.0 sometime in the future. ##### Support for breakpoint-specific padding for `container` class (#​1398) Prior to v1.3, you could configure the `container` class to have built-in horizontal padding like so: ```js // tailwind.config.js module.exports = { theme: { container: { padding: '2rem', }, }, } ``` Tailwind v1.3 enhances this functionality to allow you to specify a different amount of padding for each breakpoint: ```js // tailwind.config.js module.exports = { theme: { container: { padding: { default: '1rem', sm: '2rem', lg: '4rem', xl: '5rem', }, }, }, } ``` ##### Added `current` to the default color palette (#​1438) The default color palette now includes `current` for `currentColor`, which simplifies some situations like creating buttons where the border color should match the text color: ```html ``` Since this color has been added to the default color palette, it is available for `textColor`, `borderColor`, `backgroundColor`, and `placeholderColor` utilities automatically. ##### New `inline-grid` utility (#​1375) We've added an `inline-grid` utility for setting `display: inline-grid`. This probably should've been included in v1.2 and somehow got missed, but it's here now baby. ```html ``` Will you ever use this? I never have, but it should still be there dammit. ##### New `flow-root` display utility (#​1247) We've added a new `flow-root` utility for `display: flow-root`. Never heard of it? Me neither until it was PR'd. It behaves _exactly_ like `display: block` with one magical difference: it prevents collapsing margins! ```html
``` You'll start to find all sorts of useful use-cases for this if you pay attention, like [completely obsoleting clearfix hacks](https://alligator.io/css/no-more-clearfix-flow-root/). ##### New `clear-none` utility (#​1413) This has been in the documentation for months but didn't actually exist in the framework — whoops. It sets `clear: none`, which is mostly useful for resetting the `clear` property at different breakpoints. ```html

``` Only two people noticed it was documented but missing, so odds are you don't even care that we added this.

Renovate configuration

:date: Schedule: "after 6pm,before 9am" in timezone Europe/Paris.

:vertical_traffic_light: Automerge: Enabled.

:recycle: Rebasing: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.

:ghost: Immortal: This PR will be recreated if closed unmerged. Get config help if that's undesired.

This PR has been generated by WhiteSource Renovate. View repository job log here.

renovate[bot] commented 4 years ago

Branch automerge failure

This PR was configured for branch automerge, however this is not possible so it has been raised as a PR instead.