From 8c8486832729f40e11b131f392519042f0c6ff05 Mon Sep 17 00:00:00 2001 From: "stephen@cubedesigners.com" Date: Thu, 23 Apr 2015 13:14:46 +0000 Subject: [PATCH] Initial build of Simeox website with CMS --- framework/application/configs/application.ini | 8 + framework/application/forms/CMS/Home.php | 42 ++++- framework/application/forms/CMS/Sub/About.php | 38 ++++ .../application/forms/CMS/Sub/Benefits.php | 18 ++ .../application/forms/CMS/Sub/Carousel.php | 23 +++ .../forms/CMS/Sub/Carousel/Carousel.php | 12 ++ .../forms/CMS/Sub/Carousel/Item.php | 18 ++ .../application/forms/CMS/Sub/Contact.php | 30 +++ .../application/forms/CMS/Sub/ImageHeader.php | 27 +++ .../application/forms/CMS/Sub/Interface.php | 21 +++ .../application/forms/CMS/Sub/Operation.php | 33 ++++ .../application/forms/CMS/Sub/Partners.php | 25 +++ .../forms/CMS/Sub/Partners/Partner.php | 26 +++ .../forms/CMS/Sub/Partners/Partners.php | 12 ++ .../application/forms/CMS/Sub/RDClinic.php | 40 ++++ .../application/forms/CMS/Sub/Section.php | 13 ++ .../application/forms/CMS/Sub/Simeox.php | 24 +++ framework/application/forms/CMS/Sub/Team.php | 28 +++ .../application/forms/CMS/Sub/Team/Person.php | 26 +++ .../application/forms/CMS/Sub/Team/Team.php | 12 ++ .../application/forms/Element/Markitup.php | 28 +++ .../application/layouts/scripts/layout.phtml | 8 + .../views/helpers/BackgroundImage.php | 20 ++ .../views/helpers/PartnerLogos.php | 21 +++ .../views/scripts/common/content.phtml | 10 + .../views/scripts/common/footer.phtml | 23 +++ .../views/scripts/common/header.phtml | 27 +++ .../views/scripts/home/about.phtml | 48 +++++ .../views/scripts/home/contact.phtml | 34 ++++ .../application/views/scripts/home/hero.phtml | 7 + .../views/scripts/home/rdclinic.phtml | 16 ++ .../views/scripts/home/simeox.phtml | 49 +++++ .../views/scripts/templates/home.phtml | 7 + js/common.js | 133 +++++++++++++ less/_utilities.less | 41 ++++ less/about.less | 137 ++++++++++++++ less/common.less | 176 ++++++++++++++++++ less/contact.less | 46 +++++ less/navigation.less | 52 ++++++ less/rdclinic.less | 50 +++++ less/simeox.less | 125 +++++++++++++ 41 files changed, 1529 insertions(+), 5 deletions(-) create mode 100644 framework/application/forms/CMS/Sub/About.php create mode 100644 framework/application/forms/CMS/Sub/Benefits.php create mode 100644 framework/application/forms/CMS/Sub/Carousel.php create mode 100755 framework/application/forms/CMS/Sub/Carousel/Carousel.php create mode 100644 framework/application/forms/CMS/Sub/Carousel/Item.php create mode 100644 framework/application/forms/CMS/Sub/Contact.php create mode 100644 framework/application/forms/CMS/Sub/ImageHeader.php create mode 100644 framework/application/forms/CMS/Sub/Interface.php create mode 100644 framework/application/forms/CMS/Sub/Operation.php create mode 100644 framework/application/forms/CMS/Sub/Partners.php create mode 100644 framework/application/forms/CMS/Sub/Partners/Partner.php create mode 100644 framework/application/forms/CMS/Sub/Partners/Partners.php create mode 100644 framework/application/forms/CMS/Sub/RDClinic.php create mode 100644 framework/application/forms/CMS/Sub/Section.php create mode 100644 framework/application/forms/CMS/Sub/Simeox.php create mode 100644 framework/application/forms/CMS/Sub/Team.php create mode 100644 framework/application/forms/CMS/Sub/Team/Person.php create mode 100644 framework/application/forms/CMS/Sub/Team/Team.php create mode 100644 framework/application/forms/Element/Markitup.php create mode 100644 framework/application/views/helpers/BackgroundImage.php create mode 100644 framework/application/views/helpers/PartnerLogos.php create mode 100644 framework/application/views/scripts/common/content.phtml create mode 100644 framework/application/views/scripts/common/footer.phtml create mode 100644 framework/application/views/scripts/common/header.phtml create mode 100644 framework/application/views/scripts/home/about.phtml create mode 100644 framework/application/views/scripts/home/contact.phtml create mode 100644 framework/application/views/scripts/home/hero.phtml create mode 100644 framework/application/views/scripts/home/rdclinic.phtml create mode 100644 framework/application/views/scripts/home/simeox.phtml create mode 100644 less/_utilities.less create mode 100644 less/about.less create mode 100644 less/contact.less create mode 100644 less/navigation.less create mode 100644 less/rdclinic.less create mode 100644 less/simeox.less diff --git a/framework/application/configs/application.ini b/framework/application/configs/application.ini index f3dc191..d50547d 100644 --- a/framework/application/configs/application.ini +++ b/framework/application/configs/application.ini @@ -56,10 +56,15 @@ mail.test = APPLICATION_PATH "/../data/email/test" compat_ie = 8 +privacy.enabled = true +privacy.analytics = true + [testing : production] dev = true +minify.js = false + seo.universalAnalytics = ;httpauth.username = username @@ -67,4 +72,7 @@ seo.universalAnalytics = robots = false +locales.fr = simeox.dev.cubedesigners.com +locales.en = en.simeox.dev.cubedesigners.com + webhost = simeox.dev.cubedesigners.com \ No newline at end of file diff --git a/framework/application/forms/CMS/Home.php b/framework/application/forms/CMS/Home.php index b9aec17..c41df20 100644 --- a/framework/application/forms/CMS/Home.php +++ b/framework/application/forms/CMS/Home.php @@ -1,9 +1,41 @@ + $logo = new CubeIT_Form_Element_File_Image('site_logo'); + $logo->setLabel(__('Logo principal')); + $this->addElement($logo); + + $header = new Simeox_Form_CMS_Sub_ImageHeader(); + $header->setLegend(__('Header')); + $this->addSubForm($header, 'hero'); + + // Le Simeox section + $simeox = new Simeox_Form_CMS_Sub_Simeox(); + $simeox->setLegend(__("Section 'Le Simeox'")); + $this->addSubForm($simeox, 'simeox'); + + // R&D Clinic section + $RDClinic = new Simeox_Form_CMS_Sub_RDClinic(); + $RDClinic->setLegend(__("Section 'R&D Clinique'")); + $this->addSubForm($RDClinic, 'clinic'); + + // About section + $about = new Simeox_Form_CMS_Sub_About(); + $about->setLegend(__("Section 'A propos de PhysioAssist'")); + $this->addSubForm($about, 'about'); + + // Contact section + $contact = new Simeox_Form_CMS_Sub_Contact(); + $contact->setLegend(__("Section 'Contact'")); + $this->addSubForm($contact, 'contact'); + + // Footer text + $footer = new Simeox_Form_Element_Markitup('footer'); + $footer->setLabel(__('Pied de page')); + $this->addElement($footer); + } +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/About.php b/framework/application/forms/CMS/Sub/About.php new file mode 100644 index 0000000..52eb17a --- /dev/null +++ b/framework/application/forms/CMS/Sub/About.php @@ -0,0 +1,38 @@ +setAttrib('rows', 2); + $heading->setLabel(__('Titre')); + $this->addElement($heading); + + $subheading = new Zend_Form_Element_Textarea('subheading'); + $subheading->setAttrib('rows', 2); + $subheading->setLabel(__('Sous-titre')); + $this->addElement($subheading); + + $content = new Simeox_Form_Element_Markitup('content'); + $content->setLabel(__('Contenus')); + $this->addElement($content); + + $bg_image = new CubeIT_Form_Element_File_Image('bg_image'); + $bg_image->setLabel(__("Image d'arrière-plan")); + $bg_image->setMaxItems(1); + $this->addElement($bg_image); + + // Team members + $team = new Simeox_Form_CMS_Sub_Team(); + $team->setLegend(__("Bloc 'L'équipe'")); + $this->addSubForm($team, 'team'); + + // Partners + $partners = new Simeox_Form_CMS_Sub_Partners(); + $partners->setLegend(__("Bloc 'Les Partenaires'")); + $this->addSubForm($partners, 'partners'); + + } +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Benefits.php b/framework/application/forms/CMS/Sub/Benefits.php new file mode 100644 index 0000000..243203b --- /dev/null +++ b/framework/application/forms/CMS/Sub/Benefits.php @@ -0,0 +1,18 @@ +setLabel(__('Colonne de gauche')); + $this->addElement($content_left); + + $content_right = new Simeox_Form_Element_Markitup('content_right'); + $content_right->setLabel(__('Colonne de droite')); + $this->addElement($content_right); + } + + +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Carousel.php b/framework/application/forms/CMS/Sub/Carousel.php new file mode 100644 index 0000000..068916d --- /dev/null +++ b/framework/application/forms/CMS/Sub/Carousel.php @@ -0,0 +1,23 @@ +setLabel(__('Titre')); + $this->addElement($heading); + + $subheading = new Zend_Form_Element_Text('subheading'); + $subheading->setAttrib('rows', 2); + $subheading->setLabel(__('Sous-titre')); + $this->addElement($subheading); + + $carousel = new Simeox_Form_CMS_Sub_Carousel_Carousel(); + $carousel->setLegend(__('Carrousel des images')); + $this->addSubForm($carousel, 'image_carousel'); + + + } +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Carousel/Carousel.php b/framework/application/forms/CMS/Sub/Carousel/Carousel.php new file mode 100755 index 0000000..220d81f --- /dev/null +++ b/framework/application/forms/CMS/Sub/Carousel/Carousel.php @@ -0,0 +1,12 @@ +setBaseSubForm(new Simeox_Form_CMS_Sub_Carousel_Item()) + ->setBaseLegend('Edition de carousel item « $title »') + ->setNewLegend('Nouvelle carousel item'); + } + +} diff --git a/framework/application/forms/CMS/Sub/Carousel/Item.php b/framework/application/forms/CMS/Sub/Carousel/Item.php new file mode 100644 index 0000000..9a487e3 --- /dev/null +++ b/framework/application/forms/CMS/Sub/Carousel/Item.php @@ -0,0 +1,18 @@ +setLabel(__('Titre')); + $this->addElement($title); + + $image = new CubeIT_Form_Element_File_Image('image'); + $image->setLabel('Image'); + $image->setMaxItems(1); + $this->addElement($image); + } + +} diff --git a/framework/application/forms/CMS/Sub/Contact.php b/framework/application/forms/CMS/Sub/Contact.php new file mode 100644 index 0000000..264cdcf --- /dev/null +++ b/framework/application/forms/CMS/Sub/Contact.php @@ -0,0 +1,30 @@ +setLabel(__('Titre pour le menu')); + $this->addElement($menu_title); + + $heading = new Zend_Form_Element_Text('heading'); + $heading->setLabel(__('Titre')); + $this->addElement($heading); + + $company_name = new Zend_Form_Element_Text('company_name'); + $company_name->setLabel(__('Nom de société')); + $this->addElement($company_name); + + $company_logo = new CubeIT_Form_Element_File_Image('company_logo'); + $company_logo->setLabel(__('Logo')); + $this->addElement($company_logo); + + $email = new CubeIT_Form_Element_Email('email'); + $email->setLabel(__('Adresse email')); + $this->addElement($email); + + parent::init(); + } + +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/ImageHeader.php b/framework/application/forms/CMS/Sub/ImageHeader.php new file mode 100644 index 0000000..f68a41d --- /dev/null +++ b/framework/application/forms/CMS/Sub/ImageHeader.php @@ -0,0 +1,27 @@ +setLabel(__('Titre')); + $this->addElement($heading); + + $subheading = new Zend_Form_Element_Text('subheading'); + $subheading->setAttrib('rows', 2); + $subheading->setLabel(__('Sous-titre')); + $this->addElement($subheading); + + $bg_color = new CubeIT_Form_Element_Color('bg_color'); + $bg_color->setLabel(__('Couleur en arrière-plan')); + $this->addElement($bg_color); + + $image = new CubeIT_Form_Element_File_Image('image'); + $image->setLabel(__("Image d'arrière-plan")); + $image->setMaxItems(1); + $this->addElement($image); + } + +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Interface.php b/framework/application/forms/CMS/Sub/Interface.php new file mode 100644 index 0000000..5be4b63 --- /dev/null +++ b/framework/application/forms/CMS/Sub/Interface.php @@ -0,0 +1,21 @@ +setLabel(__('Titre')); + $this->addElement($heading); + + $content = new Simeox_Form_Element_Markitup('content'); + $content->setLabel(__('Contenus')); + $this->addElement($content); + + $image = new CubeIT_Form_Element_File_Image('image'); + $image->setLabel(__("Image")); + $image->setMaxItems(1); + $this->addElement($image); + } +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Operation.php b/framework/application/forms/CMS/Sub/Operation.php new file mode 100644 index 0000000..425aad3 --- /dev/null +++ b/framework/application/forms/CMS/Sub/Operation.php @@ -0,0 +1,33 @@ +setLabel(__('Titre')); + $this->addElement($heading); + + $subheading = new Zend_Form_Element_Text('subheading'); + $subheading->setAttrib('rows', 2); + $subheading->setLabel(__('Sous-titre')); + $this->addElement($subheading); + + $content = new Simeox_Form_Element_Markitup('content'); + $content->setLabel(__('Contenus')); + $this->addElement($content); + + $video = new CubeIT_Form_Element_WebVideo('video'); + $video->setLabel(__('Video')); + $this->addElement($video); + + $bg_image = new CubeIT_Form_Element_File_Image('bg_image'); + $bg_image->setLabel(__("Image d'arrière-plan")); + $bg_image->setMaxItems(1); + $this->addElement($bg_image); + + } + + +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Partners.php b/framework/application/forms/CMS/Sub/Partners.php new file mode 100644 index 0000000..fb0b425 --- /dev/null +++ b/framework/application/forms/CMS/Sub/Partners.php @@ -0,0 +1,25 @@ +setLabel(__('Titre')); + $this->addElement($heading); + + $partners_medical = new Simeox_Form_CMS_Sub_Partners_Partners(); + $partners_medical->setLegend(__('Les partenaires médicaux')); + $this->addSubForm($partners_medical, 'partners_medical'); + + $partners_financial = new Simeox_Form_CMS_Sub_Partners_Partners(); + $partners_financial->setLegend(__('Les partenaires financiers')); + $this->addSubForm($partners_financial, 'partners_financial'); + + $content = new Simeox_Form_Element_Markitup('content'); + $content->setLabel(__('Contenus')); + $this->addElement($content); + } + +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Partners/Partner.php b/framework/application/forms/CMS/Sub/Partners/Partner.php new file mode 100644 index 0000000..ce93bf4 --- /dev/null +++ b/framework/application/forms/CMS/Sub/Partners/Partner.php @@ -0,0 +1,26 @@ +setLabel(__('Nom de partenaire')); + $this->addElement($name); + + $description = new Zend_Form_Element_Text('description'); + $description->setLabel(__('Description')); + $this->addElement($description); + + $link = new CubeIT_Form_Element_Url('link'); + $link->setLabel(__('Lien')); + $this->addElement($link); + + $logo = new CubeIT_Form_Element_File_Image('logo'); + $logo->setLabel('Logo'); + $logo->setMaxItems(1); + $this->addElement($logo); + } + +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Partners/Partners.php b/framework/application/forms/CMS/Sub/Partners/Partners.php new file mode 100644 index 0000000..bc38148 --- /dev/null +++ b/framework/application/forms/CMS/Sub/Partners/Partners.php @@ -0,0 +1,12 @@ +setBaseSubForm(new Simeox_Form_CMS_Sub_Partners_Partner()) + ->setBaseLegend('Edition de partenaire « $name »') + ->setNewLegend(__("Nouveau partenaire")); + } + +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/RDClinic.php b/framework/application/forms/CMS/Sub/RDClinic.php new file mode 100644 index 0000000..cdaf61b --- /dev/null +++ b/framework/application/forms/CMS/Sub/RDClinic.php @@ -0,0 +1,40 @@ +setLabel(__('Titre')); + $this->addElement($heading); + + $intro = new Simeox_Form_Element_Markitup('introduction'); + $intro->setLabel(__('Introduction')); + $this->addElement($intro); + + $bg_image = new CubeIT_Form_Element_File_Image('bg_image_1'); + $bg_image->setLabel(__("Image d'arrière-plan #1")); + $bg_image->setMaxItems(1); + $this->addElement($bg_image); + + $findings = new Simeox_Form_Element_Markitup('findings'); + $findings->setLabel(__('Conclusions cliniques')); + $this->addElement($findings); + + $bg_image_2 = new CubeIT_Form_Element_File_Image('bg_image_2'); + $bg_image_2->setLabel(__("Image d'arrière-plan #2")); + $bg_image_2->setMaxItems(1); + $this->addElement($bg_image_2); + + /* + $download = new CubeIT_Form_Element_File_Image_Legend('download'); + $download->setLabel(__('PDF document')); + $download->setAttrib('data-textbutton', __('Cliquez pour choisir un document')); + $this->addElement($download); + */ + + } + + +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Section.php b/framework/application/forms/CMS/Sub/Section.php new file mode 100644 index 0000000..2f1d108 --- /dev/null +++ b/framework/application/forms/CMS/Sub/Section.php @@ -0,0 +1,13 @@ +setLabel(__('Titre pour le menu')); + $this->addElement($menu_title); + + } +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Simeox.php b/framework/application/forms/CMS/Sub/Simeox.php new file mode 100644 index 0000000..637f935 --- /dev/null +++ b/framework/application/forms/CMS/Sub/Simeox.php @@ -0,0 +1,24 @@ +setLegend(__('Carrousel')); + $this->addSubForm($carousel, 'carousel'); + + $operation = new Simeox_Form_CMS_Sub_Operation(); + $operation->setLegend(__("Bloc 'Functionnement'")); + $this->addSubForm($operation, 'operation'); + + $benefits = new Simeox_Form_CMS_Sub_Benefits(); + $benefits->setLegend(__("Bloc 'Bénéfices'")); + $this->addSubForm($benefits, 'benefits'); + + $interface = new Simeox_Form_CMS_Sub_Interface(); + $interface->setLegend(__("Bloc 'L'interface graphique'")); + $this->addSubForm($interface, 'interface'); + } +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Team.php b/framework/application/forms/CMS/Sub/Team.php new file mode 100644 index 0000000..963f313 --- /dev/null +++ b/framework/application/forms/CMS/Sub/Team.php @@ -0,0 +1,28 @@ +setLabel(__('Titre')); + $this->addElement($heading); + + $people = new Simeox_Form_CMS_Sub_Team_Team(); + $people->setLegend(__("Personnes")); + $this->addSubForm($people, 'people'); + + // Bg colour not needed when image is set to cover the full background + //$bg_color = new CubeIT_Form_Element_Color('bg_color'); + //$bg_color->setLabel(__('Couleur en arrière-plan')); + //$this->addElement($bg_color); + + $bg_image = new CubeIT_Form_Element_File_Image('bg_image'); + $bg_image->setLabel(__("Image d'arrière-plan")); + $bg_image->setMaxItems(1); + $this->addElement($bg_image); + + } + +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Team/Person.php b/framework/application/forms/CMS/Sub/Team/Person.php new file mode 100644 index 0000000..9db9b71 --- /dev/null +++ b/framework/application/forms/CMS/Sub/Team/Person.php @@ -0,0 +1,26 @@ +setLabel(__('Prénom et nom')); + $this->addElement($name); + + $position = new Zend_Form_Element_Text('position'); + $position->setLabel(__('Poste')); + $this->addElement($position); + + $bio = new Simeox_Form_Element_Markitup('bio'); + $bio->setLabel(__('Texte')); + $this->addElement($bio); + + $photo = new CubeIT_Form_Element_File_Image('photo'); + $photo->setLabel(__('Photo')); + $photo->setMaxItems(1); + $this->addElement($photo); + } + +} \ No newline at end of file diff --git a/framework/application/forms/CMS/Sub/Team/Team.php b/framework/application/forms/CMS/Sub/Team/Team.php new file mode 100644 index 0000000..f3a543d --- /dev/null +++ b/framework/application/forms/CMS/Sub/Team/Team.php @@ -0,0 +1,12 @@ +setBaseSubForm(new Simeox_Form_CMS_Sub_Team_Person()) + ->setBaseLegend('Edition de « $name »') + ->setNewLegend(__("Nouveau membre d'équipe")); + } + +} \ No newline at end of file diff --git a/framework/application/forms/Element/Markitup.php b/framework/application/forms/Element/Markitup.php new file mode 100644 index 0000000..d5b22af --- /dev/null +++ b/framework/application/forms/Element/Markitup.php @@ -0,0 +1,28 @@ +addTitleControls(); + $this->addSeparator(); + $this->addBasicControls(); + $this->addSeparator(); + $this->addListBullet(); + $this->addSeparator(); + $this->addLinkControls(); + $this->addSeparator(); + $this->addImagesControls(); + $this->addSeparator(); + $this->addNewlineControls(); + } + + // Override web video button that is called by addImagesControls + // We don't want the video button in this case... + public function addWebVideo() { + // Null + } + +} diff --git a/framework/application/layouts/scripts/layout.phtml b/framework/application/layouts/scripts/layout.phtml index d43446c..5aa0a6b 100644 --- a/framework/application/layouts/scripts/layout.phtml +++ b/framework/application/layouts/scripts/layout.phtml @@ -4,6 +4,7 @@ if ($this->acl()->isAllowed('edition')) { $this->headScript()->addCommonsAdmin(); } $this->headScript()->addIEConditionnals(); +$this->headScript()->addJQueryLocalScroll(); $this->headScript()->appendFile('/js/common.js'); $this->headLink()->appendStylesheet('/less/common.less', 'all'); @@ -17,6 +18,13 @@ $this->headLink()->appendStylesheet('/less/common.less', 'all'); * $this->headScript()->addWebFont($fonts); * */ + +$fonts = array('google' => array('families' => array('Open+Sans:400,300,600,300italic'))); +$this->headScript()->addWebFont($fonts); + +// Set viewport width for mobile devices +$this->headMeta()->setName('viewport', 'width=960'); + profile(__FILE__, __LINE__, 'Before rendering body'); $res = $this->htmlPage($this->render('common/body.phtml')); profile(__FILE__, __LINE__, 'Body rendered'); diff --git a/framework/application/views/helpers/BackgroundImage.php b/framework/application/views/helpers/BackgroundImage.php new file mode 100644 index 0000000..bf858a7 --- /dev/null +++ b/framework/application/views/helpers/BackgroundImage.php @@ -0,0 +1,20 @@ +'; + + foreach($logos as $l) { + $attribs = !empty($l['description']) ? array('data-tooltip' => $l['description']) : array(); + $res .= $this->link( + $this->imageProcess($l['logo'], $l['name'], $maxWidth, $maxHeight, $attribs, 'R', 'C', 'M', false, 'auto', 'transparent'), + $l['link']); + $res .= ' '; // space needed for justify elements spacing + } + + $res .= ''; + + return $res; + } +} \ No newline at end of file diff --git a/framework/application/views/scripts/common/content.phtml b/framework/application/views/scripts/common/content.phtml new file mode 100644 index 0000000..122b225 --- /dev/null +++ b/framework/application/views/scripts/common/content.phtml @@ -0,0 +1,10 @@ +layout()->content; + +//$admin = $this->admin ? ' admin' : ''; + +echo '
'; +echo $this->render('common/header.phtml'); +echo $this->htmlElement($c, 'main', array('class' => '')); +echo $this->render('common/footer.phtml'); \ No newline at end of file diff --git a/framework/application/views/scripts/common/footer.phtml b/framework/application/views/scripts/common/footer.phtml new file mode 100644 index 0000000..9c89804 --- /dev/null +++ b/framework/application/views/scripts/common/footer.phtml @@ -0,0 +1,23 @@ + \ No newline at end of file diff --git a/framework/application/views/scripts/common/header.phtml b/framework/application/views/scripts/common/header.phtml new file mode 100644 index 0000000..b704b2e --- /dev/null +++ b/framework/application/views/scripts/common/header.phtml @@ -0,0 +1,27 @@ +headScript()->addScriptAndStyle('navigation'); + +// Major nav sections +$sections = array('simeox', 'clinic', 'about', 'contact'); + +?> +
+
+ + + + + +
+
\ No newline at end of file diff --git a/framework/application/views/scripts/home/about.phtml b/framework/application/views/scripts/home/about.phtml new file mode 100644 index 0000000..ca927d0 --- /dev/null +++ b/framework/application/views/scripts/home/about.phtml @@ -0,0 +1,48 @@ +headScript()->addScriptAndStyle('about'); + $this->headScript()->addTooltip(false); +?> +about; ?> +
+ +
+
+

