add full width

app_web_fullwidth/static/description/index.html

@@ -0,0 +1,91 @@
+<section class="oe_container">
+    <div class="oe_row oe_spaced" style="max-width: 95%;">
+        <div class="oe_span12">
+            <h2 class="oe_slogan">App Web Responsive Fullwidth(form view fullwidth)</h2>
+            <div class="alert alert-info" style="padding:8px;font-weight: 300; font-size: 20px;">
+                <i class="fa fa-hand-o-right"></i><b> Key features: </b>
+                <ul class="list-unstyled">
+                    <li>
+                        <i class="fa fa-check-square-o text-primary"></i>
+                        Show the form view into full width, More screen show about 30%.
+                    </li>
+                    <li>
+                        <i class="fa fa-check-square-o text-primary"></i>
+                        Form view Responsive full width (fullwidth)
+                    </li>
+                    <li>
+                        <i class="fa fa-check-square-o text-primary"></i>
+                        Ready for small, medium, large, extra large screen.
+                    </li>
+                    <li>
+                        <i class="fa fa-check-square-o text-primary"></i>
+                        Ready for enterprise and communicate version.
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+    <div class="oe_row oe_spaced" style="max-width: 95%;">
+        <div class="oe_demo"
+             style="margin: 20px auto; padding: 0 15px 0 0; border:none; border-top:solid 1px #dedede; width: 96%;">
+            <h2 class='oe_mt32'>Small screen. With or without this module</h2>
+        </div>
+        <div class="oe_demo oe_screenshot">
+            <img src="demo_s.png" style="border:1px solid black"/>
+            <br/>
+        </div>
+    </div>
+    <div class="oe_row oe_spaced" style="max-width: 95%;">
+        <div class="oe_demo"
+             style="margin: 20px auto; padding: 0 15px 0 0; border:none; border-top:solid 1px #dedede; width: 96%;">
+            <h2 class='oe_mt32'>Medium screen. With or without this module</h2>
+        </div>
+        <div class="oe_demo oe_screenshot">
+            <img src="demo_m.png" style="border:1px solid black"/>
+            <br/>
+        </div>
+    </div>
+    <div class="oe_row oe_spaced" style="max-width: 95%;">
+        <div class="oe_demo"
+             style="margin: 20px auto; padding: 0 15px 0 0; border:none; border-top:solid 1px #dedede; width: 96%;">
+            <h2 class='oe_mt32'>Large and extra large screen. Perfect for lots of columns.</h2>
+        </div>
+        <div class="oe_demo oe_screenshot">
+            <img src="demo_l_1.jpg" style="border:1px solid black"/>
+            <br/>
+        </div>
+    </div>
+</section>
+
+
+<section class="oe_container oe_dark">
+    <div class="oe_row oe_spaced text-center">
+        <div class="oe_span12">
+            <h2 class="oe_slogan">Technical Help & Support</h2>
+        </div>
+        <div class="col-md-12 pad0">
+            <div class="oe_mt16">
+                <p><h4>
+                For any type of technical help & support requests, Feel free to contact us</h4></p>
+                <a style="background: #002e5a  none repeat scroll 0% 0%; color: rgb(255, 255, 255);position: relative; overflow: hidden;"
+                   class="btn btn-warning btn-lg" rel="nofollow" href="mailto:guohuadeng@hotmail.com"><span
+                        style="height: 354px; width: 354px; top: -147.433px; left: -6.93335px;" class="o_ripple"></span>
+                    <i class="fa fa-envelope"></i> guohuadeng@hotmail.com</a>
+                <p><h4>
+                Via QQ: 300883 (App user would not get QQ or any other IM support. Only for odoo project customize.)</h4></p>
+                <a style="background: #002e5a  none repeat scroll 0% 0%; color: rgb(255, 255, 255);position: relative; overflow: hidden;"
+                   class="btn btn-warning btn-lg" rel="nofollow" href="mailto:300883@qq.com"><span
+                        style="height: 354px; width: 354px; top: -147.433px; left: -6.93335px;" class="o_ripple"></span>
+                    <i class="fa fa-envelope"></i> 300883@qq.com</a>
+            </div>
+            <div class="oe_mt16">
+                <h4>
+                Visit our website for more support.</h4>
+<h4>https://www.sunpop.cn</h4>
+            </div>
+        </div>
+    </div>
+</section>
+
+<section class="oe_container oe_separator">
+</section>

app_web_fullwidth/static/src/scss/style.scss

@@ -0,0 +1,87 @@
+//xs: 0,
+//vsm: 475px,
+//sm: 576px,
+//md: 768px,
+//lg: 992px,
+//xl: 1200px,
+//xxl: 1534px,
+
+/*
+sheet全宽
+*/
+@media (min-width: 576px) {
+    .o_form_view .o_form_sheet_bg > .o_form_sheet {
+        max-width: 98% !important;
+    }
+}
+//将原来 768时的 flex 调整为1200才flex
+.o_form_view {
+    @include media-breakpoint-up(md) {
+        display: block;
+    }
+    @include media-breakpoint-up(xl) {
+        display: flex;
+    }
+}
+
+@media (min-width: 768px) {
+    .o_form_view .o_form_sheet_bg > .o_form_sheet {
+        max-width: 98% !important;
+    }
+}
+@media (min-width: 1200px) {
+    .o_form_view .o_form_sheet_bg > .o_form_sheet {
+        max-width: 960px !important;
+    }
+    .o_content .o_view_controller > div, .modal-content .o_view_controller > div    {
+        flex-direction: row;
+    }
+}
+@media (min-width: 1534px) {
+    .o_form_view .o_form_sheet_bg > .o_form_sheet {
+        max-width: 98% !important;
+    }
+}
+//xs: 0,
+//vsm: 475px,
+//sm: 576px,
+//md: 768px,
+//lg: 992px,
+//xl: 1200px,
+//xxl: 1534px,
+
+/*
+不将chatter显示在右边，form全宽
+*/
+//将原来 768时的 flex 调整为一直不flex
+.o_form_view {
+    @include media-breakpoint-up(md) {
+        display: block;
+    }
+    @include media-breakpoint-up(xl) {
+        display: block;
+        .o_form_sheet_bg > .o_form_sheet {
+            max-width: 98% !important;
+        }
+    }
+    @include media-breakpoint-up(xxl) {
+        display: block;
+        .oe_chatter {
+            width: auto;
+            max-width: 1474px;
+        }
+    }
+    .o_form_sheet_bg {
+        width: auto;
+    }
+}
+
+//debug model 时处理
+.modal-lg {
+    .o_debug_manager {
+        .dropdown-menu-right {
+            right: auto;
+            left: 0;
+        }
+    }
+}