[ADD] theme 8.0

2021-05-11 15:41:12 +02:00
commit 51c615247e
3583 changed files with 121845 additions and 0 deletions
@@ -0,0 +1,211 @@
+<section class="container">
+    <h2 class="text-muted">Html5 Responsive Bootstrap Theme for Odoo CMS</h2>
+    <hr>
+
+    <p class="lead">Loftspace is a professional responsive HTML5 theme, built using Bootstrap3,
+        the most popular front-end framework for developing responsive, mobile
+        first projects on the web. Just drag &amp; drop the new building blocks
+        you need to easily build your layout. All layouts are made of sections,
+        that you can easily combine to fit your specific project.</p>
+    <img src="loftspace_description.png" class="img-responsive center-block"/>
+    <hr>
+
+    <h2 class="text-muted">Loftspace Customization Tool</h2>
+
+    <p>Theme Loftspace comes with customization tools.&nbsp;You can easily change
+        the background, the colors and the font combination of your website or
+        you a preset.</p>
+
+    <div class="row">
+        <div class="col-md-4">
+            <img src="customtool.jpg" class="img-responsive center-block"/>
+        </div>
+        <div class="col-md-8">
+            <h3>Theme Loftspace comes with a lot of options</h3>
+            <ul>
+                <li>WIDE OR BOXED LAYOUT</li>
+                <li>6 COLOR SCHEMES</li>
+                <li>8 BACKGROUND SHADES OR USE YOUR OWN</li>
+                <li>6 FONT COMBINATIONS</li>
+                <li>10 BACKGROUND PATTERNS</li>
+            </ul>
+            <p>All the background, color and font combinations were made to work together.&nbsp;
+                You&nbsp;can not go wrong with the settings.</p>
+
+            <h3>Minimalistic Flat Design</h3>
+            <p>Loftspace was made with easy customization and branding in mind. Based on
+                simple, modern and typographical elements, it allows you to easily customize
+                your website.</p>
+
+            <h3>6 Prebuild Presets</h3>
+            <p>You don't have the time to play with options? Don't worry, Loftspace gives
+                you six full presets wich combine colors, fonts and background.</p>
+
+            <p>This theme has an <a href="https://apps.odoo.com/apps/8.0/theme_loftspace_sale/">additional eCommerce plugin</a>.</p>
+        </div>
+    </div>
+    <hr>
+
+    <h2 class="text-muted">Loftspace Building Blocks</h2>
+    
+    <p>You get a new complete range of building blocks.</p>
+
+    <div class="row">
+        <div class="col-md-4">
+            <h4 class="text-muted">CONTENT BLOCKS</h4>
+            <ul class="mb16">
+                <li>Title</li>
+                <li>1 Column Text</li>
+                <li>2 Column Text</li>
+                <li>3 Column Text</li>
+                <li>4 Column Text</li>
+                <li>Custom Button</li>
+                <li>Separator Block</li>
+            </ul>
+            <h4 class="text-muted mb16">STRUCTURE BLOCKS</h4>
+            <ul class="mb16">
+                <li>Custom Banner</li>
+                <li>Big Picture + Text</li>
+                <li>Text + Big Picture</li>
+                <li>Cubes</li>
+                <li>Cubes Reversed</li>
+                <li>Features Slideshow</li>
+                <li>Header + Text + Picture</li>
+                <li>Product List</li>
+                <li>Text + Image + Text</li>
+                <li>Parallax Banner</li>
+                <li>2 Color Blocks</li>
+                <li>4 Color Blocks</li>
+                <li>Numbers</li>
+                <li>Timeline</li>
+                <li>Event List</li>
+                <li>Logos Bar</li>
+                <li>Testimonial Slider</li>
+                <li>Progress</li>
+                <li>Big Circle Icons</li>
+            </ul>
+        </div>
+        <div class="col-md-4">
+            <h4 class="text-muted">FEATURES BLOCKS</h4>
+            <ul class="mb16">
+                <li>Slide Banner</li>
+                <li>Slideshow with products</li>
+            </ul>
+            <h4 class="text-muted">EFFECTS BLOCKS</h4>
+            <ul class="mb16">
+                <li>Big Image Parallax</li>
+            </ul>
+        </div>
+        <div class="col-md-4">
+            <h3>Customize Your Blocks</h3>
+            <p class="mb16">Each building blocks comes with its own options.&nbsp;</p>
+            <img src="customtool2.jpg" class="img-responsive center-block"/>
+        </div>
+    </div>
+
+    <p>Some fonts might not work with extended charsets.</p>
+    <p>The images in the theme are copyrighted and can't be used outside of the odoo.com domain.</p>
+    <hr>
+
+    <h1 class="text-center">CONTRIBUTORS LIST</h1>
+    <br/>
+    <p class="strong text-center">This theme was created with the help of our user community.</p>
+
+    <h3 class="text-center">Thanks to our backers the Indiegogo campaign was a success!</h3>
+    <p class="text-center"><a>https://www.indiegogo.com/projects/bootstrap-themes-for-odoo-cms/</a></p>
+    <br/>
+
+    <h1 class="text-center"><u>Main Sponsor</u></h1>
+    <br/>
+    <div class="row">
+        <div class="col-md-2">
+            <a href="http://www.aselcis.com/" target="blank">
+                <img src="contributors/aselcis.jpg" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="http://www.bas-solutions.nl/" target="blank">
+                <img src="contributors/bas-solutions.png" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="http://www.bloopark.de/" target="blank">
+                <img src="contributors/bloopark.png" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="http://www.brouwland.com" target="blank">
+                <img src="contributors/brouwland.jpg" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="http://www.catsanddogs.com/" target="blank">
+                <img src="contributors/catsdogs.png" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="https://www.hucke-media.de/" target="blank">
+                <img src="contributors/huckemedia.png" class="img-responsive center-block"/>
+            </a>
+        </div>
+    </div>
+    <div class="row">
+        <div class="col-md-2">
+            <a href="http://www.datadialog.net/" target="blank">
+                <img src="contributors/dialognet.png" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="http://www.dynapps.be/" target="blank">
+                <img src="contributors/dynapps.jpg" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="http://opusvl.com/" target="blank">
+                <img src="contributors/opusvl.png" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="http://oxenworkwear.com/" target="blank">
+                <img src="contributors/oxen.jpg" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="http://www.simplit.co/" target="blank">
+                <img src="contributors/simplitco.jpg" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="http://www.sodexis.com/" target="blank">
+                <img src="contributors/sodexis.jpg" class="img-responsive center-block"/>
+            </a>
+        </div>
+    </div>
+    <div class="row" style="margin-bottom:30px;">
+        <div class="col-md-2 col-md-offset-3">
+            <a href="https://www.techreceptives.com" target="blank">
+                <img src="contributors/tech-receptives.png" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="http://www.applicatour.com/" target="blank">
+                <img src="contributors/applicatour.jpg" class="img-responsive center-block"/>
+            </a>
+        </div>
+        <div class="col-md-2">
+            <a href="https://vauxoo.com" target="blank">
+                <img src="contributors/vauxoo.png" class="img-responsive center-block"/>
+            </a>
+        </div>
+    </div>
+
+    <p>Ross Whiting, Oxenworkwear - Hans Balis - Stephan Keller, Sodexis, Inc. - Michael Hucke, Hucke Media GmbH & Co. KG - Joachim Grubelnik, DaDi EDV GmbH datadialog.net - DynApps - Cats&Dogs bvba - Bloopark systems GmbH & Co. KG - Parthiv Patel, Tech Receptives Solutions Pvt. Ltd. - Stuart Mackintosh, OpusVL - Erwin van der Ploeg, BAS Solutions - ali Zuaby, simplit co - Aselcis Consulting - Nhomar Hernandez, Vauxoo</p>
+
+    <h1 class="text-center"><u>Sponsor</u></h1>
+    <br/>
+    <p>Robert Baumgartner, datenpol gmbh - openBIG - Russell Phillippe, Protogenos Ltd - Julien Allo, Julius - EasyPME - Jonathan Wilson, WillowIT Pty Ltd - Xavier Mallein, MAallein - Pedro M. Baeza, Serv. Tecnol. Avanzados - Daniel Dico, OERP Canada - Jantz Business Group b.v. - LogicaSoft Consulting  - Eric Caudal, Elico Corp - Ermin Trevisan, Twanda - Jean-François Mattler, OpenFid SAS - Alex Ferrer, Lannex IT Solutions - Tony Gu, Shine IT Co. Ltd. 先安科技 - TaPo-IT OG - Jos De Graeve, Apertoso - Nicolas Rigo, eezee-it - Luis Miguel Varón E, Colorisa S.A - OpenBias - Stanislas Drouin Applicatour</p>
+
+    <h1 class="text-center"><u>Power Designer</u></h1>
+    <br/>
+    <p>Rohit Thakral - François Dhommeaux, Ubic Informatique - Judson Alves, Market Home Delivery - Eric Flaux, ABF Osiell - Gilles Dupont - Arnis Putniņš - Johnson Martt, GetOpenERP (Part of OpenStow Technologies) - Gianluca Milano - Daniel Stolovich, ATEL S.A. - Equitania Software GmbH - Senthilnathan G - Houssine Bakkali - Arend Trip - Kevin Woolf, Baba Kevin's American Barbecue Co., Ltd. - toodoo sàrl - Zoltan Gabor 'Apersis' - Tom De Decker, WEB2GO LTD - Nicolás Cavalier Montenegro, STOREGUD CORPORATION SAC - Keirse Jerome - REAL Solutions S.A. - Davide Corio - Brice Muangkhot - Melvin Miguel Martinez, Mendoza Hernandez - Auditores - Chua Wen Ching - Tran Minh Tri working, ungdungtinhoc.com - Badisheng Morena - Sogexis - Josh Wardini - The Tee Shirt Bakery - Bruce Letterle, Red Lab Media - Benoit Vankoningsloo - Francisco Manuel Garcia Claramonte. - Paulina Mikolajczak-Blasco - Collectiv - Tony Fernando - Herbert Riener, rigaConcepts - Kalmen Chia, E-Global SCM Solution Sdn Bhd - Rob North, Pair A Dice Games - David E. Vargas, CloudShop - François Le Gal - Calin Chete (24h Solutions) - Maria Gabriela Fong, MAGA Systems & Consulting - Pascal Behr, Cytosurge AG - Marc Antwertinger - Opencloud Unipessoal, Lda - Ruchir Shukla, BizzAppDev - Michael Hucke, Hucke Media GmbH & Co. KG - Mathias Neef, copadoMEDIA UG - Pablo Arias - Same Motion - livingprocess.de - Habib Ayob - Igor Jovanovic - Liangming Wang, Weixuan Inc. - Jason Au Yeung, Binary System Limited - Fredrik Arvas, Arvas International AB - Martin Temmink, Zigaret - Mathieu Vanneste, Flockdesign - Filip Fruru, Instant Media - Marianne Wilmsmeier, Fabrik Fünf GmbH - Vertex Group Enterprises - Bingen Eguzkitza - Herczeg Péter, InnOpen Group Kft  - Giles Hohnen - Luis Felipe Miléo, KMEE - Maria Gabriela Fong, MAGA Systems & Consulting - Aaron Magon, Web Industries - Andrew Trueman, B.M. Trueman & Partners - Sven Petersen, Conexus - Nous Cambas - Oliver Yuan, OpenStone - Henri Ibowili, A-YANT.COM - Nicolas JEUDY - Helmut Drewes - Maik Steinfeld, Streward - Hans Henrik Gabelgaard - AJ Rosman - Eduard - Patrick Darribet, SUDOKEYS - Camptocamp - Cyril Morisse - Alejandro Santana - Eva Pinter, YBO - Mathias Neef, copadoMEDIA UG - Jean-Christophe Perrot, LOGICASOFT - Zarshed Ali, HiTechnologia - Stefan Reisich - Maxime Chambreuil, Savoir-faire Linux - Mario Gielissen, Openworx - Nicholas Burdic, Aptoworks LLC - Olivier Lenoir</p>
+</section>
@@ -0,0 +1,71 @@
+(function () {
+    'use strict';
+
+    var website = openerp.website;
+
+    // Set custom background image from modal
+    website.Theme.include({
+        start: function () {
+            this._super();
+            this.$el.find('label:has(input[data-xmlid="theme_loftspace.option_bg_custom"])').on('mouseup', _.bind(this.set_custom_bg, this));
+        },
+        change_selection: function (event, force) {
+            var self = this;
+            if (!force && (event.originalEvent && $(event.target).is('input[data-xmlid="theme_loftspace.option_bg_custom"]'))) {
+                this.set_custom_bg(event);
+                return;
+            }
+
+            this._super(event);
+        },
+        set_custom_bg: function (event) {
+            var self = this;
+
+            clearTimeout(this.set_custom_bg_time);
+            this.set_custom_bg_time = setTimeout(function () {
+
+                var $image = $('<img>');
+                var element = new CKEDITOR.dom.element($image[0]);
+                var editor = new website.editor.MediaDialog({}, element);
+
+                $image.on('saved', this, function () {
+                    var src = $image.attr('src');
+
+                    self.$el.addClass("loading");
+
+                    openerp.jsonRpc('/web/dataset/call', 'call', {
+                        model: 'ir.model.data',
+                        method: 'get_object_reference',
+                        args: ["theme_loftspace", "option_bg_custom"],
+                    }).then(function (data) {
+
+                        openerp.jsonRpc('/web/dataset/call', 'call', {
+                            model: 'ir.ui.view',
+                            method: 'save',
+                            args: [
+                                data[1],
+                                "body{background-image: url('"+src+"'); background-size: cover; background-position: top center;}",
+                                "//style",
+                                website.get_context()],
+                        }).then(function () {
+
+                            self.$el.removeClass("loading");
+                            self.change_selection(event, true);
+                        });
+
+                    });
+
+                });
+
+                editor.on('cancel', this, function () {
+                    if(typeof callback === "function") {
+                        callback();
+                    }
+                });
+
+                editor.appendTo(document.body);
+
+            },0);
+        }
+    });
+})();
@@ -0,0 +1,148 @@
+/* =====================  BLOG ===================== */
+
+#blog_right_column {
+    padding: 0 15px 35px 30px;
+}
+.website_blog {
+    .col-sm-8 {
+        padding: 0 15px 30px 35px;
+    }
+}
+.post-meta {
+    margin-top: 20px;
+    text-align: left;
+}
+.blog_title {
+    .post-meta {
+        text-align: center;
+    }
+}
+#main_column {
+    h4 {
+        font-size: 18px;
+    }
+    h2 {
+        font-size: 25px;
+    }
+}
+
+/* =====================  FORUM ===================== */
+
+.website_forum {
+    background-color: @color-eta;
+    margin-top: 0px !important;
+    width: 100%;
+    padding: 0;
+    .navbar-default {
+        margin-bottom: 0px;
+        border-radius: 0;
+        .navbar-nav > li > a, .navbar-header span {
+            color: @color-delta;
+        }
+        .navbar-right {
+            margin-bottom: 0;
+            .btn {
+                padding: 5px 20px;
+            }
+            input {
+                margin-right: 15px;
+                background-color: rgba(255, 255, 255, 0.5);
+                .transition (background-color 0.3s ease-out);
+                &:focus {
+                    background-color: rgba(255, 255, 255, 1);
+                }
+            }
+        }
+        li.active > a {
+            background-color: @color-zeta !important;
+        }
+    }
+}
+.website_forum + #wrap {
+    padding: 35px;
+    .col-sm-3 {
+        .btn-block {
+            background-color: @color-epsilon;
+            color: white;
+        }
+    }
+    .question {
+        #options button {
+            color: @color-epsilon;
+            &:hover, &:focus {
+                text-decoration: none;
+            }
+        }
+        .oe_grey {
+            background-color: transparent;
+        }
+    }
+}
+.forum_docs {
+    margin-top: 30px;
+    padding: 10px 35px;
+    background-color: white;
+}
+
+/* ============== Breadcrumb in events, job etc ============== */
+
+.breadcrumb {
+    background: transparent;
+    .BorderRadius(0px);
+}
+/* ============== Nav-pills in events, job etc ============== */
+.nav-pills {
+    li a {
+        color: @gray-light;
+        &:hover {
+            color: @gray;
+        }
+    }
+    li.active > a {
+        color: @color-epsilon;
+        background: transparent;
+        &:hover {
+            background-color: @gray-lighter;
+            color: @gray;
+        }
+        .badge {
+            color: @color-alpha;
+            background-color: @color-epsilon;
+        }
+    }
+}
+
+/* ============== Panel styles ============== */
+
+.panel-heading {
+    background-color: transparent !important;
+    border: none;
+    color: @color-epsilon !important;
+}
+.panel-footer {
+    background: transparent;
+}
+.panel {
+    text-align: center;
+    border: none;
+    box-shadow: none;
+    border: 1px solid @gray-lighter;
+    .BorderRadius (0px);
+    .list-group-item {
+        background: transparent;
+        border-color: white;
+    }
+}
+.panel-title {
+    font-size: 20px;
+}
+
+/* =====================  DOCUMENTATION ===================== */
+
+[data-view-xmlid*="website_forum_doc.documentation_post"] { 
+    .container:first-child {
+        margin-bottom: 0px !important;
+        height: 90px;
+        padding-top: 20px;
+    }
+}
@@ -0,0 +1,185 @@
+/* ================== BOOTSTRAP GRAYS ================= */
+
+@gray-darker:   lighten(#000, 13.5%); // #222
+@gray-dark:     lighten(#000, 20%);   // #333
+@gray:          lighten(#000, 33.5%); // #555
+@gray-light:    lighten(#000, 46.7%); // #777
+@gray-lighter:  lighten(#000, 85%); // #eee
+@white:         #ffffff;
+@black:         #000000;
+
+/* ================== COLOR PRESET 1 ================= */
+
+@colorPreset1_color1:           #e9e9e9; // light gray
+@colorPreset1_color1_dark:      darken(@colorPreset1_color1, 10%);
+@colorPreset1_color1_light:     lighten(@colorPreset1_color1, 5%);
+@colorPreset1_color2:           #c8efeb; // light turkquise
+@colorPreset1_color2_dark:      darken(@colorPreset1_color2, 10%);
+@colorPreset1_color2_light:     lighten(@colorPreset1_color2, 5%);
+@colorPreset1_color3:           #1e222f; // Dark blue
+@colorPreset1_color3_dark:      darken(@colorPreset1_color3, 10%);
+@colorPreset1_color3_light:     lighten(@colorPreset1_color3, 10%);
+@colorPreset1_color4:           #55e8da; // turquise
+@colorPreset1_color4_dark:      darken(@colorPreset1_color4, 10%);
+@colorPreset1_color4_light:     lighten(@colorPreset1_color4, 5%);
+
+/* ================== COLOR PRESET 2 ================= */
+
+@colorPreset2_color1:           #dbe8ed; // light blue
+@colorPreset2_color1_dark:      darken(@colorPreset2_color1, 10%);
+@colorPreset2_color1_light:     lighten(@colorPreset2_color1, 5%);
+@colorPreset2_color2:           #ecd5d6; // light rose
+@colorPreset2_color2_dark:      darken(@colorPreset2_color2, 10%);
+@colorPreset2_color2_light:     lighten(@colorPreset2_color2, 10%);
+@colorPreset2_color3:           #590046; // purple
+@colorPreset2_color3_dark:      darken(@colorPreset2_color3, 10%);
+@colorPreset2_color3_light:     lighten(@colorPreset2_color3, 10%);
+@colorPreset2_color4:           #df699c; // rose
+@colorPreset2_color4_dark:      darken(@colorPreset2_color4, 10%);
+@colorPreset2_color4_light:     lighten(@colorPreset2_color4, 5%);
+
+/* ================== COLOR PRESET 3 ================= */
+
+@colorPreset3_color1:           #d3d3d3; // gray
+@colorPreset3_color1_dark:      darken(@colorPreset3_color1, 10%);
+@colorPreset3_color1_light:     lighten(@colorPreset3_color1, 5%);
+@colorPreset3_color2:           #f2ef1a; // yellow
+@colorPreset3_color2_dark:      darken(@colorPreset3_color2, 10%);
+@colorPreset3_color2_light:     lighten(@colorPreset3_color2, 10%);
+@colorPreset3_color3:           #000000; // black
+@colorPreset3_color3_dark:      darken(@colorPreset3_color3, 10%);
+@colorPreset3_color3_light:     lighten(@colorPreset3_color3, 10%);
+@colorPreset3_color4:           #f1aa6b; // orange
+@colorPreset3_color4_dark:      darken(@colorPreset3_color4, 10%);
+@colorPreset3_color4_light:     lighten(@colorPreset3_color4, 5%);
+
+/* ================== COLOR PRESET 4 ================= */
+
+@colorPreset4_color1:           #cfcfcf; // light gray
+@colorPreset4_color1_dark:      darken(@colorPreset4_color1, 10%);
+@colorPreset4_color1_light:     lighten(@colorPreset4_color1, 5%);
+@colorPreset4_color2:           #2e2e2e; // middle gray
+@colorPreset4_color2_dark:      darken(@colorPreset4_color2, 10%);
+@colorPreset4_color2_light:     lighten(@colorPreset4_color2, 10%);
+@colorPreset4_color3:           #000000; // dark gray  
+@colorPreset4_color3_dark:      darken(@colorPreset4_color3, 10%);
+@colorPreset4_color3_light:     lighten(@colorPreset4_color3, 10%);
+@colorPreset4_color4:           #1ad68f; // green
+@colorPreset4_color4_dark:      darken(@colorPreset4_color4, 10%);
+@colorPreset4_color4_light:     lighten(@colorPreset4_color4, 5%);
+
+/* ================== COLOR PRESET 5 ================= */
+
+@colorPreset5_color1:           #9fcae2; // light green
+@colorPreset5_color1_dark:      darken(@colorPreset5_color1, 10%);
+@colorPreset5_color1_light:     lighten(@colorPreset5_color1, 5%);
+@colorPreset5_color2:           #bbc05c; // middle green
+@colorPreset5_color2_dark:      darken(@colorPreset5_color2, 10%);
+@colorPreset5_color2_light:     lighten(@colorPreset5_color2, 10%);
+@colorPreset5_color3:           #112625; // dark green
+@colorPreset5_color3_dark:      darken(@colorPreset5_color3, 10%);
+@colorPreset5_color3_light:     lighten(@colorPreset5_color3, 10%);
+@colorPreset5_color4:           #45b08c; // mallow
+@colorPreset5_color4_dark:      darken(@colorPreset5_color4, 10%);
+@colorPreset5_color4_light:     lighten(@colorPreset5_color4, 5%);
+
+/* ================== COLOR PRESET 6 ================= */
+
+@colorPreset6_color1:           #cdd0a2; // green
+@colorPreset6_color1_dark:      darken(@colorPreset6_color1, 10%);
+@colorPreset6_color1_light:     lighten(@colorPreset6_color1, 5%);
+@colorPreset6_color2:           #b4bbb9; // gray
+@colorPreset6_color2_dark:      darken(@colorPreset6_color2, 5%);
+@colorPreset6_color2_light:     lighten(@colorPreset6_color2, 5%);
+@colorPreset6_color3:           #242327; // black
+@colorPreset6_color3_dark:      darken(@colorPreset6_color3, 10%);
+@colorPreset6_color3_light:     lighten(@colorPreset6_color3, 10%);
+@colorPreset6_color4:           #957985; // purple
+@colorPreset6_color4_dark:      darken(@colorPreset6_color4, 10%);
+@colorPreset6_color4_light:     lighten(@colorPreset6_color4, 5%);
+
+/* ========================= BLACK ========================= */
+
+.black {
+    .SetDisplayColor (@black, @gray-light);
+}
+
+/* ========================= WHITE ========================= */
+
+.white {
+    .SetDisplayColor (@white, @gray);
+}
+
+/* ========================= GRAY ========================= */
+
+.gray {
+    .SetDisplayColor (@gray, @white);
+    h1, h2, h3, h4, h5, h6 {.SetTextShadow (2px, @black);}
+}
+
+/* ========================= LIGHTGRAY ========================= */
+
+.lightgray {
+    .SetDisplayColor (@gray-lighter, @gray);
+    .s_progress {
+        color: red !important;
+    }
+}
+
+/* ========================= DARKGRAY ========================= */
+
+.darkgray {
+    .SetDisplayColor (@gray-dark, @white);
+    h1, h2, h3, h4, h5, h6 {.SetTextShadow (2px, @black);}
+}
+
+/* ================== FONT COLORS IN THE EDITOR ================= */
+
+.js_sale, .oe_website_sale {
+    .text-muted {color: @gray-light;}
+}
+
+.text-blue {color: @black;}
+.bg-blue {background-color: @black;}
+
+.text-turquoise{color: @gray-darker;}
+.bg-turquoise {background-color: @gray-darker;}
+
+.text-green {color: @gray-dark;}
+.bg-green {background-color: @gray-dark;}
+
+.text-yellow {color: @gray;}
+.bg-yellow {background-color: @gray;}
+
+.text-red {color: @gray-light;}
+.bg-red {background-color: @gray-light;}
+
+.text-pink {color: @gray-lighter;}
+.bg-pink {background-color: @gray-lighter;}
+
+.text-purple {color: @white;}
+.bg-purple {background-color: @white;}
+
+.text-blue2 {color: #1e3370;}
+.bg-blue2 {background-color: #1e3370;}
+
+.text-turquoise2 {color: #1993a5;}
+.bg-turquoise2 {background-color: #1993a5;}
+
+.text-green2 {color: #4f8640;}
+.bg-green2 {background-color: #4f8640;}
+
+.text-yellow2 {color: #e6d123;}
+.bg-yellow2 {background-color: #e6d123;}
+
+.text-red2 {color: #c22e2e;}
+.bg-red2 {background-color: #c22e2e;}
+
+.text-lightblue2 {color: #5ea7db;}
+.bg-lightblue2 {background-color: #5ea7db;}
+
+.text-purple2 {color: #8458a7;}
+.bg-purple2 {background-color: #8458a7;}
+
+.text-brown2 {color: #725a4c;}
+.bg-brown2 {color: #725a4c;}
@@ -0,0 +1,400 @@
+/* ================== MODAL COLORS ================= */
+
+@modalGreen: @colorPreset6_color2;
+@modalGreenDark: darken(@modalGreen, 5%);
+@modalGreenLight: lighten(@modalGreen, 15%);
+@modalOrange: @colorPreset5_color1;
+@modalBlue: #151C24;
+@modalLightBlue: lighten(@modalBlue, 20%);
+
+/* ======================= COLOR PRESET 1 ====================== */
+
+#theme_customize_modal .row .colorPreset1 div:nth-child(1) {background-color: @white;}
+#theme_customize_modal .row .colorPreset1 div:nth-child(2) {background-color: @colorPreset1_color1;}
+#theme_customize_modal .row .colorPreset1 div:nth-child(3) {background-color: @colorPreset1_color2;}
+#theme_customize_modal .row .colorPreset1 div:nth-child(4) {background-color: @colorPreset1_color3;}
+#theme_customize_modal .row .colorPreset1 div:nth-child(5) {background-color: @colorPreset1_color4;}
+
+/* ======================= COLOR PRESET 2 ====================== */
+
+#theme_customize_modal .row .colorPreset2 div:nth-child(1) {background-color: @colorPreset2_color1;}
+#theme_customize_modal .row .colorPreset2 div:nth-child(2) {background-color: @colorPreset2_color2;}
+#theme_customize_modal .row .colorPreset2 div:nth-child(3) {background-color: @white;}
+#theme_customize_modal .row .colorPreset2 div:nth-child(4) {background-color: @colorPreset2_color3;}
+#theme_customize_modal .row .colorPreset2 div:nth-child(5) {background-color: @colorPreset2_color4;}
+
+/* ======================= COLOR PRESET 3 ====================== */
+
+#theme_customize_modal .row .colorPreset3 div:nth-child(1) {background-color: @colorPreset3_color1;}
+#theme_customize_modal .row .colorPreset3 div:nth-child(2) {background-color: @colorPreset3_color2;}
+#theme_customize_modal .row .colorPreset3 div:nth-child(3) {background-color: @white;}
+#theme_customize_modal .row .colorPreset3 div:nth-child(4) {background-color: @colorPreset3_color3;}
+#theme_customize_modal .row .colorPreset3 div:nth-child(5) {background-color: @colorPreset3_color4;}
+
+/* ======================= COLOR PRESET 4 ====================== */
+
+#theme_customize_modal .row .colorPreset4 div:nth-child(1) {background-color: @colorPreset4_color1;}
+#theme_customize_modal .row .colorPreset4 div:nth-child(2) {background-color: @colorPreset4_color2;}
+#theme_customize_modal .row .colorPreset4 div:nth-child(3) {background-color: @white;}
+#theme_customize_modal .row .colorPreset4 div:nth-child(4) {background-color: @colorPreset4_color3;}
+#theme_customize_modal .row .colorPreset4 div:nth-child(5) {background-color: @colorPreset4_color4;}
+
+/* ======================= COLOR PRESET 5 ====================== */
+
+#theme_customize_modal .row .colorPreset5 div:nth-child(1) {background-color: @colorPreset5_color1;}
+#theme_customize_modal .row .colorPreset5 div:nth-child(2) {background-color: @colorPreset5_color2;}
+#theme_customize_modal .row .colorPreset5 div:nth-child(3) {background-color: @white;}
+#theme_customize_modal .row .colorPreset5 div:nth-child(4) {background-color: @colorPreset5_color3;}
+#theme_customize_modal .row .colorPreset5 div:nth-child(5) {background-color: @colorPreset5_color4;}
+
+/* ======================= COLOR PRESET 6 ====================== */
+
+#theme_customize_modal .row .colorPreset6 div:nth-child(1) {background-color: @colorPreset6_color1;}
+#theme_customize_modal .row .colorPreset6 div:nth-child(2) {background-color: @colorPreset6_color2;}
+#theme_customize_modal .row .colorPreset6 div:nth-child(3) {background-color: @white;}
+#theme_customize_modal .row .colorPreset6 div:nth-child(4) {background-color: @colorPreset6_color3;}
+#theme_customize_modal .row .colorPreset6 div:nth-child(5) {background-color: @colorPreset6_color4;}
+
+/* ======================= BACKGROUNDS ====================== */
+
+#theme_customize_modal #bgcolor .bg_color_01 {background-color: @colorPreset1_color3;}
+#theme_customize_modal #bgcolor .bg_color_02 {background-color: @colorPreset5_color4;}
+#theme_customize_modal #bgcolor .bg_color_03 {background-color: @colorPreset3_color3;}
+#theme_customize_modal #bgcolor .bg_color_04 {background-color: @colorPreset1_color2;}
+#theme_customize_modal #bgcolor .bg_color_05 {background-color: @colorPreset5_color3;}
+#theme_customize_modal #bgcolor .bg_color_06 {background-color: @colorPreset6_color3;}
+#theme_customize_modal #bgcolor .bg_color_07 {background-color: white;}
+#theme_customize_modal #bgcolor .bg_color_08 {background-color: @colorPreset6_color2;}
+
+/* ================== THEME CUSTOMIZE MODAL =============== */
+
+#theme_customize_modal {
+    label > div, label > img, label > h6, label > h4 {
+        border: none;
+        padding: 3px;
+    }
+    label.checked > div, label.checked > img, label.checked > h6, label.checked > h4 {
+        box-shadow: none;
+        background-color: @modalLightBlue;
+    }
+    h4 {
+        color: @white;
+        text-align: left;
+    }
+    h6 {
+        color: @white;
+    }
+    p {
+        color: @white;
+    }
+    .row {
+        .col-md-2 {
+            padding-right: 0px;
+        }
+    }
+}
+#theme_customize_modal {
+    .modal-header {
+        border-bottom: none;
+    }
+    .nav-tabs > li.active > a, &:hover, &:focus, .nav > li > a:hover, &:focus {
+        background-color: @gray-dark;
+        border: none;
+        color: @modalOrange;
+    }
+}
+.nav-tabs > li > a {
+    margin-right: 0px;
+    &:hover {
+        border-radius: 0px;
+        border: none;
+    }
+}
+.nav-tabs > li > a, .nav > li > a {
+    border-radius: 0px;
+    border: none;
+}
+.modal-dialog .nav > li > a {
+    padding: 15px 5px;
+}
+.modal-h6 {
+    font-size: 30px;
+}
+.interface {
+    width: 350px;
+    margin-top: 20px;
+    position: relative;
+    font-family: "Cuprum-Regular";
+    .left-content {
+        background-color: @modalGreen;
+        width: 70px;
+        padding-left: 0px;
+        .VAlignTop;
+        ul {
+            border: none;
+        }
+    }
+    .right-content {
+        .VAlignTop;
+        padding: 0px;
+        background-color: @gray-dark;
+        .tab-content {
+            overflow-x: hidden;
+            height: 480px;
+        }
+    }
+}
+.close {
+    padding: .2em .4em;
+    color: white;
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    float: right;
+    font-weight: bold;
+    opacity: .9;
+    text-shadow: none;
+}
+.left-content-block a {
+    display: block;
+    min-height: 70px;
+    width: 70px;
+    text-decoration: none;
+    cursor: pointer;
+    color: white;
+    font-size: 12px;
+    &:hover, &:focus, &:active {
+        background-image: none;
+    }
+    span {
+        margin-bottom: 13px;
+    }
+}
+.left-content-block .glyphicon:hover, .glyphicon:focus {
+    color: @modalOrange;
+}
+.glyphicon {
+    font-size: 20px;
+    padding-bottom: 5px;
+    color: @white;
+}
+.color-combi {
+    .col-xs-2 {
+        width: 43px;
+        height: 43px;
+        padding: 0px;
+    }
+    .row {
+        border-color: @gray-light !important;
+    }
+}
+.tab-pane > .row > .col-xs-6 {
+    padding: 0px;
+}
+#bgcolor {
+    .col-xs-12 {
+        height: 50px;
+        margin-bottom: 15px;
+    }
+}
+#pattern {
+    .col-xs-12 {
+        .pattern-swatch{
+            width: 250px;
+            height: 100%;
+            img {
+                width: 100%;
+                height: auto;
+            }
+        }
+    }
+}
+#color {
+    p:first-child {
+        margin-top: 15px;
+    }
+}
+
+/*oe manipulators*/
+
+#oe_manipulators {
+    .oe_snippet_remove {
+        background-color: red;
+        color: white;
+        &:hover {
+            color: black;
+        }
+    }
+    .dropdown-menu {
+        border-radius: 0px;
+    }
+}
+
+/* ================== MODAL ======================*/
+
+.modal:not(#theme_customize_modal) {
+    .modal-dialog {
+        border: 1px solid @gray-dark;
+        .modal-content {
+            border-radius: 0px;
+            border: none;
+            background-color: @color-gamma;
+        }
+        .btn-primary, .btn-default {
+            border: none;
+        }
+        .active a {
+            background: transparent;
+            color: @color-delta;
+            text-decoration: underline;
+            &:hover {
+                border-width: 0px;
+                color: @color-delta;
+            }
+        }
+    }
+    .modal-body, .modal-footer {
+        background-color: @color-alpha;
+        border-top: 1px solid @gray-lighter;
+        color: @gray-light
+    }
+    .modal-footer {
+        color: white;
+        .btn-primary {
+            background-color: @gray-lighter;
+            color: @black;
+        }
+    }
+    .modal-header {
+        height: 71px;
+        border: none;
+        h4 {
+            font-size: 20px;
+        }
+    }
+    .modal-body {
+        font-size: 14px;
+        thead {color: white;}
+        #editor-media-image {
+            background-color: transparent !important;
+        }
+        .well {
+            background-color: @gray-lighter;
+            color: @gray;
+            .BorderRadius(0px);
+            border: none;
+            .form-control {
+                border-radius: 0px;
+                border: none;
+                box-shadow: none;
+                height: 35px;
+                &:focus {
+                    box-shadow: none;
+                    border: 1px solid @color-eta;
+                }
+            }
+            .btn-default {
+                border-radius: 0px;
+                border: none;
+                background-color: @gray;
+                color: @gray-lighter;
+                height: 35px;
+            }
+        }
+        .tab-content {
+            .existing-attachment-remove {
+                background: @gray;
+                border: 1px solid @gray-dark;
+            }
+        }
+        .nav-tabs > li.active > a, &:hover > li.active > a:focus {
+            border: none;
+        }
+        .nav-tabs {
+            border-bottom: 1px solid @gray-light;
+            background-color: @gray-lighter;
+            padding-left: 20px;
+            .font-icons:before {
+                z-index: 1;
+                font-size: 1.5em;
+                top: 12px;
+                left: 10px;
+            }
+            .pager {
+                transform: translateY(23%);
+                margin-right: 10px;
+                .previous a, .next a {
+                    background-color: @gray;
+                    color: @gray-lighter;
+                    border: none;
+                    height: 35px;
+                }
+            }
+            a {
+                color: @color-delta;
+                &:hover {
+                    background: transparent;
+                }
+            }
+        }
+        .search .form-control {
+            border-radius: 0px;
+            border: none;
+            transform: translateY(23%);
+            box-shadow: none;
+            height: 35px;
+            &:focus {
+                box-shadow: none;
+                border: none;
+            }
+        }
+    }
+    .modal-title {
+        color: @color-alpha;
+    }
+    .nav-tabs > li {
+        margin-bottom: 0px;
+        &:hover {
+            background: transparent;
+        }
+    }
+    .pager li > a {
+        .BorderRadius(0px);
+    }
+    .search .form-control {
+        border-color: @gray-lighter;
+    }
+}
+#theme_customize_modal {
+    background: transparent !important;
+}
+#editor-media-image {
+    background-color: white !important;
+}
+.oe_overlay_options {
+    .btn {
+        top: -20px;
+        &:hover {
+            border: none;
+        }
+    }
+}
+
+/* ====================== LOGIN =====================*/
+
+.oe_login_form {
+    .oe_login_buttons {
+        .btn-primary {
+            background: transparent !important;
+            &:hover {
+                color: @color-delta !important;
+            }
+        }
+        .btn-link {
+            color: @color-delta;
+        }
+    }
+}
+.oe_website_login_container {
+    padding: 50px;
+}
@@ -0,0 +1,83 @@
+@bg-img-01: url("/website/image/theme_common.image_content_11");
+@bg-img-02: url("/website/image/theme_common.image_content_09");
+@bg-img-03: url("/website/image/theme_common.image_content_10");
+@bg-img-04: url("/website/image/theme_common.image_content_12");
+@bg-img-05: url("/website/image/theme_common.image_content_02");
+@bg-img-06: url("/website/image/theme_common.image_content_03");
+@bg-img-07: url("/website/image/theme_common.image_content_07");
+
+.bg-img-01 {
+    background-image: @bg-img-01;
+    background-size: cover;
+    background-position: center center;
+}
+.bg-img-02 {
+    background-image: @bg-img-02;
+    background-size: cover;
+    background-position: center center;
+}
+.bg-img-03 {
+    background-image: @bg-img-03;
+    background-size: cover;
+    background-position: center center;
+}
+.bg-img-04 {
+    background-image: @bg-img-04;
+    background-size: cover;
+    background-position: center center;
+}
+.bg-img-05 {
+    background-image: @bg-img-05;
+    background-size: cover;
+    background-position: center center;
+}
+.bg-img-06 {
+    background-image: @bg-img-06;
+    background-size: cover;
+    background-position: center center;
+}
+.bg-img-07 {
+    background-image: @bg-img-07;
+    background-size: cover;
+    background-position: center center;
+}
+
+.px14 {
+    font-size: 14px !important;
+    line-height: 25px;
+}
+.px16 {
+    font-size: 16px !important;
+    line-height: 28px;
+}
+.px18 {
+    font-size: 18px !important;
+    line-height: 30px;
+}
+.px22 {
+    font-size: 22px !important;
+    line-height: 32px;
+}
+.px30 {
+    font-size: 30px !important;
+    line-height: 30px;
+}
+.px36 {
+    font-size: 36px !important;
+    line-height: 36px;
+}
+.px42 {
+    font-size: 42px !important;
+    line-height: 42px;
+}
+.px50 {
+    font-size: 50px !important;
+    line-height: 50px;
+}
+.px60 {
+    font-size: 60px !important;
+    line-height: 60px;
+}
+.reversed {
+    float: right;
+}
@@ -0,0 +1,3 @@
+body {
+    background-color: @colorPreset1_color3;
+}
@@ -0,0 +1,3 @@
+body {
+    background-color: @colorPreset5_color4;
+}
@@ -0,0 +1,3 @@
+body {
+    background-color: @colorPreset3_color3;
+}
@@ -0,0 +1,3 @@
+body {
+    background-color: @colorPreset1_color2;
+}
@@ -0,0 +1,3 @@
+body {
+    background-color: @colorPreset5_color3;
+}
@@ -0,0 +1,3 @@
+body {
+    background-color: @colorPreset6_color3;
+}
@@ -0,0 +1,3 @@
+body {
+    background-color: white;
+}
@@ -0,0 +1,3 @@
+body {
+    background-color: @colorPreset6_color2;
+}
@@ -0,0 +1,4 @@
+body {
+	background: url("/website/image/theme_loftspace.bg_img_01") no-repeat center center fixed;
+	background-size: cover;
+}
@@ -0,0 +1,4 @@
+body {
+    background: url("/website/image/theme_loftspace.bg_img_02") no-repeat center center fixed;
+    background-size: cover;
+}
@@ -0,0 +1,4 @@
+body {
+    background: url("/website/image/theme_loftspace.bg_img_03") no-repeat center center fixed;
+    background-size: cover;
+}
@@ -0,0 +1,4 @@
+body {
+    background: url("/website/image/theme_loftspace.bg_img_04") no-repeat center center fixed;
+    background-size: cover;
+}
@@ -0,0 +1,4 @@
+body {
+    background: url("/website/image/theme_loftspace.bg_img_05") no-repeat center center fixed;
+    background-size: cover;
+}
@@ -0,0 +1,4 @@
+body {
+    background: url("/website/image/theme_loftspace.bg_img_06") no-repeat center center fixed;
+    background-size: cover;
+}
@@ -0,0 +1,4 @@
+body {
+    background: url("/website/image/theme_loftspace.bg_img_07") no-repeat center center fixed;
+    background-size: cover;
+}
--- a/Show More
+++ b/Show More