Skip to content
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

QUESTION: How do we version patterns on npm? #119

Closed
khawkins98 opened this issue Dec 20, 2018 · 0 comments
Closed

QUESTION: How do we version patterns on npm? #119

khawkins98 opened this issue Dec 20, 2018 · 0 comments
Assignees

Comments

@khawkins98
Copy link
Contributor

Picking back up on issue #28 ("Do we publish patterns independently or as part of one big release?") which went a bit sprawling.

I think we've agreed that the patterns and vf-core can be published independently, so now the main question is how do we version the two aspects?

The status quo of versioning:

  1. vf-core@2.0.0-alpha.x the "build environment" for the pattern library, gulp and sass config follows largely semantic versioning from a v2.0.0 start.
  2. vf-pattern-x@0.0.2 the patterns being incremented from v0.0.0 with the intention of semantic versioning.
  3. vf-child-theme-template@2.0.0-alpha.x For users rolling custom look/feel there will probably be some started template like this based off a trimmed version of vf-core and should probably follow the vf-core versioning ... vf-child-theme-template@2.1.0 is based off vf-core@2.1.0
  4. 🙃Bonus note: while patterns are their own thing/version on npm, vf-core patterns (there hopefully will be popular 3rd party ones from other repos) will be baked into the newest release ... vf-new-pattern@0.0.1 will only appear on the next release, say, vf-core@2.1.2. This should be a non-issue as people won't be intended to clone the vf-core repo, rather to clone vf-child-theme-template and then pick whichever pattern+version from npm.

How will things be?

A table to illustrate where we're thinking/at:

Baseline
Does its own thing (v0.0.0) Coupled to vf-core (v2.0.0+)
vf-core
vf-child-theme-template
vf-pattern-x

Questions and user stories we need to satisfy

  1. Will certain patterns be compatible with certain version of the build environment vf-core? For example if in, say, vf-core@2.1.0 we:
    • add a new required variant option to patterns' .config.yml?
    • change the sass compiler to add/remove certain options?

If patterns are based off v0.0.0 then they would need to note any compatibility issues, a la:

  • vf-pattern-x@1.x.0 is compatible with vf-core@2.0.x
  • vf-pattern-x@2.0.0 requires vf-core@^2.1.x
  1. Interoperability between patterns
  • vf-pattern-x@2.1.2 requires pattern vf-pattern-y@^8.1.0

To me, I'm not seeing a hard reason why we can't go with the above, de-coupling of pattern version from vf-core versions.

@khawkins98 khawkins98 added this to the v2.0.0-alpha.2 milestone Dec 20, 2018
@khawkins98 khawkins98 self-assigned this Jul 1, 2019
khawkins98 added a commit that referenced this issue Jul 8, 2019
* vf-form dependencies

* chore: opimise-sas-import-paths

Sets up a cleaner hirearchy of sass path imports.

Also does an npm update.

* fix: vf-global-header-dependencies

Was using an old version of vf-logo

* chore: load-latest-patterns-to-npm

Resolve a couple of broken package dependencies.

* Fix: docs should soft fail when vf-design-tokens aren't present

* Typos

* Chore: don't send backstop files to npm

Just a cleanup thing I suppose.

* Always ignore any vf-core-components/vf-core components

There should typically never be any components here, but:

1. A developer might drop them in the wrong spot
2. if we're testing the npm directly from github, we need to ignore these

* Typo

* removes BackStop.js and adds Percy

* adds .percy.yml config file

* adds Percy.io badge

* updates percy yml file

* chore: cleanup autocomment

Mostly does two things:

- Reduces the amount of spam we're getting when a PR is made and review requested (and I think this phrasing might be more helfpul to external devs)
- Tries to fix [ ] checkbox formatting with 2 spaces at end of each line

* updates .percy.yml

* updates travis.yml for percy to be fired

* fixes incorrect variable spelling

* updates breadcrumbs so the work without an embl-grid

* adds spacing for when on desktop, hides fake dark grey bar

* various spacing issues fixed to make it look nicer

* stylelint fixes

* tidies up breadcrumbs specifity

* fixes breadcrumb on mobile

* fixes breadcrumb on mobile

* fixes main navigation inside header

* bug: conditional-edit-order-of-operation

