// backward compatibility remix WIP

admin-dev/themes/default/css/backward-admin-bootstrap-reset.css

@@ -1 +1 @@
-#nobootstrap{width:100%;background-color:#fff;margin:-20px 0 0 -20px;padding:20px;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}#nobootstrap *,#nobootstrap *:before,#nobootstrap *:after{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}#nobootstrap fieldset h1,#nobootstrap fieldset h2,#nobootstrap fieldset h3,#nobootstrap fieldset h4,#nobootstrap fieldset h5,#nobootstrap fieldset h6{margin:0 !important;padding:0 !important;background-color:transparent !important;border:none !important;text-transform:none !important}#nobootstrap a{line-height:normal}#nobootstrap .categorieList a{line-height:20px}#nobootstrap p{line-height:normal}#nobootstrap legend{font-size:13px;line-height:20px;width:auto}#nobootstrap label{font-size:13px;display:inline;line-height:normal}#nobootstrap .breadcrumb{padding:0}#nobootstrap li{line-height:normal}#nobootstrap select,#nobootstrap textarea,#nobootstrap input{height:inherit}#nobootstrap label,#nobootstrap input,#nobootstrap button,#nobootstrap select,#nobootstrap textarea{font-size:12px;line-height:13px;border-radius:none !important}#nobootstrap input[type="radio"],#nobootstrap input[type="checkbox"]{margin:0}#nobootstrap input[type="text"]{height:14px !important}#nobootstrap table.table{margin:0;padding:0;width:100%;border-collapse:collapse}#nobootstrap table.widthfull{width:100%}#nobootstrap .table thead th{vertical-align:top}#nobootstrap .table th,#nobootstrap .table td{line-height:normal;vertical-align:middle;border-top:none}#nobootstrap [class^="icon-"],#nobootstrap [class*=" icon-"]{width:auto}#nobootstrap .toolbarBox [class^="process-icon-"],#nobootstrap .toolbarBox [class*=" process-icon-"]{text-indent:-9000px;overflow:hidden}
+#content.nobootstrap { background-color: white; width: 1200px; padding: 40px; }

admin-dev/themes/default/scss/admin-theme.sass

@@ -1,16 +1,76 @@
+//Compass is required to pre-compile this stylesheets to .css
 @import "compass"
+
 @import "admin-theme/admin-theme-colors"
 @import "admin-theme/_bootstrap-variables"
-@import "admin-theme/_bootstrap-init"
 @import "admin-theme/_font-awesome"
 @import "admin-theme/animate"
 
-html, body
+//Bootstrap from bower-components
+//some help about bower here.
+
+//Bootstrap Core : Variables + Mixins + Reset + Print
+@import "../bower_components/sass-bootstrap/lib/variables"
+@import "../bower_components/sass-bootstrap/lib/mixins"
+@import "../bower_components/sass-bootstrap/lib/normalize"
+@import "../bower_components/sass-bootstrap/lib/print"
+
+//bootstrap rules apply only on div#content.bootstrap, nav.bootstrap, header.bootstrap, footer.bootstrap
+.bootstrap
+	// Core CSS
+	@import "../bower_components/sass-bootstrap/lib/scaffolding"
+	@import "../bower_components/sass-bootstrap/lib/type"
+	@import "../bower_components/sass-bootstrap/lib/code"
+	@import "../bower_components/sass-bootstrap/lib/grid"
+	@import "../bower_components/sass-bootstrap/lib/tables"
+	@import "../bower_components/sass-bootstrap/lib/forms"
+	@import "../bower_components/sass-bootstrap/lib/buttons"
+	// Components
+	@import "../bower_components/sass-bootstrap/lib/component-animations"
+	@import "../bower_components/sass-bootstrap/lib/glyphicons"
+	@import "../bower_components/sass-bootstrap/lib/dropdowns"
+	@import "../bower_components/sass-bootstrap/lib/button-groups"
+	@import "../bower_components/sass-bootstrap/lib/input-groups"
+	@import "../bower_components/sass-bootstrap/lib/navs"
+	@import "../bower_components/sass-bootstrap/lib/navbar"
+	@import "../bower_components/sass-bootstrap/lib/breadcrumbs"
+	@import "../bower_components/sass-bootstrap/lib/pagination"
+	@import "../bower_components/sass-bootstrap/lib/pager"
+	@import "../bower_components/sass-bootstrap/lib/labels"
+	@import "../bower_components/sass-bootstrap/lib/badges"
+	@import "../bower_components/sass-bootstrap/lib/jumbotron"
+	@import "../bower_components/sass-bootstrap/lib/thumbnails"
+	@import "../bower_components/sass-bootstrap/lib/alerts"
+	@import "../bower_components/sass-bootstrap/lib/progress-bars"
+	@import "../bower_components/sass-bootstrap/lib/media"
+	@import "../bower_components/sass-bootstrap/lib/list-group"
+	@import "../bower_components/sass-bootstrap/lib/panels"
+	@import "../bower_components/sass-bootstrap/lib/wells"
+	@import "../bower_components/sass-bootstrap/lib/close"
+	// Components w/ JavaScript
+	@import "../bower_components/sass-bootstrap/lib/modals"
+	@import "../bower_components/sass-bootstrap/lib/tooltip"
+	@import "../bower_components/sass-bootstrap/lib/popovers"
+	@import "../bower_components/sass-bootstrap/lib/carousel"
+
+// Utility classes
+@import "../bower_components/sass-bootstrap/lib/utilities"
+@import "../bower_components/sass-bootstrap/lib/responsive-utilities"
+
+html
 	min-height: 100%
 	height: 100%
