Git Product home page Git Product logo

puppertino's Introduction

Puppertino Stars Puppertino's contributors Follow Puppertino_css Follow Codedgar_dev Puppertino Logo

Welcome to Puppertino V 1.0!

Hi! Welcome to Puppertino! Puppertino is a framework meant to mimic the look of macOS and follow the human guidelines. Puppertino is a Framework created to be lightweight, modular, and cool looking!

NOTE: Puppertino does not include any responsive system, you must use Bootstrap, Flexbox Grid, Skeleton, or some other responsive Framework along with it.

In a nutshell

Lightweight

I'm focused on making Puppertino as Lightweight as possible, I want it to become a big framework, but not at the cost of weight and performance. So to keep it small, I won't be adding AnimateCSS, or any other framework (No matter how cool it is) on top of Puppertino. And to make it more lightweight, I have implemented my second point.

Modular

I'm developing Puppertino to be used with only the components you need or to be used as a complete framework. Choosing the components that you need may help you throw some extra KB that you don't need in your website or app.

Cool looking

This is the most important part of Puppertino! This also means that I can go out of the main components of macOS and human guidelines in the future to add other things that I think maybe necessary or great to have in the framework. In any case, coolness, it's my main focus with Puppertino.

Current Components

Puppertino currently includes:

  • Buttons
  • Switches
  • Actions
  • Form Elements (Inputs, select, form validation)
  • Modals
  • Icons
  • Font Layout
  • Segmented Controls
  • Tabs
  • Shadows
  • NEW! Dark Mode
  • Color Palette

Yeah... That's all. But no worries! I'm working on adding new components every day!

Usage

You can use Puppertino in 3 ways (for now):

  1. You can download the newfull.css file located in the /dist/ directory. Download this if you are sure that you need at least half of the elements that are present in Puppertino.
  2. Download every component CSS that you need from the /dist/ folder. Such as buttons or form elements or other components. While it maybe tedious to download them one by one, this can help you to save some KBs in your website. :)
  3. You can now download the SCSS version of Puppertino, also located in /dist/. (Deprecated)

Docs

Find all the documentation, examples, and list of components and how to use them at https://codedgar.github.io/Puppertino/.

License

Puppertino is free to use and abuse under the open-source MIT license.

About the creator

I'm Edgar Pérez. And I make cool websites :)

puppertino's People

Contributors

codedgar avatar rilexus avatar jesusrobot avatar gaurav-nelson avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.