incrediwill / foundation-less Goto Github PK

View Code? Open in Web Editor NEW

0.0 1.0 0.0 303 KB

CSS 100.00%

foundation-less's Introduction

foundation-less

Nothing to see here folks.

foundation-less's People

Contributors

Watchers

foundation-less's Issues

Preferred Payments Widget (SRP & VDP)

Go over css for the Preferred Payments Widget to make it non-reliant on any other wrappers and/or styles. Needed so it can be a stand alone control in SiteBuilder.

Move BS Popover To Extras.less

.popover {
border: 1px solid @divider-color;
border-radius: @popover-border-radius;
padding: 0;
max-width: 300px;
box-shadow: none;

.popover-title {
    background: @theme-color;
    border-radius: @popover-title-border-radius;
    border: 0;
    color: #ffffff;
}   

.popover-content {
    background: @content-bg;
    font-size: 10px;
}

}

Double check variables.less. See Dark Theme collection

Ability to add Google Fonts

Edit Styling of Price Alerts Button (VDP)

In CSS, remove #srp-vehicle-price ID from the price alerts button

Conditional statement for button gradients

Need variable (boolean) and css to change how buttons look if the designer wants gradients or not.

.button {
     & when (@button-gradient = true) {
          background: linear-gradient(to bottom,  #1e5799 0%, #7db9e8 100%);
     }
}

Review alignment on SRP & VDP buttons and button row

See site: http://www.maxmotorshawaii.com/used-cars.aspx

SRP & VDP

Right align buttons
Remove padding from sides of Button Row Wrapper

Check All Device Sizes

Navigation Overflow

Look into a solution for displaying the nav or cutting it off when it becomes too long for Header Style 1.

Add styling for autocomplete & error text

See forms.less

Lines:
134 - 143
553 - 566

Edit Styling of Price Alerts Button (SRP)

In CSS, remove #srp-vehicle-price ID from the price alerts button

Adjust Mobile Layout of Button 2 Control

Add bottom margin to .button.button-desc elements.
Remove margin on Anchor tag as it is causing misalignments.

Add Share Dropdown CSS

Add share dropdown css found in the footer of the Honda, Toyota & Porsche designs: http://www.porschewestbroward.com/

Note:
Add variables to customize size, bg color, hover bg color and content bg color

.share-panel {
    position: relative;
    display: inline-block;
    margin-bottom: 30px;
    max-width: 300px;
    width: 100%;
}

.share-panel ul {
    display: none;
    position: absolute;
    background-color: #ffffff;
    box-sizing: border-box;
    border: 1px solid #DEDEDE;
    border-radius: 5px;
    max-width: 300px;
    width: 100%;
    padding: 15px 10px 10px 10px;
    margin: -5px 0 0 0;
    z-index: 1;
    -webkit-transition: .3s ease;
    -moz-transition: .3s ease;
    -o-transition: .3s ease;
    transition: .3s ease;   
}   

.share-panel ul li {
    list-style: none;
}

.share-panel:hover ul {
    display: block;
}

.share-panel:hover .share-button {
    background: #CF0000;
}

.share-panel .share-button {
    background: #3E4146;
    border-radius: 5px;
    color: #ffffff;
    cursor: pointer;
    display: block;
    font-size: 14px;
    font-weight: 100;
    height: 38px;
    line-height: 38px;
    position: relative;
    padding: 0 30px;
    z-index: 10;    
    -webkit-transition: .3s ease;
    -moz-transition: .3s ease;
    -o-transition: .3s ease;
    transition: .3s ease;   
}

Heading issues for dark themes

See headings.less for the Dark Theme collection line 202 - 217

VDP Disclaimer class missing

.disclaimer {
font-size: 11px;
line-height: 12px;
}