005; Flora

[cirque]

Just a nice simple girly layout in Tabula Rasa. This looks a lot like some of the more simpler LJ layouts done in Flexible Squares.

The tinyicons took me f o r e v e r , and I'm not 100% satisfied with them but I kind of fell in love with this tinyicon set and just had to incorporate them somehow. If you'd like to delete/change them, go to the section in the CSS titled 'tinyicons' and just delete it :)

If girly colours aren't your thing - I am planning a revamp of this layout in super bright neon colours!

Features; rounded userpics, custom font, metadata icons.
CSS:
/* Cleaned CSS: */ /* Layout: Flora By: cirque @ dustier Base: Tabula Rasa Tinyicons: http://www.iconarchive.com/ */ /*------------------------------------- basics -------------------------------------*/ @font-face { font-family: 'Bad Script'; font-style: normal; font-weight: 400; src: local('Bad Script Regular'), local('BadScript-Regular'), url(http://themes.googleusercontent.com/static/fonts/badscript/v2/rL_b2ND61EQmMOJ8CRr1fhsxEYwM7FgeyaSgU71cLG0.woff) format('woff'); } * { margin: 0; padding: 0; } html { font-size: 100%; } body { background: #fdefd6; font: 7.5pt 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; color: #AAA; line-height: 1.8em; text-align: center; margin: 60px 0; } a, a:link, a:visited { color: #dea070; text-decoration: none; } a:hover { color: #facd9f; text-decoration: none; } blockquote { background: #FFF; border: 1px solid #aa955d; font: 9pt 'Consolas', sans-serif; font-style: italic; padding: 40px 20px; margin: 20px; color: #AAA; } ::-moz-selection { background: #aa955d; color: #FFF; } hr { color: transparent; height: 1px; border-style : none; border-bottom: 3px double #aa955d; } #canvas { width: 800px; margin: 0 auto; text-align: justify; } #primary { float: right; margin: 0; width: 550px; text-align: justify; } .two-columns-right #secondary { float: left; width: 200px; margin: 0; padding: 20px; background: #FFF; border-right: 1px solid #fdefd6; border-bottom: 1px solid #fdefd6; } .two-columns-right #tertiary { clear: both; } .two-columns-right #tertiary .module { float: left; width: 15em; } .navigation { width: 510px; text-align: justify; padding: 20px; background: #FFF; border-right: 1px solid #fdefd6; border-bottom: 1px solid #fdefd6; margin: 0 0 10px 0; margin: 0 0 10px 0; } .topnav { display: none; } li.page-back, li.page-forward { display: inline; list-style: none; padding: 0; margin: 0; } li.page-separator { display: none; } div.navigation ul { display: inline; padding: 0; margin: 0; } /*------------------------------------- header & footer -------------------------------------*/ #header { display: none; } #footer { float: right; margin: 0; width: 510px; text-align: justify; padding: 20px; background: #FFF; border-right: 1px solid #fdefd6; border-bottom: 1px solid #fdefd6; margin: 0 0 10px 0; } h1#title { font-size: 10pt; font-weight: normal; text-transform: uppercase; color: #DDD; letter-spacing: 5pt; padding: 0; margin: 0; } h2#subtitle { font-size: 8pt; font-weight: normal; text-transform: lowercase; color: #CCC; letter-spacing: 5pt; padding: 0; margin: 0; } h2#pagetitle { display: none; } /*------------------------------------- navigation -------------------------------------*/ div.module-navlinks { margin: 0 0 10px 0; } div.module-navlinks ul.module-list { padding: 0; margin: 0; list-style: none; font-size: 7pt; text-transform: uppercase; letter-spacing: 1pt; } div.module-navlinks ul.module-list li { padding: 0; margin: 0; list-style: none; border-bottom: 1px dotted #EEE; background-image: none; } /*------------------------------------- entry -------------------------------------*/ div.entry { padding: 20px; background: #FFF; border-right: 1px solid #fdefd6; border-bottom: 1px solid #fdefd6; margin: 0 0 10px 0; } div.entry-content { margin: 10px 0 0 0; } div.entry div.header { padding: 0; margin: 0 0 5px 0; } h3.entry-title { font-family: 'Bad Script'; padding: 0; margin: 0; font-size: 11pt; text-transform: lowercase; letter-spacing: 1pt; font-weight: normal; color: #aa955d; border-bottom: 1px dotted #E5E5E5; } h3.entry-title a { color: #aa955d; } h3.entry-title a:hover { color: #dea070; } .datetime { text-transform: uppercase; color: #BBB; font-size: 7pt; letter-spacing: 2pt; } .datetime a { color: #BBB; } div.entry div.userpic { float: right; margin: 0 0px 10px 10px; } div.entry div.userpic img { padding: 8px; background: #FFF!important; border: 1px solid #aa955d; width: 70px; height: 70px; border-radius: 100px; opacity: 0.5; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;} div.entry div.userpic img:hover { opacity: 0.9; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;} span.poster { margin: 15px 0; } .metadata { margin: 20px 0 0 0; } div.metadata ul { padding: 0; margin: 0; } div.metadata ul li { list-style: none; padding: 0; margin: 0; text-transform: lowercase; } span.metadata-label-location, span.metadata-label-mood, span.metadata-label-music { display: none; } span.metadata-item-location { background: url('http://i26.tinypic.com/2i25yfb.png') no-repeat; padding: 0 0 0 15px; margin: 0; display: inline; } span.metadata-item-music { background: url('http://i31.tinypic.com/2a7zp0h.png') no-repeat; padding: 0 0 0 15px; margin: 0; display: inline; } span.metadata-item-mood { background: url('http://i32.tinypic.com/2j0gpd2.png') no-repeat; padding: 0 0 0 15px; margin: 0; display: inline; } span.tag-text { display: none; } div.tag ul { background: url('http://i.imgur.com/klOf7vI.png') no-repeat; padding: 0 0 0 18px; margin: 0; display: inline; } div.tag ul li { display: inline; list-style: none; font-weight: normal; padding: 0; margin: 0 5px 0 0; } ul.entry-management-links { padding: 0; margin: 5px 0 0 0; list-style: none; text-align: center; } ul.entry-management-links li { padding: 0; margin: 0 auto; display: inline; list-style: none; text-align: center; } ul.entry-interaction-links { padding: 0; margin: 5px 0 0 0; text-align: center; } ul.entry-interaction-links li { display: inline; list-style: none; font-weight: normal; text-transform: uppercase; margin: 0 5px 0 0; padding: 0; } /*------------------------------------- archive & calender page -------------------------------------*/ li.active { list-style: none; display: inline; padding: 0; margin: 10px; } .month { padding: 20px; background: #FFF; border-right: 1px solid #fdefd6; border-bottom: 1px solid #fdefd6; margin: 0 0 10px 0; } .month h3 { padding: 0; margin: 0; font-size: 9pt; text-transform: lowercase; letter-spacing: 1pt; font-weight: normal; color: #aa955d; border-bottom: 1px dotted #E5E5E5; } div.navigation ul { display: inline; } div.navigation li { display: inline; list-style: none; } table.month { border: 0; } .month th { text-align: center; margin: 0 2px; text-transform: lowercase; font-weight: normal; background: #F9F9F9; } .month td.day { font-weight: normal; } .month td.day-has-entries { font-weight: normal; } .month td.day-has-entries p { padding: 0 0 0 5px; margin: 0; display: inline; } .month table { width: 100%; border: 0; margin: auto; } .month caption { display: none; } td.day { padding: 10px; border: 0; text-align: center; } /*------------------------------------- tags page -------------------------------------*/ .page-tags h2 { font-family: 'Bad Script'; padding: 0; margin: 0; font-size: 11pt; text-transform: lowercase; letter-spacing: 1pt; font-weight: normal; color: #aa955d; border-bottom: 1px dotted #E5E5E5; } .page-tags .tags-container { padding: 20px; background: #FFF; border-right: 1px solid #fdefd6; border-bottom: 1px solid #fdefd6; margin: 0 0 10px 0; } .page-tags .ljtaglist { margin: 0; padding: 0; } .page-tags .ljtaglist li { padding: 0 0 0 10px; margin: 0; text-transform: lowercase; letter-spacing: 0; list-style: none; background: url('http://i.imgur.com/kut1bXh.png') 0 7px no-repeat; color: #AAA; } /*------------------------------------- read comments & write a comment -------------------------------------*/ hr.above-entry-interaction-links, hr.below-reply-container { display: none; } input, textarea { background: #FFF; padding: 5px; border: 1px solid #DDD; font: 8pt 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; color: #888; } textarea.textbox { width: 80% !important; } .poster-ip { display: none; } div.comment div.userpic { display: block; float: right; margin: 0 0 0 0px; background: transparent; padding: 10px; } div.comment div.userpic img { padding: 8px; background: #FFF!important; border: 1px solid #aa955d; width: 70px; height: 70px; border-radius: 100px; opacity: 0.5; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } div.comment div.userpic img:hover { padding: 8px; background: #FFF!important; border: 1px solid #aa955d; width: 70px; height: 70px; border-radius: 100px; opacity: 0.9; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .page-reply .entry-wrapper-even { } .page-reply .entry-wrapper-odd { } .comment { background: #FFF; border: 1px solid #E5E5E5; margin: 0; padding: 10px; } .comment-wrapper { margin: 10px 0; padding: 0; } .comment-content { margin: 10px 0; } .bottomcomment { background: #FFF; border: 1px solid #E5E5E5; margin: 10px 0; padding: 10px; } .comment-management-links ul, .comment-interaction-links ul { margin: 0; padding: 0; list-style: none; } .comment-management-links li, .comment-interaction-links li { display: inline; } #qrform table { border: 0!important; } .comment-poster { text-transform: uppercase; color: #AAA; } .comment-management-links ul, .comment-interaction-links ul { margin: 0; padding: 0; list-style: none; } .comment-management-links li, .comment-interaction-links li { display: inline; } table.talkform { background: #FFF; border: 1px solid #E5E5E5; margin: 0 0 10px 0; padding: 10px; } /*------------------------------------- sidebar (minus the navigation) -------------------------------------*/ h2.module-header { font-family: 'Bad Script', Sans-serif; padding: 0; margin: 0 0 10px 0; font-size: 11pt; text-transform: lowercase; letter-spacing: 1pt; font-weight: normal; color: #aa955d; border-bottom: 1px dotted #E5E5E5; } h2.module-header a { color: #aa955d; } .module-userprofile, .module-customtext, .module-typelist, .module-tags_list, .module-pagesummary, .module-calendar, .module-syndicate, .module-powered, .module-time { margin: 10px 0; } div.module-content div.userpic { text-align: center; } div.module-content div.userpic img { padding: 8px; background: #FFF!important; border: 1px solid #aa955d; width: 70px; height: 70px; border-radius: 100px; opacity: 0.5; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } div.module-content div.userpic img:hover { padding: 8px; background: #FFF!important; border: 1px solid #aa955d; width: 70px; height: 70px; border-radius: 100px; opacity: 0.9; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } div.journal-name { font-size: 7pt; text-transform: uppercase; letter-spacing: 1pt; margin: 5px 0 0 0; text-align: center; color: #BBB; } div.journal-website-name { font-size: 7pt; text-transform: uppercase; letter-spacing: 1pt; margin: 0; text-align: center; color: #BBB; } ul.userlite-interaction-links { padding: 0; margin: 5px 0 0 0; list-style: none; text-align: center; } ul.userlite-interaction-links li { padding: 0; margin: 0 auto; display: inline; list-style: none; text-align: center; } ul.module-list { color: #CCC; padding: 0; margin: 0; list-style: none; } ul.module-list li { padding: 0 0 0 9px; margin: 0; list-style: none; border-bottom: 1px dotted #EEE; background: url('http://i.imgur.com/kut1bXh.png') no-repeat 0 6px; } ul.module-list-item { color: #CCC; padding: 0; margin: 0; list-style: none; } ul.module-list-item li { padding: 0 0 0 9px; margin: 0; list-style: none; border-bottom: 1px dotted #EEE; background: url('http://i.imgur.com/kut1bXh.png') no-repeat 0 6px; } div.manage-tags-link { margin: 10px 0 0 0; padding: 0; text-transform: uppercase; font-size: 7pt; text-align: right; letter-spacing: 1px; } div.module-calendar table { font-size: 7pt; text-align: center; margin: 0 auto; color: #BBB; } div.module-calendar th { text-transform: uppercase; background: #f1e4cc; margin: 0 1px; padding: 3px 8px; border: 1px solid #E5E5E5; } div.module-calendar td.empty-day { text-transform: uppercase; background: #fdf6e8; margin: 0 1px; border: 1px solid #EEE; } div.module-calendar td.entry-day { text-transform: uppercase; background: #fdefd6; margin: 0 1px; border: 1px solid #EEE; } .two-columns-right #tertiary .module { float: right; width: 520px; padding: 10px; margin: auto; } .module-powered, .module-time {text-align: center;} /*------------------------------------- tinyicons -------------------------------------*/ img[src*='edit.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i.imgur.com/vEPIhnN.png') no-repeat; } img[src*='tag_edit.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i.imgur.com/9tZgVLQ.png') no-repeat; } img[src*='memories_add.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i.imgur.com/jDwea7b.png') no-repeat; } img[src*='track.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i.imgur.com/bQgtVnU.png') no-repeat; } img[src*='tellafriend.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i.imgur.com/IDRWSkm.png') no-repeat; } img[src*='next.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i29.tinypic.com/153wtib.png') no-repeat; } img[src*='previous.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i31.tinypic.com/im71tt.png') no-repeat; } img[src*='anonymous.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i29.tinypic.com/10f5koy.png') no-repeat; } img[src*='user.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i32.tinypic.com/vgj43n.png') no-repeat; } img[src*='delete.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i30.tinypic.com/10rk5tc.png') no-repeat; } img[src*='screen.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i31.tinypic.com/2m4ymwo.png') no-repeat; } img[src*='unscreen.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i26.tinypic.com/b3punc.png') no-repeat; } img[src*='freeze.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i28.tinypic.com/slte85.png') no-repeat; } img[src*='unfreeze.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i27.tinypic.com/32zq8gp.png') no-repeat; } img[src*='subscription_add.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i.imgur.com/q8MziiS.png') no-repeat; } img[src*='subscription_remove.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i.imgur.com/GLFYE8c.png') no-repeat; } img[src*='post.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i.imgur.com/ZnaiPAh.png') no-repeat; } img[src*='message.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i.imgur.com/8inrFvu.png') no-repeat; } img[src*='tellafriend.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i.imgur.com/IDRWSkm.png') no-repeat; } img[src*='locked.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i26.tinypic.com/2zs01oz.png') no-repeat; } img[src*='private.png'] { width: 0; height: 0; padding: 16px 18px 0 0; background: url('http://i30.tinypic.com/jrz0n4.png') no-repeat; } img[src*='feed.png'] { background-image: url('http://i26.tinypic.com/33ml8w9.png') !important; } img[src*='news.png'] { background-image: url('http://i32.tinypic.com/33tifs9.png') !important; }
Live preview: A temporary one at my journal - cirque

Instructions:
Go to 'Customize' & apply 'Muted' for 'Tabula Rasa'.
Make sure it's set to 2 Column (Sidebar on the right).
Go to 'Customize your theme', then 'Custom CSS'.
Where it says 'Use layout's stylesheet(s)', click no.
Copy & Paste the CSS into the big white box.
Hit save, and voila!
Please credit cirque @ dustier :) And keep the original credit in the CSS intact please, it also credits the tinyicon makers etc.
Let me know if you have any questions/need help.
Note! If you would like to change any of the colours, go ahead, I was considering making a less girly (more blue!) version of this as well but then I didn't :/

Comments

[aetherna]

So pretty. *cries* Definitely gonna use this one day. Thanks a lot!!! <333

[cirque]

Thank you :DD enjoy!!