Created
October 25, 2012 06:23
-
-
Save joelip/3950826 to your computer and use it in GitHub Desktop.
DR Prototype Markup: Home Page/Account Page v2
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* DR Prototype Markup: Home Page/Account Page v2 */ | |
| /* colors | |
| Expensive Black Wool: rgb(15,10,6); | |
| Pearl Baloon: rgb(249,244,240); | |
| Paler Flesh: rgb(255,246,238); | |
| Boredom: rgb(221,209,200); | |
| Designer Beige: rgb(196,189,182); | |
| */ | |
| /* border reference | |
| border: [size px] [line type (solid etc)] [color]; | |
| */ | |
| } | |
| body { | |
| width: 1200px; | |
| height: 100%; | |
| color: rgb(255,246,238); | |
| margin: 0 auto 0 auto; | |
| padding: 0px; | |
| display: inline; | |
| font-family: 'Quattrocento Sans', helvetica, arial, sans-serif; | |
| } | |
| @font-face { | |
| font-family: 'Quattrocento Sans'; | |
| font-style: normal; | |
| font-weight: normal; | |
| src: local('Quattrocento Sans'), local('QuattrocentoSans'), url('http://themes.googleusercontent.com/static/fonts/quattrocentosans/v5/efd6FGWWGX5Z3ztwLBrG9coBJSyBiVuloIc8IXLz46o.woff') format('woff'); | |
| } | |
| @font-face { | |
| font-family: 'raphaeliconsmedium'; | |
| src: url('raphaelicons-webfont-webfont.eot'); | |
| src: url('raphaelicons-webfont-webfont.eot?#iefix') format('embedded-opentype'), | |
| url('raphaelicons-webfont-webfont.woff') format('woff'), | |
| url('raphaelicons-webfont-webfont.ttf') format('truetype'), | |
| url('raphaelicons-webfont-webfont.svg#raphaeliconsmedium') format('svg'); | |
| font-weight: normal; | |
| font-style: normal; | |
| } | |
| /* global, repeated divisions */ | |
| header { | |
| position: absolute; | |
| top: 0; | |
| right: 0; | |
| bottom: 0; | |
| left: 0; | |
| } | |
| header #topbar { | |
| width: 100%; | |
| height: 30px; | |
| margin: 0px 0px 0px 0px; | |
| border: 0px; | |
| background-color: rgba(249,244,240,0.5); | |
| -moz-box-shadow: rgb(196,189,182) 2px 2px 5px; | |
| -webkit-box-shadow: rgb(196,189,182) 2px 2px 5px; | |
| -border-radius-shadow: rgb(196,189,182) 2px 2px 5px; | |
| } | |
| .drlogosmall { | |
| Position: absolute; | |
| top: 5px; | |
| left: 8px; | |
| } | |
| /* ****** begin main content ****** */ | |
| /* side profile */ | |
| .homeprof { | |
| height: 100%; | |
| width: 200px; | |
| position: absolute; | |
| top: 30px; | |
| left: 15%; | |
| bottom: 0px; | |
| background-color: rgb(255,246,238); | |
| border: 1px solid rgb(221,209,200); | |
| } | |
| /* middle container */ | |
| .recentcont { | |
| height: 100%; | |
| width: 750px; | |
| margin: 0px auto 0px auto; | |
| position: absolute; | |
| top: 30px; | |
| left: 17%; | |
| right: 10%; | |
| bottom: 0px; | |
| background-color: rgb(255,246,238); | |
| border: 1px solid rgb(221,209,200); | |
| } | |
| /* ****** end of main content ****** */ | |
| /* footer */ | |
| footer { | |
| } | |
| nav { | |
| } | |
| .smallbnav { | |
| /* b stands for bottom */ | |
| position: absolute; | |
| bottom: 15px; | |
| } | |
| .smallbnav > ul { | |
| list-style: none; | |
| display: inline; | |
| padding: 0px auto 0px auto; | |
| } | |
| .smallbnav > ul > li { | |
| display: inline; | |
| margin: 0px 3.5% 0px 4%; | |
| } | |
| .smallbnav a { | |
| text-decoration: none; | |
| font-family: 'Quattrocento Sans', helvetica, arial, sans-serif; | |
| color: rgb(255,246,238); | |
| } | |
| .smallbnav a:hover { | |
| text-decoration: none; | |
| font-family: 'Quattrocento Sans', helvetica, arial, sans-serif; | |
| color: rgba(255,246,238,0.7); | |
| cursor: pointer; | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <body> | |
| <header> | |
| <div id="topbar"> | |
| <img class="drlogosmall" src="http://f.cl.ly/items/370w1x3p320D0t400r14/[email protected]_-Dressing-Room-logo-.jpg-&-.png" /> | |
| </div> | |
| </header> | |
| <!--aside needs to have styling to separate it from the body. Also have it take up about 33% of page.--> | |
| <section> | |
| <aside class="homeprof"> <!-- profile, account settings, etc --> | |
| </aside> | |
| <section class="recentcont"> <!-- recent choices, recent uploads --> | |
| </section> | |
| </section> | |
| <footer> | |
| <nav class="smallbnav"> | |
| <ul> | |
| <li><a href="#">Home</a></li> | |
| <li><a href="#">About</a></li> | |
| <li><a href="#">Terms</a></li> | |
| <li><a href="#">Contact</a></li> | |
| </ul> | |
| </nav> | |
| </footer> | |
| </aside> | |
| <!--picture turnstyle goes here--> | |
| <section id="droomslides"> | |
| <img src="" /> | |
| </section> | |
| </body> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| {"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment