Post Friends My journal
gawariel in gawariel_design

#38: Peek-a-boo Elephant

Sep 11, 2006 11:47



D E S C R I P T I O N

Name:

Peek-a-Boo

Description:

S2 - Tranquility II layout made for the second round of the 7th version of LLS run at freelayouts. The theme was  Animals .

G E N E R A L     I N F O R M A T I O N

Works with ads?:

Yes: set your ad orientation to  Horizontal Placement  or  Placement Between Entries .

Style:

Smooth Sailing.

Tested in:

IE and Mozilla Firefox.

Best Resolution:

1024*768 and above

Works with Navigation Strip?:

Yes

Known issues:

This layout has a few minor flaws:
  • The footer looks cut off. I wanted to add an image in there, but failed.
  • The archive page looks very bad.[See]

    Credit:

    Please put a link to gawariel_design in your profile or sidebar.



    {Bigger}



    I N S T A L L A T I O N

    Go to Manage:

    Customize

    Select a New Theme:

    • Type Tranquility II in the search box.
    • Click 'Search'.
    • Apply   any   theme that you get in the search results, it doesn't really matter which one!


    Choose a Page Setup:



    Note:

    The following sections can be found in the left, blue sidebar of the page.
    Only the sections I mention are the ones you MUST adjust. You can play with the rest as you please.

    Custom CSS:

    • Use layout's stylesheet(s): No
    • Custom external stylesheet URL: Leave empty
    • Custom stylesheet: Paste the stylesheet (given bellow) in this box.
    Hit "save changes".



    I M A G E S     &     C O D E

    Images:

    The images are hosted on my account, but it is recommended that you upload them yourself. Don't forget to change the URL's in the code!


    Code:

    /* LAYOUT 38: PEEK-A-BOO ELEPHANT */
    /* S2 STYLE: TRANQUILITY II */
    /* AVAILABLE AT GAWARIEL_DESIGN (http://community.livejournal.com/gawariel_design/) */
    /* CREATED BY GAWARIEL (http://gawariel.livejournal.com/) */
    /* ALL IMAGES MADE IN PHOTOSHOP CS */
    /*-----------------------------------------------------------------------------------------------*/

    /*----------- DON'T TOUCH -----------*/
    @media screen, print {

    ul#lj-links, ul#lj-summary, ul#user-links {
    margin: 0;
    padding: 0;
    }

    /*----------- MISC -----------*/
    p {
    margin: 5px;
    padding: 5px;
    }

    form {
    display: inline;
    margin: 0px;
    padding: 0px;
    }

    input, select, textarea {
    font-family: Verdana, Helvetica, sans-serif;
    font-size: 100%;
    color: #000000;
    background: #eeeeee;
    padding: 2px;
    margin: 3px;
    width: 95%;
    padding: 10px;
    }

    code {
    font-family: arial;
    font-size: 10px;
    font-color: #000000;
    background: #eeeeee;
    text-align: center;
    }

    /*----------- PAGE -----------*/

    body {
    background-color: #688490;
    font-family: Century Gothic, serif;
    font-size: 12px;
    line-height: 125%;
    color: #333333;
    text-align: center;
    }

    a {
    font-family: Century Gothic, serif;
    font-size: 100%;
    color: #CC986F;
    text-decoration: none;
    }

    a:visited {
    color: #DCB592;
    }

    a:hover,
    a:visited:hover
    {
    color: #DCB592;
    text-decoration: underline;
    }

    a:active {
    color: #DCB592;
    }

    a img {
    border: none;
    }

    /*----------- MAIN -----------*/

    #container {
    position: relative;
    width: 811px;
    margin: 0 auto;
    text-align: left;
    background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/38_Animals%20-%20Peek-a-Boo%20Elephant%20-%20LLS2/Container.jpg);
    background-position: top center;
    background-repeat: repeat-y;
    }

    /*----------- HEADER -----------*/

    #header {
    background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/38_Animals%20-%20Peek-a-Boo%20Elephant%20-%20LLS2/Header.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    height: 353px;
    border: none;
    }

    #header h1 {
    display: none;
    }

    /*----------- ENTRIES -----------*/

    #content {
    position: relative;
    margin-left: 215px;
    }

    #entries {
    border: none;
    padding: 5px;
    background-color: transparent;
    }

    #content h2 {
    margin: 2px 45px;
    }

    #entries, #comments {
    margin: 10px;
    }

    .ind-entry {
    padding: 20px;
    padding-bottom: 15px;
    border: none;
    background-color: transparent;
    background-image:url(http://i19.photobucket.com/albums/b153/gawariel_design/38_Animals%20-%20Peek-a-Boo%20Elephant%20-%20LLS2/EntryBG.jpg);
    background-position:top left;
    background-repeat:no-repeat;
    }

    .ind-entry h2 {
    font-family: Georgia, serif;
    font-variant: small-caps;
    font-size: 20px;
    color: #688490;
    }

    .ind-entry h4,
    .ind-comment-one h4,
    .ind-comment-two h4,
    .ind-comment-screened h4
    {
    font-family: Verdana, Helvetica, sans-serif;
    font-size: 10px;
    color: #A3B7C0;
    }

    .ind-entry h4 {
    background-color: transparent;
    }

    .ind-entry h4 a,
    .ind-comment-one h4 a,
    .ind-comment-two h4 a,
    .ind-comment-screened h4 a
    {
    font-family: Verdana, Helvetica, sans-serif;
    font-size: 10px;
    color: #869EA8;
    text-decoration: none;
    width: 50%;
    }

    .ind-entry h4 a:visited,
    .ind-comment-one h4 a:visited,
    .ind-comment-two h4 a:visited,
    .ind-comment-screened h4 a:visited
    {
    color: #869EA8;
    text-decoration: underline;
    }

    .ind-entry h4 a:hover,
    .ind-comment-one h4 a:hover,
    .ind-comment-two h4 a:hover,
    .ind-comment-screened h4 a:hover {
    color: #688490;
    text-decoration: underline;
    }

    .ind-entry h4 a:visited:hover,
    .ind-comment-one h4 a:visited:hover,
    .ind-comment-two h4 a:visited:hover,

    .ind-comment-screened h4 a:visited:hover
    {
    color: #688490;
    }

    .ind-entry h4 a:active,
    .ind-comment-one h4 a:active,
    .ind-comment-two h4 a:active,
    .ind-comment-screened h4 a:active {
    color: #688490;
    }

    .ind-entry div.entry-item,
    .ind-entry div.month-entries
    {
    font-family: Century Gothic, serif;
    font-size: 8pt;
    color: #496470;
    padding: 0px 0px 15px 0px;
    background-image:
    url(http://i19.photobucket.com/albums/b153/gawariel_design/38_Animals%20-%20Peek-a-Boo%20Elephant%20-%20LLS2/SeperateEntriesfromcomments.jpg);
    background-position: bottom left;
    background-repeat: no-repeat;
    }

    .ind-entry div.entry-item a,
    .ind-entry div.month-entries a
    {
    font-family: verdana, serif;
    font-size: 8pt;
    color: #CC986F;
    text-decoration: none;
    font-weight: bold;
    letter-spacing: none;
    }

    .ind-entry div.entry-item a:visited,
    .ind-entry div.month-entries a:visited
    {
    color: #DCB592;
    text-decoration: underline;
    }

    .ind-entry div.entry-item a:hover,
    .ind-entry div.entry-item a:visited:hover
    {
    color: #DCB592;
    text-decoration: underline;
    }

    .ind-entry div.month-entries a:hover,
    .ind-entry div.month-entries a:visited:hover
    {
    color: #DCB592;
    text-decoration: underline;
    }

    .ind-entry div.entry-item a:active,
    .ind-entry div.month-entries a:active
    {
    color: #DCB592;
    text-decoration: underline;
    }

    /*----------- FRIENDS PAGE -----------*/

    .ind-entry h3 img,
    .ind-comment-one h3 img,
    .ind-comment-two h3 img,
    .ind-comment-screened h3 img
    {
    position: relative;
    float: right;
    background: #F7EFCC;
    border: 1px solid #EFE0A3;
    margin: 5px;
    margin-top: 0px;
    padding: 5px;
    }

    /*----------- SIDEBAR -----------*/

    #menu {
    position: relative;
    float: left;
    left: 50%;
    margin-left: -385px;
    width: 185px;
    background-color: transparent;
    border: none;
    font-family: Century Gothic, serif;
    font-size: 100%;
    color: #333333;
    padding: 4px;
    }

    #menu h2 {
    font-family: Georgia, serif;
    font-variant: small-caps;
    text-align: right;
    text-decoration: underline;
    font-size: 14px;
    color: #BE8054;
    }

    #menu h2.userpic {
    text-align: center;
    width: 100px;
    padding: 15px;
    background: #EED7C1;
    margin-left: 25px;
    border: 1px solid #DCB592;
    }

    #menu a {
    font-family: Verdana, Helvetica, sans-serif;
    font-size: 10px;
    color: #A66038;
    text-decoration: none;
    }

    #menu a:visited {
    color: #BE8054;
    text-decoration: none;
    }

    #menu a:hover,
    #menu a:visited:hover
    {
    color: #A66038;
    text-decoration: none;

    }

    #menu a:active {
    color: #A66038;
    text-decoration: none;
    }

    #menu ul {
    margin: 0px;
    list-style: none;
    text-transform:uppercase;
    letter-spacing:1px;
    text-align: right;
    }

    #menu ul li {
    margin: 0px;
    padding: 0px;
    padding-top: 7px;
    padding-right: 10px;
    list-style: none;
    background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/38_Animals%20-%20Peek-a-Boo%20Elephant%20-%20LLS2/LinkBG.jpg);
    background-position: top right;
    background-repeat: no-repeat;
    height: 32px;
    }

    #menu ul li:hover {
    background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/38_Animals%20-%20Peek-a-Boo%20Elephant%20-%20LLS2/LinkHoverBG.jpg);
    background-position: top right;
    background-repeat: no-repeat;
    height: 32px;
    }

    #menu ul li.active {
    font-family: Verdana, Helvetica, sans-serif;
    color: #8E401C;
    font-weight: bold;
    }

    /*----------- COMMENT PAGES -----------*/

    .ind-comment-one,
    .ind-comment-two,
    .ind-comment-screened
    {
    margin: 0px 0;
    padding: 5px;
    }

    /*FIRST COMMENT*/

    .ind-comment-one {
    background-color: #F8F2EB;
    border: 1px solid #F2E1D0;
    }

    .ind-comment-one h2 {
    font-family: Georgia, serif;
    font-size: 130%;
    color: #688490;
    font-variant: small-caps;
    margin: 20px 0px;
    }

    .ind-comment-one div.entry-item {
    font-family: Century Gothic, serif;
    font-size: 7pt;
    color: #496470;
    letter-spacing: 1px;
    margin: 15px 0px;
    }

    .ind-comment-one div.entry-item a {
    font-family: verdana, serif;
    font-size: 7pt;
    color: #CC986F;
    text-decoration: none;
    font-weight: bold;
    letter-spacing: 1px;
    }

    .ind-comment-one div.entry-item a:visited {
    color: #DCB592;
    text-decoration: underline;
    }

    .ind-comment-one div.entry-item a:hover,
    .ind-comment-one div.entry-item a:visited:hover
    {
    color: #DCB592;
    text-decoration: underline;
    }

    .ind-comment-one div.entry-item a:active {
    color: #DCB592;
    text-decoration: underline;
    }

    /*COMMENT TO FIRST COMMENT*/

    .ind-comment-two {
    background-color: #FBF8F5;
    border: 1px solid #F8F0E6;
    }

    .ind-comment-two h2 {
    font-family: Georgia, serif;
    font-size: 130%;
    color: #688490;
    font-variant: small-caps;
    margin: 20px 0px;
    }

    .ind-comment-two div.entry-item {
    font-family: Century Gothic, serif;
    font-size: 7pt;
    color: #496470;
    letter-spacing: 1px;
    margin: 15px 0px;
    }

    .ind-comment-two div.entry-item a {
    font-family: verdana, serif;
    font-size: 7pt;
    color: #CC986F;
    text-decoration: none;
    font-weight: bold;
    letter-spacing: 1px;
    }

    .ind-comment-two div.entry-item a:visited {
    color: #DCB592;
    text-decoration: underline;
    }

    .ind-comment-two div.entry-item a:hover,
    .ind-comment-two div.entry-item a:visited:hover
    {
    color: #DCB592;
    text-decoration: underline;
    }

    .ind-comment-two div.entry-item a:active {
    color: #DCB592;
    text-decoration: underline;
    }

    /*SCREENED COMMENT*/

    .ind-comment-screened {
    background-color: #EFF1E8;
    border: 1px solid #FBFBF9;
    }

    .ind-comment-screened h2 {
    font-family: Georgia, serif;
    font-size: 130%;
    color: #688490;
    font-variant: small-caps;
    margin: 20px 0px;
    }

    .ind-comment-screened div.entry-item {
    font-family: Century Gothic, serif;
    font-size: 7pt;
    color: #496470;
    letter-spacing: 1px;
    margin: 15px 0px;
    }

    .ind-comment-screened div.entry-item a {
    font-family: verdana, serif;
    font-size: 7pt;
    color: #CC986F;
    text-decoration: none;
    font-weight: bold;
    letter-spacing: 1px;
    }

    .ind-comment-screened div.entry-item a:visited {
    color: #DCB592;
    text-decoration: underline;
    }

    .ind-comment-screened div.entry-item a:hover,
    .ind-comment-screened div.entry-item a:visited:hover
    {
    color: #DCB592;
    text-decoration: underline;
    }

    .ind-comment-screened div.entry-item a:active {
    color: #DCB592;
    text-decoration: underline;
    }

    /*----------- FOOTER -----------*/

    #footer {
    position: relative;
    font-family: Georgia, serif;
    text-transform: uppercase;
    font-size: 8pt;;
    color: #688490;
    background-color: transparent;
    }

    #footer p {
    padding: 20px;
    }

    #footer a {
    font-family: Georgia, serif;
    font-size: 100%;
    color: #688490;
    }

    #footer a:visited {
    color: #688490;
    }

    #footer a:hover,
    #footer a:visited:hover
    {
    color: #688490;
    }

    #footer a:active {
    color: #688490;
    }

    /*----------- TAGS PAGE -----------*/

    .ljtaglist {
    margin-left: 5px;
    }

    /*----------- MISC -----------*/

    .month-entries {
    margin: 10px 0;
    }

    .month-entries ul {
    list-style: none;
    margin: 10px;
    }

    .month-entries ul li {
    list-style: none;
    padding: 3px;
    }

    .clear {
    display: none;
    }

    /*----------- DON'T TOUCH -----------*/

    }

    @media print {

    #menu {
    display: none;
    }

    #content {
    margin-left: 0px;
    }

    #entries, .ind-entry, .ind-comment, #footer, #header {
    border: none;
    }

    }



    E X T R A

    Icon:





    T R O U B L E S H O O T I N G

    Before asking any questions, make sure you read all information above thouroughly and that your question isn't adressed in the FAQ.

    If your problem still isn't solved, you are welcome to ask your question here



    L L S     v 0 . 7

    Here are all the layouts I entered in the LLS v0.7 contest over at freelayouts:

    Round 1

    Audition - Tree

    Round 2

    Back to School - Back to School

    Round 3

    Animals - Peek-a-boo Elephant

    Round 4

    Weather - Dancing in the Rain

    Round 5

    Smooth Sailing - Nocturne

    Round 6

    Patterns - The Patterns of my Ways
    I got eleminated with this layout.

layouts: account status: plus, layouts: contests: lls_v0.7, layouts: account status: paid, layouts: [s2]: tranquility ii, layouts: account status: basic, layouts: contests, layouts: [s2], layouts

Leave a comment

Read comments 9
Previous post Next post
Up
Homepage Read journal... Full version Help Русская версия
© 1999-2025 LiveJournal, Inc.