Issue #22 closed
Lauris Mikulans created an issue

Will keep code blocks here for backup/historical value.

CSS additions to site:

 header{
    padding: 0px;
    min-height: 90px;
}
#logo{
    position: relative;
    height: 90px;
}
#logo img.logo {
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -30px;
    max-height: 60px;
}
body {
    font-size: 16px;
}
.navbar .nav > li > a {
    font-size: 18px;
    padding: 35px 10px 32px;
}
.nav-tabs.center-tabs li {
    float: none;
    display: inline-block;
}
.nav-tabs.center-tabs {
    text-align: center;
    margin-left: 110px;
}
.who-are-you {
    position: absolute;
    left: 0px;
    top: 5px;
    margin: 0;
    font-size: 20px;
}
.position-relative {
    position: relative;
}

.full-page-left-content {
    padding: 0 0 0 40px;
    max-width: 500px;
    float: right;
}

.full-page-right-content {
    padding: 0 0 0 40px;
    max-width: 500px;
    float: left;
}

.full-page-right-image {
    float: right;
}

.full-page-left-image {
    float: left;
}

.userTestimonials {
    border: 1px solid #ddd;
    padding: 20px 34px;
    border-radius: 8px;
    background-color: #fcfcfc;
    margin-bottom: 6px;
    width: 70%;
    position: relative;
}
.userTestimonials:before {
    content: "\A";
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #eee transparent transparent transparent;
    position: absolute;
    bottom: -11px;
    left: 26px;
}

.userTestimonials:after {
    content: "\A";
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #fcfcfc transparent transparent transparent;
    position: absolute;
    bottom: -9px;
    left: 26px;
}
.portraitImages {
    background-position: -0px 1px;
    float: left;
    margin: 10px 10px;
    border-radius: 50px;
    border: 1px solid #ccc;
    background-image: url(http://farm6.staticflickr.com/5799/31117199216_31d115970c_s.jpg);
    width: 50px;
    height: 50px;
    background-size: contain;
}
.portraitImages.director {
    background-image: url(http://farm6.staticflickr.com/5509/31009480952_68bdfde8e9_s.jpg);
}
.userTestimonial {
    float: left;
    margin-top: 10px;
}

Full page content insired from fluid UI

<div class="row-fluid">
    <div class="span6">
        <div class="full-page-left-content">
            <h2>Prototype web, desktop and mobile apps - easily</h2>
            <ul>
                <li>Select from 16 built in libraries for Android, iOS, web, desktop and more</li>
                <li>Add interactions and animations to bring your prototype or wireframe to life.</li>
                <li>Interact with your prototype immediately on desktop or on mobile using the Fluid UI apps.</li>
            </ul>
            <div class="userTestimonials">"Add interactions and animations to bring your prototype or wireframe to life."</div>
            <div class="portraitImages"></div>
            <div class="userTestimonial">
                <div class="paragraphText subHeader-bold">Clive</div>
                <div class="subText-medium company">The Professional</div>
            </div>
        </div>
    </div>
    <div class="span6">
        <div class="full-page-right-image">
            <img src="/sites/default/files/omniprez/testbg3.jpg" alt="">
        </div>
    </div>
</div>

<div class="block row">

</div>

<div class="row-fluid">
    <div class="span6">
        <div class="full-page-left-image">
            <img src="/sites/default/files/omniprez/testbg4.jpg" alt="">
        </div>
    </div>
    <div class="span6">
        <div class="full-page-right-content">
            <h2>Prototype web, desktop and mobile apps - easily</h2>
            <ul>
                <li>Select from 16 built in libraries for Android, iOS, web, desktop and more</li>
                <li>Add interactions and animations to bring your prototype or wireframe to life.</li>
                <li>Interact with your prototype immediately on desktop or on mobile using the Fluid UI apps.</li>
            </ul>
            <div class="userTestimonials">"Interact with your prototype immediately on desktop or on mobile using the Fluid UI apps."</div>
            <div class="portraitImages director"></div>
            <div class="userTestimonial">
                <div class="paragraphText subHeader-bold">Emil</div>
                <div class="subText-medium company">Director</div>
            </div>
        </div>
    </div>
</div>

Comments (4)

  1. Log in to comment