Contact page, general CSS grid and responsive behaviour WIP #486 @6.5

diff --git a/framework/application/forms/RequestQuote.php b/framework/application/forms/RequestQuote.php
new file mode 100644 (file)
index 0000000..bb1b23e
--- /dev/null
+++ b/framework/application/forms/RequestQuote.php
@@ -0,0 +1,60 @@
+<?php
+
+class Fluidbook_Form_RequestQuote extends CubeIT_Form {
+
+    public function init() {
+        parent::init();
+
+        $last_name = new Zend_Form_Element_Text('last_name');
+        $last_name->setLabel(__('Votre nom'));
+        $last_name->setRequired(true);
+        $last_name->addErrorMessage(__('Votre nom est obligatoire'));
+        $this->addElement($last_name);
+
+        $first_name = new Zend_Form_Element_Text('first_name');
+        $first_name->setLabel(__('Prénom'));
+        $first_name->setRequired(true);
+        $first_name->addErrorMessage(__('Votre prénom est obligatoire'));
+        $this->addElement($first_name);
+
+        $company = new Zend_Form_Element_Text('company');
+        $company->setLabel(__('Nom de la société'));
+        $company->setRequired(true);
+        $company->addErrorMessage(__('Champ obligatoire'));
+        $this->addElement($company);
+
+        $contact_type = new Zend_Form_Element_Select('contact_type');
+        $contact_type->setLabel(__('Vous êtes'));
+        $contact_type->setMultiOptions(array(
+            '' => __("???"), // Todo: set options
+        ));
+        $contact_type->setAttrib('required', 'required'); // Needed so we can style the first element when nothing selected
+        $contact_type->setRequired(true);
+        $contact_type->addErrorMessage(__('Champ obligatoire'));
+        $this->addElement($contact_type);
+
+        $email = new CubeIT_Form_Element_Email('email');
+        $email->setLabel(__('Email professionnel'));
+        $email->setRequired(true);
+        $email->addErrorMessage(__('E-mail invalide'));
+        $this->addElement($email);
+
+        $phone = new Zend_Form_Element_Text('phone');
+        $phone->setLabel(__('Téléphone'));
+        $phone->setRequired(false);
+        $phone->addErrorMessage(__('Champ obligatoire'));
+        $this->addElement($phone);
+
+        $comments = new Zend_Form_Element_Textarea('comments');
+        $comments->setLabel(__('Commentaires sur votre projet'));
+        $this->addElement($comments);
+
+        $submit = new Zend_Form_Element_Button('submit');
+        $submit->setLabel(__('Envoyer la demande'));
+        $submit->setAttrib('class', 'submit-button');
+        $submit->setAttrib('type', 'submit');
+        $this->addElement($submit);
+
+    }
+
+}
\ No newline at end of file