+

+ markupDotclear($a['content']); ?> +
+
+ + +
+ +
+

+ +
+ +
+ imageProcess($person['photo'], $person['name'], 110, 110, array(), 'C', 'C', 'M', false, 'auto', 'transparent'); ?> +
+
+ markupDotclear($person['bio'], array(), array('class' => 'bio')); ?> +
+ +
+
+
+ + +
+ +
+

+ PartnerLogos($p['partners_medical']); ?> +
+ PartnerLogos($p['partners_financial']); ?> + + markupDotclear($p['content']); ?> +
+
+ +
\ No newline at end of file diff --git a/framework/application/views/scripts/home/contact.phtml b/framework/application/views/scripts/home/contact.phtml new file mode 100644 index 0000000..f0394f8 --- /dev/null +++ b/framework/application/views/scripts/home/contact.phtml @@ -0,0 +1,34 @@ +headScript()->addScriptAndStyle('contact'); + +$c = $this->contact; + +//-- Microdata +$name = $this->microdataProp($c['company_name'], 'name', array('class' => 'companyName')); + +$address = $this->microdataProp($c['adresse'], 'streetAddress'); +$address .= '
'; +$address .= $this->microdataProp($c['code_postal'], 'postalCode'); +$address .= ' '; +$address .= $this->microdataProp($c['ville'], 'addressLocality', array('class' => 'city')); +//$address .= ' - '; +//$address .= $this->microdataProp(Zend_Locale::getTranslation($c['pays'], 'territory'), 'addressCountry', array('class' => 'country')); + +$postalAddress = $this->microdataPostalAddress($address, array('class' => 'address'), 'address'); + +?> +
+ +
+

