isopods | Entries tagged with navigation

                    // NAV
                
                    TITLE

                    - SUBSECTION 

                    - LINK 

                    - LINK 

                    - LINK 

                    - LINK 

                        // TITLE HERE
                    
                        Lorem ipsum dolor sit amet, consectetur adipiscing 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.

                            SUBSECTION
                        
                        Morbi quis commodo odio aenean sed adipiscing diam. Libero volutpat sed cras ornare arcu dui vivamus
                        arcu felis. Vel orci porta non pulvinar neque laoreet suspendisse interdum consectetur. Adipiscing
                        tristique risus nec feugiat in fermentum posuere.
                    
                    < isopods >

                // TITLE HERE
            
                Lorem ipsum dolor sit amet, consectetur adipiscing 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.

                    SUBSECTION
                
                Morbi quis commodo odio aenean sed adipiscing diam. Libero volutpat sed cras ornare arcu dui vivamus
                arcu felis. Vel orci porta non pulvinar neque laoreet suspendisse interdum consectetur. Adipiscing
                tristique risus nec feugiat in fermentum posuere.
            
                    HOME
                
                    PREMISE
                
                    FAQ
                
                    TAKEN
                
                    RULES
                
                    LOCATIONS
                
                    MOD CONTACT
                
                    < isopods >

NOSTROMO

A minimal, terminal-style info/navigation page. Can be used for game info, FAQs, event posts, character info--whatever your heart desires! Comes in two different styles--sticky side navbar (best viewed on desktop), and footer navbar (mobile friendly)--and four preset colors!

( Instructions and code below the cut! )

loupnoir

LAYOUT: STACKED

"SUNRISE, PARABELLUM."

< isopods >

LAYOUT: STACKED + CONDENSED (w/o icon)

NAVIGATION

GENERAL RP

GAME NAME

< isopods >

LAYOUT: HORIZONTAL FLEXBOX (w/ inverted button colors)

"SUNRISE, PARABELLUM."

< isopods >

CLEAN & SIMPLE 2.0

A simple navigation layout that is modular and easy to customize. An attempt to improve upon my first HTML template from two years ago, back when I didn't understand padding and margins.

( Instructions and code below the cut! )

loupnoir

HOME

PAGE 2

PAGE 3

PAGE 4

PAGE 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed et aliquam tortor. Morbi iaculis orci ipsum, a rutrum nibh maximus a. Nulla lacus ante, dignissim sit amet lacus ac, lacinia ultrices massa. Vestibulum volutpat, turpis ut tempor tempus, augue enim pharetra eros, et condimentum urna nulla at neque.

Maecenas at augue imperdiet, pellentesque augue sed, volutpat metus. Quisque auctor dolor sit amet auctor ullamcorper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Donec suscipit est ut libero tempus ultrices. Interdum et malesuada fames ac ante ipsum primis in faucibus.

HOME

PAGE 2

PAGE 3

PAGE 4

PAGE 5

 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sollicitudin diam nec nisi consectetur, eget volutpat leo varius. Vestibulum malesuada erat felis, eu finibus nibh viverra quis. Maecenas at augue imperdiet, pellentesque augue sed, volutpat metus. Quisque auctor dolor sit amet auctor ullamcorper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Donec suscipit est ut libero tempus ultrices. Interdum et malesuada fames ac ante ipsum primis in faucibus.

Etiam eleifend faucibus ornare. Sed eget vestibulum ipsum, eu pulvinar purus. Donec accumsan, risus ac lobortis scelerisque, nulla lacus porttitor diam, vestibulum fermentum ante diam vel velit. Pellentesque aliquam quam nisl, quis bibendum risus posuere eu. Ut ullamcorper erat ac est dictum cursus. Aliquam erat volutpat. Curabitur quis mauris dui. Duis tempor dolor magna, in interdum magna pharetra vitae. Sed eros ex, interdum vitae pharetra eget, commodo quis turpis. Nam gravida metus finibus massa vehicula, vitae vestibulum leo rhoncus. Donec semper est sagittis ante auctor, a vulputate augue aliquet.

HOME

PAGE 2

PAGE 3

PAGE 4

PAGE 5

Vestibulum malesuada erat felis, eu finibus nibh viverra quis. Maecenas at augue imperdiet, pellentesque augue sed, volutpat metus. Quisque auctor dolor sit amet auctor ullamcorper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Donec suscipit est ut libero tempus ultrices. Interdum et malesuada fames ac ante ipsum primis in faucibus.

HOME

PAGE 2

PAGE 3

PAGE 4

PAGE 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vulputate aliquam maximus. Praesent sit amet ex posuere, tincidunt lectus ut, fermentum tortor. Etiam elementum dolor nec imperdiet aliquet. Ut mollis in lorem in laoreet. Donec porttitor eu tortor et placerat.

HOME

PAGE 2

PAGE 3

PAGE 4

PAGE 5

idk what to put here

INFO

CR CHART

IMPRESSIONS

VISUALS

THREADS

Here's some info text, maybe a quote. Blah blah blah. Pretend I'm saying some important stuff here. Juno Steel deserves all the hugs in the world. Lorem ipsum whatever. Ask me how I make a "polaroid" border for icons using only HTML.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam malesuada interdum nisi ut varius.
© isopods

INFO

CR CHART

IMPRESSIONS

VISUALS

THREADS

WOOHOO a cr chart or something goes here idk

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin aliquam arcu quis auctor viverra. Nunc volutpat ante a semper tempor. Quisque feugiat elit vitae mauris convallis luctus. Curabitur a orci elit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aenean suscipit mi sem. Vestibulum semper elementum lorem non mattis. Maecenas suscipit facilisis luctus. Sed turpis tortor, tempus eu sagittis eu, accumsan vel odio. 
© isopods

INFO

CR CHART

IMPRESSIONS

VISUALS

THREADS

congrats you made it to page 3
© isopods

INFO

CR CHART

IMPRESSIONS

VISUALS

THREADS

i'm not sure what else to put here. i'm running out of lorem ipsum stuff

© isopods

INFO

CR CHART

IMPRESSIONS

VISUALS

THREADS

i guess you could put thread tracking here if you were a madman

© isopods

TABBED (TERMINAL & FOLDER)

A tabbed navigation template that comes in two different flavors! Use this for whatever the hell you want--navigation, game info, whatever. I mostly just made these templates as a way of proving to myself that I could conquer this hellish HTML challenge and be satisfied with myself. If you do decide to use this template, I'd love to see what you use this for!

( Instructions and code below the cut! )