Resolves an issue where `?embl-conditional-edit` was being parsed before content had loaded.

* enhancement: dont-link-breadcrumbs-without-url

The current desire is that when we don't have a working url, to not link the term.

* Enhancement: vf-blockquote

Adds `blockquout` to `vf-conent` and better insulates against external styling with a `border: 0`

Relates to https://gitlab.ebi.ac.uk/emblorg/backlog/issues/215

* Usage updates for vf-breadcrumb to remove wrapping grid

* the one that fixes quite a lot of small issues with vf-core and vf-wp (#441)

* fixes incorrect variable spelling

* updates breadcrumbs so the work without an embl-grid

* adds spacing for when on desktop, hides fake dark grey bar

* various spacing issues fixed to make it look nicer

* stylelint fixes

* tidies up breadcrumbs specifity

* fixes breadcrumb on mobile

* fixes breadcrumb on mobile

* fixes main navigation inside header

* the one where we include the first pass at a card component (#440)

* npm shrinkwrap idk

* adds initial vf-card pattern

* some spacing fixes for hover and mobile

* makes the image not go crazy on small viewports

* Enhancement: update heading--l text size

Resolves issues that occur as `heading--l` and `heading--l-alit` were both 24px

For more background see: https://gitlab.ebi.ac.uk/emblorg/backlog/issues/215#note_45386

We could also resolve some of these issues by manually setting the `.vf-content h2` size, but that would be a bit of a hack and not get updates from vf-design-tokens.

This will have some knockon effects to other patterns, sometimes it may be a "change for the better" other times we may need to update a pattern to use `--l-alt`

The Sketch paragraph styles may also need to be updated.

* enhancement: use-heading--l-alt-for-some-patterns

Follows up on #443 by subing out `heading--l` for `heading--l-alt` in:

- vf-card
- vf-section-header
- vf-summary
- vf-video-teaser

Basically, where a bump from 30px to 24px was undesirable.

We may have a larger refactor of the naming of some of these tokens coming, but for now this "makes things look right", i think.

* BUG: hover issue with buttons or links that look like buttons

Procrastinating writing some documentation so had a go at sorting #436

* Chore: vf-sass-utilities should be on npm (#449)

Addresses #399

* Docs: How do we version patterns on npm? #119

* Docs: List core audiences/user types #127

* Typos

* Typos

* Bug: Autocomment formatting

Continues effort to (attempt to) clean up formatting.

* bug: spacing-token-naming

The spacing token names missed an update, that is: `vf-spacing-r` should be `vf-spacing--r`

Also adds an issue where nested `.vf-content ul li > ul` didn't have a needed margin at the top.

* Enhancement: gulp css building, linting

Addresses #412 and also address the "spirit" of that ticket, by:

- Making the css linting come after the css recompilation
- Adds a soft-fail css linting task that won't explode the local deve experience
- Fixes `vf-css` to use a better callback approach so that:
    1. You get an accurate idea of the css build time
    2. A real signal that the vf-css pipe stream has completed
    3. No longer get a flash of fractal befor the css build has finished

And it should be a bit faster now that fractal won't try to run while the Sass is still building.

* Bug: fix static build path

This mainly fixes how vf-card was showing without the image when deployed. It relates to #364 on how we need to document this, propbably in the pattern template too.

It also sneaks in a fix where the utility mixins were need for the hover effect for the button.

* Drop vf-sass-lint from watch command

* docs: Using frctl `path` with njk templates (#458)

Addresses #364

* CHORE: Swap npm for yarn

Addresses #455

* Bug: component variant name, demo (#461)

A few minor fixes I stumbled on while working on #460: a name for a vf-text variant and the vf-headings demo

* the one where we use variants for the vf-card component (#462)

* makes use of nunjucks to create variants

* makes use of variables and maps and normalises some sizing

* small readme update

* Elsewhere we've used hyphens, changing for consistency

* Remove _preview--grids

It's the same as --containers

* Remove _preview--containers

* bug: vf-conent-hub-html grid-escape

The below tweak introduced some layout issues as non-layout affecting content out of the content hub (think: blocks) was being escaped from the grid.

```
.embl-content-hub-html {
  grid-column: 1 / -1;
}
```

This fixes that by only targeting elements that are direct children of `-grid`.

It also add `.embl-content-hub-html` so we can begin to update classes in the contentHub.

* Chore: set percy to run only on develop

This limits the percy command to only run on commits to develop and compares against master.

We might also want to disable the github integration to stop comparissons on PRs, which has chewed through our alotment of screenshots.

This also set it only do mobile/desktop for a 33% savings :D

But it doesn't really matter until August as we've already gone through our quota!

* Forgot to commit

* Docs: move design token demonstration (#468)

As I work through cleaning up docs and making "things more approachable", it became clear that the design tokens can (of course) change in both how they're used and how much technical detail should be shown.

With that in mind I've moved the existing `/docs/styles/` to be paired directly with `vf-design-tokens`

I think this:

1. Makes it clear that these settings come from `vf-design-tokens`
2. Are where developers might expect the most technical values
3. We can link to from `/docs`
4. Makes it possible to put something more high level in `docs/styles`
5 It also stops the risk of "what happens when there's `docs/styles` but `vf-design-tokens` wasn't installed?

* adds vertical spacing for vf-lede, normalises spacing for vf-intor (#472)

* adds vertical spacing for vf-lede, normalises spacing for vf-intor

* moves vf-lede margin to vf-intro parent

* RELAESES - alpha.7 (#470)

* Update package.json

* Update npm versions
khawkins98 added a commit that referenced this issue Jul 19, 2019
* vf-form dependencies

* chore: opimise-sas-import-paths

Sets up a cleaner hirearchy of sass path imports.

Also does an npm update.

* fix: vf-global-header-dependencies

Was using an old version of vf-logo

* chore: load-latest-patterns-to-npm

Resolve a couple of broken package dependencies.

* Fix: docs should soft fail when vf-design-tokens aren't present

* Typos

* Chore: don't send backstop files to npm

Just a cleanup thing I suppose.

* Always ignore any vf-core-components/vf-core components

There should typically never be any components here, but:

1. A developer might drop them in the wrong spot
2. if we're testing the npm directly from github, we need to ignore these

* Typo

* removes BackStop.js and adds Percy

* adds .percy.yml config file

* adds Percy.io badge

* updates percy yml file

* chore: cleanup autocomment

Mostly does two things:

- Reduces the amount of spam we're getting when a PR is made and review requested (and I think this phrasing might be more helfpul to external devs)
- Tries to fix [ ] checkbox formatting with 2 spaces at end of each line

* updates .percy.yml

* updates travis.yml for percy to be fired

* fixes incorrect variable spelling

* updates breadcrumbs so the work without an embl-grid

* adds spacing for when on desktop, hides fake dark grey bar

* various spacing issues fixed to make it look nicer

* stylelint fixes

* tidies up breadcrumbs specifity

* fixes breadcrumb on mobile

* fixes breadcrumb on mobile

* fixes main navigation inside header

* bug: conditional-edit-order-of-operation

Resolves an issue where `?embl-conditional-edit` was being parsed before content had loaded.

* enhancement: dont-link-breadcrumbs-without-url

The current desire is that when we don't have a working url, to not link the term.

* Enhancement: vf-blockquote

Adds `blockquout` to `vf-conent` and better insulates against external styling with a `border: 0`

Relates to https://gitlab.ebi.ac.uk/emblorg/backlog/issues/215

* Usage updates for vf-breadcrumb to remove wrapping grid

* the one that fixes quite a lot of small issues with vf-core and vf-wp (#441)

* fixes incorrect variable spelling

* updates breadcrumbs so the work without an embl-grid

* adds spacing for when on desktop, hides fake dark grey bar

* various spacing issues fixed to make it look nicer

* stylelint fixes

* tidies up breadcrumbs specifity

* fixes breadcrumb on mobile

* fixes breadcrumb on mobile

* fixes main navigation inside header

* the one where we include the first pass at a card component (#440)

* npm shrinkwrap idk

* adds initial vf-card pattern

* some spacing fixes for hover and mobile

* makes the image not go crazy on small viewports

* Enhancement: update heading--l text size

Resolves issues that occur as `heading--l` and `heading--l-alit` were both 24px

For more background see: https://gitlab.ebi.ac.uk/emblorg/backlog/issues/215#note_45386

We could also resolve some of these issues by manually setting the `.vf-content h2` size, but that would be a bit of a hack and not get updates from vf-design-tokens.

This will have some knockon effects to other patterns, sometimes it may be a "change for the better" other times we may need to update a pattern to use `--l-alt`

The Sketch paragraph styles may also need to be updated.

* enhancement: use-heading--l-alt-for-some-patterns

Follows up on #443 by subing out `heading--l` for `heading--l-alt` in:

- vf-card
- vf-section-header
- vf-summary
- vf-video-teaser

Basically, where a bump from 30px to 24px was undesirable.

We may have a larger refactor of the naming of some of these tokens coming, but for now this "makes things look right", i think.

* BUG: hover issue with buttons or links that look like buttons

Procrastinating writing some documentation so had a go at sorting #436

* Chore: vf-sass-utilities should be on npm (#449)

Addresses #399

* Docs: How do we version patterns on npm? #119

* Docs: List core audiences/user types #127

* Typos

* Typos

* Bug: Autocomment formatting

Continues effort to (attempt to) clean up formatting.

* bug: spacing-token-naming

The spacing token names missed an update, that is: `vf-spacing-r` should be `vf-spacing--r`

Also adds an issue where nested `.vf-content ul li > ul` didn't have a needed margin at the top.

* Enhancement: gulp css building, linting

Addresses #412 and also address the "spirit" of that ticket, by:

- Making the css linting come after the css recompilation
- Adds a soft-fail css linting task that won't explode the local deve experience
- Fixes `vf-css` to use a better callback approach so that:
    1. You get an accurate idea of the css build time
    2. A real signal that the vf-css pipe stream has completed
    3. No longer get a flash of fractal befor the css build has finished

And it should be a bit faster now that fractal won't try to run while the Sass is still building.

* Bug: fix static build path

This mainly fixes how vf-card was showing without the image when deployed. It relates to #364 on how we need to document this, propbably in the pattern template too.

It also sneaks in a fix where the utility mixins were need for the hover effect for the button.

* Drop vf-sass-lint from watch command

* docs: Using frctl `path` with njk templates (#458)

Addresses #364

* updates ordering of typography

* CHORE: Swap npm for yarn

Addresses #455

* Bug: component variant name, demo (#461)

A few minor fixes I stumbled on while working on #460: a name for a vf-text variant and the vf-headings demo

* the one where we use variants for the vf-card component (#462)

* makes use of nunjucks to create variants

* makes use of variables and maps and normalises some sizing

* small readme update

* Elsewhere we've used hyphens, changing for consistency

* Remove _preview--grids

It's the same as --containers

* Remove _preview--containers

* bug: vf-conent-hub-html grid-escape

The below tweak introduced some layout issues as non-layout affecting content out of the content hub (think: blocks) was being escaped from the grid.

```
.embl-content-hub-html {
  grid-column: 1 / -1;
}
```

This fixes that by only targeting elements that are direct children of `-grid`.

It also add `.embl-content-hub-html` so we can begin to update classes in the contentHub.

* updates button, body, and text design tokens

* removes unused monospace tokens

* swaps vf-color--grey--light and vf-color--grey--lightest

* Chore: set percy to run only on develop

This limits the percy command to only run on commits to develop and compares against master.

We might also want to disable the github integration to stop comparissons on PRs, which has chewed through our alotment of screenshots.

This also set it only do mobile/desktop for a 33% savings :D

But it doesn't really matter until August as we've already gone through our quota!

* Forgot to commit

* Docs: move design token demonstration (#468)

As I work through cleaning up docs and making "things more approachable", it became clear that the design tokens can (of course) change in both how they're used and how much technical detail should be shown.

With that in mind I've moved the existing `/docs/styles/` to be paired directly with `vf-design-tokens`

I think this:

1. Makes it clear that these settings come from `vf-design-tokens`
2. Are where developers might expect the most technical values
3. We can link to from `/docs`
4. Makes it possible to put something more high level in `docs/styles`
5 It also stops the risk of "what happens when there's `docs/styles` but `vf-design-tokens` wasn't installed?

* updats

* adds vertical spacing for vf-lede, normalises spacing for vf-intor (#472)

* adds vertical spacing for vf-lede, normalises spacing for vf-intor

* moves vf-lede margin to vf-intro parent

* RELAESES - alpha.7 (#470)

* Update package.json

* Update npm versions

* Guidance on how (and when) to start using vf-core #391, #339 (#474)

In this commit we make it clear(er) that the role of the Fractal part of vf-core is to be the component library.

It also works to cleanup the docs in general leverage the vf-welcome site, which itself is a work in progress.

In all, this narrows the role of docs within vf-core to be directly about the component library and lets vf-welcome be an umbrella site to support both vf-core and vf-eleventy, and likely other sites as well.

* Drop glob for fastglob

Before: `Finished 'vf-css' after 1.68 s`
After: `Finished 'vf-css' after 1.41 s`

Background: see #481

Note: fastglob isn't suitable for use everywhere, particuarly if we want to pass globed assets into a folder.

* BUG: Remove extra spacing from vf-badge

Was breaking formatting on render in whitespace-aware environments.

* BUG: Fix for code examples that break layout

Currently .vf-content pre and .vf-code-example__pre have the default behaviour of never breaking and will explode the layout.

This stops that.

* ENHANCEMENT: Code highlighting

I'm working a lot with code snippets at the moment and the lack of formatting has finally gotten to me. This is basically GitHub's approach with VF sizings.

Probably more to do here, but a placeholder until Mark has time to draft a design.

* Fix pre blocks, use spacing map

* linting

* chore: update-footer

* Revert "chore: update-footer"

This reverts commit 8b52e69.

* Make footer generic

* Chore: twaks for vf-component-rollup docs, integration

A couple of minor edits to the rollup to make its use a bit clearer. Also add a `.yml` and `.njk` whose absence would make fractal brittle in some occasions.

* Language tweaks

* Give info about cloning the vf-component-rollup

* removes normalize dependency

* removes normalize dependency

* adds body margin reset

* enhancement: vf-grid--reset

Sometimes content needs to escape a grid container, for example full-width content inside of `.vf-body`.

This formalises an adhoc approach that was appearing in some places, like the component library when needing to show components like the global footer at full-screen width in the middel of the page, or on the groups sites with the local `.vfwp-column-reset`

* Somehow the old docs came back

* Remove uneedded dependencies

* the one where we update the card so it can be a link (#495)

* fixes the text moving issue on hover

* adds the option to use as link

* adds the option to use as link

* ENHANCEMENT - ship, enhance component generator (#477)

* CHORE - Ship component generator

It will be easier to create local design system components (think: `randomservice-component-idea`) if we ship the component generator.

* Pick up the project namespace for making the component

That is, if you're in an embl environment it gives you an `embl-` option ... EBI gives you `ebi-`, Service X gives `servicex-`

* Use package.json relative to project root

* Sneak in a templeting fix

Sorts an issue if docsection is empty.

In reality this whole chunk of code might go soon, but error proofing for now.

* Should default to the local environment

* Fix namespace guidance

* Make npm frasing future-tense

* Respect vfComponentPath; no need to set globals here

* CHORE - update component versions status (#496)

* Chore: update component versions, status

This goes through the components in prep of the beta:

- updates status of several components to be alpha/beta, depending on how much they're likely to change (quite a lot of the components are understandably alpha)
- makes a component's npm alpha/beta consistent with the alpha/beta status in the config.yml
- sets the version to `alpha/beta.0`, which will be bumped to `.1` on the next lerna publish

* Cleanup changelogs

No one wants to no the pre-release junk

* updates t-shirt sizes to be at least two letter variants

* fixes a little 2izes problem

* Run vf-tokens

* Remove zombie files from merge resolve

* Class name fixes, mostly on usage of `.vf-u-`

* should fix all outstanding issues with design tokens switch

* Fix njk templates

* Use integer sizing for type/heading

* fixes radio buttons not working (#497)

* Capture lerna bumps

* Update vf-core to alpha.8

* Update vf-content dependencies

* Update dependencies, remove trivial dependencies

* Version bumps to incorporate latest package.json fixes
khawkins98 added a commit that referenced this issue Jul 25, 2019
* vf-form dependencies

* chore: opimise-sas-import-paths

Sets up a cleaner hirearchy of sass path imports.

Also does an npm update.

* fix: vf-global-header-dependencies

Was using an old version of vf-logo

* chore: load-latest-patterns-to-npm

Resolve a couple of broken package dependencies.

* Fix: docs should soft fail when vf-design-tokens aren't present

* Typos

* Chore: don't send backstop files to npm

Just a cleanup thing I suppose.

* Always ignore any vf-core-components/vf-core components

There should typically never be any components here, but:

1. A developer might drop them in the wrong spot
2. if we're testing the npm directly from github, we need to ignore these

* Typo

* removes BackStop.js and adds Percy

* adds .percy.yml config file

* adds Percy.io badge

* updates percy yml file

* chore: cleanup autocomment

Mostly does two things:

- Reduces the amount of spam we're getting when a PR is made and review requested (and I think this phrasing might be more helfpul to external devs)
- Tries to fix [ ] checkbox formatting with 2 spaces at end of each line

* updates .percy.yml

* updates travis.yml for percy to be fired

* fixes incorrect variable spelling

* updates breadcrumbs so the work without an embl-grid

* adds spacing for when on desktop, hides fake dark grey bar

* various spacing issues fixed to make it look nicer

* stylelint fixes

* tidies up breadcrumbs specifity

* fixes breadcrumb on mobile

* fixes breadcrumb on mobile

* fixes main navigation inside header

* bug: conditional-edit-order-of-operation

Resolves an issue where `?embl-conditional-edit` was being parsed before content had loaded.

* enhancement: dont-link-breadcrumbs-without-url

The current desire is that when we don't have a working url, to not link the term.

* Enhancement: vf-blockquote

Adds `blockquout` to `vf-conent` and better insulates against external styling with a `border: 0`

Relates to https://gitlab.ebi.ac.uk/emblorg/backlog/issues/215

* Usage updates for vf-breadcrumb to remove wrapping grid

* the one that fixes quite a lot of small issues with vf-core and vf-wp (#441)

* fixes incorrect variable spelling

* updates breadcrumbs so the work without an embl-grid

* adds spacing for when on desktop, hides fake dark grey bar

* various spacing issues fixed to make it look nicer

* stylelint fixes

* tidies up breadcrumbs specifity

* fixes breadcrumb on mobile

* fixes breadcrumb on mobile

* fixes main navigation inside header

* the one where we include the first pass at a card component (#440)

* npm shrinkwrap idk

* adds initial vf-card pattern

* some spacing fixes for hover and mobile

* makes the image not go crazy on small viewports

* Enhancement: update heading--l text size

Resolves issues that occur as `heading--l` and `heading--l-alit` were both 24px

For more background see: https://gitlab.ebi.ac.uk/emblorg/backlog/issues/215#note_45386

We could also resolve some of these issues by manually setting the `.vf-content h2` size, but that would be a bit of a hack and not get updates from vf-design-tokens.

This will have some knockon effects to other patterns, sometimes it may be a "change for the better" other times we may need to update a pattern to use `--l-alt`

The Sketch paragraph styles may also need to be updated.

* enhancement: use-heading--l-alt-for-some-patterns

Follows up on #443 by subing out `heading--l` for `heading--l-alt` in:

- vf-card
- vf-section-header
- vf-summary
- vf-video-teaser

Basically, where a bump from 30px to 24px was undesirable.

We may have a larger refactor of the naming of some of these tokens coming, but for now this "makes things look right", i think.

* BUG: hover issue with buttons or links that look like buttons

Procrastinating writing some documentation so had a go at sorting #436

* Chore: vf-sass-utilities should be on npm (#449)

Addresses #399

* Docs: How do we version patterns on npm? #119

* Docs: List core audiences/user types #127

* Typos

* Typos

* Bug: Autocomment formatting

Continues effort to (attempt to) clean up formatting.

* bug: spacing-token-naming

The spacing token names missed an update, that is: `vf-spacing-r` should be `vf-spacing--r`

Also adds an issue where nested `.vf-content ul li > ul` didn't have a needed margin at the top.

* Enhancement: gulp css building, linting

Addresses #412 and also address the "spirit" of that ticket, by:

- Making the css linting come after the css recompilation
- Adds a soft-fail css linting task that won't explode the local deve experience
- Fixes `vf-css` to use a better callback approach so that:
    1. You get an accurate idea of the css build time
    2. A real signal that the vf-css pipe stream has completed
    3. No longer get a flash of fractal befor the css build has finished

And it should be a bit faster now that fractal won't try to run while the Sass is still building.

* Bug: fix static build path

This mainly fixes how vf-card was showing without the image when deployed. It relates to #364 on how we need to document this, propbably in the pattern template too.

It also sneaks in a fix where the utility mixins were need for the hover effect for the button.

* Drop vf-sass-lint from watch command

* docs: Using frctl `path` with njk templates (#458)

Addresses #364

* updates ordering of typography

* CHORE: Swap npm for yarn

Addresses #455

* Bug: component variant name, demo (#461)

A few minor fixes I stumbled on while working on #460: a name for a vf-text variant and the vf-headings demo

* the one where we use variants for the vf-card component (#462)

* makes use of nunjucks to create variants

* makes use of variables and maps and normalises some sizing

* small readme update

* Elsewhere we've used hyphens, changing for consistency

* Remove _preview--grids

It's the same as --containers

* Remove _preview--containers

* bug: vf-conent-hub-html grid-escape

The below tweak introduced some layout issues as non-layout affecting content out of the content hub (think: blocks) was being escaped from the grid.

```
.embl-content-hub-html {
  grid-column: 1 / -1;
}
```

This fixes that by only targeting elements that are direct children of `-grid`.

It also add `.embl-content-hub-html` so we can begin to update classes in the contentHub.

* updates button, body, and text design tokens

* removes unused monospace tokens

* swaps vf-color--grey--light and vf-color--grey--lightest

* Chore: set percy to run only on develop

This limits the percy command to only run on commits to develop and compares against master.

We might also want to disable the github integration to stop comparissons on PRs, which has chewed through our alotment of screenshots.

This also set it only do mobile/desktop for a 33% savings :D

But it doesn't really matter until August as we've already gone through our quota!

* Forgot to commit

* Docs: move design token demonstration (#468)

As I work through cleaning up docs and making "things more approachable", it became clear that the design tokens can (of course) change in both how they're used and how much technical detail should be shown.

With that in mind I've moved the existing `/docs/styles/` to be paired directly with `vf-design-tokens`

I think this:

1. Makes it clear that these settings come from `vf-design-tokens`
2. Are where developers might expect the most technical values
3. We can link to from `/docs`
4. Makes it possible to put something more high level in `docs/styles`
5 It also stops the risk of "what happens when there's `docs/styles` but `vf-design-tokens` wasn't installed?

* updats

* adds vertical spacing for vf-lede, normalises spacing for vf-intor (#472)

* adds vertical spacing for vf-lede, normalises spacing for vf-intor

* moves vf-lede margin to vf-intro parent

* RELAESES - alpha.7 (#470)

* Update package.json

* Update npm versions

* Guidance on how (and when) to start using vf-core #391, #339 (#474)

In this commit we make it clear(er) that the role of the Fractal part of vf-core is to be the component library.

It also works to cleanup the docs in general leverage the vf-welcome site, which itself is a work in progress.

In all, this narrows the role of docs within vf-core to be directly about the component library and lets vf-welcome be an umbrella site to support both vf-core and vf-eleventy, and likely other sites as well.

* Drop glob for fastglob

Before: `Finished 'vf-css' after 1.68 s`
After: `Finished 'vf-css' after 1.41 s`

Background: see #481

Note: fastglob isn't suitable for use everywhere, particuarly if we want to pass globed assets into a folder.

* BUG: Remove extra spacing from vf-badge

Was breaking formatting on render in whitespace-aware environments.

* BUG: Fix for code examples that break layout

Currently .vf-content pre and .vf-code-example__pre have the default behaviour of never breaking and will explode the layout.

This stops that.

* ENHANCEMENT: Code highlighting

I'm working a lot with code snippets at the moment and the lack of formatting has finally gotten to me. This is basically GitHub's approach with VF sizings.

Probably more to do here, but a placeholder until Mark has time to draft a design.

* Fix pre blocks, use spacing map

* linting

* chore: update-footer

* Revert "chore: update-footer"

This reverts commit 8b52e69.

* Make footer generic

* stuff

* Chore: twaks for vf-component-rollup docs, integration

A couple of minor edits to the rollup to make its use a bit clearer. Also add a `.yml` and `.njk` whose absence would make fractal brittle in some occasions.

* Language tweaks

* Give info about cloning the vf-component-rollup

* removes normalize dependency

* removes normalize dependency

* adds body margin reset

* enhancement: vf-grid--reset

Sometimes content needs to escape a grid container, for example full-width content inside of `.vf-body`.

This formalises an adhoc approach that was appearing in some places, like the component library when needing to show components like the global footer at full-screen width in the middel of the page, or on the groups sites with the local `.vfwp-column-reset`

* Somehow the old docs came back

* Remove uneedded dependencies

* the one where we update the card so it can be a link (#495)

* fixes the text moving issue on hover

* adds the option to use as link

* adds the option to use as link

* ENHANCEMENT - ship, enhance component generator (#477)

* CHORE - Ship component generator

It will be easier to create local design system components (think: `randomservice-component-idea`) if we ship the component generator.

* Pick up the project namespace for making the component

That is, if you're in an embl environment it gives you an `embl-` option ... EBI gives you `ebi-`, Service X gives `servicex-`

* Use package.json relative to project root

* Sneak in a templeting fix

Sorts an issue if docsection is empty.

In reality this whole chunk of code might go soon, but error proofing for now.

* Should default to the local environment

* Fix namespace guidance

* Make npm frasing future-tense

* Respect vfComponentPath; no need to set globals here

* CHORE - update component versions status (#496)

* Chore: update component versions, status

This goes through the components in prep of the beta:

- updates status of several components to be alpha/beta, depending on how much they're likely to change (quite a lot of the components are understandably alpha)
- makes a component's npm alpha/beta consistent with the alpha/beta status in the config.yml
- sets the version to `alpha/beta.0`, which will be bumped to `.1` on the next lerna publish

* Cleanup changelogs

No one wants to no the pre-release junk

* updates t-shirt sizes to be at least two letter variants

* fixes a little 2izes problem

* Run vf-tokens

* Remove zombie files from merge resolve

* Class name fixes, mostly on usage of `.vf-u-`

* should fix all outstanding issues with design tokens switch

* Fix njk templates

* Use integer sizing for type/heading

* fixes radio buttons not working (#497)

* Capture lerna bumps

* Update vf-core to alpha.8

* Update vf-content dependencies

* Update dependencies, remove trivial dependencies

* Version bumps to incorporate latest package.json fixes

* adds vf-summary--publication

* adds et al helper class

* fixes linting issue by not nesting

* re-implements autoprefixer

* adds minimal documentation

* fixes various minor CSS mispellings (#501)

* Prime task splitting

* Move vf-scripts task

* Move vf-css

* Move vf-cleanup

* Move vf-svg

* Move vf-component-assets

* Move vf-fractal

* Move vf-watch

* Note dependencies that we might be able to remove

* Reload and watch need top be where you might not expect them

* Explicitly require sub-gulp files

A bit more effort, but it's a bit clearer what's happening and removes a dependency.

* Refactor as JS modules

as it makes passing paramaters simpler and avoids needing workarounds invlolving global variables

* vf-components needs to know where it's run from

* Use a rollup of gulp tasks for better portability

* Sort an issue around component paths

* Gulp and path don't really need special information

* Add a bit of a soft touch

* the one where we add a moving label (#503)

* fixes radio buttons not working

* replaces script for floating label

* adds relevant new classes where needed

* adds floatlabel classes

* various bits to tidy up horizontal and vertical layout

* changes the display none to only work if JS workss

* makes stylelint happy

* CHORE - vf-forms linting (#504)

* Minor style/spacing differences

* Add the generic JS template

* Make a JS module

* Namespace all the things, use data attributes

* BUG - vf-footer vistied link colour

Passed colour was virtually same as the background. Also adds component variables.

* Add some unqiue hashes for better visited colour testing

* Release/beta 1 (#506)

* Update vf-core to beta.1

* Update yarn.lock

* Update component versions
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant