qpp-style
Advanced tools
Shared style guide across the QPP program.
This repository houses qpp-style, a shared style guide/library for the QPP program. qpp-style was built on top of bootstrap.
The purpose of qpp-style is to provide assets such as CSS, SCSS, JS, images and fonts to design a site with the visual style of qpp.cms.gov. This allows multiple sites built in separate repositories and with different languages to share a global style without repeating styling code. The qpp-style library is primarily distributed on the node/npm ecosystem.
The style guide is located at https://cmsgov.github.io/qpp-style/ but can be viewed locally by running:
$ bundle exec jekyll serve --config _config.dev.yml
The best way to install qpp-style is with npm or yarn. If you haven't already installed the qpp-style module, run the following command to install qpp-style into your project.
npm install --save qpp-style
or
yarn add qpp-style
Once installed, all the assets from qpp-style need to be consumed by your project. The simplest way to to this is by copying over the relevant assets with build commands and include them from the html with link tags. For example:
$ pushd .
$ cd ./node_modules/qpp-style
$ npm install
$ npm start
$ popd
$ mkdir -p public
$ cp -r ./node_modules/qpp-style/build/* public
$ touch public/index.html
<html lang="en">
<head>
<link href="/css/qpp-style.css" type="text/css" rel="stylesheet" />
</head>
<body>
<h1>QPP Quality Payment Program</h1>
</body>
</html>
Another way to use the style is by importing the sass into your project. This can be done in the following way:
Copy the fonts to /fonts:
$ mkdir -p fonts
$ cp -r ./node_modules/qpp-style/fonts/* fonts
Create a .scss file and adding this line:
@import "../node_modules/qpp-style/styles/qpp_style";
FAQs
Shared style guide across the QPP program.
The npm package qpp-style receives a total of 298 weekly downloads. As such, qpp-style popularity was classified as not popular.
We found that qpp-style demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Newly introduced telemetry in devenv 1.4 sparked a backlash over privacy concerns, leading to the removal of its AI-powered feature after strong community pushback.
Security News
TC39 met in Seattle and advanced 9 JavaScript proposals, including three to Stage 4, introducing new features and enhancements for a future ECMAScript release.
Security News
Deno 2.2 enhances Node.js compatibility, improves dependency management, adds OpenTelemetry support, and expands linting and task automation for developers.