\r
$res .= '<div class="footer-social">';\r
foreach ($this->option('social_networks') as $social) {\r
+\r
+ if (empty($social['title']) || empty($social['icon'])) continue;\r
+\r
+ // Make CSS friendly ID from title\r
+ $social_ID = strtolower(trim($social['title']));\r
+ // Make alphanumeric (removes all other characters)\r
+ $social_ID = preg_replace('/[^a-z0-9_\s-]/', '', $social_ID);\r
+ // Clean up multiple dashes or whitespace\r
+ $social_ID = preg_replace('/[\s-]+/', ' ', $social_ID);\r
+ // Convert whitespaces and underscores to dashes\r
+ $social_ID = preg_replace('/[\s_]/', '-', $social_ID);\r
+\r
+ // Get the SVG for embedding (for simplicity, we assume it is properly optimised)\r
+ $SVG_file = PUBLIC_PATH . CubeIT_View_Helper_ImageCms::getPath($social['icon']);\r
+ if (!file_exists($SVG_file)) continue;\r
+ $SVG = file_get_contents(PUBLIC_PATH . CubeIT_View_Helper_ImageCms::getPath($social['icon']));\r
+\r
$res .= '<style type="text/css">';\r
- $res .= '#s-' . $social['icon'] . ':hover{background-color: ' . $social['color'] . ';border-color: ' . $social['color'] . ';}';\r
+ $res .= '#s-' . $social_ID . ':hover{background-color: ' . $social['color'] . ';border-color: ' . $social['color'] . ';}';\r
$res .= '</style>';\r
- $res .= $this->link('', $social['url'], array('id' => 's-' . $social['icon'],\r
+ $res .= $this->link($SVG, $social['url'], ['id' => 's-' . $social_ID,\r
'title' => $social['title'],\r
- 'class' => 'social-link fb-' . $social['icon'],\r
+ 'class' => 'social-link',\r
'itemprop' => 'sameAs',\r
- 'data-event' => array('category' => 'social',\r
- 'action' => 'go',\r
- 'label' => $social['icon'])));\r
- $res .= '</a>';\r
+ 'target' => '_blank',\r
+ 'rel' => 'noopener',\r
+ 'data-event' => [\r
+ 'category' => 'social',\r
+ 'action' => 'go',\r
+ 'label' => $social['title']\r
+ ]\r
+ ]);\r
}\r
$res .= '</div>'; // .footer-external\r
\r
// Resellers\r
$res .= '<div class="resellers content-wrapper grid">';\r
$res .= '<h2 class="title col-6">' . nl2br($this->resellers_title) . '</h2>';\r
+$res .= '<div class="resellers-grid">';\r
foreach ($this->resellers as $reseller) {\r
- $res .= '<div class="reseller col-1">';\r
+ $res .= '<div class="reseller">';\r
$res .= '<h4>' . $locale->getTranslation($reseller['country'], 'Territory') . '</h4>';\r
$res .= $reseller['company'];\r
$res .= $this->markupDotclear($reseller['details']);\r
$res .= '</div>'; // .reseller\r
}\r
+$res .= '</div>'; // .resellers-grid\r
$res .= '</div>'; // .resellers\r
\r
echo $res;\r
.resellers {
display: block !important;
background-color: @color-light-grey;
- padding-bottom: 2% !important;
-
- @media @m900 {
- text-align: center;
- }
}
-.reseller {
- display: inline-block;
- vertical-align: top;
- padding-right: 30px;
- width: percentage(1/6);
- min-width: 240px;
- margin-bottom: 30px; // Needed when items wrap
- text-align: left;
-
- @media @m900 {
- min-width: 210px;
- }
+.resellers-grid {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+ grid-gap: 30px;
a {
text-decoration: none;
.request-quote .form {
position: relative;
z-index: 2;
-}
\ No newline at end of file
+}