1.28.2 • Public • Published


Tachyon like seeds classes

Get Started

If you are openning this package for the first time, you need to run the following command to build the style classes which will output to the dist folder with the file name seedlings-marketing.css:

yarn build

Adding a New Seedling

To add a new seedling, you need to create a new file inside the src folder with the name of the seedling. If you are importing a new Axiom from seeds you'll need to create the following files:

  • Under /src/axioms/NewAxiom.scss: This file will contain the styles for the new axiom you are importing.

NOTE: If the seeds axiom you are importing does not currently exist in the package.json's list of dependencies, you'll need to add it there first.

  • Under /src/ create a new file _new-style.scss and you'll need to import the new axiom styles.

    • Within this file make sure you are using the front matter needed to generate the classes. You can see an example of this in the _elevation.scss file that looks like this:

      Name: Elevation
          elevation: elevation
          100: Level 100
          300: Level 300
          400: Level 400
          -ns: not-small
          -m: medium
          -l: large
      HoverClasses: true
      Example: <div class="pa800 {{modifier}} w-100p"><h3>{{label}}</h3></div>

      and whatever scss you need to create your new seedling classes.

  • Once you've written what you need to generate those classes you can run the following command to generate the new seedling classes:

    yarn build

    This will generate (or update) the new seedling classes in the dist folder with the file name seedlings-marketing.css.

Once you get a successful build, if you need to use them inside the sprout theme, head back to web-insights-application/themes/sprout/ and run the following command to build all the available javascript and css (this will include the new seedling classes):

yarn build

NOTE: If you are pushing these style changes to your test box and still not seeing the style changes, try busting the cache with the cache buster tool located under tools in your wp-admin using the media.sproutsocial.com distribution.

Updating utilities.html

To update https://local.cms.sproutsocial.test/lps/utilities/ with your new utility classes, see Generating Utility Styles Cheatsheet in web-insights-application/packages/calder-views/README.md




Package Sidebar


npm i @sproutsocial/seedlings

Weekly Downloads






Unpacked Size

1.19 MB

Total Files


Last publish


  • sproutops
  • lmoselesprout
  • ozfest
  • mtrums
  • sprout-publish
  • joyellewoodson
  • mosleywm
  • soung3
  • tmcwilliam
  • jritterbush
  • benthemonkey
  • conwaydev
  • chrisege
  • dgarofalo
  • zpaul
  • dansnetwork
  • bambu-npm
  • notthefakecory
  • shreya317
  • stanton47
  • timrwhi
  • bfoehring
  • kbrtrm
  • sprout-npm
  • mchlltt
  • margie
  • hjylewis
  • xmwl
  • ianduvall
  • bensprout
  • madelynnelson
  • ryansprout
  • sprout-seeds-packets