+	font-size: 62.5%
+	-webkit-tap-highlight-color: rgba(0,0,0,0)
+body
+	min-height: 100%
+	height: 100%
+	font-family: $font-family-base
+	font-size: $font-size-base
+	line-height: $line-height-base
+	color: $text-color
+	background-color: $body-bg
 
-#header
-	z-index: 20
 #main
 	z-index: 10
 	float: left
@@ -21,7 +81,7 @@ html, body
 	background-color: $bg-content-color
 	background-image: url('../img/patterns/bedge_grunge.png') // texture
 
-#content
+#content.bootstrap
 	padding: 80px 10px 0
 	@include transition-property(margin)
 	@include transition-duration(0.4s)
@@ -82,9 +142,6 @@ html, body
 		margin: 0
 		padding: 80px 5px 0
 
-//backward
-#nobootstrap
-	float: left
 
 //data-focus
 .data-focus
@@ -108,18 +165,24 @@ body.display-modal
 		background: #F8F8F8
 
 //todo: remove temp fix for bootstrap RC1 -> final
-input[type="text"],input[type="search"],input[type="password"], textarea, select
-	@extend .form-control
-
+.bootstrap
+	input[type="text"],input[type="search"],input[type="password"], textarea, select
+		@extend .form-control
+		
 //panels
-#content
+.bootstrap
 	.panel
 		.panel-footer
 			margin: 15px -20px -20px
 			height: 73px
-.panel-footer
-	.btn.pull-right
-		margin-left: 3px
+			.btn.pull-right
+				margin-left: 3px
+#header
+	.panel-footer
+		margin: 15px 0 0!important
+		height: 40px!important
+
+
 
 //colors
 .attributes-color-container
@@ -128,23 +191,24 @@ input[type="text"],input[type="search"],input[type="password"], textarea, select
 	display: block
 	border: solid 1px black
 
-//components
 @import "admin-theme/admin-header"
 @import "admin-theme/admin-footer"
 @import "admin-theme/admin-nav"
-@import "admin-theme/admin-commons"
-@import "admin-theme/admin-tables"
-@import "admin-theme/admin-tree"
-@import "admin-theme/admin-forms"
-@import "admin-theme/admin-kpi"
-@import "admin-theme/admin-switch"
-@import "admin-theme/admin-toolbar"
-@import "admin-theme/admin-date-range-picker"
-@import "admin-theme/ladda"
 
