Keep common variables in one place (file)

... to make plugin authors life simpler, so they don't have to
include all less files

skins/elastic/styles/layout.less

@@ -9,31 +9,6 @@
  * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
  */
 
-@screen-width-large:    1200px;
-@screen-width-medium:   1024px;
-@screen-width-small:    768px;
-@screen-width-xs:       480px;
-@screen-width-mini:     320px;
-@screen-width-touch:    @screen-width-medium;
-
-@page-font-size:        14px;
-@page-min-width:        240px;
-
-@layout-menu-width:                     5rem;
-@layout-header-height:                  4.2rem;
-@layout-header-font-size:               1rem;
-@layout-pagenav-height:                 2rem;
-
-@layout-touch-header-height:            @layout-header-height;
-@layout-touch-header-font-size:         1.2rem;
-@layout-touch-menu-record-height:       3.4rem;
-@layout-touch-menu-record-font-size:    1.2rem;
-@layout-touch-icon-width:               2.2em;
-
-@layout-contact-icon-width:             112px;
-@layout-contact-icon-height:            135px;
-
-
 /*** Responsive design - Layout ***/
 
 /*

skins/elastic/styles/styles.less

@@ -12,6 +12,7 @@
 @import (reference) "fontawesome";
 @import (reference) "colors";
 @import (reference) "mixins";
+@import (reference) "variables";
 
 /*** Fonts ***/
 

skins/elastic/styles/variables.less

@@ -0,0 +1,37 @@
+/**
+ * Roundcube webmail styles for the Elastic skin
+ *
+ * Copyright (c) 2017, The Roundcube Dev Team
+ *
+ * The contents are subject to the Creative Commons Attribution-ShareAlike
+ * License. It is allowed to copy, distribute, transmit and to adapt the work
+ * by keeping credits to the original authors in the README.md file.
+ * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
+ */
+
+@screen-width-large:    1200px;
+@screen-width-medium:   1024px;
+@screen-width-small:    768px;
+@screen-width-xs:       480px;
+@screen-width-mini:     320px;
+@screen-width-touch:    @screen-width-medium;
+
+@page-font-size:        14px;
+@page-min-width:        240px;
+
+@layout-menu-width:                     5rem;
+@layout-header-height:                  4.2rem;
+@layout-header-font-size:               1rem;
+@layout-pagenav-height:                 2rem;
+
+@layout-touch-header-height:            @layout-header-height;
+@layout-touch-header-font-size:         1.2rem;
+@layout-touch-menu-record-height:       3.4rem;
+@layout-touch-menu-record-font-size:    1.2rem;
+@layout-touch-icon-width:               2.2em;
+
+@layout-contact-icon-width:             112px;
+@layout-contact-icon-height:            135px;
+
+@listing-line-height:           2.5rem;
+@listing-touch-line-height:     3.4rem;

skins/elastic/styles/widgets/common.less

@@ -9,12 +9,6 @@
  * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
  */
 
-/*** Common sizing variables ***/
-
-@listing-line-height:           2.5rem;
-@listing-touch-line-height:     3.4rem;
-
-
 /*** Common UI elements ***/
 
 .hidden,