odoo
/
odoo
2
0
Fork 0
Code Pull Requests Releases Activity

[FIX] wesbite: banner - remove css and use bootstrap for positionning. Now hidden-xs works, we don't lost 50% of width 

bzr revid: jke@openerp.com-20140414142631-k78shkqjqdtcnp83
This commit is contained in:
Kersten Jeremy 2014-04-14 16:26:31 +02:00
parent 6b020549f8 f3e405fbe1
commit afc2685cee
4 changed files with 30 additions and 137 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
addons/website/static/src/css/website.css
View File

@ -1,3 +1,4 @@
@charset "utf-8";
/* THIS CSS FILE IS FOR WEBSITE THEMING CUSTOMIZATION ONLY
*
* css for editor buttons, openerp widget included in the website and other
@ -305,69 +306,6 @@ ul.nav-stacked > li > a {
background-size: cover;
}
.carousel .carousel-caption {
position: absolute;
right: 50%;
left: 50%;
bottom: 20px;
}
.carousel .carousel-caption > div {
position: absolute;
text-align: left;
padding: 20px;
background: rgba(0, 0, 0, 0.4);
bottom: 20px;
}
.carousel .carousel-caption h1, .carousel .carousel-caption h2, .carousel .carousel-caption h3 {
margin-top: 10px;
margin-bottom: 10px;
}
.carousel .carousel-image {
top: 5%;
bottom: 5%;
position: absolute;
max-height: 90%;
margin: 0 auto;
}
.carousel .item.text_only .carousel-image {
display: none !important;
}
.carousel .item.text_only .carousel-caption {
left: 10%;
right: 10%;
top: 10%;
bottom: auto;
}
.carousel .item.text_only .carousel-caption > div {
text-align: center;
background: transparent;
bottom: auto;
width: 100%;
}
.carousel .item.text_image .carousel-caption {
left: 10%;
}
.carousel .item.text_image .carousel-caption > div {
right: 50%;
margin-right: -20%;
max-width: 550px;
}
.carousel .item.text_image .carousel-image {
right: 10%;
left: 50%;
}
.carousel .item.image_text .carousel-caption {
right: 10%;
}
.carousel .item.image_text .carousel-caption > div {
left: 50%;
margin-left: -20%;
max-width: 550px;
}
.carousel .item.image_text .carousel-image {
right: 50%;
left: 10%;
}
.carousel .carousel-control {
cursor: pointer;
}
@ -410,6 +348,16 @@ div.carousel .carousel-indicators li {
div.carousel .carousel-indicators .active {
background-color: grey;
}
div.carousel span.carousel-img img, div.carousel div.carousel-content {
max-height: 95%;
padding: 10px;
}
div.carousel div.carousel-content {
background-color: black;
color: white;
background: rgba(0, 0, 0, 0.3);
margin-top: 75px;
}
.parallax {
background-size: cover;

61
addons/website/static/src/css/website.sass
View File

@ -250,59 +250,6 @@ ul.nav-stacked > li > a
height: 100%
background-size: cover
.carousel
.carousel-caption
position: absolute
right: 50%
left: 50%
bottom: 20px
> div
position: absolute
text-align: left
padding: 20px
background: rgba(0, 0, 0, 0.4)
bottom: 20px
h1, h2, h3
margin-top: 10px
margin-bottom: 10px
.carousel-image
top: 5%
bottom: 5%
position: absolute
max-height: 90%
margin: 0 auto
.item.text_only
.carousel-image
display: none !important
.carousel-caption
left: 10%
right: 10%
top: 10%
bottom: auto
> div
text-align: center
background: transparent
bottom: auto
width: 100%
.item.text_image
.carousel-caption
left: 10%
> div
right: 50%
margin-right: -20%
max-width: 550px
.carousel-image
right: 10%
left: 50%
.item.image_text
.carousel-caption
right: 10%
> div
left: 50%
margin-left: -20%
max-width: 550px
.carousel-image
right: 50%
left: 10%
.carousel-control
cursor: pointer
span
@ -338,6 +285,14 @@ div.carousel
border: 1px solid grey
.active
background-color: grey
span.carousel-img img, div.carousel-content
max-height: 95%
padding: 10px
div.carousel-content
background-color: black
color: white
background: rgba(0, 0, 0, 0.3)
margin-top: 75px
.parallax
background-size: cover

2
addons/website/static/src/js/website.snippets.editor.js
View File

@ -934,7 +934,7 @@
drop_and_build_snippet: function() {
this.id = this.unique_id();
this.$target.attr("id", this.id);
this.$target.find("[data-slide]").attr("data-target", "#" + this.id);
this.$target.find("[data-slide]").attr("data-cke-saved-href", "#" + this.id);
this.$target.find("[data-slide-to]").attr("data-target", "#" + this.id);
this.rebind_event();

30
addons/website/views/snippets.xml
View File

@ -26,16 +26,18 @@
<div class="carousel-inner">
<div class="item image_text active" style="background-image: url('/website/static/src/img/banner/color_splash.jpg')">
<div class="container">
<div class="carousel-caption content">
<div>
<h2>Your Banner Title</h2>
<h3>Click to customize this text</h3>
<p>
<a href="/page/website.contactus" class="btn btn-success btn-large">Contact us</a>
</p>
<div class="row content">
<div class="carousel-content col-md-6 col-sm-12">
<h2>Your Banner Title</h2>
<h3>Click to customize this text</h3>
<p>
<a href="/page/website.contactus" class="btn btn-success btn-large">Contact us</a>
</p>
</div>
<span class="carousel-img col-md-6 hidden-sm hidden-xs">
<img class="carousel-image img-responsive" src="/website/static/src/img/banner/banner_picture.png" alt="Banner OpenERP Image"/>
</span>
</div>
<img class="carousel-image hidden-xs" src="/website/static/src/img/banner/banner_picture.png" alt="Banner OpenERP Image"/>
</div>
</div>
</div>
@ -900,18 +902,6 @@
</li>
</div>
<div data-snippet-option-id='carousel-style'
data-selector=".carousel:not(.quotecarousel)">
<li class="dropdown-submenu" data-required="true">
<a tabindex="-1" href="#">Layout</a>
<ul class="dropdown-menu">
<li data-value="text_only"><a>Text Only</a></li>
<li data-value="image_text"><a>Image - Text</a></li>
<li data-value="text_image"><a>Text - Image</a></li>
</ul>
</li>
</div>
<div data-snippet-option-id='carousel'
data-selector=".carousel">
<li class="divider"></li>