-//page specific
-@import "admin-theme/admin-login"
-@import "admin-theme/admin-carrier-wizard"
-@import "admin-theme/admin-modules"
-@import "admin-theme/admin-dashboard"
-@import "admin-theme/admin-search"
+.bootstrap
+	//components
+	@import "admin-theme/admin-commons"
+	@import "admin-theme/admin-tables"
+	@import "admin-theme/admin-tree"
+	@import "admin-theme/admin-forms"
+	@import "admin-theme/admin-kpi"
+	@import "admin-theme/admin-switch"
+	@import "admin-theme/admin-toolbar"
+	@import "admin-theme/admin-date-range-picker"
+	@import "admin-theme/ladda"
+	//page specific
+	@import "admin-theme/admin-login"
+	@import "admin-theme/admin-carrier-wizard"
+	@import "admin-theme/admin-modules"
+	@import "admin-theme/admin-dashboard"
+	@import "admin-theme/admin-search"

admin-dev/themes/default/scss/admin-theme/_admin-header.sass

@@ -1,3 +1,5 @@
+#header
+	z-index: 20
 #header_infos
 	@extend .navbar
 	@extend .navbar-inverse
@@ -7,20 +9,21 @@
 	@extend .navbar-brand
 	font: 300 1.3em/100% $headings-font-family
 	position: relative
-	padding: 0 0 0 45px
 	margin: 0 20px 0 0
-	height: 37px
-	line-height: 37px
+	height: 36px
+	padding-left: 45px!important
+	line-height: 36px
 	img
 		position: absolute
 		top: 0
 		left: 0
-		width: 37px
-		height: 37px
+		width: 36px
+		height: 36px
 #header_notifs_icon_wrapper
 	@extend .hidden-xs
 	@extend .nav
 	@extend .navbar-nav
+	height: 36px
 	li a
 		padding: 9px 5px
 	> li > a > i
@@ -47,7 +50,6 @@
 				margin: 0
 		.notifs_panel_footer
 			@extend .panel-footer
-
 #header_nav_toggle
 	background-color: black
 	border: none
@@ -64,7 +66,7 @@
 #header_search
 	@extend .navbar-form
 	@extend .navbar-left
-	width: 160px
+	width: 160px!important
 	padding: 0 0 0 10px
 	position: relative
 	@media (max-width: $screen-tablet)
@@ -77,39 +79,32 @@
 		top: 0
 		left: 10px
 		width: 400px
-
 #employee_infos
