https://github.com/andrearufo/nova.css

Super simple and light CSS framework
https://github.com/andrearufo/nova.css

Last synced: 2 months ago
JSON representation

Super simple and light CSS framework

• Host: GitHub
• URL: https://github.com/andrearufo/nova.css
• Owner: andrearufo
• Created: 2019-03-03T09:03:23.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2022-03-22T21:12:55.000Z (about 3 years ago)
• Last Synced: 2025-01-17T20:15:52.283Z (4 months ago)
• Language: SCSS
• Homepage: https://andrearufo.github.io/nova.css/
• Size: 453 KB
• Stars: 4
• Watchers: 2
• Forks: 0
• Open Issues: 14
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


  



# Nova.css

**Nova.css** is an(other) simple and minimalistic CSS framework for your webpages. Made in pure SCSS and compiled with Gulp

## Structure

You can use the `` and `` and `` elements of HTML for create a basic structure.

Here an example of basic structure:

```html

    

    Nova.css

    

    

    

    

        


            

                


                    

                    Nova.css

                


                


                    
Home

                    
About

                    
Contacts

                

            


        

    


    

        


            
Welcome


            
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

            

Continue


            


                


                    
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.


                

                


                    pLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

                

            


        

    


    

        


            Made with Nova.css by Andrea Rufo

        

    


```

### Header

In the header container you may use the  `` tag to organize:

- an hamburger button

- a brand name in the `
` block

- a simple inline menu inside an `
` block


## Classes

- `.stiky` for the siky header

- `.container` to wrap the content

- `.row` for contain the grid coloumns

- `.col` a coloumns of the grid

- `.card` a card container

- `.btn` a simple button

- `.btn.btn-outline` a simple button wit only the outline

- `.btn.btn-ghost` a trasparent button like a ghost

- `.hamburger` a simple and animated menu icon

- `.text-{left, center, right}` to align text

- `.text-{left, center, right}-{large, small}` to align text in the breakpoint

- `.float-{left, center, right}` for the float elements

- `.float-{left, center, right}-{large, small}` for the float elements in the breakpoint

- `.display-{none, block}` for display or hide elements

- `.display-{none, block}-{large, small}` for display or hide elements in the breakpoint