+ +
+ + + +
+
+
\ No newline at end of file diff --git a/framework/application/views/scripts/home/hero.phtml b/framework/application/views/scripts/home/hero.phtml new file mode 100644 index 0000000..ec70330 --- /dev/null +++ b/framework/application/views/scripts/home/hero.phtml @@ -0,0 +1,7 @@ +hero; ?> +
+
+

+

+
+
\ No newline at end of file diff --git a/framework/application/views/scripts/home/rdclinic.phtml b/framework/application/views/scripts/home/rdclinic.phtml new file mode 100644 index 0000000..7031854 --- /dev/null +++ b/framework/application/views/scripts/home/rdclinic.phtml @@ -0,0 +1,16 @@ +headScript()->addScriptAndStyle('rdclinic'); ?> +clinic; ?> +
+
+

+ +
+ markupDotclear($c['introduction']); ?> + imageCms($c['bg_image_1'], null, null, null, array('class' => 'img1')); ?> +
+
+ markupDotclear($c['findings']); ?> + imageCms($c['bg_image_2'], null, null, null, array('class' => 'img2')); ?> +
+
+
\ No newline at end of file diff --git a/framework/application/views/scripts/home/simeox.phtml b/framework/application/views/scripts/home/simeox.phtml new file mode 100644 index 0000000..e8236ad --- /dev/null +++ b/framework/application/views/scripts/home/simeox.phtml @@ -0,0 +1,49 @@ +headScript()->addScriptAndStyle('simeox'); + +?> +
+ + simeox['carousel']; ?> +
+ +
+