-	
-.employee_name
-	position: relative
-	padding-left: 34px!important
-
-.employee_avatar_small
-	height: 30px
-	width: 30px
-	display: inline-block
-	position: absolute
-	top: 4px
-	left: 0
-	img
-		width: 100%
-		height: 100%
-		@include border-radius(30px)
-
-.employee_avatar
-	height: 100px
-	width: 100px
-	display: block
-	margin: 10px auto 10px auto
-	overflow: hidden
-	@include border-radius(120px)
-	@include box-shadow(white 0 0 0 2px, #ccc 0 0 10px 3px)
-	img
-		width: 100%
-		height: 100%
-		
-
-
+	.employee_name
+		position: relative
+		padding-left: 34px!important
+	.employee_avatar_small
+		height: 30px
+		width: 30px
+		display: inline-block
+		position: absolute
+		top: 4px
+		left: 0
+		img
+			width: 100%
+			height: 100%
+			@include border-radius(30px)
+	.employee_avatar
+		height: 100px
+		width: 100px
+		display: block
+		margin: 10px auto
+		overflow: hidden
+		@include border-radius(120px)
+		@include box-shadow(white 0 0 0 2px, #ccc 0 0 10px 3px)
+		img
+			width: 100%
+			height: 100%
 #header_quick
 	@extend .nav
 	@extend .navbar-nav

admin-dev/themes/default/scss/admin-theme/_admin-nav.sass

@@ -396,4 +396,3 @@
 
 [class^="icon-Admin"]
 	margin-right: 6px
-

admin-dev/themes/default/scss/admin-theme/_bootstrap-variables.scss

@@ -73,7 +73,7 @@ $border-radius-base:             3px ;
 // -------------------------
 
 // $table-bg:                           transparent ; overall background-color
-// $table-bg-accent:                    #f9f9f9 ; for striping
+$table-bg-accent:                    #f9f9f9 ; //for striping
 $table-bg-hover:                     $bg-panel-heading-color ;
 
 // $table-border-color:                 #ddd ; table and cell border

admin-dev/themes/default/scss/backward-admin-bootstrap-reset.sass

@@ -1,63 +1,6 @@
 @import compass
-#nobootstrap
-	width: 100%
+#content.nobootstrap
+	//width: 100%
 	background-color: white
-	margin: -20px 0 0 -20px
-	padding: 20px
-	@include box-sizing(content-box)
-	*, *:before, *:after
-		@include box-sizing(content-box)
-	fieldset
-		h1, h2, h3, h4, h5, h6
-			margin: 0!important
-			padding: 0!important
-			background-color: transparent!important
-			border: none!important
-			text-transform: none!important
-	a
-		line-height: normal
-	.categorieList a
-		line-height: 20px
-	p
-		line-height: normal
-	legend
-		font-size: 13px
-		line-height: 20px
-		width: auto
-	label
-		font-size: 13px
-		display: inline
-		line-height: normal
-	.breadcrumb
-		padding: 0
-	li
-		line-height: normal
-	select, textarea, input
-		height: inherit
-	label, input, button, select, textarea
-		font-size: 12px
-		line-height: 13px
-		border-radius: none!important
-
-	input[type="radio"], input[type="checkbox"]
-		margin: 0
-	input[type="text"]
-		height: 14px!important
-	table.table
-		margin: 0
-		padding: 0
-		width: 100%
-		border-collapse: collapse
-	table.widthfull
-		width: 100%
-	.table thead th
-		vertical-align: top
-	.table th, .table td
-		line-height: normal
-		vertical-align: middle
-		border-top: none
-	[class^="icon-"], [class*=" icon-"]
-		width: auto
-	.toolbarBox [class^="process-icon-"], .toolbarBox [class*=" process-icon-"]
-		text-indent: -9000px
-		overflow: hidden
+	width: 1200px
+	padding: 40px

admin-dev/themes/default/scss/backward-admin-old.scss

@@ -1,4 +1,4 @@
-#nobootstrap {
+#content.nobootstrap {
 	//old admin theme
 	h1,h2,h3,h4{font-family:Arial, Helvetica, sans-serif;line-height:1.4em;margin-bottom:.5em}
 	h2{font-size:1.7em}

admin-dev/themes/default/template/controllers/login/header.tpl

@@ -47,4 +47,4 @@
 </head>
 <body class="page-topbar">
 	<div id="login">
-		<div id="content" class="page-content">
+		<div id="content">

admin-dev/themes/default/template/controllers/modules/configure.tpl

@@ -22,26 +22,28 @@
 *  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
 *  International Registered Trademark & Property of PrestaShop SA
 *}
-<div class="page-head">
-	<h2 class="page-title">
-		{l s='Configure'} : {$module_name}
-	</h2>
-	<div class="page-bar toolbarBox">
-		<div class="btn-toolbar">
-			<ul class="cc_button nav nav-pills pull-right">
-				<li>
-					<a id="desc-module-hook" class="toolbar_btn" href="{$module_hooklink}" title="{l s='Manage hooks'}">
-						<i class="process-icon-anchor"></i>
-						<div>{l s='Manage hooks'}</div>
-					</a>
-				</li>
-				<li>
-					<a id="desc-module-back" class="toolbar_btn" href="{$backlink}" title="{l s='Back'}">
-						<i class="process-icon-back" ></i>
-						<div>{l s='Back'}</div>
-					</a>
-				</li>
-			</ul>
+<div class="bootstrap">
+	<div class="page-head">
+		<h2 class="page-title">
+			{l s='Configure'} : {$module_name}
+		</h2>
+		<div class="page-bar toolbarBox">
+			<div class="btn-toolbar">
+				<ul class="cc_button nav nav-pills pull-right">
+					<li>
+						<a id="desc-module-hook" class="toolbar_btn" href="{$module_hooklink}" title="{l s='Manage hooks'}">
+							<i class="process-icon-anchor"></i>
+							<div>{l s='Manage hooks'}</div>
+						</a>
+					</li>
+					<li>
+						<a id="desc-module-back" class="toolbar_btn" href="{$backlink}" title="{l s='Back'}">
+							<i class="process-icon-back" ></i>
+							<div>{l s='Back'}</div>
+						</a>
+					</li>
+				</ul>
+			</div>
 		</div>
 	</div>
 </div>

admin-dev/themes/default/template/footer.tpl

@@ -27,7 +27,7 @@
 </div>
 {if $display_footer}
 {hook h="displayBackOfficeFooter"}
-<div id="footer">
+<div id="footer" class="bootstrap">
 	<div class="col-sm-5 hidden-xs">
 		<a href="http://www.prestashop.com/" target="_blank">PrestaShop&trade; {$ps_version}</a> - <span>{l s='Load time: '} {number_format(microtime(true) - $timer_start, 3, '.', '')}s</span>
 	</div>

admin-dev/themes/default/template/header.tpl

@@ -102,11 +102,11 @@
 	{/if}
 </head>
 
+
 {if $display_header}
 	<body class="{if $employee->bo_menu}page-sidebar {* page-sidebar-closed *}{else}page-topbar{/if} {$smarty.get.controller|escape|strtolower}">
-
-{* begin  HEADER *}
-	<header id="header">
+	{* begin  HEADER *}
+	<header id="header" class="bootstrap">
 		<nav id="header_infos" role="navigation">
 			<div class="navbar-header">
 			<button id="header_nav_toggle" type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse-primary">
@@ -341,12 +341,15 @@
 	<div id="main">
 		{include file='nav.tpl'}
 
-		<div id="content" class="page-content">
+		<div id="content" class="{if !$bootstrap}nobootstrap{else}bootstrap{/if}">
+		
+
 {if $install_dir_exists}
 			<div class="alert alert-warning">
 				{l s='For security reasons, you must also:'}&nbsp;{l s='delete the /install folder'}
 			</div>
 {/if}
+
 {if $is_multishop && $shop_list && ($multishop_context & Shop::CONTEXT_GROUP || $multishop_context & Shop::CONTEXT_SHOP)}
 			<div class="panel multishop_toolbar">
 				<div class="col-lg-12 form-horizontal">
@@ -355,10 +358,10 @@
 				</div>
 			</div>
 {/if}
+{* end display_header*}
 
-{* end display_header*}	
 {else}
 	<body{if isset($lite_display) && $lite_display} class="display-modal"{/if}>
 		<div id="main">
-			<div id="content" class="page-content">
+			<div id="content" class="{if !$bootstrap}nobootstrap{else}bootstrap{/if}">
 {/if}

admin-dev/themes/default/template/layout.tpl

@@ -87,8 +87,5 @@
 		{/if}
 	</div>
 {/if}
-
-{if !$bootstrap}<div id="nobootstrap">{/if}
 {$page}
-{if !$bootstrap}</div>{/if}
 {$footer}

admin-dev/themes/default/template/nav.tpl

@@ -1,4 +1,4 @@
-<nav id="nav-sidebar" role="navigation">
+<nav id="nav-sidebar" class="bootstrap" role="navigation">
 {if !$tab}
 	<div class="mainsubtablist" style="display:none"></div>
 {/if}

classes/controller/AdminController.php

@@ -1940,8 +1940,9 @@ class AdminControllerCore extends Controller
 	{
 		$admin_webpath = str_ireplace(_PS_ROOT_DIR_, '', _PS_ADMIN_DIR_);
 		$admin_webpath = preg_replace('/^'.preg_quote(DIRECTORY_SEPARATOR, '/').'/', '', $admin_webpath);
-		$this->addCSS(__PS_BASE_URI__.$admin_webpath.'/themes/'.$this->bo_theme.'/css/backward-admin-bootstrap-reset.css', 'all', 1);
-		$this->addCSS(__PS_BASE_URI__.$admin_webpath.'/themes/'.$this->bo_theme.'/css/backward-admin-old.css', 'all', 2);
+		//$this->addCSS(__PS_BASE_URI__.$admin_webpath.'/themes/'.$this->bo_theme.'/css/backward-admin-old.css', 'all', 1);
+		$this->addCSS(__PS_BASE_URI__.$admin_webpath.'/themes/'.$this->bo_theme.'/css/backward-admin-bootstrap-reset.css', 'all', 2);
+		
 	}
 
 	public function setMedia()