TheCoreDev/sterivein
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Change integration - Add mini cart

Browse Source
This commit is contained in:
touffies
2013-10-09 12:31:40 +02:00
parent 7234b2e994
commit 778fa9e4b5
10 changed files with 177 additions and 184 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
templates/default/assets/js/script.js
View File

@@ -3,7 +3,7 @@
/* ------------------------------------------------------------------
onLoad Function -------------------------------------------------- */
$(document).ready(function(){
$(document).ready(function(){ alert(1);
// Loader
var $loader = $('<div class="loader"></div>');

25
templates/default/assets/less/thelia/buttons.less
View File

@@ -9,32 +9,31 @@
// Buttons
.btn {
// Remove Box Shadow
&:active,
&.active {
.box-shadow(none);
}
// Primary Buttons
&.btn_add_to_cart,
&.btn-cart,
&.btn-checkout,
&.btn-checkout-next,
&.btn-checkout-home,
&.btn-filter,
&.btn-forgot,
&.btn-login,
&.btn-proceed-checkout,
&.btn-register,
&.btn-submit { .btn-primary; }
&.btn-add-address,
&.btn-checkout,
&.btn-checkout-next,
&.btn-checkout-home { float: right; }
// Secondary Buttons
&.btn-back,
&.btn-continue-shopping {
@@ -44,11 +43,13 @@
// Keep old style button
&.btn-add-address,
&.btn-coupon,
&.btn-filter,
&.btn-grid,
&.btn-list,
&.btn-login-mini,
&.btn-search,
&.btn-subscribe { .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border); }
// Account Info
&.btn-change-account,
&.btn-change-password { padding: 0; }
@@ -57,7 +58,7 @@
&.btn-edit-address,
&.btn-order-details,
&.btn-remove-address {
border: 1px solid @btn-primary-border;
border: 1px solid @btn-primary-border;
margin-bottom: 10px; padding: 4px 9px;
&:hover,
@@ -66,9 +67,9 @@
color: @text-color;
}
}
// Checkout Step 3
&.btn-change-address {
&.btn-change-address {
padding: 0;
&:before {
.icon(@pencil);
@@ -85,8 +86,8 @@
}
}
}
// Not styled
&.btn-cancel { padding-left: 0; }
&.btn-compare {}

10
templates/default/assets/less/thelia/cart.less
View File

@@ -1,9 +1,17 @@
// Thelia : Shopping Cart
// Cart Empty
.cart-empty { margin: 0; padding: 40px; }
// Cart Mini
.table-cart-mini { margin-bottom: 0; }
// Cart
.table-cart {
.table-bordered;
thead,
tbody,
tfooter {

10
templates/default/assets/less/thelia/forms.less
View File

@@ -9,10 +9,18 @@
}
// Form Login Mini
#form-login-mini {
.form-control { .input-sm; }
.btn { .btn-sm; }
width: 200px;
}
// Form Login
#form-login,
#form-forgotpassword {
background: #f5f5f5;;
background: #f5f5f5;
padding: 45px;
legend {

2
templates/default/assets/less/thelia/import.less vendored
View File

@@ -1,6 +1,6 @@
// Thelia
@import "variables.less";
@import "path.less";
//@import "path.less";
// Thelia : Layout
@import "global.less";

148
templates/default/assets/less/thelia/navbar.less
View File

@@ -3,35 +3,26 @@
.navbar {
.navbar-default;
.navbar-brand { .visible-xs; } // Visible only Small screen
/*.nav-main {
font-size: @navbar-font-size;
li > a {
color: @navbar-default-link-color;
padding: @navbar-link-padding;
&:hover,
&:focus {
color: @navbar-default-link-hover-color;
background-color: @navbar-default-link-hover-bg;
}
// Uncollapse the nav
@media (min-width: @grid-float-breakpoint) {
padding-top: ((@navbar-height - @line-height-computed) / 2);
padding-bottom: ((@navbar-height - @line-height-computed) / 2);
.navbar-cart {
@media (min-width: @grid-float-breakpoint) {
.dropdown > a {
.dropdown-toggle;
&:after {
float: none;
}
}
}
.active > a {
color: @navbar-default-link-active-color;
background-color: @navbar-default-link-active-bg;
.dropdown-menu {
@media (max-width: @grid-float-breakpoint) { display: none; }
margin: 0; padding: 20px;
&.cart-content {
width: 350px;
> p { margin: 0; }
}
}
.open > a {
color: @navbar-default-link-hover-color!important;
background-color: @navbar-default-link-hover-bg!important;
}
}*/
.cart-not-empty .cart-content { border-top: none; padding: 0; }
}
// Subnav Links
@media (min-width: @grid-float-breakpoint) {
@@ -40,13 +31,6 @@ li > a {
border: 1px solid @navbar-subnav-border;
border-radius: @navbar-subnav-border-radius;
.box-shadow(@navbar-subnav-shadow);
/*
float: left;
min-width: 160px;
position: absolute;
top: 100%; left: 0;
z-index: @zindex-dropdown;
*/
// Links within the sub navigation
> li > a {
@@ -89,106 +73,6 @@ li > a {
}
}
}
/*
.subnav {
position: relative;
> ul {
//display: none; // none by default, but block on "open" of the menu
font-size: @font-size-base;
list-style: none;
margin: 0; padding: 0;
// Links within the sub navigation
> li > a {
clear: both;
display: block;
font-weight: normal;
line-height: @line-height-base;
white-space: nowrap; // prevent links from randomly breaking onto new lines
&:hover,
&:focus {
text-decoration: none;
}
}
// Active state
> .active > a {
&,
&:hover,
&:focus {
outline: 0;
text-decoration: none;
}
}
@media (min-width: @grid-float-breakpoint) {
background-color: @navbar-subnav-bg;
background-clip: padding-box;
border: 1px solid @navbar-subnav-border;
border-radius: @navbar-subnav-border-radius;
.box-shadow(@navbar-subnav-shadow);
float: left;
min-width: 160px;
position: absolute;
top: 100%; left: 0;
z-index: @zindex-dropdown;
// Links within the sub navigation
> li > a {
color: @navbar-subnav-link-color;
padding: @navbar-subnav-link-padding;
// Hover/Focus state
&:hover,
&:focus {
color: @navbar-subnav-link-hover-color;
background-color: @navbar-subnav-link-hover-bg;
}
}
// Active state
> .active > a {
&,
&:hover,
&:focus {
background-color: @navbar-subnav-link-hover-bg;
color: @navbar-subnav-link-hover-color;
}
}
}
}
/* Add support for multilevel dropdown menus
.subnav {
> ul {
top:0; left: 100%;
}
.accordion-toggle:after {
float:right;
padding-left: .3em;
.icon(@chevron-down);
@media (min-width: @screen-desktop) { .icon(@chevron-right); margin-right: -14px; padding-left: 0; }
}
}*/
// Sub
/*
> .active > a,
> .open > a {
&,
&:hover,
&:focus {
background-color: @navbar-subnav-link-hover-bg;
color: @navbar-subnav-link-hover-color;
}
}
*//*
}
.navbar-nav > .subnav > ul { border-top-color: @navbar-default-link-hover-bg; }
*/
}

3
templates/default/assets/less/thelia/price.less
View File

@@ -6,9 +6,10 @@
.price {
color: @brand-primary;
font-size: ceil(@font-size-base * 1.5);
font-size: ceil(@font-size-base * 1.4);
font-weight: bold;
font-style: italic;
white-space: nowrap;
}
// Regular price

2
templates/default/assets/less/thelia/variables.less
View File

@@ -5,7 +5,7 @@
@FontAwesomePath: "../font/fontawesome";
//bootstrap font
@icon-font-path: "../font/bootstrap/";
@icon-font-path: "../font/bootstrap/";
// Grid system
@grid-float-breakpoint: @screen-desktop;

46
templates/default/assets/themes/default/less/theme.less
View File

@@ -1,9 +1,11 @@
// Body padding required with the fixed navbar (By default, the navbar is 50px high.)
/*
body { padding-top: 80px; }
.navbar {
.navbar-fixed-top;
}
*/
.page-header {
border: none;
@@ -64,25 +66,36 @@ label { font-weight: 600; }
}
}
> a.cart {
background-color: @brand-primary;
color: #fff;
> .badge {
background-color: #fff;
color: @brand-primary;
}
&:hover,
&:focus {
> .badge {
background-color: #fff;
color: @brand-primary;
}
}
}
&.cart-not-empty {
> a.cart {
background-color: @brand-primary;
color: #fff;
}
&:before {
.icon(@shopping-cart);
color: #fff;
font-size: 24px; line-height: 0;
margin-right: .4em;
> .badge {
background-color: #fff;
color: @brand-primary;
}
&:hover,
&:focus {
background-color: @brand-primary;
color: #fff;
}
&:before {
.icon(@shopping-cart);
color: #fff;
font-size: 24px; line-height: 0;
margin-right: .4em;
}
}
}
}
@@ -151,7 +164,7 @@ header {
/* Custom button */
.btn-primary {
.page .btn-primary {
border-left: 3px solid lighten(@brand-primary, 20%);
.border-radius(0);
color: #fff;
@@ -410,6 +423,7 @@ td.product,
@media (min-width: @screen-desktop) {
.product-image { padding-bottom: 40px; }
.product-info {
.transition(height 300ms linear);
position: absolute;
bottom: 0;
width: 100%; height: 50px;
@@ -419,7 +433,6 @@ td.product,
&:focus {
cursor: pointer;
height: 140px;
.transition(height 300ms linear);
}
}
}
@@ -1124,7 +1137,6 @@ td.product,
> tr {
> td {
&.price,
&.unitprice,
&.qty,
&.subprice { padding: 35px 10px; }
}

113
templates/default/layout.tpl
View File

@@ -23,7 +23,7 @@ URL: http://www.thelia.net
<meta charset="utf-8">
{* Page Title *}
<title>{block name="page-title"}{strip}{if $breadcrumbs}{foreach from=$breadcrumbs|array_reverse item=breadcrumb}{$breadcrumb.title} | {/foreach}{/if}Thelia{/strip}{/block}</title>
<title>{block name="page-title"}{strip}{if $breadcrumbs}{foreach from=$breadcrumbs|array_reverse item=breadcrumb}{$breadcrumb.title} | {/foreach}{/if}{config key="company_name"}{/strip}{/block}</title>
{* Meta Tags *}
<meta name="description" content="">
@@ -32,10 +32,14 @@ URL: http://www.thelia.net
<meta name="viewport" content="width=device-width,initial-scale=1.0">
{block name="meta"}{/block}
<!-- StyleSheet -->
{* Stylesheets *}
{stylesheets file='assets/less/styles.less' filters='less,cssembed,cssrewrite'}
<link rel="stylesheet" href="{$asset_url}">
{/stylesheets}
<!--link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css"-->
{debugbar_rendercss}
{block name="stylesheet"}{/block}
</head>
@@ -60,17 +64,11 @@ URL: http://www.thelia.net
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="{navigate to="index"}">Thelia</a>
<a class="navbar-brand" href="{navigate to="index"}">{config key="company_name"}</a>
</div>
<!-- Place everything within .nav-collapse to hide it until above 768px -->
<nav class="navbar-collapse collapse nav-main" role="navigation" aria-label="{intl l="Main Navigation"}">
<ul class="nav navbar-nav navbar-categories">
<li><a href="{navigate to="index"}" class="home">{intl l="Home"}</a></li>
{loop type="category" name="category.navigation" parent="0"}
<li><a href="{$URL}">{$TITLE}</a></li>
{/loop}
</ul>
<ul class="nav navbar-nav navbar-cart navbar-right">
{loop type="auth" name="customer_info_block" roles="CUSTOMER" context="front"}
<li><a href="{url path="/logout"}" class="logout">{intl l="Log out!"}</a></li>
@@ -78,14 +76,95 @@ URL: http://www.thelia.net
{/loop}
{elseloop rel="customer_info_block"}
<li><a href="{url path="/register"}" class="register">{intl l="Register!"}</a></li>
<li><a href="{url path="/login"}" class="login">{intl l="Log In!"}</a></li>
{/elseloop}
<li class="dropdown">
<a href="{url path="/cart"}" class="cart" data-toggle="dropdown">
<a href="{url path="/login"}" class="login">{intl l="Log In!"}</a>
<div class="dropdown-menu">
<form id="form-login-mini" action="login.php" method="post" role="form">
<div class="form-group group-email-mini">
<label for="email-mini">Email address:</label>
<input type="email" name="email" id="email-mini" class="form-control" value="" aria-required="true" required>
</div>
<div class="form-group group-email">
<label for="password-mini">Password</label>
<input type="password" name="password" id="password-mini" class="form-control" value="" aria-required="true" required>
</div>
<div class="group-btn">
<button type="submit" class="btn btn-login-mini">Sign In</button>
<a href="register.php" class="btn btn-register-mini">Register</a>
</div>
</form>
</div>
</li>
{/elseloop}
<li class="dropdown cart-not-empty">
<a href="{url path="/cart"}" rel="nofollow" class="cart">
Cart <span class="badge">{cart attr="count_item"}</span>
</a>
<div class="dropdown-menu cart-content">
<p>You have no items in your shopping cart.</p>
</div>
<div class="dropdown-menu cart-content">
<form id="form-cart-mini" action="cart-step2.php" method="post" role="form">
<table class="table table-cart-mini">
<colgroup>
<col width="70">
<col>
<col width="100">
</colgroup>
<tbody>
<tr>
<td class="image">
<a href="product-details.php" class="thumbnail"><img src="img/product/1/118x85.png" alt="Product #1"></a>
</td>
<td class="product">
<h3 class="name" style="margin:0"><a href="product-details.php">
Product #1
</a></h3>
<a href="?item=1&amp;qty=0" class="btn btn-remove" data-tip="tooltip" data-title="Delete" data-original-title=""><i class="icon-trash"></i> <span>Remove</span></a>
</td>
<td class="unitprice text-center">
<span class=="qty">2</span> X <span class="price" style="font-size:1em;">$50.00</span></div>
</td>
</tr>
<tr>
<td class="image">
<a href="product-details.php" class="thumbnail"><img src="img/product/1/118x85.png" alt="Product #2"></a>
</td>
<td class="product">
<h3 class="name" style="margin:0"><a href="product-details.php">
Product with very long name #2
</a></h3>
<a href="?item=1&amp;qty=0" class="btn btn-remove" data-tip="tooltip" data-title="Delete" data-original-title=""><i class="icon-trash"></i> <span>Remove</span></a>
</td>
<td class="unitprice text-center">
<span class=="qty">2</span> X <span class="price" style="font-size:1em;">$50.00</span></div>
</td>
</tr>
</tbody>
<tfoot>
<tr >
<td colspan="2" class="empty">
<a href="cart.php" role="button" class="btn btn-default btn-sm"><span>View Cart</span></a>
<button type="submit" name="checkout" class="btn btn-warning btn-sm"><span>Checkout</span></button>
</td>
<td class="total">
<div class="total-price">
<span class="price">$200.00</span>
</div>
</td>
</tr>
</tfoot>
</table>
</form>
</div>
</li>
</ul>
<ul class="nav navbar-nav navbar-categories">
<li><a href="{navigate to="index"}" class="home">{intl l="Home"}</a></li>
{loop type="category" name="category.navigation" parent="0"}
<li><a href="{$URL}">{$TITLE}</a></li>
{/loop}
</ul>
</nav>
</div>
</div>
@@ -94,8 +173,8 @@ URL: http://www.thelia.net
<header class="container" role="banner">
<div class="header">
<h1 class="logo">
<a href="{navigate to="index"}" class="{intl l="Thelia * Since 2006 *"}">
{images file='assets/img/logo.gif'}<img src="{$asset_url}" alt="Thelia">{/images}
<a href="{navigate to="index"}" title="{config key="company_name"}">
{images file='assets/img/logo.gif'}<img src="{$asset_url}" alt="{config key="company_name"}">{/images}
</a>
</h1>
@@ -290,7 +369,7 @@ URL: http://www.thelia.net
<section class="block block-contact" itemscope itemtype="http://schema.org/Organization">
<div class="block-heading"><h3 class="block-title">Contact Us</h3></div>
<div class="block-content">
<meta itemprop="name" content="Thelia V2">
<meta itemprop="name" content="{config key="company_name"}">
<ul>
<li class="contact-address">
<address class="adr" itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
@@ -350,11 +429,11 @@ URL: http://www.thelia.net
{javascripts file='assets/js/bootstrap/bootstrap.js'}
<script src="{$asset_url}"></script>
{/javascripts}'}
{/javascripts}
{javascripts file='assets/js/plugins/bootbox/bootbox.js'}
<script src="{$asset_url}"></script>
{/javascripts}'}
{/javascripts}
{block name="after-javascript-include"}{/block}