replacing css madness by bootstrap, homepage is mostly ok, ecommerce is broken

bzr revid: fva@openerp.com-20130730160317-j5aj1ktxt3u5rlyf
This commit is contained in:
Frédéric van der Essen 2013-07-30 18:03:17 +02:00
parent 474b984f0e
commit 195ebf72d0
22 changed files with 7158 additions and 2057 deletions

View File

@ -20,8 +20,7 @@ OpenERP Website CMS
'static/src/js/website.js',
],
'css': [
'static/lib/bootstrap/css/bootstrap.css',
'static/src/css/*.css',
'static/src/css/editor.css',
],
'qweb': ['static/src/xml/*.xml'],
}

File diff suppressed because it is too large Load Diff

View File

@ -1,2 +1,3 @@
sass:
sass -t expanded --unix-newlines website.sass > website.css
sass -t expanded --unix-newlines --watch website.sass:website.css&
sass -t expanded --unix-newlines --watch editor.sass:editor.css&

View File

@ -1,730 +0,0 @@
@charset "utf-8";
@font-face {
font-family: "mnmliconsRegular";
src: url("/web/static/src/font/mnmliconsv21-webfont.eot") format("eot");
src: url("/web/static/src/font/mnmliconsv21-webfont.woff") format("woff");
src: url("/web/static/src/font/mnmliconsv21-webfont.ttf") format("truetype");
src: url("/web/static/src/font/mnmliconsv21-webfont.svg") format("svg") active;
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "EntypoRegular";
src: url("/web/static/src/font/entypo-webfont.eot") format("eot");
src: url("/web/static/src/font/entypo-webfont.eot?#iefix") format("embedded-opentype");
src: url("/web/static/src/font/entypo-webfont.woff") format("woff");
src: url("/web/static/src/font/entypo-webfont.ttf") format("truetype");
src: url("/web/static/src/font/entypo-webfont.svg") format("svg") active;
font-weight: normal;
font-style: normal;
}
/* --------------------------------- *
* STYLING CONTEXT *
* --------------------------------- */
/* --- Styling for the V8/Lato/White/Purple design --- */
body.oe_styling_v8 {
background: #e9e9e9;
padding: 0;
margin: 0;
}
.oe_styling_v8 {
font-family: "Open Sans", "Helvetica", Sans;
font-weight: 300;
color: #646464;
background: white;
font-size: 16px;
}
.oe_styling_v8 .oe_website_contents {
background: whitesmoke;
padding-bottom: 1px;
}
.oe_styling_v8 b {
font-weight: 600;
}
.oe_styling_v8 a {
color: #6d57e0;
text-decoration: none;
}
.oe_styling_v8 a:visited {
color: #5b284f;
}
.oe_styling_v8 a:hover {
color: #0096eb;
}
.oe_styling_v8 .oe_title_font {
font-family: "Lato", "Open Sans", "Helvetica", Sans;
}
.oe_styling_v8 .oe_page {
background: white;
overflow: hidden;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
-ms-border-radius: 1px;
-o-border-radius: 1px;
border-radius: 1px;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}
.oe_styling_v8 .oe_emph {
font-weight: 400;
}
.oe_styling_v8 .oe_dark {
overflow: hidden;
background: #fcfcfc;
-webkit-box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset;
-moz-box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset;
box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset;
}
/* --------------------------------- *
* LAYOUT *
* --------------------------------- */
/* ------ BASE GRID CONSTRUCTS ----- */
.oe_page {
margin: 0px auto 64px auto;
max-width: 992px;
}
.oe_row {
width: 928px;
margin-top: 16px;
margin-bottom: 16px;
margin-left: auto;
margin-right: auto;
}
.oe_row.oe_fit {
width: auto;
}
.oe_clearfix:after, .oe_row:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
[class*='oe_span'] {
float: left;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 16px;
}
.oe_span12 {
width: 928px;
}
.oe_span10 {
width: 773px;
}
.oe_span9 {
width: 696px;
}
.oe_span8 {
width: 618px;
}
.oe_span6 {
width: 464px;
}
.oe_span4 {
width: 309px;
}
.oe_span3 {
width: 232px;
}
.oe_span2 {
width: 154px;
}
[class*='oe_span'].oe_fit {
padding-left: 0px !important;
padding-right: 0px !important;
}
[class*='oe_span'].oe_right {
float: right;
}
.oe_row.oe_flex [class*='oe_span'] {
display: inline-block;
float: none;
vertical-align: top;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 16px;
width: auto;
}
.oe_row.oe_flex .oe_span12 {
max-width: 928px;
}
.oe_row.oe_flex .oe_span10 {
max-width: 769px;
}
.oe_row.oe_flex .oe_span9 {
max-width: 692px;
}
.oe_row.oe_flex .oe_span8 {
max-width: 614px;
}
.oe_row.oe_flex .oe_span6 {
max-width: 460px;
}
.oe_row.oe_flex .oe_span4 {
max-width: 305px;
}
.oe_row.oe_flex .oe_span3 {
max-width: 228px;
}
.oe_row.oe_flex .oe_span2 {
max-width: 150px;
}
.oe_mb0 {
margin-bottom: 0px !important;
}
.oe_mb4 {
margin-bottom: 4px !important;
}
.oe_mb8 {
margin-bottom: 8px !important;
}
.oe_mb16 {
margin-bottom: 16px !important;
}
.oe_mb32 {
margin-bottom: 32px !important;
}
.oe_mb48 {
margin-bottom: 48px !important;
}
.oe_mb64 {
margin-bottom: 64px !important;
}
.oe_mt0 {
margin-top: 0px !important;
}
.oe_mt4 {
margin-top: 4px !important;
}
.oe_mt8 {
margin-top: 8px !important;
}
.oe_mt16 {
margin-top: 16px !important;
}
.oe_mt32 {
margin-top: 32px !important;
}
.oe_mt48 {
margin-top: 48px !important;
}
.oe_mt64 {
margin-top: 64px !important;
}
/* ------ GENERIC LAYOUT MODIFIERS ----- */
.oe_rightfit {
padding-right: 0px !important;
}
.oe_leftfit {
padding-left: 0px !important;
}
.oe_leftalign {
text-align: left;
}
.oe_rightalign {
text-align: right;
}
.oe_centeralign {
text-align: center;
}
.oe_centered {
margin-left: auto;
margin-right: auto;
}
.oe_hidden {
display: none !important;
opacity: 0 !important;
}
.oe_invisible {
visibility: hidden !important;
}
.oe_transparent {
opacity: 0 !important;
}
.oe_mb0 {
margin-bottom: 0px !important;
}
.oe_mb4 {
margin-bottom: 4px !important;
}
.oe_mb8 {
margin-bottom: 8px !important;
}
.oe_mb16 {
margin-bottom: 16px !important;
}
.oe_mb32 {
margin-bottom: 32px !important;
}
.oe_mb64 {
margin-bottom: 64px !important;
}
.oe_spaced {
margin-top: 32px;
margin-bottom: 32px;
}
.oe_more_spaced {
margin-top: 64px;
margin-bottom: 64px;
}
.oe_padded {
padding-top: 16px;
padding-bottom: 16px;
}
.oe_more_padded {
padding-top: 32px;
padding-bottom: 32px;
}
/* --------------------------------- *
* WEBPAGE COMPONENTS *
* --------------------------------- */
/* ------ BUTTONS ----- */
.oe_styling_v8 .oe_button, .oe_styling_v8 a.oe_button {
position: relative;
bottom: 0;
display: inline-block;
cursor: pointer;
padding: 8px 14px;
background: #8b72b6;
color: white;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
-ms-border-radius: 2px;
-o-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: 0px 2px 0px #afa8cc;
-moz-box-shadow: 0px 2px 0px #afa8cc;
box-shadow: 0px 2px 0px #afa8cc;
text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.44);
border: solid 1px rgba(0, 0, 0, 0.09);
-webkit-transition-property: bottom, background;
-moz-transition-property: bottom, background;
-o-transition-property: bottom, background;
transition-property: bottom, background;
-webkit-transition-duration: 250ms;
-moz-transition-duration: 250ms;
-o-transition-duration: 250ms;
transition-duration: 250ms;
}
.oe_styling_v8 .oe_button:hover, .oe_styling_v8 a.oe_button:hover {
background: #8b5bdd;
color: white;
}
.oe_styling_v8 .oe_button:active, .oe_styling_v8 a.oe_button:active {
background: #333333;
bottom: -3px;
}
.oe_styling_v8 .oe_button.oe_big, .oe_styling_v8 a.oe_button.oe_big {
font-size: 24px;
}
.oe_styling_v8 .oe_button.oe_bigger, .oe_styling_v8 a.oe_button.oe_bigger {
font-size: 32px;
}
.oe_styling_v8 .oe_button.oe_small, .oe_styling_v8 a.oe_button.oe_small {
font-size: 13px;
padding: 2px 4px;
}
.oe_styling_v8 .oe_button.oe_small:active, .oe_styling_v8 a.oe_button.oe_small:active {
bottom: -1px;
}
.oe_styling_v8 .oe_button.oe_medium, .oe_styling_v8 a.oe_button.oe_medium {
padding: 5px 12px;
font-size: 16px;
}
.oe_styling_v8 .oe_button.oe_tacky, .oe_styling_v8 a.oe_button.oe_tacky {
background: #ff4444;
-webkit-box-shadow: 0px 2px 0px #eba8a8;
-moz-box-shadow: 0px 2px 0px #eba8a8;
box-shadow: 0px 2px 0px #eba8a8;
}
.oe_styling_v8 .oe_button.oe_tacky:hover, .oe_styling_v8 a.oe_button.oe_tacky:hover {
background: #ff1010;
}
.oe_styling_v8 .oe_button.oe_tacky:active, .oe_styling_v8 a.oe_button.oe_tacky:active {
background: black;
}
.oe_styling_v8 .oe_button.oe_disabled, .oe_styling_v8 a.oe_button.oe_disabled {
background: #c8c8c8;
-webkit-box-shadow: 0px 2px 0px #b4b4b4;
-moz-box-shadow: 0px 2px 0px #b4b4b4;
box-shadow: 0px 2px 0px #b4b4b4;
cursor: default;
}
.oe_styling_v8 .oe_button.oe_disabled:hover, .oe_styling_v8 a.oe_button.oe_disabled:hover {
background: #c8c8c8;
-webkit-box-shadow: 0px 2px 0px #b4b4b4;
-moz-box-shadow: 0px 2px 0px #b4b4b4;
box-shadow: 0px 2px 0px #b4b4b4;
}
.oe_styling_v8 .oe_button.oe_disabled:active, .oe_styling_v8 a.oe_button.oe_disabled:active {
background: #c8c8c8;
bottom: 0px;
-webkit-box-shadow: 0px 2px 0px #b4b4b4;
-moz-box-shadow: 0px 2px 0px #b4b4b4;
box-shadow: 0px 2px 0px #b4b4b4;
}
.oe_styling_v8.oe_styling_black .oe_button {
-webkit-box-shadow: 0px 2px 0px #463555;
-moz-box-shadow: 0px 2px 0px #463555;
box-shadow: 0px 2px 0px #463555;
}
/* ------ FORMS ----- */
.oe_styling_v8 {
/* FIXME: this is a quick hack for the release */
}
.oe_styling_v8 .oe_input {
padding: 4px 7px;
border-radius: 3px;
border: solid 1px #d6d6d6;
box-shadow: 0px 2px #e6e6e6;
background: #fafafa;
font-weight: 300;
outline: none;
-webkit-transition: all 150ms linear;
-moz-transition: all 150ms linear;
-o-transition: all 150ms linear;
transition: all 150ms linear;
}
.oe_styling_v8 .oe_input:focus {
border: solid 1px #969696;
box-shadow: 0px 2px #d2d2d2;
}
.oe_styling_v8 .oe_input.oe_valid {
background: #f2ffec;
border-color: #b1ebb6;
box-shadow: 0px 2px #e1f8e1;
color: #0f610f;
}
.oe_styling_v8 .oe_input.oe_invalid {
background: #fff2f2;
border-color: #ebb1b1;
box-shadow: 0px 2px #f8e1e1;
color: #610f0f;
}
.oe_styling_v8 .oe_input.oe_big {
padding: 8px 14px;
}
.oe_styling_v8 .oe_input_label {
font-weight: 300;
font-size: 16px;
}
.oe_styling_v8 .oe_input_label.oe_big {
font-size: 20px;
}
.oe_styling_v8 .oe_textarea {
width: 300px;
height: 80px;
}
.oe_styling_v8 .oe_form_layout_table {
width: 100%;
}
.oe_styling_v8 .oe_form_layout_table td {
padding-bottom: 16px;
}
.oe_styling_v8 .oe_form_layout_table td:first-child {
text-align: right;
padding-right: 16px;
}
/* ------ SLOGANS ----- */
.oe_styling_v8 .oe_slogan {
color: #333333;
font-family: "Lato", "Open Sans", "Helvetica", Sans;
text-align: center;
margin-top: 32px;
margin-bottom: 32px;
}
.oe_styling_v8 h1.oe_slogan {
font-size: 64px;
font-weight: 900;
margin-top: 48px;
margin-bottom: 48px;
}
.oe_styling_v8 h2.oe_slogan {
font-size: 40px;
font-weight: 300;
}
.oe_styling_v8 h3.oe_slogan {
font-size: 26px;
font-weight: 300;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
opacity: 0.5;
}
.oe_styling_v8 h4.oe_slogan {
font-size: 24px;
font-weight: 300;
}
.oe_styling_v8 h4.oe_slogan:before, .oe_styling_v8 h4.oe_slogan:after {
margin: 0 20px;
content: "";
display: inline-block;
width: 100px;
height: 0px;
border-top: solid 1px;
vertical-align: middle;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
opacity: 0.3;
}
.oe_styling_v8 h5.oe_slogan {
font-weight: 300;
}
.oe_styling_v8 h2.oe_slogan + h3.oe_slogan {
margin-top: -28px;
}
/* ------ QUOTES ----- */
.oe_quote {
margin: 8px;
padding: 16px;
background: rgba(0, 0, 0, 0.02);
border: solid 1px rgba(0, 0, 0, 0.06);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
-ms-border-radius: 2px;
-o-border-radius: 2px;
border-radius: 2px;
}
.oe_quote .oe_q, .oe_quote q {
margin: 10px;
display: block;
font-style: italic;
text-align: center;
font-size: 20px;
color: #4e66e7;
}
.oe_quote .oe_q:before, .oe_quote .oe_q:after, .oe_quote q:before, .oe_quote q:after {
content: """;
font-weight: 900;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20);
opacity: 0.2;
}
.oe_quote cite {
display: block;
font-style: normal;
margin-top: 16px;
}
.oe_quote .oe_photo {
float: left;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
margin-right: 16px;
}
.oe_quote .oe_author {
font-size: 20px;
padding-top: 6px;
color: #8d7bac;
}
.oe_dark .oe_quote {
background: white;
border: 1px solid #f0f0ff;
}
/* ------ PICTURES ----- */
.oe_picture {
display: block;
max-width: 84%;
max-height: 400px;
margin: 16px 8%;
}
.oe_screenshot {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
}
/* ----- Link Image with Footer ----- */
/* FIXME: Terrible CSS, rewrite this */
.oe_demo {
position: relative;
border: 1px solid #dedede;
}
.oe_demo .oe_demo_play {
top: 50%;
left: 50%;
width: 80px;
height: 60px;
margin-top: -30px;
margin-left: -40px;
display: block;
position: absolute;
background: url("../img/layout/play-button.png") no-repeat left top transparent;
pointer-events: none;
}
.oe_demo img {
max-width: 100%;
width: 100%;
}
.oe_demo .oe_demo_footer {
position: absolute;
left: 0;
background-color: rgba(0, 0, 0, 0.4);
opacity: 0.85;
bottom: -1px;
width: 100%;
padding-top: 7px;
padding-bottom: 7px;
color: white;
font-size: 14px;
font-weight: bold;
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
pointer-events: none;
}
.oe_demo:hover .oe_demo_play {
background: url("../img/layout/play-button-over.png") no-repeat left top transparent;
}
/* ----- SEPARATOR ----- */
.oe_styling_v8 .oe_container.oe_separator {
height: 64px;
margin-bottom: 16px;
/* @include background(linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.02))) */
-webkit-box-shadow: 0px -3px 10px -5px rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow: 0px -3px 10px -5px rgba(0, 0, 0, 0.1) inset;
box-shadow: 0px -3px 10px -5px rgba(0, 0, 0, 0.1) inset;
overflow-y: hidden;
}
/* ----- TABS ----- */
.oe_row_tabs {
text-align: center;
margin-top: 0px;
margin-bottom: 0px;
padding-top: 21px;
}
.oe_row_tab {
position: relative;
min-width: 120px;
padding: 8px;
font-size: 20px;
display: inline-block;
margin: 0px -2px;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border: solid 1px rgba(0, 0, 0, 0.1);
border-bottom: none;
background: #fafafa;
background-image: +linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.02));
box-shadow: 0px -3px 10px -5px rgba(0, 0, 0, 0.1) inset;
cursor: pointer;
-webkit-transition: all 250ms linear;
-moz-transition: all 250ms linear;
-o-transition: all 250ms linear;
transition: all 250ms linear;
}
.oe_row_tab:hover {
padding-bottom: 12px;
top: -4px;
background-color: white;
}
.oe_row_tab.oe_active {
background-color: white;
background-image: none;
box-shadow: none;
border-top-color: #8272b6;
border-top-width: 2px;
cursor: default;
}
.oe_row_tab.oe_active:hover {
padding-bottom: 8px;
top: 0asx;
}
/* ------ CALL TO ACTION ----- */
.oe_calltoaction {
height: 32px;
margin-top: -32px;
position: relative;
}
label, input, button, select, textarea {
line-height: 15px !important;
}
input[type='checkbox'] {
vertical-align: top !important;
margin-top: 2px !important;
}
.oe_form_status li {
height: 30px;
}
.oe_form_status .label {
background: none !important;
font-weight: normal !important;
line-height: 1.5em !important;
}

View File

@ -1,706 +0,0 @@
@charset "utf-8"
// Variables {{{
$facets-border: #afafb6
$section-title-color: #7C7BAD
$tag-bg-light: #f0f0fa
$tag-bg-dark: #7C7BAD
$tag-border: #afafb6
$tag-border-selected: #a6a6fe
$hover-background: #f0f0fa
$link-color: #7C7BAD
$sheet-max-width: 860px
$sheet-min-width: 650px
$sheet-padding: 16px
// }}}
// Mixins {{{
@font-face
font-family: 'mnmliconsRegular'
src: url('/web/static/src/font/mnmliconsv21-webfont.eot') format('eot')
src: url('/web/static/src/font/mnmliconsv21-webfont.woff') format('woff')
src: url('/web/static/src/font/mnmliconsv21-webfont.ttf') format('truetype')
src: url('/web/static/src/font/mnmliconsv21-webfont.svg') format('svg') active
font-weight: normal
font-style: normal
@font-face
font-family: 'EntypoRegular'
src: url('/web/static/src/font/entypo-webfont.eot') format('eot')
src: url('/web/static/src/font/entypo-webfont.eot?#iefix') format('embedded-opentype')
src: url('/web/static/src/font/entypo-webfont.woff') format('woff')
src: url('/web/static/src/font/entypo-webfont.ttf') format('truetype')
src: url('/web/static/src/font/entypo-webfont.svg') format('svg') active
font-weight: normal
font-style: normal
@mixin reset()
border: none
padding: 0
margin: 0
background: none
@include radius(0)
@include box-shadow(none)
@mixin vertical-gradient($startColor: #555, $endColor: #333)
background-color: mix($startColor, $endColor)
background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor)) /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(top, $startColor, $endColor) /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(top, $startColor, $endColor) /* FF3.6 */
background-image: -ms-linear-gradient(top, $startColor, $endColor) /* IE10 */
background-image: -o-linear-gradient(top, $startColor, $endColor) /* Opera 11.10+ */
background-image: linear-gradient(to bottom, $startColor, $endColor)
@mixin radial-gradient($gradient)
background-position: center center
background-image: -webkit-radial-gradient(circle, $gradient)
background-image: -moz-radial-gradient($gradient)
background-image: -ms-radial-gradient($gradient)
background-image: radial-gradient($gradient)
@mixin radius($radius: 5px)
-moz-border-radius: $radius
-webkit-border-radius: $radius
border-radius: $radius
@mixin box-shadow($bsval: 0px 1px 4px #777)
-moz-box-shadow: $bsval
-webkit-box-shadow: $bsval
box-shadow: $bsval
@mixin transition($transval: (border linear 0.2s, box-shadow linear 0.2s))
-webkit-transition: $transval
-moz-transition: $transval
-ms-transition: $transval
-o-transition: $transval
transition: $transval
@mixin opacity($opacity: .5)
filter: alpha(opacity=$opacity * 100)
opacity: $opacity
@mixin background-clip($clip: padding-box)
-webkit-background-clip: $clip
-moz-background-clip: $clip
background-clip: $clip
@mixin box-sizing($type: content)
// type = border || content || padding
-webkit-box-sizing: #{$type}-box
-moz-box-sizing: #{$type}-box
-ms-box-sizing: #{$type}-box
box-sizing: #{$type}-box
@mixin skew-gradient($startColor: #555, $endColor: #333)
background-color: $endColor
background: -moz-linear-gradient(135deg, $endColor, $startColor)
background: -o-linear-gradient(135deg, $startColor, $endColor)
background: -webkit-gradient(linear, left top, right bottom, from($startColor), to($endColor))
background: -ms-linear-gradient(top, $startColor, $endColor) /* IE10 */
@mixin transform($transform)
-webkit-transform: $transform
-moz-transform: $transform
-ms-transform: $transform
-o-transform: $transform
transform: $transform
@mixin keyframes($name)
@-webkit-keyframes #{$name}
@content
@-moz-keyframes #{$name}
@content
@-ms-keyframes #{$name}
@content
@-o-keyframes #{$name}
@content
@keyframes #{$name}
@content
// Transforms the (readable) text of an inline element into an mmlicons icon,
// allows for actual readable text in-code (and in readers?) with iconic looks
@mixin text-to-icon($icon-name, $color: #404040)
font-size: 1px
letter-spacing: -1px
color: transparent
text-shadow: none
font-weight: normal
&:before
font: 21px "mnmliconsRegular"
content: $icon-name
color: $color
@mixin text-to-entypo-icon($icon-name, $color: #404040, $size: 21px)
font-size: 1px
letter-spacing: -1px
color: transparent
text-shadow: none
font-weight: normal
&:before
font: $size "entypoRegular"
content: $icon-name
color: $color
// }}}
// CMS and module descriptions {{{
// Warning MOST of those classes will be deprecated in favor of bootstrap
// before the relase of OpenERP v8. Dont use them.
@import "compass/css3"
/* --------------------------------- *
* STYLING CONTEXT *
* --------------------------------- */
/* --- Styling for the V8/Lato/White/Purple design --- */
$v8_footer_color: #e9e9e9
$v8_title_font_color: rgb(51,51,51)
$v8_text_font_color: rgb(100,100,100)
$v8_font_paragraph_color: rgb(51,51,51)
$v8_body_color: rgb(245,245,245)
$v8_bg_color: rgb(255,255,255)
$v8_text_font_family: 'Open Sans','Helvetica',Sans
$v8_title_font_family: 'Lato','Open Sans','Helvetica',Sans
$v8_anchor_color: #6D57E0
$v8_anchor_visited_color: rgb(91, 40, 79)
body.oe_styling_v8
background: $v8_footer_color
padding: 0
margin: 0
.oe_styling_v8
font-family: $v8_text_font_family
font-weight: 300
color: $v8_text_font_color
background: $v8_bg_color
font-size: 16px
.oe_website_contents
background: $v8_body_color
padding-bottom: 1px
b
font-weight: 600
a
color: $v8_anchor_color
text-decoration: none
a:visited
color: $v8_anchor_visited_color
a:hover
color: #0096EB
.oe_title_font
font-family: $v8_title_font_family
.oe_page
background: $v8_bg_color
overflow: hidden
+border-radius(1px)
+box-shadow(0 1px 3px rgba(0,0,0,0.35))
.oe_emph
font-weight: 400
.oe_dark
overflow: hidden
background: #FCFCFC
+box-shadow(0px 5px 9px -7px rgba(0,0,255,0.5) inset, 0px -3px 9px -7px rgba(0,0,255,0.5) inset)
/* --------------------------------- *
* LAYOUT *
* --------------------------------- */
/* ------ BASE GRID CONSTRUCTS ----- */
.oe_page
margin: 0px auto 64px auto
max-width: 992px
.oe_row
width: 928px
margin-top: 16px
margin-bottom: 16px
margin-left: auto
margin-right: auto
.oe_row.oe_fit
width: auto
.oe_clearfix:after, .oe_row:after
content: "."
display: block
clear: both
visibility: hidden
line-height: 0
height: 0
$oe_span12_width: 928px
$oe_span10_width: 773px
$oe_span9_width: 696px
$oe_span8_width: 618px
$oe_span6_width: 464px
$oe_span4_width: 309px
$oe_span3_width: 232px
$oe_span2_width: 154px
[class*='oe_span']
float: left
+box-sizing(border-box)
padding: 0 16px
.oe_span12
width: $oe_span12_width
.oe_span10
width: $oe_span10_width
.oe_span9
width: $oe_span9_width
.oe_span8
width: $oe_span8_width
.oe_span6
width: $oe_span6_width
.oe_span4
width: $oe_span4_width
.oe_span3
width: $oe_span3_width
.oe_span2
width: $oe_span2_width
[class*='oe_span'].oe_fit
padding-left: 0px !important
padding-right: 0px !important
[class*='oe_span'].oe_right
float: right
.oe_row.oe_flex
[class*='oe_span']
display: inline-block
float: none
vertical-align: top
+box-sizing(border-box)
padding: 0 16px
width: auto
.oe_span12
max-width: $oe_span12_width
.oe_span10
max-width: ($oe_span10_width +-4px)
.oe_span9
max-width: ($oe_span9_width +-4px)
.oe_span8
max-width: ($oe_span8_width +-4px)
.oe_span6
max-width: ($oe_span6_width +-4px)
.oe_span4
max-width: ($oe_span4_width +-4px)
.oe_span3
max-width: ($oe_span3_width +-4px)
.oe_span2
max-width: ($oe_span2_width +-4px)
.oe_mb0
margin-bottom: 0px !important
.oe_mb4
margin-bottom: 4px !important
.oe_mb8
margin-bottom: 8px !important
.oe_mb16
margin-bottom: 16px !important
.oe_mb32
margin-bottom: 32px !important
.oe_mb48
margin-bottom: 48px !important
.oe_mb64
margin-bottom: 64px !important
.oe_mt0
margin-top: 0px !important
.oe_mt4
margin-top: 4px !important
.oe_mt8
margin-top: 8px !important
.oe_mt16
margin-top: 16px !important
.oe_mt32
margin-top: 32px !important
.oe_mt48
margin-top: 48px !important
.oe_mt64
margin-top: 64px !important
/* ------ GENERIC LAYOUT MODIFIERS ----- */
.oe_rightfit
padding-right: 0px !important
.oe_leftfit
padding-left: 0px !important
.oe_leftalign
text-align: left
.oe_rightalign
text-align: right
.oe_centeralign
text-align: center
.oe_centered
margin-left: auto
margin-right: auto
.oe_hidden
display: none !important
opacity: 0 !important
.oe_invisible
visibility: hidden !important
.oe_transparent
opacity: 0 !important
.oe_mb0
margin-bottom: 0px !important
.oe_mb4
margin-bottom: 4px !important
.oe_mb8
margin-bottom: 8px !important
.oe_mb16
margin-bottom: 16px !important
.oe_mb32
margin-bottom: 32px !important
.oe_mb64
margin-bottom: 64px !important
.oe_spaced
margin-top: 32px
margin-bottom: 32px
.oe_more_spaced
margin-top: 64px
margin-bottom: 64px
.oe_padded
padding-top: 16px
padding-bottom: 16px
.oe_more_padded
padding-top: 32px
padding-bottom: 32px
/* --------------------------------- *
* WEBPAGE COMPONENTS *
* --------------------------------- */
/* ------ BUTTONS ----- */
.oe_styling_v8 .oe_button, .oe_styling_v8 a.oe_button
position: relative
bottom: 0
display: inline-block
cursor: pointer
padding: 8px 14px
background: rgb(139, 114, 182)
color: white
+border-radius(2px)
+box-shadow(0px 2px 0px rgb(175, 168, 204))
+text-shadow(0px 1px 1px rgba(0,0,0, 0.44))
border: solid 1px rgba(0,0,0,0.09)
+transition-property((bottom, background))
+transition-duration(250ms)
&:hover
background: rgb(139,91,221)
color: white
&:active
background: rgb(51,51,51)
bottom: -3px
&.oe_big
font-size: 24px
&.oe_bigger
font-size: 32px
&.oe_small
font-size: 13px
padding: 2px 4px
&:active
bottom: -1px
&.oe_medium
padding: 5px 12px
font-size: 16px
&.oe_tacky
background: rgb(255,68,68)
+box-shadow(0px 2px 0px #eba8a8)
&:hover
background: rgb(255,16,16)
&:active
background: black
&.oe_disabled
background: rgb(200,200,200)
+box-shadow(0px 2px 0px rgb(180,180,180))
cursor: default
&:hover
background: rgb(200,200,200)
+box-shadow(0px 2px 0px rgb(180,180,180))
&:active
background: rgb(200,200,200)
bottom: 0px
+box-shadow(0px 2px 0px rgb(180,180,180))
.oe_styling_v8.oe_styling_black .oe_button
+box-shadow(0px 2px 0px rgb(70,53,85))
/* ------ FORMS ----- */
.oe_styling_v8
.oe_input
padding: 4px 7px
border-radius: 3px
border: solid 1px rgb(214,214,214)
box-shadow: 0px 2px rgb(230,230,230)
background: rgb(250,250,250)
font-weight: 300
outline: none
@include transition( all 150ms linear )
&:focus
border: solid 1px rgb(150,150,150)
box-shadow: 0px 2px rgb(210,210,210)
&.oe_valid
background: #F2FFEC
border-color: rgb(177,235,182)
box-shadow: 0px 2px rgb(225,248,225)
color: rgb(15,97,15)
&.oe_invalid
background: rgb(255,242,242)
border-color: #EBB1B1
box-shadow: 0px 2px #F8E1E1
color: #610F0F
&.oe_big
padding: 8px 14px
.oe_input_label
font-weight: 300
font-size: 16px
&.oe_big
font-size: 20px
/* FIXME: this is a quick hack for the release */
.oe_textarea
width: 300px
height: 80px
.oe_form_layout_table
width: 100%
td
padding-bottom: 16px
&:first-child
text-align: right
padding-right: 16px
/* ------ SLOGANS ----- */
.oe_styling_v8
.oe_slogan
color: $v8_title_font_color
font-family: $v8_title_font_family
text-align: center
margin-top: 32px
margin-bottom: 32px
h1.oe_slogan
font-size: 64px
font-weight: 900
margin-top: 48px
margin-bottom: 48px
h2.oe_slogan
font-size: 40px
font-weight: 300
h3.oe_slogan
font-size: 26px
font-weight: 300
+opacity(0.5)
h4.oe_slogan
font-size: 24px
font-weight: 300
h4.oe_slogan:before, h4.oe_slogan:after
margin: 0 20px
content: ""
display: inline-block
width: 100px
height: 0px
border-top: solid 1px
vertical-align: middle
+opacity(0.3)
h5.oe_slogan
font-weight: 300
//TODO
h2.oe_slogan+h3.oe_slogan
margin-top: -28px
/* ------ QUOTES ----- */
.oe_quote
margin: 8px
padding: 16px
background: rgba(0,0,0,0.02)
border: solid 1px rgba(0,0,0,0.06)
+border-radius(2px)
.oe_q,q
margin: 10px
display: block
font-style: italic
text-align: center
font-size: 20px
color: rgb(78, 102, 231)
&:before, &:after
content: '"'
font-weight: 900
+opacity(0.2)
cite
display: block
font-style: normal
margin-top: 16px
.oe_photo
float: left
+border-radius(3px)
margin-right: 16px
.oe_author
font-size: 20px
padding-top: 6px
color: rgb(141, 123, 172)
.oe_dark .oe_quote
background: white
border: 1px solid rgb(240,240,255)
/* ------ PICTURES ----- */
// display a picture in a span
.oe_picture
display: block
max-width: 84%
max-height: 400px
margin: 16px 8%
// style the picture like a screenshot
.oe_screenshot
+border-radius(3px)
+box-shadow(0px 3px 8px rgba(0,0,0,0.2))
/* ----- Link Image with Footer ----- */
/* FIXME: Terrible CSS, rewrite this */
.oe_demo
position: relative
border: 1px solid #dedede
.oe_demo_play
top: 50%
left: 50%
width: 80px
height: 60px
margin-top: -30px
margin-left: -40px
display: block
position: absolute
background: url("../img/layout/play-button.png") no-repeat left top transparent
pointer-events: none
img
max-width: 100%
width: 100%
.oe_demo_footer
position: absolute
left: 0
background-color: rgba(0,0,0,0.4)
opacity: 0.85
bottom: -1px
width: 100%
padding-top: 7px
padding-bottom: 7px
color: white
font-size: 14px
font-weight: bold
border-bottom-left-radius: 3px
border-bottom-right-radius: 3px
pointer-events: none
&:hover .oe_demo_play
background: url("../img/layout/play-button-over.png") no-repeat left top transparent
/* ----- SEPARATOR ----- */
.oe_styling_v8 .oe_container.oe_separator
height: 64px
margin-bottom: 16px
/* @include background(linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.02))) */
+box-shadow(0px -3px 10px -5px rgba(0,0,0,0.1) inset)
overflow-y: hidden
/* ----- TABS ----- */
.oe_row_tabs
text-align: center
margin-top: 0px
margin-bottom: 0px
padding-top: 21px
.oe_row_tab
position: relative
min-width: 120px
padding: 8px
font-size: 20px
display: inline-block
margin: 0px -2px
border-top-left-radius: 4px
border-top-right-radius: 4px
border: solid 1px rgba(0,0,0,0.1)
border-bottom: none
background: rgb(250,250,250)
background-image: +linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.02))
box-shadow: 0px -3px 10px -5px rgba(0,0,0,0.1) inset
cursor: pointer
@include transition(all 250ms linear)
.oe_row_tab:hover
padding-bottom: 12px
top: -4px
background-color: white
.oe_row_tab.oe_active
background-color: white
background-image: none
box-shadow: none
border-top-color: rgb(130, 114, 182)
border-top-width: 2px
cursor: default
.oe_row_tab.oe_active:hover
padding-bottom: 8px
top: 0asx
/* ------ CALL TO ACTION ----- */
.oe_calltoaction
height: 32px
margin-top: -32px
position: relative
// }}}
// BOOTSTRAP OVERIDDES
label, input, button, select, textarea
line-height: 15px !important
input[type='checkbox']
vertical-align: top !important
margin-top: 2px !important
.oe_form_status
li
height: 30px
.label
background: none !important
font-weight: normal !important
line-height: 1.5em !important
// au BufWritePost,FileWritePost *.sass :!sass --style expanded --line-numbers <afile> > "%:p:r.css"
// vim:tabstop=4:shiftwidth=4:softtabstop=4:fdm=marker:

View File

@ -0,0 +1,47 @@
.oe_website_editorbar {
position: fixed;
top: 0;
right: 0;
z-index: 10;
display: block;
width: 100%;
padding: 10px;
margin: 0px;
z-index: 10000;
background-color: #414141;
background: -webkit-linear-gradient(#646060, #262626);
box-sizing: border-box;
}
.oe_website_editorbar li {
display: inline;
color: #eeeeee;
}
.oe_website_editorbar li:hover {
background: rgba(0, 0, 0, 0.2);
text-shadow: black 0px 0px 3px;
color: white;
}
.oe_website_editorbar .oe_rte_toolbar div.dropdown {
display: inline-block;
}
.oe_website_editorbar .oe_rte_toolbar div.dropdown li {
display: list-item;
}
.oe_website_editorbar .oe_rte_toolbar button {
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
text-decoration: inherit;
}
.oe_website_editorbar .oe_rte_toolbar button.oe_button_list {
padding-right: 3px;
}
.oe_website_editorbar .oe_rte_toolbar button.oe_button_list:after {
content: "\F0D7";
padding-left: 6px;
}
.oe_editable:focus {
outline: #80b5f2 solid 5px !important;
}

View File

@ -0,0 +1,42 @@
@charset "utf-8"
.oe_website_editorbar
position: fixed
top: 0
right: 0
z-index: 10
display: block
width: 100%
padding: 10px
margin: 0px
z-index: 10000
background-color: #414141
background: -webkit-linear-gradient(#646060, #262626)
box-sizing: border-box
li
display: inline
color: #eee
&:hover
background: rgba(0,0,0,0.2)
text-shadow: black 0px 0px 3px
color: white
.oe_website_editorbar .oe_rte_toolbar
div.dropdown
display: inline-block
li
display: list-item
button
font-family: FontAwesome
font-weight: normal
font-style: normal
text-decoration: inherit
&.oe_button_list
padding-right: 3px
&:after
content: "\F0D7"
padding-left: 6px
.oe_editable:focus
outline: #80B5F2 solid 5px !important

View File

@ -1,169 +0,0 @@
/*
.oe_snippet_demo .oe_page{
margin-top: 50px;
margin-bottom: 300px;
padding-bottom: 10px;
}
.oe_snippet_demo .oe_page .oe_container{
min-height: 200px;
}
.oe_snippet_demo .oe_page *{
outline: 1px solid transparent;
-webkit-transiton: all 150ms linear;
}
.oe_snippet_demo .oe_page .oe_selected{
position: relative;
outline: 2px dashed rgba(151, 137, 255,0.5) !important;
cursor: pointer;
}
.oe_snippet_demo .oe_page .oe_selected:after{
content:'Insert Snippet Here';
position: absolute;
height:20px; left:-2px; right:-2px; bottom:-10px;
background: rgba(151, 137, 255, 1);
border-radius: 2px;
z-index: 800;
pointer-events :none;
color: white;
text-shadow: none;
font-size: 14px;
line-height: 20px;
text-align: center;
}
.oe_snippet_demo.oe_new .oe_page .oe_selected:after{
content:'';
height:100%;
top:0px; left:0px; right:0px; bottom:0px;
background: rgba(151, 137, 255, 0.2);
}
.oe_snippet_editor{
position: fixed;
z-index: 1000;
bottom: 0px;
left: 0px;
right: 0px;
height: 214px;
background: rgb(160,160,160);
box-shadow: 0px 1px 3px rgb(100,100,100) inset;
overflow-y: hidden;
overflow-x: scroll;
}
*/
.oe_snippet_list{
width: auto;
white-space: nowrap;
margin-left: 20px;
}
.oe_snippet_editor .oe_snippet{
box-sizing: border-box;
display: inline-block;
width: 220px;
height: 160px;
border-radius: 3px;
background: white;
margin: 20px;
margin-left: 0px;
cursor: pointer;
border: 2px solid transparent;
box-shadow: 0px 1px 3px rgb(100,100,100);
position: relative;
top: 0px;
-webkit-transition: all 150ms linear;
overflow: hidden;
vertical-align: top;
user-select: none;
white-space: normal;
}
.oe_snippet_editor .oe_snippet:after{
content: attr(name);
position: absolute;
bottom: 0px;
left: 0px;
right: 0px;
background: rgba(255,255,255,0.8);
text-align: center;
color: black;
padding: 8px;
}
.oe_snippet_editor .oe_snippet.oe_selected{
border: 2px solid rgb(151, 137, 255);
box-shadow: 0px 3px 17px rgba(99, 53, 150, 0.59);
}
.oe_snippet_editor .oe_snippet > *{
pointer-events: none;
margin-top: 16px;
line-height: 1em;
zoom: 0.6;
}
.oe_snippet_editor .oe_snippet > .oe_container{
margin-top: 0px;
zoom: 0.23;
line-height: 0.999em;
line-height: 1em;
}
.oe_snippet_editor .oe_snippet > .oe_row{
margin-top: 0px;
zoom: 0.23;
line-height: 0.999em;
}
.oe_snippet_editor .oe_snippet > .oe_span6{
margin-top: 16px;
zoom: 0.47;
}
.oe_snippet_editor .oe_snippet > .oe_span12{
margin-top: 16px;
zoom: 0.23;
}
.oe_snippet_editor .oe_snippet > p{
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
font-size: 20px;
padding: 16px;
zoom: 1;
margin: 0px;
}
.oe_snippet_editor .oe_snippet.oe_new{
background: gray;
box-shadow: 0px 1px 3px rgb(90,90,90) inset;
border: 0px;
}
.oe_snippet_editor .oe_snippet.oe_new.oe_selected{
box-shadow: 0px 2px 0px 0px rgb(151,137,255) inset, 0px 3px 17px rgba(99, 53, 150, 0.59) inset;
}
.oe_snippet_editor .oe_snippet.oe_new > *{
zoom:1;
margin: 0;
line-height: 160px;
text-align: center;
color: white;
font-size: 48px;
}
.oe_snippet_editor .oe_snippet.oe_new:after{
position: absolute;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
background: transparent;
color: white;
text-shadow: 0px 1px 3px black;
line-height: 160px;
padding: 0px;
}
[class*="span"]{
margin-left: 0px !important;
}

View File

@ -1,155 +1,74 @@
@charset "utf-8";
@font-face {
font-family: "mnmliconsRegular";
src: url("/web/static/src/font/mnmliconsv21-webfont.eot") format("eot");
src: url("/web/static/src/font/mnmliconsv21-webfont.woff") format("woff");
src: url("/web/static/src/font/mnmliconsv21-webfont.ttf") format("truetype");
src: url("/web/static/src/font/mnmliconsv21-webfont.svg") format("svg") active;
font-weight: normal;
font-style: normal;
.mt128 {
margin-top: 128px !important;
}
@font-face {
font-family: "EntypoRegular";
src: url("/web/static/src/font/entypo-webfont.eot") format("eot");
src: url("/web/static/src/font/entypo-webfont.eot?#iefix") format("embedded-opentype");
src: url("/web/static/src/font/entypo-webfont.woff") format("woff");
src: url("/web/static/src/font/entypo-webfont.ttf") format("truetype");
src: url("/web/static/src/font/entypo-webfont.svg") format("svg") active;
font-weight: normal;
font-style: normal;
.mt92 {
margin-top: 92px !important;
}
@media print {
.oe_website {
padding-top: 0 !important;
}
.oe_website .oe_website_editorbar, .oe_website .css_noprint, .oe_website .oe_snippet_editor, .oe_website .oe_website_footer {
display: none !important;
}
.oe_website .oe_website_header > .container > .row, .oe_website .oe_website_body > .container > .row {
margin-left: 0px !important;
}
}
.oe_website {
background: #e9e9e9;
color: #646464;
.mt64 {
margin-top: 64px !important;
}
.oe_website_header {
background: whitesmoke;
color: #333333;
padding-top: 8px;
.mt48 {
margin-top: 48px !important;
}
/* Body {{{ */
.oe_website_body {
background: white;
color: #333333;
padding-bottom: 32px;
.mt32 {
margin-top: 32px !important;
}
/* }}} */
/* Footer {{{ */
.oe_website_footer {
border-top: solid 1px #e0e0e0;
padding-bottom: 32px;
padding-top: 32px;
.mt16 {
margin-top: 16px !important;
}
.oe_website_footer h5 {
border-bottom: solid 1px rgba(0, 0, 0, 0.06);
margin-right: 24px;
padding-bottom: 6px;
margin-bottom: 6px;
margin-top: 24px;
.mt8 {
margin-top: 8px !important;
}
.oe_website_footer ul {
list-style: none;
padding: 0;
margin: 0;
.mt4 {
margin-top: 4px !important;
}
.oe_website_footer ul li {
display: block;
margin-bottom: 4px;
font-size: 14px;
margin-right: 32px;
.mt0 {
margin-top: 0px !important;
}
.oe_website_footer ul li a {
color: inherit;
text-decoration: inherit;
}
.oe_website_footer ul li a:visited {
color: inherit;
text-decoration: inherit;
}
.oe_website_footer ul li a:hover {
color: black;
text-decoration: inherit;
}
.oe_website_copy {
margin-top: 24px;
margin-bottom: 6px;
}
/* }}} */
/* Editor {{{ */
.oe_website_editorbar {
position: fixed;
top: 0;
right: 0;
z-index: 10;
display: block;
width: 100%;
padding: 10px;
margin: 0px;
background-color: #414141;
background-color: #454343;
background-image: -webkit-gradient(linear, left top, left bottom, from(#646060), to(#262626));
background-image: -webkit-linear-gradient(top, #646060, #262626);
background-image: -moz-linear-gradient(top, #646060, #262626);
background-image: -ms-linear-gradient(top, #646060, #262626);
background-image: -o-linear-gradient(top, #646060, #262626);
background-image: linear-gradient(to bottom, #646060, #262626);
html, body {
height: 100%;
box-sizing: border-box;
}
.oe_website_editorbar li {
display: inline;
color: #eeeeee;
}
.oe_website_editorbar li:hover {
background: rgba(0, 0, 0, 0.2);
text-shadow: black 0px 0px 3px;
color: white;
position: relative;
}
.oe_website_editorbar .oe_rte_toolbar div.dropdown {
display: inline-block;
}
.oe_website_editorbar .oe_rte_toolbar div.dropdown li {
display: list-item;
}
.oe_website_editorbar .oe_rte_toolbar button {
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
text-decoration: inherit;
}
.oe_website_editorbar .oe_rte_toolbar button.oe_button_list {
padding-right: 3px;
}
.oe_website_editorbar .oe_rte_toolbar button.oe_button_list:after {
content: "\F0D7";
padding-left: 6px;
#wrap {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -300px;
}
/* }}} */
.oe_editable:focus {
outline: #80b5f2 solid 5px !important;
#push-footer {
height: 364px;
}
footer {
box-sizing: border-box;
height: 300px;
background: #ddebe3;
padding-top: 64px;
padding-bottom: 64px;
}
.subheader {
letter-spacing: 3px;
font-weight: 300;
}
header.navbar-fixed-top {
position: static;
}
.dark {
background: #eff8f8;
padding: 64px;
}

View File

@ -1,241 +1,52 @@
@charset "utf-8"
// vim:tabstop=4:shiftwidth=4:softtabstop=4:fdm=marker:fdl=0
.mt128
margin-top: 128px !important
.mt92
margin-top: 92px !important
.mt64
margin-top: 64px !important
.mt48
margin-top: 48px !important
.mt32
margin-top: 32px !important
.mt16
margin-top: 16px !important
.mt8
margin-top: 8px !important
.mt4
margin-top: 4px !important
.mt0
margin-top: 0px !important
// Mixins {{{
@font-face
font-family: 'mnmliconsRegular'
src: url('/web/static/src/font/mnmliconsv21-webfont.eot') format('eot')
src: url('/web/static/src/font/mnmliconsv21-webfont.woff') format('woff')
src: url('/web/static/src/font/mnmliconsv21-webfont.ttf') format('truetype')
src: url('/web/static/src/font/mnmliconsv21-webfont.svg') format('svg') active
font-weight: normal
font-style: normal
@font-face
font-family: 'EntypoRegular'
src: url('/web/static/src/font/entypo-webfont.eot') format('eot')
src: url('/web/static/src/font/entypo-webfont.eot?#iefix') format('embedded-opentype')
src: url('/web/static/src/font/entypo-webfont.woff') format('woff')
src: url('/web/static/src/font/entypo-webfont.ttf') format('truetype')
src: url('/web/static/src/font/entypo-webfont.svg') format('svg') active
font-weight: normal
font-style: normal
@mixin reset()
border: none
padding: 0
margin: 0
background: none
@include radius(0)
@include box-shadow(none)
@mixin vertical-gradient($startColor: #555, $endColor: #333)
background-color: mix($startColor, $endColor)
background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor)) /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(top, $startColor, $endColor) /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(top, $startColor, $endColor) /* FF3.6 */
background-image: -ms-linear-gradient(top, $startColor, $endColor) /* IE10 */
background-image: -o-linear-gradient(top, $startColor, $endColor) /* Opera 11.10+ */
background-image: linear-gradient(to bottom, $startColor, $endColor)
@mixin radial-gradient($gradient)
background-position: center center
background-image: -webkit-radial-gradient(circle, $gradient)
background-image: -moz-radial-gradient($gradient)
background-image: -ms-radial-gradient($gradient)
background-image: radial-gradient($gradient)
@mixin radius($radius: 5px)
-moz-border-radius: $radius
-webkit-border-radius: $radius
border-radius: $radius
@mixin box-shadow($bsval: 0px 1px 4px #777)
-moz-box-shadow: $bsval
-webkit-box-shadow: $bsval
box-shadow: $bsval
@mixin transition($transval: (border linear 0.2s, box-shadow linear 0.2s))
-webkit-transition: $transval
-moz-transition: $transval
-ms-transition: $transval
-o-transition: $transval
transition: $transval
@mixin opacity($opacity: .5)
filter: alpha(opacity=$opacity * 100)
opacity: $opacity
@mixin background-clip($clip: padding-box)
-webkit-background-clip: $clip
-moz-background-clip: $clip
background-clip: $clip
@mixin box-sizing($type: content)
// type = border || content || padding
-webkit-box-sizing: #{$type}-box
-moz-box-sizing: #{$type}-box
-ms-box-sizing: #{$type}-box
box-sizing: #{$type}-box
@mixin skew-gradient($startColor: #555, $endColor: #333)
background-color: $endColor
background: -moz-linear-gradient(135deg, $endColor, $startColor)
background: -o-linear-gradient(135deg, $startColor, $endColor)
background: -webkit-gradient(linear, left top, right bottom, from($startColor), to($endColor))
background: -ms-linear-gradient(top, $startColor, $endColor) /* IE10 */
@mixin transform($transform)
-webkit-transform: $transform
-moz-transform: $transform
-ms-transform: $transform
-o-transform: $transform
transform: $transform
@mixin keyframes($name)
@-webkit-keyframes #{$name}
@content
@-moz-keyframes #{$name}
@content
@-ms-keyframes #{$name}
@content
@-o-keyframes #{$name}
@content
@keyframes #{$name}
@content
// Transforms the (readable) text of an inline element into an mmlicons icon,
// allows for actual readable text in-code (and in readers?) with iconic looks
@mixin text-to-icon($icon-name, $color: #404040)
font-size: 1px
letter-spacing: -1px
color: transparent
text-shadow: none
font-weight: normal
&:before
font: 21px "mnmliconsRegular"
content: $icon-name
color: $color
@mixin text-to-entypo-icon($icon-name, $color: #404040, $size: 21px)
font-size: 1px
letter-spacing: -1px
color: transparent
text-shadow: none
font-weight: normal
&:before
font: $size "entypoRegular"
content: $icon-name
color: $color
// }}}
@media print
.oe_website
padding-top: 0 !important
.oe_website_editorbar, .css_noprint, .oe_snippet_editor, .oe_website_footer
display: none !important
.oe_website_header, .oe_website_body
> .container > .row
margin-left: 0px !important
.oe_website
background: #e9e9e9
color: #646464
.oe_website_header
background: whitesmoke
color: #333
padding-top: 8px
/* Body {{{ */
.oe_website_body
background: #fff
color: #333
padding-bottom: 32px
/* }}} */
/* Footer {{{ */
.oe_website_footer
border-top: solid 1px #e0e0e0
padding-bottom: 32px
padding-top: 32px
.oe_website_footer h5
border-bottom: solid 1px rgba(0, 0, 0, 0.06)
margin-right: 24px
padding-bottom: 6px
margin-bottom: 6px
margin-top: 24px
.oe_website_footer ul
list-style: none
padding: 0
margin: 0
.oe_website_footer ul li
display: block
margin-bottom: 4px
font-size: 14px
margin-right: 32px
.oe_website_footer ul li a
color: inherit
text-decoration: inherit
.oe_website_footer ul li a:visited
color: inherit
text-decoration: inherit
.oe_website_footer ul li a:hover
color: black
text-decoration: inherit
.oe_website_copy
margin-top: 24px
margin-bottom: 6px
/* }}} */
/* Editor {{{ */
.oe_website_editorbar
position: fixed
top: 0
right: 0
z-index: 10
display: block
width: 100%
padding: 10px
margin: 0px
background-color: #414141
@include vertical-gradient(#646060, #262626)
html,body
height: 100%
box-sizing: border-box
li
display: inline
color: #eee
&:hover
background: rgba(0,0,0,0.2)
text-shadow: black 0px 0px 3px
color: white
position: relative
.oe_website_editorbar .oe_rte_toolbar
div.dropdown
display: inline-block
li
display: list-item
#wrap
min-height: 100%
height: auto !important
height: 100%
margin: 0 auto -300px
button
font-family: FontAwesome
font-weight: normal
font-style: normal
text-decoration: inherit
&.oe_button_list
padding-right: 3px
&:after
content: "\F0D7"
padding-left: 6px
#push-footer
height: 364px
/* }}} */
footer
box-sizing: border-box
height: 300px
background: rgb(221, 235, 227)
padding-top: 64px
padding-bottom: 64px
.oe_editable:focus
outline: #80B5F2 solid 5px !important
.subheader
letter-spacing: 3px
font-weight: 300
header.navbar-fixed-top
position: static
.dark
background: rgb(239, 248, 248)
padding: 64px

Binary file not shown.

After

Width:  |  Height:  |  Size: 428 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 131 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 221 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 584 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 384 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 584 KiB

View File

@ -14,6 +14,6 @@ $(function() {
$(function() {
var editor = new instance.website.EditorBar(instance.webclient);
editor.prependTo($('body'));
$('body').css('padding-top', editor.$el.outerHeight());
$('body').css('padding-top', '48px'); // Not working properly: editor.$el.outerHeight());
});
});

View File

@ -6,12 +6,13 @@
<template id="header">
<div class="container">
<div class="row">
<div class="oe_website_logo span4">
<a href='/page/website.homepage'><img t-att-alt="res_company.name" src='/web/binary/company_logo'/></a>
</div>
<ul class="oe_website_nav span8 nav nav-pills">
<li class="pull-right"><a href="/admin">Sign in</a></li>
<li class="pull-right"><a href="/page/website.contactus">Contact us</a></li>
<a href='/page/website.homepage' class='brand'>
<em>Open</em><b>ERP</b>
<!--<img t-att-alt="res_company.name" src='/web/binary/company_logo'/></a>-->
</a>
<ul class="nav">
<li class=""><a href="/admin">Sign in</a></li>
<li class=""><a href="/page/website.contactus">Contact us</a></li>
</ul>
</div>
</div>
@ -54,14 +55,6 @@
<html>
<head>
<title t-raw="title"><t t-esc="res_company.name"/></title>
<link rel='stylesheet' href='/website/static/src/css/base.css'/>
<link rel='stylesheet' href='/website/static/src/css/website.css'/>
<link rel='stylesheet' href='/website/static/lib/bootstrap/css/bootstrap.css'/>
<link rel='stylesheet' href='/web/static/lib/fontawesome/css/font-awesome.css'/>
<link rel='stylesheet' href='https://www.openerp.com/saas_master/static/site_new/fonts/lato/stylesheet.css'/>
<link href='//fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'/>
<link href='//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,300,600,700' rel='stylesheet' type='text/css'/>
<script type="text/javascript" src="/web/static/lib/jquery/jquery-1.8.3.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/ckeditor/4.2/ckeditor.js"></script>
<script type="text/javascript">
@ -76,28 +69,39 @@
<script type="text/javascript" src="/website/static/src/js/website_bootstrap.js"></script>
</t>
<t t-raw="head"/>
<link rel='stylesheet' href='/website/static/lib/bootstrap/css/bootstrap-flatly.css'/>
<link rel='stylesheet' href='/web/static/lib/fontawesome/css/font-awesome.css'/>
<link rel='stylesheet' href='/website/static/src/css/website.css'/>
<!--<link rel='stylesheet' href='/website/static/lib/bootstrap/css/bootstrap-responsive.css'/>-->
</head>
<body class="oe_website">
<header class="oe_website_header">
<t t-call="website.header"/>
</header>
<div class="oe_website_body" t-raw="0">
<div class="container">
<div class="row">
<h1>I'm an empty page, please edit me...</h1>
<body>
<div id='wrap'>
<header class='navbar navbar-fixed-top'>
<div class='navbar-inner'>
<t t-call="website.header"/>
</div>
</header>
<div t-raw="0">
<div class="container">
<div class="row">
<h1>I'm an empty page, please edit me...</h1>
</div>
</div>
</div>
<div id='push-footer'>
</div>
</div>
<footer class="oe_website_footer">
<footer>
<t t-call="website.footer"/>
<p class="oe_website_copy text-center">&amp;copy; <span t-record="res_company" t-field="name">Company name</span>.</p>
<p class="text-center">&amp;copy; <span t-record="res_company" t-field="name">Company name</span>.</p>
</footer>
<!--
<div class='oe_snippet_editor' style="display: none;">
<div class='oe_snippet_list'>
<div class='oe_snippet' name='Screenshot' selafter='.oe_span6' selinside='.oe_row'>
<div class="oe_span6">
<div class='oe_snippet' name='Screenshot' selafter='.span6' selinside='.row'>
<div class="span6">
<div class="oe_demo oe_picture oe_screenshot">
<a href="#">
<img src="https://www.openerp.com/apps/point_of_sale/pos_sc_02.jpg"/>
@ -105,21 +109,21 @@
</div>
</div>
</div>
<div class='oe_snippet' name='Introduction' data-selector=".oe_container">
<section class="oe_container">
<div class="oe_row oe_spaced">
<div class="oe_span12">
<div class='oe_snippet' name='Introduction' data-selector=".container">
<section class="container">
<div class="row oe_spaced">
<div class="span12">
<h2 class="oe_slogan">A very friendly Point of Sale</h2>
<h3 class="oe_slogan">Set up in a minute, Sell in seconds</h3>
</div>
<div class="oe_span6">
<div class="span6">
<div class="oe_demo oe_picture oe_screenshot">
<a href="#">
<img src="https://www.openerp.com/apps/point_of_sale/pos_sc_02.jpg"/>
</a>
</div>
</div>
<div class="oe_span6">
<div class="span6">
<p class='oe_mt32'>
OpenERP's Point of Sale introduces a super clean interface with no installation required
that runs online and offline on modern hardwares.
@ -135,19 +139,19 @@
</div>
</section>
</div>
<div class='oe_snippet' name='Call To Action' selafter='p,h1,h2,h3,h4,h5,ul,ol' selinside='.oe_span6'>
<div class='oe_snippet' name='Call To Action' selafter='p,h1,h2,h3,h4,h5,ul,ol' selinside='.span6'>
<div class="oe_centeralign oe_websiteonly">
<a href="http://www.openerp.com/start" class="oe_button oe_big oe_tacky">Start your <span class="oe_emph">free</span> trial</a>
</div>
</div>
<div class='oe_snippet' name='Alternate Paragraph' data-selector=".oe_container">
<section class="oe_container oe_dark">
<div class="oe_row oe_spaced">
<div class="oe_span12">
<h2 class="oe_slogan">A very friendly Point of Sale</h2>
<h3 class="oe_slogan">Set up in a minute, Sell in seconds</h3>
<div class='oe_snippet' name='Alternate Paragraph' data-selector=".container">
<section class="container oe_dark">
<div class="row oe_spaced">
<div class="span12">
<h2>A very friendly Point of Sale</h2>
<h3>Set up in a minute, Sell in seconds</h3>
</div>
<div class="oe_span6">
<div class="span6">
<p class='oe_mt32'>
OpenERP's Point of Sale introduces a super clean interface with no installation required
that runs online and offline on modern hardwares.
@ -160,7 +164,7 @@
<a href="http://www.openerp.com/start" class="oe_button oe_big oe_tacky">Start your <span class="oe_emph">free</span> trial</a>
</div>
</div>
<div class="oe_span6">
<div class="span6">
<div class="oe_demo oe_picture oe_screenshot">
<a href="#">
<img src="https://www.openerp.com/apps/point_of_sale/pos_sc_02.jpg"/>
@ -174,56 +178,88 @@
</div>
</div>
</div>
-->
</body>
</html>
</template>
<template id="homepage">
<t t-call="website.layout">
<div>
<section class="oe_container">
<div class="oe_row oe_spaced oe_dark">
<div class="oe_span12">
<h2 class="oe_slogan">I'm your home page, please edit me...</h2>
<h3 class="oe_slogan">I'm a motto please edit me...</h3>
</div>
<div class="oe_span6">
<div class="oe_demo oe_picture oe_screenshot">
<a href="#">
<img src="https://www.openerp.com/apps/point_of_sale/pos_sc_02.jpg"/>
</a>
</div>
</div>
<div class="oe_span6">
<p class='oe_mt32'>
Here you can describoe you company...
OpenERP's Point of Sale introduces a super
clean interface with no installation required
that runs online and offline on modern
hardwares.
</p>
<p>
It's full integration with the company
inventory and accounting, gives you real time
statistics and consolidations amongst all shops
without the hassle of integrating several
applications.
</p>
<div class="oe_centeralign oe_websiteonly">
<a href="http://www.openerp.com/start" class="oe_button oe_big oe_tacky">Start your <span class="oe_emph">free</span> trial</a>
</div>
</div>
</div>
</section>
</div>
<div class="container">
<section class="container">
<div class="row">
<div class="span12">
<h1></h1>
<div class="span12 text-center">
<h1 class='mt64'>Welcome To Your New Homepage,</h1>
<h2 class='mt32 subheader'>where <b><em>everything</em></b> can be customized </h2>
</div>
</div>
</section>
<div class='dark mt64'>
<section class="container">
<div class="row">
<div class="span5">
<img class='img-rounded' src="/website/static/src/img/island.jpg"/>
</div>
<div class="span6 offset1">
<p class='mt16'>
Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua. Ut enim ad minim veniam, quis nostrud exercitation
ullamco laboris nisi ut aliquip ex ea commodo consequat.
</p>
<p>
Duis aute irure dolor in reprehenderit in voluptate velit
esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa qui officia
deserunt mollit anim id est laborum
</p>
<div class="text-center">
<a href="http://www.openerp.com/start" class="btn mt16 btn-large btn-primary">Call To <em>Action</em></a>
</div>
</div>
</div>
</section>
</div>
<section class="container">
<div class="row">
<div class="span12 text-center">
<h2 class='mt48'>Ut enim ad minim veniam</h2>
</div>
</div>
<div class="row mt32">
<div class="span4">
<img class='img-rounded' src="/website/static/src/img/china_thumb.jpg"/>
<h4 class='mt16'>Cillum Dolore</h4>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua. Ut enim ad minim veniam, quis nostrud exercitation
ullamco laboris nisi ut aliquip ex ea commodo consequat.
</p>
</div>
<div class="span4">
<img class='img-rounded' src="/website/static/src/img/desert_thumb.jpg"/>
<h4 class='mt16'>Mollit Anim</h4>
<p>
Duis aute irure dolor in reprehenderit in voluptate velit
esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa qui officia
deserunt mollit anim id est laborum
</p>
</div>
<div class="span4">
<img class='img-rounded' src="/website/static/src/img/deers_thumb.jpg"/>
<h4 class='mt16'>Nemo Enim Ipsam</h4>
<p>
Sed ut perspiciatis unde omnis iste natus error sit voluptatem
accusantium doloremque laudantium, totam rem aperiam, eaque ipsa
quae ab illo inventore veritatis et quasi architecto beatae vitae
dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas
</p>
</div>
</div>
</section>
</t>
</template>
@ -246,7 +282,7 @@
<div class="container">
<div class="row">
<div class="span12">
<h1 class="oe_slogan">404: Page not found!</h1>
<h1>404: Page not found!</h1>
<p class="oe_grey">
The page you were looking for could not be
found; it is possible you have typed the
@ -276,8 +312,8 @@
<t t-call="website.layout">
<t t-set="title">Contact us - <t t-esc="res_company.name"/></t>
<div class="container">
<div class="oe_row">
<h2 class="oe_slogan">Contact us</h2>
<div class="row">
<h2>Contact us</h2>
</div>
<div class="row">
<div class="span8">