+

+
+ + imageSlideshowContinuous($c['image_carousel'], 790, array(), array('arrowspermanent' => 1)); ?> +
+ + simeox['operation']; ?> +
+
+

+

+ markupDotclear($o['content']) ?> + +
+ videoWeb($o['video']); ?> +
+ +
+
+ + simeox['benefits']; ?> +
+
+
markupDotclear($b['content_left']); ?>
+
markupDotclear($b['content_right']); ?>
+
+
+ + simeox['interface'] ?> +
+
+

+ markupDotclear($i['content']); ?> +
+
+
+
\ No newline at end of file diff --git a/framework/application/views/scripts/templates/home.phtml b/framework/application/views/scripts/templates/home.phtml index e69de29..00d88bd 100644 --- a/framework/application/views/scripts/templates/home.phtml +++ b/framework/application/views/scripts/templates/home.phtml @@ -0,0 +1,7 @@ +render('home/hero.phtml'); +echo $this->render('home/simeox.phtml'); +echo $this->render('home/rdclinic.phtml'); +echo $this->render('home/about.phtml'); +echo $this->render('home/contact.phtml'); \ No newline at end of file diff --git a/js/common.js b/js/common.js index e69de29..e31d817 100644 --- a/js/common.js +++ b/js/common.js @@ -0,0 +1,133 @@ +registerLoader(load_common_once, true); + +var localScrollInitialised = false; + +function load_common_once() { + + // Handle cookie banner + cookieBanner(); + + $('a').click(function() { + if(!localScrollInitialised) { // Only initalise localscroll after first click + $.localScroll({ + axis: 'y', + //onBefore: onStartAutoScroll, + //onAfter: onEndAutoScroll, + duration: 1000, + hash: true, + offset: -65 // For fixed header height + }); + + localScrollInitialised = true; + } + }); + + // Shrinking fixed header + $(window).scroll(function() { + if ($(this).scrollTop() > 100) { + $('header.site').addClass("small"); + } else { + $('header.site').removeClass("small"); + } + }); + + $('.partners .logos').imagefit(); // Make sure logos fit onto one line +} + + +function cookieBanner() { + if($('#cookieBanner').length) { + + var cookieBannerHeight = $('#cookieBanner').outerHeight(); + + // First, make it fixed fixed position + $('#cookieBanner').css({ + position: 'fixed', + width: '100%' + }); + + // Now add necessary padding to the header and main areas + $('header.site').css('margin-top', cookieBannerHeight); + $('main').css('padding-top', '+=' + cookieBannerHeight); + + + // Supplement cookie banner close action with one that handles the fixed header + $(document).on('click', "#cookieBanner .close", function () { + + // Remove padding for cookieBanner + $('header.site').css('margin-top', 0); + $('main').css('padding-top', '-=' + cookieBannerHeight); + + // ... now the .close click event set by bannerCookies.js will run... + + }); + } +} + + +//---------------------------------------------------// + + +/* jquery.imagefit + * + * Fits images onto one line, with space left for gutters between them. + * Designed for use with justified inline-blocks to handle spacing between images + * Original code inspired by: http://www.ollicle.com/eg/jquery/imagefit/ + * + */ +(function($) { + $.fn.imagefit = function(options) { + var fit = { + scale: function(scaleFactor, imgs) { + imgs.each(function(){ + var newWidth = Math.round(scaleFactor * $(this).width()); + var newHeight = Math.round(scaleFactor * $(this).height()); + $(this).width(newWidth); + $(this).height(newHeight); + }) + } + }; + + this.each(function(){ + var container = this; + + // Get list of contained images + var imgs = $('img', container); + + var availableWidth = $(container).width(); + var minGutter = 25; // Minimum gutter size between images (cannot be zero because inline blocks have a natural space between them for justify trick) + var numGutters = imgs.length - 1; + var totalWidth = 0; + + // Calculate total width of all contained images + imgs.each(function(){ + totalWidth += $(this).width(); + }); + + // Add minimum gutters, making sure gutterTotal doesn't exceed available width + var gutterTotal = numGutters * minGutter; + + // Make gutters small enough to fit but bigger than natural gap between inline-blocks (normally 4px) + if(gutterTotal > availableWidth) { + gutterTotal = numGutters * 5; + } + //fb('Gutter total = ' + gutterTotal); + + availableWidth -= gutterTotal; // Take fixed gutters away from available space + //fb('Total img width = ' + totalWidth); + + if(totalWidth > availableWidth) { + var scale = availableWidth / totalWidth; + //fb('Scale factor: ' + Math.round(scale * 100) + '%'); + + fit.scale(scale, imgs); + } + + // Could recalculate scaleFactor from new available width for fluid designs... + //$(window).bind('resize', function(){ + // fit.scale(imgs); + //}); + }); + return this; + }; +})(jQuery); \ No newline at end of file diff --git a/less/_utilities.less b/less/_utilities.less new file mode 100644 index 0000000..e2d906e --- /dev/null +++ b/less/_utilities.less @@ -0,0 +1,41 @@ +.col { + display: inline-block; + width: 50%; + vertical-align: top; + white-space: normal; +} + +// Media object abstraction +.media { + overflow: hidden; +} +.media--item { + float: left; + margin-right: 25px; +} +.media--body { + overflow: hidden; +} + +// Utility class for self-clearing floats +.group:after { + content: ""; + display: table; + clear: both; +} + +////---- Mixins ----//// + +// Justified group (evenly space inline-block elements in a grid without specifying margins) +// From: https://gist.github.com/interactivellama/5699885 +// Note: elements *must* have whitespace between them or this won't work. No minified HTML. +.jgroup { + text-align: justify; + font-size: .01px; + + &:after{ + content: ''; + display: inline-block; + width: 100%; + } +} \ No newline at end of file diff --git a/less/about.less b/less/about.less new file mode 100644 index 0000000..100887d --- /dev/null +++ b/less/about.less @@ -0,0 +1,137 @@ +@import "_utilities"; + +.about-intro { + background-position: center; + background-repeat: no-repeat; + background-size: cover; + padding-top: 120px; + + .content { + padding-right: 520px; + } + + h1 { + margin-bottom: 70px; + } + h2 { + font-size: 20px; + font-weight: 600; + margin-bottom: 10px; + } + + img { + padding-top: 2em; + } +} + +.team { + background-position: top center; + background-repeat: no-repeat; + background-color: #0080c8; + background-size: cover; + color: #fff; + padding: 75px 0; + + h1 { + color: #fff; + } + + .people { + white-space: nowrap; // For columns + } + .person { + &:extend(.media); + padding-top: 60px; + + img { + &:extend(.media--item); + } + + &:nth-of-type(odd) { + padding-right: 40px; + } + &:nth-of-type(even) { + padding-left: 40px; + } + } + .name { + font-weight: 600; + padding-bottom: 12px; + } + .position { + font-style: italic; + padding-bottom: 10px; + } + .bio { + &:extend(.media--body); + font-size: 13px; + line-height: 18px; + } + +} + +.partners { + padding: 85px 0; + + h1 { + color: #3c3c3b; + margin-bottom: 100px; + } + + hr { + margin: 60px 0; + } + + .logos { + .jgroup; + + a { + display: inline-block; + } + } + + .dotclear { + margin-top: 60px; + } +} + +#tooltip { + position: absolute; + background: #0080c8; + padding: 15px; + border-radius: 15px; + color: #fff; + font-size: 14px; + margin: -10px 0 0 60px; + min-width: 80px; + min-height: 49px; + -moz-transform: scale(0.99999); // For Mozilla only: forces anti-aliasing on angled lines + + &:before { + content: ""; + position: absolute; + bottom: -10px; + left: 30px; + border: 0; + border-left-width: 15px; + border-bottom-width: 10px; + border-style: solid; + border-color: transparent #0080c8; + display: block; + width: 0; + } + + &:after { + content: ""; + position: absolute; + bottom: -10px; + left: 30px; + border: 0; + border-left-width: 5px; + border-bottom-width: 10px; + border-style: solid; + border-color: transparent #fff; + display: block; + width: 0; + } +} \ No newline at end of file diff --git a/less/common.less b/less/common.less index e69de29..7e4a173 100644 --- a/less/common.less +++ b/less/common.less @@ -0,0 +1,176 @@ +@import "_utilities"; +@header-height: 130px; + +html { + box-sizing: border-box; +} +*, *:before, *:after { + box-sizing: inherit; +} + + +body { + font-family: 'Open Sans', sans-serif; + font-weight: 300; + font-size: 16px; + min-width: 960px; // stops centred background images from moving beyond where they should +} + +a { + text-decoration: none; + color: #3c3c3b; + + &:hover { + color: #1d81c2; + } +} + +strong { + font-weight: 600; +} + +h1, h2 { + font-weight: 300; +} + +h1 { + color: #0080c8; + font-size: 52px; + font-weight: 300; +} +h2 { + font-size: 30px; + color: #525151; +} + +p { + padding-bottom: 1em; +} + +.content { + width: 960px; + margin: 0 auto; + padding-left: 37px; + + ul { + list-style-type: none; + } + li { + padding-left: 32px; + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAADwikbvAAABN0lEQVQoU2NkQAMWFhYKLCxMCf//M9rDpBgZ/x/88+ffghMnTjxAVs6IzLG2tu5nZGQoQDcQxv//n2HC169fGy9cuPABJAbXbG1tdZ6RkdEAl0YkAw4cPXrUEa7ZxsaqAWhOPUxBXl4ew+3bdxi2b9+Gw6z/jUeOHGtgNDAwEODh4b4PVCUAU6mqqsowadJkIJ6Ey4APX758VWS0sbFwYGBg3o9uBcyAw4cPM7S1tWK44O/ff4FAzahORlYFM2DevHkMq1evQjPgfyNezYaGhkBb28E2g1yACoCaLS0tA5iZmdaju8vT04uhqqoKqLENh7//OmINMMIaGSABBrIR3d8gzV++fMbiVHhsQ6IKxgWmrv3A1AUMefwAmMpQEwlIOSi+ubm56wklT2DqKoQZj5K2QYKkZAwAhECNnlNX7scAAAAASUVORK5CYII='); + background-repeat: no-repeat; + background-position: 0 5px; + line-height: 1.5; + margin-bottom: 10px; + } + ul li ul { + margin-top: 10px; + margin-left: 10px; + li { + background: none; + padding: 0; + &:before { + content: '• '; + } + } + } +} + +header.site { + height: @header-height; + position: fixed; + width: 100%; + background-color: #fff; + z-index: 10; + transition: all 0.3s ease; + + .content { + position: relative; + } + + .logo { + float: left; + margin-top: 50px; + text-indent: 100%; + overflow: hidden; + width: 290px; + height: 49px; + background-size: contain; + transition: all 0.3s ease; + } + + &.small { + height: @header-height/2; + box-shadow: 0 1px 7px rgba(0,0,0,0.2); + + .logo { + height: 25px; + margin-top: 21px; + } + + nav.primary { + //font-size: 16px; + margin-top: 20px; + } + nav.locales { + //top: 6px; // or hide completely? + opacity: 0; + } + } +} + +main { + padding-top: @header-height; // offset space for fixed header +} + +.hero { + background-position: center; + background-repeat: no-repeat; + + .content { + padding-top: 85px; + padding-left: 440px; + } + + h1, h2 { + color: #fff; + max-width: 520px; + } + h1 { font-size: 70px; } + h2 { font-size: 24px; } +} + +.footnotes { + font-size: 12px; + + h4 { + display: none; + } +} + +footer { + background-color: #333338; + color: #848487; + font-size: 13px; + a { + color: inherit; + &:hover { + color: #fff; + } + } + + p { + padding: 0; + line-height: 44px; + } +} + +#adminBar { + position: absolute; + width: 100%; + z-index: 99; + + .content { + width: 100%; + } +} \ No newline at end of file diff --git a/less/contact.less b/less/contact.less new file mode 100644 index 0000000..a001843 --- /dev/null +++ b/less/contact.less @@ -0,0 +1,46 @@ +@import "_utilities"; + +#contact { + background-color: #2e2e32; + color: #fff; + padding: 70px 0; + + h1 { + color: #fff; + padding-bottom: 80px; + } + + a { + color: #fff; + + &:hover { + color: #0080c8; + } + } + + .address { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAyCAMAAAAHpFkRAAAATlBMVEUAAABgYGBgYGhiYmpgYGpiYmpjY2tgYGhiYmpjY2pjY2liYmpjY2tiYmtiYmliYmtiYmlgYGhiYmpjY2liYmpiYmtgYGpjY2pgYGBjY2tD442sAAAAGXRSTlMAEEAAMIC/AGDPAN8AjwDvcCCfUK8AAAAAKQ09kgAAAb1JREFUeF6dlN2SgyAMhRMQBClFtPvj+7/oigSDab3Z76JjMzE5h2BAgmoHfwXQBwZjN8Ka4bsD+NH57YJ3+gQ0ocL2RlAjAfUB4/aR+FWB4xe5n8AjW+izkt1JMg8uWWHOVcRgAudR2tIKOd0xt5JLdbpy+Qu5NVHFKQZ+qZCVos74Iiml2ky1fgo5HppCxN6a06BrsXRUcGm76MyJysFQw6ZEzdbhusgAsRYrTZoXVj5iLWfAsn4x1VBi9bAs1NA6TVNXjIOuNqO0YqCbPusl6ZT22LEyzZbof9KwjVZetkxp4TRfxyFOTtURwXKqRU7gs6y+Iqx8RkYY5bNcYUpn19G/GXBtpjryBcHO7Ou4I4Hqgs5dC+1oYMHpwjlwOA+CbrgyO/TFu/PCgtb59C+Y2XHZIYbldORXc0zLARMFkskjkWMLBmwbybFBH41SJvrrdZpgKsipy/k/4PjN6S4r5X4jzXdp8/MAnhV725Kb3rZN2O9e4Va4JKfEcrMreVvebEyPnxb+IOSlQSx8wn0QxtqYKIVJbYSXQ2rAoweDlC8tsA2WLy0wK++2HhgF88f7DlqyNJPCqWRZ9Bt/KhuHjqH+vKEAAAAASUVORK5CYII='); + background-repeat: no-repeat; + background-position: 0 0; + padding-left: 54px; + min-height: 50px; + } + + .email { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC0AAAAiCAMAAAD8kqB9AAAATlBMVEUAAABiYmljY2tiYmtiYmpjY2lgYGpgYGBgYGhiYmpiYmpgYGpgYGBjY2pgYGhgYGhiYmpjY2liYmpiYmtiYmpiYmljY2tiYmtjY2pjY2uGXuZBAAAAGXRSTlMAcL/vr1AAECAAYDAAz0AA3wCAj58AAAAAmVMa8QAAAS1JREFUeF6N0+2ugyAMx2FAB4Lgu9t6/zd6arPz/1JFmxi35Al1PzPDYx3dTtO+5nk2fFmAGhcdunFMD3Dvfe+NlXtzg4ucORhHTYqxn+o45LwQreYAzEOp4C3GuLFz5v9raC/x+vkER9DMedV2gbFZNJ7MXpWTCNDCOU06LzcIhpZBSV2OtP6VVOVWOtMoqctprUtKuUJa69Ow6U5HKzGGcRzr2r3fnZSUQlw6TGcaCUKRki3HSMcmaao0sKQ5hsuBay3LpRfZfd/x6aU18C/NUAhh0pnmBgvp4Z+6KI1DMGolNB6wxqFVK9UVuo7Bocv3G6ZziVfciMaqy8Fu1hM1IWengPrb90StaZHochDYmgH4ngeTc070ZDi7N9539GimGKPhq7PL/SRukf8Aott9BBLtP7YAAAAASUVORK5CYII='); + background-repeat: no-repeat; + line-height: 34px; + padding-left: 57px; + } + +} + +.contact-blocks { + .jgroup; // Space items evenly with text-justify trick + + div { + display: inline-block; + vertical-align: middle; + font-size: 16px; // needed to reset .jgroup font-size + } +} \ No newline at end of file diff --git a/less/navigation.less b/less/navigation.less new file mode 100644 index 0000000..98217c6 --- /dev/null +++ b/less/navigation.less @@ -0,0 +1,52 @@ +nav { + font-weight: 400; + + ul { + list-style: none; + } + li { + display: inline-block; + padding-left: 0 !important; + background: none !important; + } +} + +nav.primary { + float: right; + margin-top: 65px; + font-size: 18px; + transition: all 0.3s ease; + + li { + margin-left: 68px; + } +} + +nav.locales { + font-size: 11px; + font-weight: 300; + float: right; + + li { + display: inline-block; + line-height: 44px; + margin: 0 0 0 5px; + } + + a { + width: 28px; + height: 28px; + line-height: 28px; + text-align: center; + border-radius: 50%; + background-color: #444; + color: #999; + text-transform: uppercase; + display: inline-block; + + &:hover, &.active { + background: #0080c8; + color: #fff; + } + } +} \ No newline at end of file diff --git a/less/rdclinic.less b/less/rdclinic.less new file mode 100644 index 0000000..08dd22f --- /dev/null +++ b/less/rdclinic.less @@ -0,0 +1,50 @@ +#clinic { + background-color: #fafafa; + padding-top: 110px; + + h1, h3, ul, p { + width: 680px; + } + + h1 { + padding-bottom: 40px; + } + h3 { + padding-bottom: 25px; + } + + .content { + position: relative; + } + + .img1 { + position: absolute; + top: -130px; + right: -220px; + } + + .intro { + margin-bottom: 70px; + } + + .findings { + position: relative; + min-height: 500px; + } + + .img2 { + position: absolute; + top: 0; + right: -550px; + } + + p + blockquote { + margin-top: -1em; + } + blockquote { + font-size: 13px; + font-style: italic; + line-height: 18px; + } + +} \ No newline at end of file diff --git a/less/simeox.less b/less/simeox.less new file mode 100644 index 0000000..eb1af75 --- /dev/null +++ b/less/simeox.less @@ -0,0 +1,125 @@ +.carousel { + background-color: #fafafa; + padding-top: 65px; + + .content { + margin-bottom: 40px; + } + + .slideshowcontinuous { + position: relative; + + .arrows { + a { + display: block; + width: 39px; + height: 66px; + margin-top: -33px; // half of height to center properly + position: absolute; + z-index: 2; + + &:hover { + opacity: .7; + } + } + .prev { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACcAAABCCAYAAADUms/cAAAC1UlEQVRoQ82azVXDMAzH5fIeD04wQkfgyMeFbgAb0A1ggroTlA3KBnSDcoFw7AgdgRtcqFFiktTNlxwrtnutY/8i+S/JcgTE+JOJBCXORHRss2QJQjwAqGk8cHJ9Dup0jcYag9hNQV6v4oCT7xegjpYa7HcC8maTejQ8nAZLLbYF8Y1gk698q4WFkwnuLbEEBSsEQ1eWYGEtJz8eAUYLUOoF5lfTOmGGsdyeIkFevTRFDL9wmSJPXtGVFyDUUxuYX7fKZIyBFcFMRbbFWT+WMxSp7tFiW0rwHx4uVaQSC4z4GxA/CGYqMpzlilDRrMgwcIUid7jxr58pbjwcw+9WnSMxecNdmry7FOnPckbyLnNkH6vxhhJDkb9oMZ28XX48bpUfd6BGaVVRSd5h4RwVOdyem30ucONjAldz3PjSxUp8iV/nSATT5bSLInktZygyS0Vv3BbL57MTRKbIUZq8sbDYIZi7Inks11JOh7XcviLFD6YjevJ2Ae92a3rABTHDOv8Z5pdPLovZPtsORyynbReljq+HqzngUifkHFeFazjgci5KncuEC6BIWigpyml4qzvgUt+Wc5y2HOGAy7kodS4BMrnFULEOESq6IBFuv/XkXr12LWjz/79b7U7iNgu4jDXVGjjoHr5ITZzr7v64WMPm2YYM0d43s1nAZWxzbo0gILcn/sCpjFAyVbvcLq6yebYbLp8tgJLpcFma81t42sFpwAfdAce21sAluz2cBrz9b6Gyth+6gzB1x3o4JvazXP4CAx+w3eAyFw/XmnCHK0INf1OHD+5QyQ1XRtQtnY7jhcsA+RqJ/HAZ4P41Zf8W7DBwhVDym+d+5f9wcCVg77b/sHCVosHuwsQPXE8l+4PLAS0u6fzCVZTcfr3pH05bkHQxHAauzMmtV+rh4Ajlf3g4nfJqP+OIA84INeUHMPHAVZT8PYkLrgTE61H1FR9crmQ4Hv8BeSiLmLJuOQ0AAAAASUVORK5CYII='); + left: 35px; + } + .next { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACcAAABCCAYAAADUms/cAAACmklEQVRoQ82av3XCMBDGT8l7eaTLCIxAGUgDGyQbhA1gAswEsAFsEDYgTUJKNggjpAsNKCcLbBxhW7ZPJ1G5oPi9k777850ERB8dkDczEMcxRE9bCOgnIFo/gLxfI1MbxGEQEqCIAxUDtjB64hVADiHqLkMIoIY7/yabxQlwioCRb8AsXBzFDUZPLEDKJUy7Q5+AJlwM+PmMIlng1w7EL97DwY8PyOtwMaBS8a0SCgIe8B7yKzkfLhGKPyUXw6WA6oj7ICTmQj4ll8MZSlbJujfnuIP2cFooIwCsJkxKrgZ3TjVSzDBZb0HsX1wquTqcoWSJgN2di2OuB6cj2AYp3vDLWU2uD5couYWAooNdDebC3ooygs3gzJpM2jTQwOljxkZBTCiVTAeXaRpghTUZo9isJtPCGUpu1jTQw6WAquQ1UrIbOKNpiHPhe1Ulu4MjULJ7OAU5+cL5BEYgYQ7Tx7FtBHngMkrG9l/ssbMpVzIfnAbsn0qeVfvPC5co+UbVZMzZRxRKfvvPD2coOX+Q9wOXNg2Fg7w/ODPVGIO8f7j/Sr4Y5MOAiwHNQT4cOKNpOAzDgkuV/K0GqPDgUqcroMhpEzPjLIQRuRx31T9cgZvlF67EB/QHZ+Gg+oGz9J554Sq69nxwNfYdPHB6S2TVYF7OF+7hKrbmfHCXirQcanjgao6D7uEuincT9532zmUUWc+CcBM5XSMbmzf0cJni3cz2ooVLFEljGNLBObBaaeCIFFnkOFVXqy7ezuz9+pFjWIzUg8so0t1KqTqcUiTTMq4aHPMa0x4uUSTfArgc7sqAa2syU/7PTCU12mlKoPzIBfBc4zpcIA9dTDiLAdfV0RWXLzWAgMCXNzKIx1XZyCkBwF3bx3OgstP4A6rAkHPDsyd8AAAAAElFTkSuQmCC'); + right: 35px; + } + } + + .shortcuts { + bottom: 25px; + position: absolute; + text-align: center; + width: 100%; + z-index: 2; + + a { + display: inline-block; + width: 16px; + height: 16px; + text-indent: 100%; + overflow: hidden; + background: #fff; + border-radius: 50%; + margin: 0 5px; + + &.active { + background: #0080c8; + } + } + } + + } + .slide { + background-position: center; + width: 100%; + position: absolute; + display: none; + } +} + +.operation { + background-position: center bottom; + background-repeat: no-repeat; + padding-top: 65px; + + .dotclear { + max-width: 425px; + margin-top: 120px; + } + + .video { + width: 582px; + margin-top: 55px; + box-shadow: 15px 10px 15px rgba(0, 0, 0, 0.2); + + iframe { + display: block; // gets rid of odd space at the bottom of the video + } + } +} + +.benefits { + background-color: #0080c8; + color: #fff; + white-space: nowrap; // to make inline-blocks sit beside each other even when there is space between the tags + padding: 45px 0; + + h3 { + font-size: 30px; + font-weight: 400; + margin-bottom: 35px; + } + + .col { + max-width: 360px; + + &:nth-of-type(odd) { + margin-right: 80px; + } + &:nth-of-type(even) { + margin-left: 37px; + margin-right: 43px; + } + } +} + +.interface { + padding-top: 75px; + + h1 { + margin-bottom: 25px; + } + + .screenshot { + background-position: center; + background-repeat: no-repeat; + margin-top: 55px; + } +} \ No newline at end of file -- 2.39.5