npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

primocss

v1.0.14

Published

PrimoCSS framework, a light weight mobile friendly SCSS / CSS framework for web & UI development

Downloads

35

Readme

PrimoCSS Framework

Build Status npm version Downloads Bower version devDependency Status

PrimoCSS Framework, a light weight and mobile friendly SCSS / CSS framework for web & UI development.

Primo is a framework which provides the prime starting blocks for any frontend requirements. Without supplying out of the box solutions or mantras to follow, it creates a solid architecture to kick-start any project.

A great starting points

All the styles and tools have been created as the perfect starting point for your project. This isn't a full framework trying to impose design styles and mantras.

Built with Sass & gulp

Using Gulp to create tests and build steps. Developing the source code using SASS and harnessing the powerful preprocessor for our css.

Every view possible

With a powerful responsive grid. Any design is possible for all devices and effectively scales from handhelds to desktops.


Hotlink

If you just need to include the latest compiled version of the PrimoCSS Framework, use our hosted version and fonts to begin your project.

<link href="http://primocss.com/build/css/primocss.min.css" rel="stylesheet" media="screen" type="text/css">

Now you're all done, your site or project has PrimoCSS at it's core and you can start to build simple but effective responsive designs. Follow on reading for our basic HTML template.

Basic template

<!DOCTYPE html>
<html lang="en" dir="ltr">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

        <link href="http://primocss.com/build/css/primocss.min.css" rel="stylesheet" media="screen" type="text/css">
    </head>
    <body>
        <h1>Hello, world!</h1>
    </body>
</html>

Package manager installation

PrimoCSS can be installed to any project using different package managers and obtain the SCSS source files. To pull down the latest release use the following commands with NPM, Yarn or Bower;

npm:

npm install primocss --save-dev

Yarn:

yarn add primocss

Bower:

bower install primocss --save-dev

Local development

If you would like to help and improve this project in anyway or use the project and develop on it locally follow these commands to help. Start by downloading via GitHub or git cloning the project git clone [email protected]:primocss/primocss.git.

Development requires the latest version of Node.js. To setup, here is a list of commands to help you get started:

npm install
gulp build

Once complete open the build folder to see the newly created CSS. You can override any of the global settings for PrimoCSS via _settings.defaults.scss and _settings.colors.scss. Any new SCSS created can be tested by running the gulp linter and keeps all styles in check.

gulp test

Browser support

Using the latest technologies, PrimoCSS is aimed at new browsers and will attempt to degrade gracefully to previous versions.

  • Chrome latest
  • Firefox latest
  • Opera latest
  • Safari latest
  • IE Latest

License

Code licensed MIT by Richard McCartney