diff --git a/framework/application/forms/Settings.php b/framework/application/forms/Settings.php
index 57a6a78f5cceab697beb1c2b56e8965bc0c74e66..7a8328b24e6e1aa97364655be9b999a163b218ae 100644 (file)
--- a/framework/application/forms/Settings.php
+++ b/framework/application/forms/Settings.php
@@ -23,6 +23,19 @@ class Fluidbook_Form_Settings extends CubeIT_Form_Settings {
                $adresse->setLabel('Adresse');
                $this->addSubFormLocalized($adresse, 'address');
 
+               $quote_heading = new CubeIT_Form_Element_Textarea('quote_heading');
+               $quote_heading->setAttrib('rows', 3);
+               $quote_heading->setLabel('"Demander un Devis" titre');
+               $this->addElementLocalized($quote_heading);
+
+               $quote_description = new CubeIT_Form_Element_Markitup('quote_description');
+               $quote_description->setLabel('"Demander un Devis" texte');
+               $this->addElementLocalized($quote_description);
+
+               $quote_form_tips = new CubeIT_Form_Element_Markitup('quote_form_tips');
+               $quote_form_tips->setLabel('Conseils de forme "Demander un Devis"');
+               $this->addElementLocalized($quote_form_tips);
+
                $footer_menu_main = new Fluidbook_Form_CMS_Element_PagesTagList('footer_menu_main');
                $footer_menu_main->setLabel('Pages for menu "Plan du site"');
                $footer_menu_main->setAttrib('placeholder', 'Tapez un titre de la page');

diff --git a/framework/application/views/scripts/templates/contact.phtml b/framework/application/views/scripts/templates/contact.phtml
index 90fc73af60298c3db935d24d39545f44675fcd34..236bfcea325f20972b89d8e17a68cace6339aca9 100644 (file)
--- a/framework/application/views/scripts/templates/contact.phtml
+++ b/framework/application/views/scripts/templates/contact.phtml
@@ -8,10 +8,13 @@ $intro_image_path = CubeIT_View_Helper_ImageCms::getPath($this->intro_bg_image);
 CubeIT_Image::getDimensions($intro_image_path, $intro_image_width, $intro_image_height);\r
 $intro_ratio = $intro_image_height / $intro_image_width;\r
 \r
-$res .= '<div class="contact-intro content-wrapper" \r
+$res .= '<div class="contact-intro content-wrapper no-shrink" \r
               style="background-image: url('. $intro_image_path .');"\r
               data-bg-ratio="'. $intro_ratio .'">';\r
 \r
+$res .= '<div class="grid">';\r
+$res .= '<div class="col-2">';\r
+\r
 $res .= '<h1 class="title">'. nl2br($this->intro_title) .'</h1>';\r
 $res .= $this->markupDotclear($this->intro_content);\r
 \r
@@ -30,6 +33,23 @@ $res .= '<br>';
 $res .= __('email :') . ' ' . $this->linkEmail($address['email']);\r
 $res .= '</address>';\r
 \r
+$res .= '</div>'; // .col-2\r
+$res .= '</div>'; // .grid\r
 $res .= '</div>'; // .contact-intro\r
 \r
+// Request Quote form\r
+$res .= '<div class="request-quote content-wrapper grid">';\r
+$res .= '<div class="text col-2">';\r
+$res .= '<h1 class="title">'. nl2br($this->option('quote_heading')) .'</h1>';\r
+$res .= $this->markupDotclear($this->option('quote_description'));\r
+$res .= '</div>'; // .col-2\r
+$res .= '<div class="form col-4">';\r
+$form = new Fluidbook_Form_RequestQuote();\r
+$res .= $form;\r
+$res .= $this->markupDotclear($this->option('quote_form_tips'));\r
+$res .= '</div>'; // .col-4\r
+$res .= '</div>'; // .request-quote\r
+\r
+// Resellers\r
+\r
 echo $res;
\ No newline at end of file

diff --git a/less/001-variables.less b/less/001-variables.less
index a22a4ac7ecfde71e1405ebaa4b7706dcd3ccec35..40d9237bd53acfad7217719fecf3aaa6d3aa7cc2 100644 (file)
--- a/less/001-variables.less
+++ b/less/001-variables.less
@@ -18,4 +18,5 @@
 
 //-- Content and breakpoints
 @mobile-breakpoint: 1024px;
+@desktop-min-width: 1200px;
 @content-max-width: 1680px;
\ No newline at end of file

diff --git a/less/002-common.less b/less/002-common.less
index d1db1d80e8ac4e13c1c0e682a65e89fb46877e49..c45c5c4cc701284fffb08a55de05c01e694a9e3e 100644 (file)
--- a/less/002-common.less
+++ b/less/002-common.less
@@ -1,8 +1,11 @@
 @import "000-imports";\r
 \r
-*{\r
+html {\r
        box-sizing: border-box;\r
 }\r
+*, *:before, *:after {\r
+       box-sizing: inherit;\r
+}\r
 \r
 body {\r
        background-color: @color-body-bg;\r
@@ -11,7 +14,7 @@ body {
        line-height: 26/14;\r
 }\r
 \r
-main{\r
+main {\r
        background-color: #fff;\r
        max-width: @content-max-width;\r
        margin: 0 auto;\r
@@ -34,10 +37,36 @@ a {
 \r
 .content-wrapper {\r
        width: 100%;\r
-       padding: 0 5%;\r
+       padding-top: 5%;\r
+       padding-bottom: 5%;\r
+\r
+       &:first-of-type {\r
+               padding-top: 152px; // Minimum clearance and top for fixed menu\r
+       }\r
+}\r
+\r
+.no-shrink {\r
+       min-width: @desktop-min-width;\r
 }\r
 \r
 .cubeit-content{\r
        width: 90%;\r
        margin:0 auto;\r
-}
\ No newline at end of file
+}\r
+\r
+// Simple Flexbox Grid\r
+.grid {\r
+       display: flex;\r
+       padding-left: 5%;\r
+       padding-right: 5%;\r
+}\r
+.col {\r
+       flex: 1 0 auto;\r
+}\r
+// Grid contains 6 columns without gutters\r
+.col-1 { flex-basis: percentage(1/6); }\r
+.col-2 { flex-basis: percentage(2/6); }\r
+.col-3 { flex-basis: percentage(3/6); }\r
+.col-4 { flex-basis: percentage(4/6); }\r
+.col-5 { flex-basis: percentage(5/6); }\r
+.col-6 { flex-basis: percentage(6/6); }\r

diff --git a/less/310-contact.less b/less/310-contact.less
index 6551b487af6e29308e8d6063d11bd02cb166322c..502d50d9575e792a31959465ff06f50259f36d91 100644 (file)
--- a/less/310-contact.less
+++ b/less/310-contact.less
@@ -33,4 +33,11 @@
     }
   }
 
+}
+
+// Request a quote section
+.request-quote {
+  .text {
+    padding-right: 30px;
+  }
 }
\ No newline at end of file