Updated portal template management view
authorThierry Florac <tflorac@ulthar.net>
Wed, 02 Sep 2020 17:16:04 +0200
changeset 275 36ff0ccd4253
parent 274 024b6541567a
child 276 8ee7a2423c36
Updated portal template management view
src/pyams_portal/portlet.py
src/pyams_portal/resources/css/portal.css
src/pyams_portal/resources/css/portal.css.map
src/pyams_portal/resources/css/portal.min.css
src/pyams_portal/resources/js/i18n/fr.min.js
src/pyams_portal/resources/js/portal.js
src/pyams_portal/resources/js/portal.min.js
src/pyams_portal/resources/less/portal.less
src/pyams_portal/template.py
src/pyams_portal/zmi/layout.py
src/pyams_portal/zmi/templates/layout.pt
--- a/src/pyams_portal/portlet.py	Fri Oct 18 16:55:07 2019 +0200
+++ b/src/pyams_portal/portlet.py	Wed Sep 02 17:16:04 2020 +0200
@@ -96,11 +96,12 @@
                 factory = None
                 component = ob
 
-            config = context.config.with_package(info.module)
             logger.debug("Registering portlet {0} named '{1}'".format(
                 str(component) if component else str(factory), name))
-            config.registry.registerUtility(component=component, factory=factory,
-                                            provided=IPortlet, name=name)
+            config = context.config.with_package(info.module)
+            registry = settings.get('registry', config.registry)
+            registry.registerUtility(component=component, factory=factory,
+                                     provided=IPortlet, name=name)
 
         info = self.venusian.attach(wrapped, callback, category='pyams_portal',
                                     depth=depth + 1)
--- a/src/pyams_portal/resources/css/portal.css	Fri Oct 18 16:55:07 2019 +0200
+++ b/src/pyams_portal/resources/css/portal.css	Wed Sep 02 17:16:04 2020 +0200
@@ -29,7 +29,7 @@
   margin: 0;
   border: 1px solid rgba(51, 122, 183, 0.6);
   border-bottom-width: 5px;
-  min-height: 20px!important;
+  min-height: 20px !important;
 }
 #portal_config .row .slot > .header {
   margin: 1px;
@@ -40,7 +40,7 @@
   margin: 1px;
   padding: 0;
   border: 1px solid rgba(98, 120, 128, 0.5);
-  min-height: 20px!important;
+  min-height: 20px !important;
 }
 #portal_config .row .portlet > .header {
   background-color: rgba(92, 109, 128, 0.5);
@@ -56,8 +56,8 @@
 }
 #portal_config .slot-highlight {
   margin: 3px 0;
-  border: 1px solid #7b939c!important;
-  background-color: #a4c3ce!important;
+  border: 1px solid #7b939c !important;
+  background-color: #a4c3ce !important;
   min-height: 40px;
 }
 #portal_config .portlets {
@@ -84,72 +84,491 @@
 #portal_config .wrapper-imagemap svg {
   width: 100%;
 }
-#portal_config.container .col-12 {
+#portal_config.container .slot.col-12 {
   float: left;
-  width: 100%!important;
+  width: 100% !important;
 }
-#portal_config.container .col-11 {
+#portal_config.container .slot.col-11 {
   float: left;
-  width: 91.66666667%!important;
+  width: 91.66666667% !important;
 }
-#portal_config.container .col-10 {
+#portal_config.container .slot.col-10 {
   float: left;
-  width: 83.33333333%!important;
+  width: 83.33333333% !important;
 }
-#portal_config.container .col-9 {
+#portal_config.container .slot.col-9 {
   float: left;
-  width: 75%!important;
+  width: 75% !important;
 }
-#portal_config.container .col-8 {
+#portal_config.container .slot.col-8 {
   float: left;
-  width: 66.66666667%!important;
+  width: 66.66666667% !important;
 }
-#portal_config.container .col-7 {
+#portal_config.container .slot.col-7 {
   float: left;
-  width: 58.33333333%!important;
+  width: 58.33333333% !important;
 }
-#portal_config.container .col-6 {
+#portal_config.container .slot.col-6 {
   float: left;
-  width: 50%!important;
+  width: 50% !important;
 }
-#portal_config.container .col-5 {
+#portal_config.container .slot.col-5 {
   float: left;
-  width: 41.66666667%!important;
+  width: 41.66666667% !important;
 }
-#portal_config.container .col-4 {
+#portal_config.container .slot.col-4 {
   float: left;
-  width: 33.33333333%!important;
+  width: 33.33333333% !important;
 }
-#portal_config.container .col-3 {
+#portal_config.container .slot.col-3 {
   float: left;
-  width: 25%!important;
+  width: 25% !important;
 }
-#portal_config.container .col-2 {
+#portal_config.container .slot.col-2 {
   float: left;
-  width: 16.66666667%!important;
+  width: 16.66666667% !important;
 }
-#portal_config.container .col-1 {
+#portal_config.container .slot.col-1 {
   float: left;
-  width: 8.33333333%!important;
+  width: 8.33333333% !important;
 }
-#portal_config.container .col-0 {
+#portal_config.container .slot.col-0 {
   float: left;
-  width: 100%!important;
+  width: 100% !important;
   opacity: 0.5;
 }
-#portal_config.container .col-0 > .portlets {
+#portal_config.container .slot.col-0 > .portlets {
   display: none;
 }
+@media (max-width: 767px) {
+  #portal_config.container .slot.col-xs-12 {
+    width: 100% !important;
+  }
+  #portal_config.container .slot.col-xs-11 {
+    width: 91.66666667% !important;
+  }
+  #portal_config.container .slot.col-xs-10 {
+    width: 83.33333333% !important;
+  }
+  #portal_config.container .slot.col-xs-9 {
+    width: 75% !important;
+  }
+  #portal_config.container .slot.col-xs-8 {
+    width: 66.66666667% !important;
+  }
+  #portal_config.container .slot.col-xs-7 {
+    width: 58.33333333% !important;
+  }
+  #portal_config.container .slot.col-xs-6 {
+    width: 50% !important;
+  }
+  #portal_config.container .slot.col-xs-5 {
+    width: 41.66666667% !important;
+  }
+  #portal_config.container .slot.col-xs-4 {
+    width: 33.33333333% !important;
+  }
+  #portal_config.container .slot.col-xs-3 {
+    width: 25% !important;
+  }
+  #portal_config.container .slot.col-xs-2 {
+    width: 16.66666667% !important;
+  }
+  #portal_config.container .slot.col-xs-1 {
+    width: 8.33333333% !important;
+  }
+  #portal_config.container .slot.col-xs-0 {
+    width: 0 !important;
+  }
+}
+@media (min-width: 768px) {
+  #portal_config.container .slot.col-sm-12,
+  #portal_config.container .slot.col-md-12,
+  #portal_config.container .slot.col-lg-12 {
+    width: 100% !important;
+  }
+  #portal_config.container .slot.col-sm-11,
+  #portal_config.container .slot.col-md-11,
+  #portal_config.container .slot.col-lg-11 {
+    width: 91.66666667% !important;
+  }
+  #portal_config.container .slot.col-sm-10,
+  #portal_config.container .slot.col-md-10,
+  #portal_config.container .slot.col-lg-10 {
+    width: 83.33333333% !important;
+  }
+  #portal_config.container .slot.col-sm-9,
+  #portal_config.container .slot.col-md-9,
+  #portal_config.container .slot.col-lg-9 {
+    width: 75% !important;
+  }
+  #portal_config.container .slot.col-sm-8,
+  #portal_config.container .slot.col-md-8,
+  #portal_config.container .slot.col-lg-8 {
+    width: 66.66666667% !important;
+  }
+  #portal_config.container .slot.col-sm-7,
+  #portal_config.container .slot.col-md-7,
+  #portal_config.container .slot.col-lg-7 {
+    width: 58.33333333% !important;
+  }
+  #portal_config.container .slot.col-sm-6,
+  #portal_config.container .slot.col-md-6,
+  #portal_config.container .slot.col-lg-6 {
+    width: 50% !important;
+  }
+  #portal_config.container .slot.col-sm-5,
+  #portal_config.container .slot.col-md-5,
+  #portal_config.container .slot.col-lg-5 {
+    width: 41.66666667% !important;
+  }
+  #portal_config.container .slot.col-sm-4,
+  #portal_config.container .slot.col-md-4,
+  #portal_config.container .slot.col-lg-4 {
+    width: 33.33333333% !important;
+  }
+  #portal_config.container .slot.col-sm-3,
+  #portal_config.container .slot.col-md-3,
+  #portal_config.container .slot.col-lg-3 {
+    width: 25% !important;
+  }
+  #portal_config.container .slot.col-sm-2,
+  #portal_config.container .slot.col-md-2,
+  #portal_config.container .slot.col-lg-2 {
+    width: 16.66666667% !important;
+  }
+  #portal_config.container .slot.col-sm-1,
+  #portal_config.container .slot.col-md-1,
+  #portal_config.container .slot.col-lg-1 {
+    width: 8.33333333% !important;
+  }
+  #portal_config.container .slot.col-sm-0,
+  #portal_config.container .slot.col-md-0,
+  #portal_config.container .slot.col-lg-0 {
+    width: 0 !important;
+  }
+}
+@media (min-width: 992px) {
+  #portal_config.container .slot.col-md-12,
+  #portal_config.container .slot.col-lg-12 {
+    width: 100% !important;
+  }
+  #portal_config.container .slot.col-md-11,
+  #portal_config.container .slot.col-lg-11 {
+    width: 91.66666667% !important;
+  }
+  #portal_config.container .slot.col-md-10,
+  #portal_config.container .slot.col-lg-10 {
+    width: 83.33333333% !important;
+  }
+  #portal_config.container .slot.col-md-9,
+  #portal_config.container .slot.col-lg-9 {
+    width: 75% !important;
+  }
+  #portal_config.container .slot.col-md-8,
+  #portal_config.container .slot.col-lg-8 {
+    width: 66.66666667% !important;
+  }
+  #portal_config.container .slot.col-md-7,
+  #portal_config.container .slot.col-lg-7 {
+    width: 58.33333333% !important;
+  }
+  #portal_config.container .slot.col-md-6,
+  #portal_config.container .slot.col-lg-6 {
+    width: 50% !important;
+  }
+  #portal_config.container .slot.col-md-5,
+  #portal_config.container .slot.col-lg-5 {
+    width: 41.66666667% !important;
+  }
+  #portal_config.container .slot.col-md-4,
+  #portal_config.container .slot.col-lg-4 {
+    width: 33.33333333% !important;
+  }
+  #portal_config.container .slot.col-md-3,
+  #portal_config.container .slot.col-lg-3 {
+    width: 25% !important;
+  }
+  #portal_config.container .slot.col-md-2,
+  #portal_config.container .slot.col-lg-2 {
+    width: 16.66666667% !important;
+  }
+  #portal_config.container .slot.col-md-1,
+  #portal_config.container .slot.col-lg-1 {
+    width: 8.33333333% !important;
+  }
+  #portal_config.container .slot.col-md-0,
+  #portal_config.container .slot.col-lg-0 {
+    width: 0 !important;
+  }
+}
+@media (min-width: 1200px) {
+  #portal_config.container .slot.col-lg-12 {
+    width: 100% !important;
+  }
+  #portal_config.container .slot.col-lg-11 {
+    width: 91.66666667% !important;
+  }
+  #portal_config.container .slot.col-lg-10 {
+    width: 83.33333333% !important;
+  }
+  #portal_config.container .slot.col-lg-9 {
+    width: 75% !important;
+  }
+  #portal_config.container .slot.col-lg-8 {
+    width: 66.66666667% !important;
+  }
+  #portal_config.container .slot.col-lg-7 {
+    width: 58.33333333% !important;
+  }
+  #portal_config.container .slot.col-lg-6 {
+    width: 50% !important;
+  }
+  #portal_config.container .slot.col-lg-5 {
+    width: 41.66666667% !important;
+  }
+  #portal_config.container .slot.col-lg-4 {
+    width: 33.33333333% !important;
+  }
+  #portal_config.container .slot.col-lg-3 {
+    width: 25% !important;
+  }
+  #portal_config.container .slot.col-lg-2 {
+    width: 16.66666667% !important;
+  }
+  #portal_config.container .slot.col-lg-1 {
+    width: 8.33333333% !important;
+  }
+  #portal_config.container .slot.col-lg-0 {
+    width: 0 !important;
+  }
+}
 #portal_config.container-xs {
-  max-width: 750px!important;
+  max-width: 750px !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-11 {
+  margin-left: 91.66666667% !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-10 {
+  margin-left: 83.33333333% !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-9 {
+  margin-left: 75% !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-8 {
+  margin-left: 66.66666667% !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-7 {
+  margin-left: 58.33333333% !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-6 {
+  margin-left: 50% !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-5 {
+  margin-left: 41.66666667% !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-4 {
+  margin-left: 33.33333333% !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-3 {
+  margin-left: 25% !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-2 {
+  margin-left: 16.66666667% !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-1 {
+  margin-left: 8.33333333% !important;
+}
+#portal_config.container-xs .slot.col-xs-offset-0 {
+  margin-left: 0 !important;
 }
 #portal_config.container-sm {
-  width: 750px!important;
+  width: 750px !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-11,
+#portal_config.container-sm .slot.col-sm-offset-11 {
+  margin-left: 91.66666667% !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-10,
+#portal_config.container-sm .slot.col-sm-offset-10 {
+  margin-left: 83.33333333% !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-9,
+#portal_config.container-sm .slot.col-sm-offset-9 {
+  margin-left: 75% !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-8,
+#portal_config.container-sm .slot.col-sm-offset-8 {
+  margin-left: 66.66666667% !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-7,
+#portal_config.container-sm .slot.col-sm-offset-7 {
+  margin-left: 58.33333333% !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-6,
+#portal_config.container-sm .slot.col-sm-offset-6 {
+  margin-left: 50% !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-5,
+#portal_config.container-sm .slot.col-sm-offset-5 {
+  margin-left: 41.66666667% !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-4,
+#portal_config.container-sm .slot.col-sm-offset-4 {
+  margin-left: 33.33333333% !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-3,
+#portal_config.container-sm .slot.col-sm-offset-3 {
+  margin-left: 25% !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-2,
+#portal_config.container-sm .slot.col-sm-offset-2 {
+  margin-left: 16.66666667% !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-1,
+#portal_config.container-sm .slot.col-sm-offset-1 {
+  margin-left: 8.33333333% !important;
+}
+#portal_config.container-sm .slot.col-xs-offset-0,
+#portal_config.container-sm .slot.col-sm-offset-0 {
+  margin-left: 0 !important;
 }
 #portal_config.container-md {
-  width: 970px!important;
+  width: 970px !important;
+}
+#portal_config.container-md .slot.col-xs-offset-11,
+#portal_config.container-md .slot.col-sm-offset-11,
+#portal_config.container-md .slot.col-md-offset-11 {
+  margin-left: 91.66666667% !important;
+}
+#portal_config.container-md .slot.col-xs-offset-10,
+#portal_config.container-md .slot.col-sm-offset-10,
+#portal_config.container-md .slot.col-md-offset-10 {
+  margin-left: 83.33333333% !important;
+}
+#portal_config.container-md .slot.col-xs-offset-9,
+#portal_config.container-md .slot.col-sm-offset-9,
+#portal_config.container-md .slot.col-md-offset-9 {
+  margin-left: 75% !important;
+}
+#portal_config.container-md .slot.col-xs-offset-8,
+#portal_config.container-md .slot.col-sm-offset-8,
+#portal_config.container-md .slot.col-md-offset-8 {
+  margin-left: 66.66666667% !important;
+}
+#portal_config.container-md .slot.col-xs-offset-7,
+#portal_config.container-md .slot.col-sm-offset-7,
+#portal_config.container-md .slot.col-md-offset-7 {
+  margin-left: 58.33333333% !important;
+}
+#portal_config.container-md .slot.col-xs-offset-6,
+#portal_config.container-md .slot.col-sm-offset-6,
+#portal_config.container-md .slot.col-md-offset-6 {
+  margin-left: 50% !important;
+}
+#portal_config.container-md .slot.col-xs-offset-5,
+#portal_config.container-md .slot.col-sm-offset-5,
+#portal_config.container-md .slot.col-md-offset-5 {
+  margin-left: 41.66666667% !important;
+}
+#portal_config.container-md .slot.col-xs-offset-4,
+#portal_config.container-md .slot.col-sm-offset-4,
+#portal_config.container-md .slot.col-md-offset-4 {
+  margin-left: 33.33333333% !important;
+}
+#portal_config.container-md .slot.col-xs-offset-3,
+#portal_config.container-md .slot.col-sm-offset-3,
+#portal_config.container-md .slot.col-md-offset-3 {
+  margin-left: 25% !important;
+}
+#portal_config.container-md .slot.col-xs-offset-2,
+#portal_config.container-md .slot.col-sm-offset-2,
+#portal_config.container-md .slot.col-md-offset-2 {
+  margin-left: 16.66666667% !important;
+}
+#portal_config.container-md .slot.col-xs-offset-1,
+#portal_config.container-md .slot.col-sm-offset-1,
+#portal_config.container-md .slot.col-md-offset-1 {
+  margin-left: 8.33333333% !important;
+}
+#portal_config.container-md .slot.col-xs-offset-0,
+#portal_config.container-md .slot.col-sm-offset-0,
+#portal_config.container-md .slot.col-md-offset-0 {
+  margin-left: 0 !important;
 }
 #portal_config.container-lg {
-  width: 1170px!important;
+  width: 1170px !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-11,
+#portal_config.container-lg .slot.col-sm-offset-11,
+#portal_config.container-lg .slot.col-md-offset-11,
+#portal_config.container-lg .slot.col-lg-offset-11 {
+  margin-left: 91.66666667% !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-10,
+#portal_config.container-lg .slot.col-sm-offset-10,
+#portal_config.container-lg .slot.col-md-offset-10,
+#portal_config.container-lg .slot.col-lg-offset-10 {
+  margin-left: 83.33333333% !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-9,
+#portal_config.container-lg .slot.col-sm-offset-9,
+#portal_config.container-lg .slot.col-md-offset-9,
+#portal_config.container-lg .slot.col-lg-offset-9 {
+  margin-left: 75% !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-8,
+#portal_config.container-lg .slot.col-sm-offset-8,
+#portal_config.container-lg .slot.col-md-offset-8,
+#portal_config.container-lg .slot.col-lg-offset-8 {
+  margin-left: 66.66666667% !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-7,
+#portal_config.container-lg .slot.col-sm-offset-7,
+#portal_config.container-lg .slot.col-md-offset-7,
+#portal_config.container-lg .slot.col-lg-offset-7 {
+  margin-left: 58.33333333% !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-6,
+#portal_config.container-lg .slot.col-sm-offset-6,
+#portal_config.container-lg .slot.col-md-offset-6,
+#portal_config.container-lg .slot.col-lg-offset-6 {
+  margin-left: 50% !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-5,
+#portal_config.container-lg .slot.col-sm-offset-5,
+#portal_config.container-lg .slot.col-md-offset-5,
+#portal_config.container-lg .slot.col-lg-offset-5 {
+  margin-left: 41.66666667% !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-4,
+#portal_config.container-lg .slot.col-sm-offset-4,
+#portal_config.container-lg .slot.col-md-offset-4,
+#portal_config.container-lg .slot.col-lg-offset-4 {
+  margin-left: 33.33333333% !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-3,
+#portal_config.container-lg .slot.col-sm-offset-3,
+#portal_config.container-lg .slot.col-md-offset-3,
+#portal_config.container-lg .slot.col-lg-offset-3 {
+  margin-left: 25% !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-2,
+#portal_config.container-lg .slot.col-sm-offset-2,
+#portal_config.container-lg .slot.col-md-offset-2,
+#portal_config.container-lg .slot.col-lg-offset-2 {
+  margin-left: 16.66666667% !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-1,
+#portal_config.container-lg .slot.col-sm-offset-1,
+#portal_config.container-lg .slot.col-md-offset-1,
+#portal_config.container-lg .slot.col-lg-offset-1 {
+  margin-left: 8.33333333% !important;
+}
+#portal_config.container-lg .slot.col-xs-offset-0,
+#portal_config.container-lg .slot.col-sm-offset-0,
+#portal_config.container-lg .slot.col-md-offset-0,
+#portal_config.container-lg .slot.col-lg-offset-0 {
+  margin-left: 0 !important;
 }
 /*# sourceMappingURL=portal.css.map */
\ No newline at end of file
--- a/src/pyams_portal/resources/css/portal.css.map	Fri Oct 18 16:55:07 2019 +0200
+++ b/src/pyams_portal/resources/css/portal.css.map	Wed Sep 02 17:16:04 2020 +0200
@@ -1,1 +1,1 @@
-{"version":3,"sources":["../less/portal.less"],"names":[],"mappings":"AAAA;EAEC,gBAAA;EACA,eAAA;;AAHD,cAKC;EACC,gBAAA;;AANF,cAQC;EACC,kBAAA;EACA,qBAAA;EACA,YAAA;EACA,yBAAA;EACA,wBAAA;EACA,gBAAA;EACA,YAAA;;AAfF,cAQC,KASC;EACC,kBAAA;EACA,WAAA;EACA,0BAAA;;AAEA,cAdF,KASC,UAKE;EACA,WAAA;;AAED,cAjBF,KASC,UAQE;EACA,YAAA;;AA1BJ,cAQC,KAqBC;EACC,SAAA;EACA,yCAAA;EACA,wBAAA;EACA,0BAAA;;AAjCH,cAQC,KAqBC,MAMC;EACC,WAAA;EACA,yCAAA;EACA,YAAA;;AAtCJ,cAQC,KAiCC;EACC,WAAA;EACA,UAAA;EACA,yCAAA;EACA,0BAAA;;AA7CH,cAQC,KAiCC,SAMC;EACC,yCAAA;EACA,YAAA;;AAjDJ,cAqDC;EACC,aAAA;EACA,yBAAA;EACA,gBAAA;;AAxDF,cA2DC;EACC,gBAAA;;AA5DF,cA8DC;EACC,aAAA;EACA,mCAAA;EACA,mCAAA;EACA,gBAAA;;AAlEF,cAqEC;EACC,gBAAA;;AAEA,cAHD,UAGE;EACA,wBAAA;;AAED,cAND,UAME;EACA,wBAAA;;AA5EH,cA+EC;EACC,SAAA;EACA,yBAAA;EACA,gBAAA;;AAlFF,cAqFC;AArFD,cAsFC;EACC,WAAA;;AAvFF,cAqFC,eAIC;AAzFF,cAsFC,kBAGC;AAzFF,cAqFC,eAKC;AA1FF,cAsFC,kBAIC;EACC,WAAA;;AAGF,cAAC,UACA;EACC,WAAA;EACA,qBAAA;;AAHF,cAAC,UAKA;EACC,WAAA;EACA,6BAAA;;AAPF,cAAC,UASA;EACC,WAAA;EACA,6BAAA;;AAXF,cAAC,UAaA;EACC,WAAA;EACA,oBAAA;;AAfF,cAAC,UAiBA;EACC,WAAA;EACA,6BAAA;;AAnBF,cAAC,UAqBA;EACC,WAAA;EACA,6BAAA;;AAvBF,cAAC,UAyBA;EACC,WAAA;EACA,oBAAA;;AA3BF,cAAC,UA6BA;EACC,WAAA;EACA,6BAAA;;AA/BF,cAAC,UAiCA;EACC,WAAA;EACA,6BAAA;;AAnCF,cAAC,UAqCA;EACC,WAAA;EACA,oBAAA;;AAvCF,cAAC,UAyCA;EACC,WAAA;EACA,6BAAA;;AA3CF,cAAC,UA6CA;EACC,WAAA;EACA,4BAAA;;AA/CF,cAAC,UAiDA;EACC,WAAA;EACA,qBAAA;EACA,YAAA;;AApDF,cAAC,UAiDA,OAKC;EACC,aAAA;;AAIH,cAAC;EACA,0BAAA;;AAED,cAAC;EACA,sBAAA;;AAED,cAAC;EACA,sBAAA;;AAED,cAAC;EACA,uBAAA","file":"portal.css"}
\ No newline at end of file
+{"version":3,"sources":["../less/portal.less"],"names":[],"mappings":"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CD,cAtIF,UACA,MAqIG;EACD,cAvIF,UACA,MAsIG;IACA,qBAAA;;EAED,cA1IF,UACA,MAyIG;EACD,cA3IF,UACA,MA0IG;EACD,cA5IF,UACA,MA2IG;IACA,mBAAA;;EAED,cA/IF,UACA,MA8IG;EACD,cAhJF,UACA,MA+IG;EACD,cAjJF,UACA,MAgJG;IACA,mBAAA;;EAED,cApJF,UACA,MAmJG;EACD,cArJF,UACA,MAoJG;EACD,cAtJF,UACA,MAqJG;IACA,qBAAA;;EAED,cAzJF,UACA,MAwJG;EACD,cA1JF,UACA,MAyJG;EACD,cA3JF,UACA,MA0JG;IACA,mBAAA;;EAED,cA9JF,UACA,MA6JG;EACD,cA/JF,UACA,MA8JG;EACD,cAhKF,UACA,MA+JG;IACA,kBAAA;;EAED,cAnKF,UACA,MAkKG;EACD,cApKF,UACA,MAmKG;EACD,cArKF,UACA,MAoKG;IACA,mBAAA;;;AAIF,QAA0B;EACzB,cA3KF,UACA,MA0KG;EACD,cA5KF,UACA,MA2KG;IACA,sBAAA;;EAED,cA/KF,UACA,MA8KG;EACD,cAhLF,UACA,MA+KG;IACA,mBAAA;;EAED,cAnLF,UACA,MAkLG;EACD,cApLF,UACA,MAmLG;IACA,mBAAA;;EAED,cAvLF,UACA,MAsLG;EACD,cAxLF,UACA,MAuLG;IACA,qBAAA;;EAED,cA3LF,UACA,MA0LG;EACD,cA5LF,UACA,MA2LG;IACA,mBAAA;;EAED,cA/LF,UACA,MA8LG;EACD,cAhMF,UACA,MA+LG;IACA,mBAAA;;EAED,cAnMF,UACA,MAkMG;EACD,cApMF,UACA,MAmMG;IACA,qBAAA;;EAED,cAvMF,UACA,MAsMG;EACD,cAxMF,UACA,MAuMG;IACA,mBAAA;;EAED,cA3MF,UACA,MA0MG;EACD,cA5MF,UACA,MA2MG;IACA,mBAAA;;EAED,cA/MF,UACA,MA8MG;EACD,cAhNF,UACA,MA+MG;IACA,qBAAA;;EAED,cAnNF,UACA,MAkNG;EACD,cApNF,UACA,MAmNG;IACA,mBAAA;;EAED,cAvNF,UACA,MAsNG;EACD,cAxNF,UACA,MAuNG;IACA,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","file":"portal.css"}
\ No newline at end of file
--- a/src/pyams_portal/resources/css/portal.min.css	Fri Oct 18 16:55:07 2019 +0200
+++ b/src/pyams_portal/resources/css/portal.min.css	Wed Sep 02 17:16:04 2020 +0200
@@ -1,1 +1,1 @@
-#portal_config{padding-right:0;padding-left:0}#portal_config .rows{min-height:15px}#portal_config .row{position:relative;margin:1.2em 0 .5em;padding:1px;border:1px solid #337ab7;border-top-width:.65em;min-height:20px;cursor:move}#portal_config .row>.row_id{position:absolute;top:-1.5em;padding:.2em .6em .3em}#portal_config .row>.row_id.pull-left{left:.3em}#portal_config .row>.row_id.pull-right{right:.3em}#portal_config .row .slot{margin:0;border:1px solid rgba(51,122,183,.6);border-bottom-width:5px;min-height:20px!important}#portal_config .row .slot>.header{margin:1px;background-color:rgba(51,122,183,.6);color:#fff}#portal_config .row .portlet{margin:1px;padding:0;border:1px solid rgba(98,120,128,.5);min-height:20px!important}#portal_config .row .portlet>.header{background-color:rgba(92,109,128,.5);color:#fff}#portal_config .row-highlight{margin:5px 0;border:1px solid #c75100;min-height:40px}#portal_config .slots{min-height:15px}#portal_config .slot-highlight{margin:3px 0;border:1px solid #7b939c!important;background-color:#a4c3ce!important;min-height:40px}#portal_config .portlets{min-height:15px}#portal_config .portlets-hover{background-color:silver}#portal_config .portlets-active{background-color:silver}#portal_config .portlet-highlight{margin:0;border:1px solid #7b939c;min-height:40px}#portal_config .wrapper-image,#portal_config .wrapper-imagemap{width:100%}#portal_config .wrapper-image img,#portal_config .wrapper-image svg,#portal_config .wrapper-imagemap img,#portal_config .wrapper-imagemap svg{width:100%}#portal_config.container .col-12{float:left;width:100%!important}#portal_config.container .col-11{float:left;width:91.66666667%!important}#portal_config.container .col-10{float:left;width:83.33333333%!important}#portal_config.container .col-9{float:left;width:75%!important}#portal_config.container .col-8{float:left;width:66.66666667%!important}#portal_config.container .col-7{float:left;width:58.33333333%!important}#portal_config.container .col-6{float:left;width:50%!important}#portal_config.container .col-5{float:left;width:41.66666667%!important}#portal_config.container .col-4{float:left;width:33.33333333%!important}#portal_config.container .col-3{float:left;width:25%!important}#portal_config.container .col-2{float:left;width:16.66666667%!important}#portal_config.container .col-1{float:left;width:8.33333333%!important}#portal_config.container .col-0{float:left;width:100%!important;opacity:.5}#portal_config.container .col-0>.portlets{display:none}#portal_config.container-xs{max-width:750px!important}#portal_config.container-sm{width:750px!important}#portal_config.container-md{width:970px!important}#portal_config.container-lg{width:1170px!important}
+#portal_config{padding-right:0;padding-left:0}#portal_config .rows{min-height:15px}#portal_config .row{position:relative;margin:1.2em 0 .5em;padding:1px;border:1px solid #337ab7;border-top-width:.65em;min-height:20px;cursor:move}#portal_config .row>.row_id{position:absolute;top:-1.5em;padding:.2em .6em .3em}#portal_config .row>.row_id.pull-left{left:.3em}#portal_config .row>.row_id.pull-right{right:.3em}#portal_config .row .slot{margin:0;border:1px solid rgba(51,122,183,.6);border-bottom-width:5px;min-height:20px!important}#portal_config .row .slot>.header{margin:1px;background-color:rgba(51,122,183,.6);color:#fff}#portal_config .row .portlet{margin:1px;padding:0;border:1px solid rgba(98,120,128,.5);min-height:20px!important}#portal_config .row .portlet>.header{background-color:rgba(92,109,128,.5);color:#fff}#portal_config .row-highlight{margin:5px 0;border:1px solid #c75100;min-height:40px}#portal_config .slots{min-height:15px}#portal_config .slot-highlight{margin:3px 0;border:1px solid #7b939c!important;background-color:#a4c3ce!important;min-height:40px}#portal_config .portlets{min-height:15px}#portal_config .portlets-hover{background-color:silver}#portal_config .portlets-active{background-color:silver}#portal_config .portlet-highlight{margin:0;border:1px solid #7b939c;min-height:40px}#portal_config .wrapper-image,#portal_config .wrapper-imagemap{width:100%}#portal_config .wrapper-image img,#portal_config .wrapper-image svg,#portal_config .wrapper-imagemap img,#portal_config .wrapper-imagemap svg{width:100%}#portal_config.container .slot.col-12{float:left;width:100%!important}#portal_config.container .slot.col-11{float:left;width:91.66666667%!important}#portal_config.container .slot.col-10{float:left;width:83.33333333%!important}#portal_config.container .slot.col-9{float:left;width:75%!important}#portal_config.container .slot.col-8{float:left;width:66.66666667%!important}#portal_config.container .slot.col-7{float:left;width:58.33333333%!important}#portal_config.container .slot.col-6{float:left;width:50%!important}#portal_config.container .slot.col-5{float:left;width:41.66666667%!important}#portal_config.container .slot.col-4{float:left;width:33.33333333%!important}#portal_config.container .slot.col-3{float:left;width:25%!important}#portal_config.container .slot.col-2{float:left;width:16.66666667%!important}#portal_config.container .slot.col-1{float:left;width:8.33333333%!important}#portal_config.container .slot.col-0{float:left;width:100%!important;opacity:.5}#portal_config.container .slot.col-0>.portlets{display:none}@media (max-width:767px){#portal_config.container .slot.col-xs-12{width:100%!important}#portal_config.container .slot.col-xs-11{width:91.66666667%!important}#portal_config.container .slot.col-xs-10{width:83.33333333%!important}#portal_config.container .slot.col-xs-9{width:75%!important}#portal_config.container .slot.col-xs-8{width:66.66666667%!important}#portal_config.container .slot.col-xs-7{width:58.33333333%!important}#portal_config.container .slot.col-xs-6{width:50%!important}#portal_config.container .slot.col-xs-5{width:41.66666667%!important}#portal_config.container .slot.col-xs-4{width:33.33333333%!important}#portal_config.container .slot.col-xs-3{width:25%!important}#portal_config.container .slot.col-xs-2{width:16.66666667%!important}#portal_config.container .slot.col-xs-1{width:8.33333333%!important}#portal_config.container .slot.col-xs-0{width:0!important}}@media (min-width:768px){#portal_config.container .slot.col-lg-12,#portal_config.container .slot.col-md-12,#portal_config.container .slot.col-sm-12{width:100%!important}#portal_config.container .slot.col-lg-11,#portal_config.container .slot.col-md-11,#portal_config.container .slot.col-sm-11{width:91.66666667%!important}#portal_config.container .slot.col-lg-10,#portal_config.container .slot.col-md-10,#portal_config.container .slot.col-sm-10{width:83.33333333%!important}#portal_config.container .slot.col-lg-9,#portal_config.container .slot.col-md-9,#portal_config.container .slot.col-sm-9{width:75%!important}#portal_config.container .slot.col-lg-8,#portal_config.container .slot.col-md-8,#portal_config.container .slot.col-sm-8{width:66.66666667%!important}#portal_config.container .slot.col-lg-7,#portal_config.container .slot.col-md-7,#portal_config.container .slot.col-sm-7{width:58.33333333%!important}#portal_config.container .slot.col-lg-6,#portal_config.container .slot.col-md-6,#portal_config.container .slot.col-sm-6{width:50%!important}#portal_config.container .slot.col-lg-5,#portal_config.container .slot.col-md-5,#portal_config.container .slot.col-sm-5{width:41.66666667%!important}#portal_config.container .slot.col-lg-4,#portal_config.container .slot.col-md-4,#portal_config.container .slot.col-sm-4{width:33.33333333%!important}#portal_config.container .slot.col-lg-3,#portal_config.container .slot.col-md-3,#portal_config.container .slot.col-sm-3{width:25%!important}#portal_config.container .slot.col-lg-2,#portal_config.container .slot.col-md-2,#portal_config.container .slot.col-sm-2{width:16.66666667%!important}#portal_config.container .slot.col-lg-1,#portal_config.container .slot.col-md-1,#portal_config.container .slot.col-sm-1{width:8.33333333%!important}#portal_config.container .slot.col-lg-0,#portal_config.container .slot.col-md-0,#portal_config.container .slot.col-sm-0{width:0!important}}@media (min-width:992px){#portal_config.container .slot.col-lg-12,#portal_config.container .slot.col-md-12{width:100%!important}#portal_config.container .slot.col-lg-11,#portal_config.container .slot.col-md-11{width:91.66666667%!important}#portal_config.container .slot.col-lg-10,#portal_config.container .slot.col-md-10{width:83.33333333%!important}#portal_config.container .slot.col-lg-9,#portal_config.container .slot.col-md-9{width:75%!important}#portal_config.container .slot.col-lg-8,#portal_config.container .slot.col-md-8{width:66.66666667%!important}#portal_config.container .slot.col-lg-7,#portal_config.container .slot.col-md-7{width:58.33333333%!important}#portal_config.container .slot.col-lg-6,#portal_config.container .slot.col-md-6{width:50%!important}#portal_config.container .slot.col-lg-5,#portal_config.container .slot.col-md-5{width:41.66666667%!important}#portal_config.container .slot.col-lg-4,#portal_config.container .slot.col-md-4{width:33.33333333%!important}#portal_config.container .slot.col-lg-3,#portal_config.container .slot.col-md-3{width:25%!important}#portal_config.container .slot.col-lg-2,#portal_config.container .slot.col-md-2{width:16.66666667%!important}#portal_config.container .slot.col-lg-1,#portal_config.container .slot.col-md-1{width:8.33333333%!important}#portal_config.container .slot.col-lg-0,#portal_config.container .slot.col-md-0{width:0!important}}@media (min-width:1200px){#portal_config.container .slot.col-lg-12{width:100%!important}#portal_config.container .slot.col-lg-11{width:91.66666667%!important}#portal_config.container .slot.col-lg-10{width:83.33333333%!important}#portal_config.container .slot.col-lg-9{width:75%!important}#portal_config.container .slot.col-lg-8{width:66.66666667%!important}#portal_config.container .slot.col-lg-7{width:58.33333333%!important}#portal_config.container .slot.col-lg-6{width:50%!important}#portal_config.container .slot.col-lg-5{width:41.66666667%!important}#portal_config.container .slot.col-lg-4{width:33.33333333%!important}#portal_config.container .slot.col-lg-3{width:25%!important}#portal_config.container .slot.col-lg-2{width:16.66666667%!important}#portal_config.container .slot.col-lg-1{width:8.33333333%!important}#portal_config.container .slot.col-lg-0{width:0!important}}#portal_config.container-xs{max-width:750px!important}#portal_config.container-xs .slot.col-xs-offset-11{margin-left:91.66666667%!important}#portal_config.container-xs .slot.col-xs-offset-10{margin-left:83.33333333%!important}#portal_config.container-xs .slot.col-xs-offset-9{margin-left:75%!important}#portal_config.container-xs .slot.col-xs-offset-8{margin-left:66.66666667%!important}#portal_config.container-xs .slot.col-xs-offset-7{margin-left:58.33333333%!important}#portal_config.container-xs .slot.col-xs-offset-6{margin-left:50%!important}#portal_config.container-xs .slot.col-xs-offset-5{margin-left:41.66666667%!important}#portal_config.container-xs .slot.col-xs-offset-4{margin-left:33.33333333%!important}#portal_config.container-xs .slot.col-xs-offset-3{margin-left:25%!important}#portal_config.container-xs .slot.col-xs-offset-2{margin-left:16.66666667%!important}#portal_config.container-xs .slot.col-xs-offset-1{margin-left:8.33333333%!important}#portal_config.container-xs .slot.col-xs-offset-0{margin-left:0!important}#portal_config.container-sm{width:750px!important}#portal_config.container-sm .slot.col-sm-offset-11,#portal_config.container-sm .slot.col-xs-offset-11{margin-left:91.66666667%!important}#portal_config.container-sm .slot.col-sm-offset-10,#portal_config.container-sm .slot.col-xs-offset-10{margin-left:83.33333333%!important}#portal_config.container-sm .slot.col-sm-offset-9,#portal_config.container-sm .slot.col-xs-offset-9{margin-left:75%!important}#portal_config.container-sm .slot.col-sm-offset-8,#portal_config.container-sm .slot.col-xs-offset-8{margin-left:66.66666667%!important}#portal_config.container-sm .slot.col-sm-offset-7,#portal_config.container-sm .slot.col-xs-offset-7{margin-left:58.33333333%!important}#portal_config.container-sm .slot.col-sm-offset-6,#portal_config.container-sm .slot.col-xs-offset-6{margin-left:50%!important}#portal_config.container-sm .slot.col-sm-offset-5,#portal_config.container-sm .slot.col-xs-offset-5{margin-left:41.66666667%!important}#portal_config.container-sm .slot.col-sm-offset-4,#portal_config.container-sm .slot.col-xs-offset-4{margin-left:33.33333333%!important}#portal_config.container-sm .slot.col-sm-offset-3,#portal_config.container-sm .slot.col-xs-offset-3{margin-left:25%!important}#portal_config.container-sm .slot.col-sm-offset-2,#portal_config.container-sm .slot.col-xs-offset-2{margin-left:16.66666667%!important}#portal_config.container-sm .slot.col-sm-offset-1,#portal_config.container-sm .slot.col-xs-offset-1{margin-left:8.33333333%!important}#portal_config.container-sm .slot.col-sm-offset-0,#portal_config.container-sm .slot.col-xs-offset-0{margin-left:0!important}#portal_config.container-md{width:970px!important}#portal_config.container-md .slot.col-md-offset-11,#portal_config.container-md .slot.col-sm-offset-11,#portal_config.container-md .slot.col-xs-offset-11{margin-left:91.66666667%!important}#portal_config.container-md .slot.col-md-offset-10,#portal_config.container-md .slot.col-sm-offset-10,#portal_config.container-md .slot.col-xs-offset-10{margin-left:83.33333333%!important}#portal_config.container-md .slot.col-md-offset-9,#portal_config.container-md .slot.col-sm-offset-9,#portal_config.container-md .slot.col-xs-offset-9{margin-left:75%!important}#portal_config.container-md .slot.col-md-offset-8,#portal_config.container-md .slot.col-sm-offset-8,#portal_config.container-md .slot.col-xs-offset-8{margin-left:66.66666667%!important}#portal_config.container-md .slot.col-md-offset-7,#portal_config.container-md .slot.col-sm-offset-7,#portal_config.container-md .slot.col-xs-offset-7{margin-left:58.33333333%!important}#portal_config.container-md .slot.col-md-offset-6,#portal_config.container-md .slot.col-sm-offset-6,#portal_config.container-md .slot.col-xs-offset-6{margin-left:50%!important}#portal_config.container-md .slot.col-md-offset-5,#portal_config.container-md .slot.col-sm-offset-5,#portal_config.container-md .slot.col-xs-offset-5{margin-left:41.66666667%!important}#portal_config.container-md .slot.col-md-offset-4,#portal_config.container-md .slot.col-sm-offset-4,#portal_config.container-md .slot.col-xs-offset-4{margin-left:33.33333333%!important}#portal_config.container-md .slot.col-md-offset-3,#portal_config.container-md .slot.col-sm-offset-3,#portal_config.container-md .slot.col-xs-offset-3{margin-left:25%!important}#portal_config.container-md .slot.col-md-offset-2,#portal_config.container-md .slot.col-sm-offset-2,#portal_config.container-md .slot.col-xs-offset-2{margin-left:16.66666667%!important}#portal_config.container-md .slot.col-md-offset-1,#portal_config.container-md .slot.col-sm-offset-1,#portal_config.container-md .slot.col-xs-offset-1{margin-left:8.33333333%!important}#portal_config.container-md .slot.col-md-offset-0,#portal_config.container-md .slot.col-sm-offset-0,#portal_config.container-md .slot.col-xs-offset-0{margin-left:0!important}#portal_config.container-lg{width:1170px!important}#portal_config.container-lg .slot.col-lg-offset-11,#portal_config.container-lg .slot.col-md-offset-11,#portal_config.container-lg .slot.col-sm-offset-11,#portal_config.container-lg .slot.col-xs-offset-11{margin-left:91.66666667%!important}#portal_config.container-lg .slot.col-lg-offset-10,#portal_config.container-lg .slot.col-md-offset-10,#portal_config.container-lg .slot.col-sm-offset-10,#portal_config.container-lg .slot.col-xs-offset-10{margin-left:83.33333333%!important}#portal_config.container-lg .slot.col-lg-offset-9,#portal_config.container-lg .slot.col-md-offset-9,#portal_config.container-lg .slot.col-sm-offset-9,#portal_config.container-lg .slot.col-xs-offset-9{margin-left:75%!important}#portal_config.container-lg .slot.col-lg-offset-8,#portal_config.container-lg .slot.col-md-offset-8,#portal_config.container-lg .slot.col-sm-offset-8,#portal_config.container-lg .slot.col-xs-offset-8{margin-left:66.66666667%!important}#portal_config.container-lg .slot.col-lg-offset-7,#portal_config.container-lg .slot.col-md-offset-7,#portal_config.container-lg .slot.col-sm-offset-7,#portal_config.container-lg .slot.col-xs-offset-7{margin-left:58.33333333%!important}#portal_config.container-lg .slot.col-lg-offset-6,#portal_config.container-lg .slot.col-md-offset-6,#portal_config.container-lg .slot.col-sm-offset-6,#portal_config.container-lg .slot.col-xs-offset-6{margin-left:50%!important}#portal_config.container-lg .slot.col-lg-offset-5,#portal_config.container-lg .slot.col-md-offset-5,#portal_config.container-lg .slot.col-sm-offset-5,#portal_config.container-lg .slot.col-xs-offset-5{margin-left:41.66666667%!important}#portal_config.container-lg .slot.col-lg-offset-4,#portal_config.container-lg .slot.col-md-offset-4,#portal_config.container-lg .slot.col-sm-offset-4,#portal_config.container-lg .slot.col-xs-offset-4{margin-left:33.33333333%!important}#portal_config.container-lg .slot.col-lg-offset-3,#portal_config.container-lg .slot.col-md-offset-3,#portal_config.container-lg .slot.col-sm-offset-3,#portal_config.container-lg .slot.col-xs-offset-3{margin-left:25%!important}#portal_config.container-lg .slot.col-lg-offset-2,#portal_config.container-lg .slot.col-md-offset-2,#portal_config.container-lg .slot.col-sm-offset-2,#portal_config.container-lg .slot.col-xs-offset-2{margin-left:16.66666667%!important}#portal_config.container-lg .slot.col-lg-offset-1,#portal_config.container-lg .slot.col-md-offset-1,#portal_config.container-lg .slot.col-sm-offset-1,#portal_config.container-lg .slot.col-xs-offset-1{margin-left:8.33333333%!important}#portal_config.container-lg .slot.col-lg-offset-0,#portal_config.container-lg .slot.col-md-offset-0,#portal_config.container-lg .slot.col-sm-offset-0,#portal_config.container-lg .slot.col-xs-offset-0{margin-left:0!important}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/pyams_portal/resources/js/i18n/fr.min.js	Wed Sep 02 17:16:04 2020 +0200
@@ -0,0 +1,1 @@
+jQuery.extend(PyAMS_portal.i18n,{CANT_DELETE_ROW_WITH_PORTLETS:"Une ligne contenant des composants ne peut pas être supprimée !",CANT_DELETE_SLOT_WITH_PORTLETS:"Un panneau contenant des composants ne peut pas être supprimé !"});
--- a/src/pyams_portal/resources/js/portal.js	Fri Oct 18 16:55:07 2019 +0200
+++ b/src/pyams_portal/resources/js/portal.js	Wed Sep 02 17:16:04 2020 +0200
@@ -10,7 +10,7 @@
 		 * I18n strings
          */
 		i18n: {
-			CANT_DELETE_ROW_WITH_PORTLETS: "A row containing portlets dan't be removed!",
+			CANT_DELETE_ROW_WITH_PORTLETS: "A row containing portlets can't be removed!",
 			CANT_DELETE_SLOT_WITH_PORTLETS: "A slot containing portlets can't be removed!"
 		},
 
@@ -99,6 +99,7 @@
 												slot.addClass('col-' + display + '-' + widths[display]);
 											}
 										}
+										slot.addClass(widths.css);
 									}
 								});
 			},
@@ -349,6 +350,7 @@
 									} else {
 										slot.addClass('col-' + widths[device]);
 									}
+									slot.addClass(widths.css);
 								});
 			},
 
@@ -375,6 +377,7 @@
 						slot.addClass('col-' + device + '-' + result.width[device]);
 					}
 				}
+				slot.addClass(result.css);
 			},
 
 			overSlots: function(event, ui) {
--- a/src/pyams_portal/resources/js/portal.min.js	Fri Oct 18 16:55:07 2019 +0200
+++ b/src/pyams_portal/resources/js/portal.min.js	Wed Sep 02 17:16:04 2020 +0200
@@ -1,1 +1,1 @@
-!function(t,e){"use strict";var a=e.MyAMS,o={i18n:{CANT_DELETE_ROW_WITH_PORTLETS:"A row containing portlets dan't be removed!",CANT_DELETE_SLOT_WITH_PORTLETS:"A slot containing portlets can't be removed!"},template:{initConfig:function(){var e=t("#portal_config");e.data("ams-allowed-change")&&(t(".rows",e).addClass("sortable"),t(".slots",e).addClass("sortable"),t(".slot",e).addClass("resizable"),t(".portlets",e).addClass("sortable"),a.plugins.enabled.sortable(e),a.plugins.enabled.resizable(e),t(".btn-row",".btn-toolbar").draggable({cursor:"move",helper:"clone",revert:"invalid",connectToSortable:".rows"}),t(".rows",e).droppable({accept:".btn-row",drop:o.template.dropRowButton}),t(".btn-slot",".btn-toolbar").draggable({cursor:"move",helper:"clone",revert:"invalid",connectToSortable:".slots"}),t(".slots",e).droppable({accept:".btn-slot",drop:o.template.dropSlotButton}),t(".btn-portlet",".btn-toolbar").draggable({cursor:"move",helper:"clone",revert:"invalid",connectToSortable:".portlets"}),t(".portlets",e).droppable({accept:".btn-portlet",hoverClass:"portlets-hover",activeClass:"portlets-active",drop:o.template.dropPortletButton}))},selectDisplay:function(){var e=t(this).val();a.ajax.post("get-slots-width.json",{device:e},function(a){var o=t("#portal_config");o.removeClassPrefix("container-"),e&&o.addClass("container-"+e),t(".slot",o).removeClassPrefix("col-");for(var s in a)if(a.hasOwnProperty(s)){var l=a[s],r=t('.slot[data-ams-slot-name="'+s+'"]',o);if(e)r.addClass("col-"+l[e]);else for(var n in l)l.hasOwnProperty(n)&&r.addClass("col-"+n+"-"+l[n])}})},addRow:function(){return function(){t(this).parents(".btn-group").removeClass("open"),a.ajax.post("add-template-row.json",{},function(e){var s=e.row_id,l=t(".rows","#portal_config");t("<div></div>").addClass("row context-menu").attr("data-ams-row-id",s).append(t("<strong></strong>").addClass("row_id label label-danger pull-left").text(s+1)).append(t("<strong></strong>").addClass("row_id label label-danger pull-right").text(s+1)).append(t("<div></div>").addClass("slots").sortable({placeholder:"slot-highlight",connectWith:".slots",over:o.template.overSlots,stop:o.template.sortSlots}).droppable({accept:".btn-slot",drop:o.template.dropSlotButton})).contextMenu({menuSelector:"#rowMenu",menuSelected:a.helpers.contextMenuHandler}).appendTo(l),l.sortable("refresh")})}},dropRowButton:function(e,s){s.draggable.hasClass("already-dropped")||(s.draggable.addClass("already-dropped"),a.ajax.post("add-template-row.json",{},function(e){var l=e.row_id,r=t(".rows","#portal_config");s.draggable.removeClassPrefix("btn").removeClassPrefix("ui-").removeClassPrefix("bg-").removeClass("already-dropped").removeAttr("style").addClass("row context-menu").attr("data-ams-row-id",l).empty().append(t("<strong></strong>").addClass("row_id label label-danger pull-left").text(l+1)).append(t("<strong></strong>").addClass("row_id label label-danger pull-right").text(l+1)).append(t("<div></div>").addClass("slots").sortable({placeholder:"slot-highlight",connectWith:".slots",over:o.template.overSlots,stop:o.template.sortSlots}).droppable({accept:".btn-slot",drop:o.template.dropSlotButton})).contextMenu({menuSelector:"#rowMenu",menuSelected:a.helpers.contextMenuHandler}),o.template.sortRows(),r.sortable("refresh")}))},overRows:function(e,a){t(a.placeholder).attr("class",t(a.item).attr("class")).removeClassPrefix("ui-").addClass("row-highlight").css("height",t(a.item).outerHeight())},sortRows:function(e,o){if(!o||!o.item.hasClass("already-dropped")){var s=t("#portal_config"),l=t(".row",s).listattr("data-ams-row-id");a.ajax.post("set-template-row-order.json",{rows:JSON.stringify(l)},function(e){"success"===e.status&&t(".row",s).each(function(e){t(this).attr("data-ams-row-id",e),t(".row_id",t(this)).text(e+1)})})}},deleteRow:function(){return function(e){e=e.objectOrParentWithClass("row"),t(".portlet",e).exists()?a.skin.messageBox("error",{title:a.i18n.ERROR_OCCURED,content:o.i18n.CANT_DELETE_ROW_WITH_PORTLETS,icon:"fa fa-warning animated shake",timeout:5e3}):a.skin.bigBox({title:a.i18n.WARNING,content:'<i class="text-danger fa fa-2x fa-bell"></i>&nbsp; '+a.i18n.DELETE_WARNING,status:"info",buttons:a.i18n.BTN_OK_CANCEL},function(o){o===a.i18n.BTN_OK&&a.ajax.post("delete-template-row.json",{row_id:e.data("ams-row-id")},function(a){"success"===a.status&&(e.remove(),t(".row","#portal_config").each(function(e){t(this).removeData().attr("data-ams-row-id",e),t(".row_id",t(this)).text(e+1)}))})})}},addSlotCallback:function(e){var s=t(".slots",'.row[data-ams-row-id="'+e.row_id+'"]'),l=e.slot_name,r=t("<div></div>").addClass("slot context-menu no-padding col col-xs-12 col-sm-12 col-md-12 col-lg-12 resizable").attr("data-ams-slot-name",l).append(t("<div></div>").addClass("header padding-x-5").append('<i class="fa fa-fw fa-minus-square pull-right padding-top-2"    data-ams-click-handler="PyAMS_portal.template.switchSlot"></i>').append(l)).append(t("<div></div>").addClass("portlets").sortable({placeholder:"portlet-highlight",connectWith:".portlets",over:o.template.overPortlets,stop:o.template.sortPortlets}).droppable({accept:".btn-portlet",hoverClass:"portlets-hover",activeClass:"portlets-active",drop:o.template.dropPortletButton})).append(t("<div></div>").addClass("clearfix")).contextMenu({menuSelector:"#slotMenu",menuSelected:a.helpers.contextMenuHandler}),n=t(".btn-slot",s);n.exists()?(n.replaceWith(r),t(".slot",s).each(function(){t(this).removeData()}),o.template.sortSlots()):r.appendTo(s),r.resizable({start:o.template.startSlotResize,stop:o.template.stopSlotResize,handles:"e"}),s.sortable("refresh")},dropSlotButton:function(e,o){if(!o.draggable.hasClass("already-dropped")){o.draggable.addClass("already-dropped");var s=o.helper.parents(".row:first").data("ams-row-id");a.dialog.open("add-template-slot.html?add_form.widgets.row_id="+s,{},{hide:function(){t(".already-dropped").remove()}})}},startSlotResize:function(t,e){var a=e.element,o=a.parents(".slots:first"),s=(o.innerWidth()-110)/12,l=a.height();e.element.resizable("option","grid",[s,l]),e.element.resizable("option","minWidth",s),e.element.resizable("option","minHeight",l),e.element.resizable("option","maxWidth",o.innerWidth()),e.element.resizable("option","maxHeight",l)},stopSlotResize:function(e,o){var s=o.element,l=(s.parents(".slots:first").innerWidth()-10)/12,r=Math.round(t(s).width()/l),n=t("#device_selector").val();if(!n){var i=t("body").width();n=i>1170?"lg":i>970?"md":i>750?"sm":"xs"}a.ajax.post("set-slot-width.json",{slot_name:s.data("ams-slot-name"),device:n,width:r},function(t){s.removeClassPrefix("col-"),s.removeAttr("style");var e=t[s.data("ams-slot-name")];n?s.addClass("col-"+n+"-"+e[n]):s.addClass("col-"+e[n])})},editSlot:function(){return function(t){t.hasClass("slot")||(t=t.parents(".slot")),a.dialog.open("slot-properties.html?slot.widgets.slot_name="+t.data("ams-slot-name"))}},editSlotCallback:function(e){var a=t('.slot[data-ams-slot-name="'+e.slot_name+'"]');a.attr("class","slot context-menu no-padding col");var o=t("#device_selector").val();if(o)a.addClass("col-"+e.width[o]);else for(o in e.width)e.width.hasOwnProperty(o)&&a.addClass("col-"+o+"-"+e.width[o])},overSlots:function(e,a){t(a.placeholder).attr("class",t(a.item).attr("class")).removeClassPrefix("ui-").addClass("slot-highlight").css("height",t(a.item).outerHeight())},sortSlots:function(e,o){if(!o||!o.item.hasClass("already-dropped")){var s=t("#portal_config"),l={};t(".row",s).each(function(){var e=t(this),a=[];t(".slot",e).each(function(){a.push(t(this).data("ams-slot-name"))}),l[parseInt(e.attr("data-ams-row-id"))]=a}),a.ajax.post("set-template-slot-order.json",{order:JSON.stringify(l)})}},switchSlot:function(){var e=t(this),a=e.parents(".header").first().siblings(".portlets");a.hasClass("hidden")?(a.removeClass("hidden"),e.removeClass("fa-plus-square").addClass("fa-minus-square")):(a.addClass("hidden"),e.removeClass("fa-minus-square").addClass("fa-plus-square"))},deleteSlot:function(){return function(e){e=e.objectOrParentWithClass("slot"),t(".portlet",e).exists()?a.skin.messageBox("error",{title:a.i18n.ERROR_OCCURED,content:o.i18n.CANT_DELETE_SLOT_WITH_PORTLETS,icon:"fa fa-warning animated shake",timeout:5e3}):a.skin.bigBox({title:a.i18n.WARNING,content:'<i class="text-danger fa fa-2x fa-bell"></i>&nbsp; '+a.i18n.DELETE_WARNING,status:"info",buttons:a.i18n.BTN_OK_CANCEL},function(o){o===a.i18n.BTN_OK&&a.ajax.post("delete-template-slot.json",{slot_name:e.data("ams-slot-name")},function(a){"success"===a.status&&(e.remove(),t(".slot","#portal_config").each(function(){t(this).removeData()}))})})}},addPortletCallback:function(e){var s=t(".portlets",'.slot[data-ams-slot-name="'+e.slot_name+'"]'),l=t("<div></div>").addClass("portlet context-menu").attr("data-ams-portlet-id",e.portlet_id).append(t("<div></div>").addClass("header padding-x-5").append('<i class="fa fa-fw fa-minus-square pull-right padding-top-2"    data-ams-click-handler="PyAMS_portal.template.switchPortlet"></i>').append(e.label).append(" ").append('<i class="fa fa-fw fa-edit hint opaque align-base"    data-ams-url="PyAMS_portal.template.editPortlet"    data-ams-hint-gravity="se" data-ams-hint-offset="2"></i>')).append(t("<div></div>").addClass("preview").html(e.preview||"")).contextMenu({menuSelector:"#portletMenu",menuSelected:a.helpers.contextMenuHandler});a.initContent(t(".preview",l));var r=t(".btn-portlet",s);r.exists()?(r.replaceWith(l),t(".portlet",s).each(function(){t(this).removeData()}),o.template.sortPortlets(null,{item:l})):l.appendTo(s),s.sortable("refresh"),a.dialog.open("portlet-properties.html?portlet.widgets.portlet_id="+e.portlet_id)},dropPortletButton:function(e,o){if(!o.draggable.hasClass("already-dropped")){o.draggable.addClass("already-dropped");var s=o.draggable,l=t(this).parents(".slot:first");a.ajax.post("drag-template-portlet.json",{portlet_name:s.data("ams-portlet-name"),slot_name:l.data("ams-slot-name")},function(t){a.ajax.handleJSON(t)})}},submitPortletEditForm:function(){var e=t(this).parents("form").first();a.form.submit(e,{form_data:{autosubmit:!0}})},editPortlet:function(){return function(t){void 0===t&&(t=this),t.hasClass("portlet")||(t=t.parents(".portlet:first")),a.dialog.open("portlet-properties.html?portlet.widgets.portlet_id="+t.data("ams-portlet-id"))}},editPortletCallback:function(e){if(e.preview){var o=t("#portal_config"),s=t('.portlet[data-ams-portlet-id="'+e.portlet_id+'"]',o),l=t(".header",s);e.inherit_parent?t("i.chain",l).removeClass("fa-chain-broken"):t("i.chain",l).addClass("fa-chain-broken"),t(".preview",s).html(e.preview),a.initContent(t(".preview",s))}},overPortlets:function(e,a){t(a.placeholder).attr("class",t(a.item).attr("class")).removeClassPrefix("ui-").addClass("portlet-highlight").css("height",t(a.item).outerHeight())},sortPortlets:function(e,o){if(!o.item.hasClass("already-dropped")){var s=o.item,l=s.parents(".slot"),r=t(".portlet",l),n={from:s.data("ams-portlet-id"),to:{slot:l.data("ams-slot-name"),portlet_ids:r.listattr("data-ams-portlet-id")}};a.ajax.post("set-template-portlet-order.json",{order:JSON.stringify(n)})}},switchPortlet:function(){var e=t(this),a=e.parents(".header").first().siblings(".preview");a.hasClass("hidden")?(a.removeClass("hidden"),e.removeClass("fa-plus-square").addClass("fa-minus-square")):(a.addClass("hidden"),e.removeClass("fa-minus-square").addClass("fa-plus-square"))},deletePortlet:function(){return function(e){a.skin.bigBox({title:a.i18n.WARNING,content:'<i class="text-danger fa fa-2x fa-bell"></i>&nbsp; '+a.i18n.DELETE_WARNING,status:"info",buttons:a.i18n.BTN_OK_CANCEL},function(o){o===a.i18n.BTN_OK&&(e.hasClass("portlet")||(e=e.parents(".portlet")),a.ajax.post("delete-template-portlet.json",{portlet_id:e.data("ams-portlet-id")},function(a){"success"===a.status&&(e.remove(),t(".portlet","#portal_config").each(function(){t(this).removeData()}))}))})}}}};e.PyAMS_portal=o;t("HTML");"en"!==a.lang&&a.getScript("/--static--/pyams_portal/js/i18n/"+a.lang+a.devext+".js")}(jQuery,this);
+!function(t,e){"use strict";var a=e.MyAMS,s={i18n:{CANT_DELETE_ROW_WITH_PORTLETS:"A row containing portlets can't be removed!",CANT_DELETE_SLOT_WITH_PORTLETS:"A slot containing portlets can't be removed!"},template:{initConfig:function(){var e=t("#portal_config");e.data("ams-allowed-change")&&(t(".rows",e).addClass("sortable"),t(".slots",e).addClass("sortable"),t(".slot",e).addClass("resizable"),t(".portlets",e).addClass("sortable"),a.plugins.enabled.sortable(e),a.plugins.enabled.resizable(e),t(".btn-row",".btn-toolbar").draggable({cursor:"move",helper:"clone",revert:"invalid",connectToSortable:".rows"}),t(".rows",e).droppable({accept:".btn-row",drop:s.template.dropRowButton}),t(".btn-slot",".btn-toolbar").draggable({cursor:"move",helper:"clone",revert:"invalid",connectToSortable:".slots"}),t(".slots",e).droppable({accept:".btn-slot",drop:s.template.dropSlotButton}),t(".btn-portlet",".btn-toolbar").draggable({cursor:"move",helper:"clone",revert:"invalid",connectToSortable:".portlets"}),t(".portlets",e).droppable({accept:".btn-portlet",hoverClass:"portlets-hover",activeClass:"portlets-active",drop:s.template.dropPortletButton}))},selectDisplay:function(){var e=t(this).val();a.ajax.post("get-slots-width.json",{device:e},(function(a){var s=t("#portal_config");for(var o in s.removeClassPrefix("container-"),e&&s.addClass("container-"+e),t(".slot",s).removeClassPrefix("col-"),a)if(a.hasOwnProperty(o)){var l=a[o],r=t('.slot[data-ams-slot-name="'+o+'"]',s);if(e)r.addClass("col-"+l[e]);else for(var n in l)l.hasOwnProperty(n)&&r.addClass("col-"+n+"-"+l[n]);r.addClass(l.css)}}))},addRow:function(){return function(){t(this).parents(".btn-group").removeClass("open"),a.ajax.post("add-template-row.json",{},(function(e){var o=e.row_id,l=t(".rows","#portal_config");t("<div></div>").addClass("row context-menu").attr("data-ams-row-id",o).append(t("<strong></strong>").addClass("row_id label label-danger pull-left").text(o+1)).append(t("<strong></strong>").addClass("row_id label label-danger pull-right").text(o+1)).append(t("<div></div>").addClass("slots").sortable({placeholder:"slot-highlight",connectWith:".slots",over:s.template.overSlots,stop:s.template.sortSlots}).droppable({accept:".btn-slot",drop:s.template.dropSlotButton})).contextMenu({menuSelector:"#rowMenu",menuSelected:a.helpers.contextMenuHandler}).appendTo(l),l.sortable("refresh")}))}},dropRowButton:function(e,o){o.draggable.hasClass("already-dropped")||(o.draggable.addClass("already-dropped"),a.ajax.post("add-template-row.json",{},(function(e){var l=e.row_id,r=t(".rows","#portal_config");o.draggable.removeClassPrefix("btn").removeClassPrefix("ui-").removeClassPrefix("bg-").removeClass("already-dropped").removeAttr("style").addClass("row context-menu").attr("data-ams-row-id",l).empty().append(t("<strong></strong>").addClass("row_id label label-danger pull-left").text(l+1)).append(t("<strong></strong>").addClass("row_id label label-danger pull-right").text(l+1)).append(t("<div></div>").addClass("slots").sortable({placeholder:"slot-highlight",connectWith:".slots",over:s.template.overSlots,stop:s.template.sortSlots}).droppable({accept:".btn-slot",drop:s.template.dropSlotButton})).contextMenu({menuSelector:"#rowMenu",menuSelected:a.helpers.contextMenuHandler}),s.template.sortRows(),r.sortable("refresh")})))},overRows:function(e,a){t(a.placeholder).attr("class",t(a.item).attr("class")).removeClassPrefix("ui-").addClass("row-highlight").css("height",t(a.item).outerHeight())},sortRows:function(e,s){if(!s||!s.item.hasClass("already-dropped")){var o=t("#portal_config"),l=t(".row",o).listattr("data-ams-row-id");a.ajax.post("set-template-row-order.json",{rows:JSON.stringify(l)},(function(e){"success"===e.status&&t(".row",o).each((function(e){t(this).attr("data-ams-row-id",e),t(".row_id",t(this)).text(e+1)}))}))}},deleteRow:function(){return function(e){e=e.objectOrParentWithClass("row"),t(".portlet",e).exists()?a.skin.messageBox("error",{title:a.i18n.ERROR_OCCURED,content:s.i18n.CANT_DELETE_ROW_WITH_PORTLETS,icon:"fa fa-warning animated shake",timeout:5e3}):a.skin.bigBox({title:a.i18n.WARNING,content:'<i class="text-danger fa fa-2x fa-bell"></i>&nbsp; '+a.i18n.DELETE_WARNING,status:"info",buttons:a.i18n.BTN_OK_CANCEL},(function(s){s===a.i18n.BTN_OK&&a.ajax.post("delete-template-row.json",{row_id:e.data("ams-row-id")},(function(a){"success"===a.status&&(e.remove(),t(".row","#portal_config").each((function(e){t(this).removeData().attr("data-ams-row-id",e),t(".row_id",t(this)).text(e+1)})))}))}))}},addSlotCallback:function(e){var o=t(".slots",'.row[data-ams-row-id="'+e.row_id+'"]'),l=e.slot_name,r=t("<div></div>").addClass("slot context-menu no-padding col col-xs-12 col-sm-12 col-md-12 col-lg-12 resizable").attr("data-ams-slot-name",l).append(t("<div></div>").addClass("header padding-x-5").append('<i class="fa fa-fw fa-minus-square pull-right padding-top-2"    data-ams-click-handler="PyAMS_portal.template.switchSlot"></i>').append(l)).append(t("<div></div>").addClass("portlets").sortable({placeholder:"portlet-highlight",connectWith:".portlets",over:s.template.overPortlets,stop:s.template.sortPortlets}).droppable({accept:".btn-portlet",hoverClass:"portlets-hover",activeClass:"portlets-active",drop:s.template.dropPortletButton})).append(t("<div></div>").addClass("clearfix")).contextMenu({menuSelector:"#slotMenu",menuSelected:a.helpers.contextMenuHandler}),n=t(".btn-slot",o);n.exists()?(n.replaceWith(r),t(".slot",o).each((function(){t(this).removeData()})),s.template.sortSlots()):r.appendTo(o),r.resizable({start:s.template.startSlotResize,stop:s.template.stopSlotResize,handles:"e"}),o.sortable("refresh")},dropSlotButton:function(e,s){if(!s.draggable.hasClass("already-dropped")){s.draggable.addClass("already-dropped");var o=s.helper.parents(".row:first").data("ams-row-id");a.dialog.open("add-template-slot.html?add_form.widgets.row_id="+o,{},{hide:function(){t(".already-dropped").remove()}})}},startSlotResize:function(t,e){var a=e.element,s=a.parents(".slots:first"),o=(s.innerWidth()-110)/12,l=a.height();e.element.resizable("option","grid",[o,l]),e.element.resizable("option","minWidth",o),e.element.resizable("option","minHeight",l),e.element.resizable("option","maxWidth",s.innerWidth()),e.element.resizable("option","maxHeight",l)},stopSlotResize:function(e,s){var o=s.element,l=(o.parents(".slots:first").innerWidth()-10)/12,r=Math.round(t(o).width()/l),n=t("#device_selector").val();if(!n){var i=t("body").width();n=i>1170?"lg":i>970?"md":i>750?"sm":"xs"}a.ajax.post("set-slot-width.json",{slot_name:o.data("ams-slot-name"),device:n,width:r},(function(t){o.removeClassPrefix("col-"),o.removeAttr("style");var e=t[o.data("ams-slot-name")];n?o.addClass("col-"+n+"-"+e[n]):o.addClass("col-"+e[n]),o.addClass(e.css)}))},editSlot:function(){return function(t){t.hasClass("slot")||(t=t.parents(".slot")),a.dialog.open("slot-properties.html?slot.widgets.slot_name="+t.data("ams-slot-name"))}},editSlotCallback:function(e){var a=t('.slot[data-ams-slot-name="'+e.slot_name+'"]');a.attr("class","slot context-menu no-padding col");var s=t("#device_selector").val();if(s)a.addClass("col-"+e.width[s]);else for(s in e.width)e.width.hasOwnProperty(s)&&a.addClass("col-"+s+"-"+e.width[s]);a.addClass(e.css)},overSlots:function(e,a){t(a.placeholder).attr("class",t(a.item).attr("class")).removeClassPrefix("ui-").addClass("slot-highlight").css("height",t(a.item).outerHeight())},sortSlots:function(e,s){if(!s||!s.item.hasClass("already-dropped")){var o=t("#portal_config"),l={};t(".row",o).each((function(){var e=t(this),a=[];t(".slot",e).each((function(){a.push(t(this).data("ams-slot-name"))})),l[parseInt(e.attr("data-ams-row-id"))]=a})),a.ajax.post("set-template-slot-order.json",{order:JSON.stringify(l)})}},switchSlot:function(){var e=t(this),a=e.parents(".header").first().siblings(".portlets");a.hasClass("hidden")?(a.removeClass("hidden"),e.removeClass("fa-plus-square").addClass("fa-minus-square")):(a.addClass("hidden"),e.removeClass("fa-minus-square").addClass("fa-plus-square"))},deleteSlot:function(){return function(e){e=e.objectOrParentWithClass("slot"),t(".portlet",e).exists()?a.skin.messageBox("error",{title:a.i18n.ERROR_OCCURED,content:s.i18n.CANT_DELETE_SLOT_WITH_PORTLETS,icon:"fa fa-warning animated shake",timeout:5e3}):a.skin.bigBox({title:a.i18n.WARNING,content:'<i class="text-danger fa fa-2x fa-bell"></i>&nbsp; '+a.i18n.DELETE_WARNING,status:"info",buttons:a.i18n.BTN_OK_CANCEL},(function(s){s===a.i18n.BTN_OK&&a.ajax.post("delete-template-slot.json",{slot_name:e.data("ams-slot-name")},(function(a){"success"===a.status&&(e.remove(),t(".slot","#portal_config").each((function(){t(this).removeData()})))}))}))}},addPortletCallback:function(e){var o=t(".portlets",'.slot[data-ams-slot-name="'+e.slot_name+'"]'),l=t("<div></div>").addClass("portlet context-menu").attr("data-ams-portlet-id",e.portlet_id).append(t("<div></div>").addClass("header padding-x-5").append('<i class="fa fa-fw fa-minus-square pull-right padding-top-2"    data-ams-click-handler="PyAMS_portal.template.switchPortlet"></i>').append(e.label).append(" ").append('<i class="fa fa-fw fa-edit hint opaque align-base"    data-ams-url="PyAMS_portal.template.editPortlet"    data-ams-hint-gravity="se" data-ams-hint-offset="2"></i>')).append(t("<div></div>").addClass("preview").html(e.preview||"")).contextMenu({menuSelector:"#portletMenu",menuSelected:a.helpers.contextMenuHandler});a.initContent(t(".preview",l));var r=t(".btn-portlet",o);r.exists()?(r.replaceWith(l),t(".portlet",o).each((function(){t(this).removeData()})),s.template.sortPortlets(null,{item:l})):l.appendTo(o),o.sortable("refresh"),a.dialog.open("portlet-properties.html?portlet.widgets.portlet_id="+e.portlet_id)},dropPortletButton:function(e,s){if(!s.draggable.hasClass("already-dropped")){s.draggable.addClass("already-dropped");var o=s.draggable,l=t(this).parents(".slot:first");a.ajax.post("drag-template-portlet.json",{portlet_name:o.data("ams-portlet-name"),slot_name:l.data("ams-slot-name")},(function(t){a.ajax.handleJSON(t)}))}},submitPortletEditForm:function(){var e=t(this).parents("form").first();a.form.submit(e,{form_data:{autosubmit:!0}})},editPortlet:function(){return function(t){void 0===t&&(t=this),t.hasClass("portlet")||(t=t.parents(".portlet:first")),a.dialog.open("portlet-properties.html?portlet.widgets.portlet_id="+t.data("ams-portlet-id"))}},editPortletCallback:function(e){if(e.preview){var s=t("#portal_config"),o=t('.portlet[data-ams-portlet-id="'+e.portlet_id+'"]',s),l=t(".header",o);e.inherit_parent?t("i.chain",l).removeClass("fa-chain-broken"):t("i.chain",l).addClass("fa-chain-broken"),t(".preview",o).html(e.preview),a.initContent(t(".preview",o))}},overPortlets:function(e,a){t(a.placeholder).attr("class",t(a.item).attr("class")).removeClassPrefix("ui-").addClass("portlet-highlight").css("height",t(a.item).outerHeight())},sortPortlets:function(e,s){if(!s.item.hasClass("already-dropped")){var o=s.item,l=o.parents(".slot"),r=t(".portlet",l),n={from:o.data("ams-portlet-id"),to:{slot:l.data("ams-slot-name"),portlet_ids:r.listattr("data-ams-portlet-id")}};a.ajax.post("set-template-portlet-order.json",{order:JSON.stringify(n)})}},switchPortlet:function(){var e=t(this),a=e.parents(".header").first().siblings(".preview");a.hasClass("hidden")?(a.removeClass("hidden"),e.removeClass("fa-plus-square").addClass("fa-minus-square")):(a.addClass("hidden"),e.removeClass("fa-minus-square").addClass("fa-plus-square"))},deletePortlet:function(){return function(e){a.skin.bigBox({title:a.i18n.WARNING,content:'<i class="text-danger fa fa-2x fa-bell"></i>&nbsp; '+a.i18n.DELETE_WARNING,status:"info",buttons:a.i18n.BTN_OK_CANCEL},(function(s){s===a.i18n.BTN_OK&&(e.hasClass("portlet")||(e=e.parents(".portlet")),a.ajax.post("delete-template-portlet.json",{portlet_id:e.data("ams-portlet-id")},(function(a){"success"===a.status&&(e.remove(),t(".portlet","#portal_config").each((function(){t(this).removeData()})))})))}))}}}};e.PyAMS_portal=s;t("HTML");"en"!==a.lang&&a.getScript("/--static--/pyams_portal/js/i18n/"+a.lang+a.devext+".js")}(jQuery,this);
--- a/src/pyams_portal/resources/less/portal.less	Fri Oct 18 16:55:07 2019 +0200
+++ b/src/pyams_portal/resources/less/portal.less	Wed Sep 02 17:16:04 2020 +0200
@@ -31,7 +31,7 @@
 			margin: 0;
 			border: 1px solid rgba(51, 122, 183, 0.6);
 			border-bottom-width: 5px;
-			min-height: 20px!important;
+			min-height: 20px !important;
 
 			>.header {
 				margin: 1px;
@@ -43,7 +43,7 @@
 			margin: 1px;
 			padding: 0;
 			border: 1px solid rgba(98, 120, 128, 0.5);
-			min-height: 20px!important;
+			min-height: 20px !important;
 
 			>.header {
 				background-color: rgba(92, 109, 128, 0.5);
@@ -62,8 +62,8 @@
 	}
 	.slot-highlight {
 		margin: 3px 0;
-		border: 1px solid #7b939c!important;
-		background-color: #a4c3ce!important;
+		border: 1px solid #7b939c !important;
+		background-color: #a4c3ce !important;
 		min-height: 40px;
 	}
 
@@ -93,74 +93,511 @@
 		}
 	}
 	&.container {
-		.col-12 {
-			float: left;
-			width: 100%!important;
-		}
-		.col-11 {
-			float: left;
-			width: 91.66666667%!important;
-		}
-		.col-10 {
-			float: left;
-			width: 83.33333333%!important;
-		}
-		.col-9 {
-			float: left;
-			width: 75%!important;
-		}
-		.col-8 {
-			float: left;
-			width: 66.66666667%!important;
-		}
-		.col-7 {
-			float: left;
-			width: 58.33333333%!important;
-		}
-		.col-6 {
-			float: left;
-			width: 50%!important;
-		}
-		.col-5 {
-			float: left;
-			width: 41.66666667%!important;
-		}
-		.col-4 {
-			float: left;
-			width: 33.33333333%!important;
-		}
-		.col-3 {
-			float: left;
-			width: 25%!important;
-		}
-		.col-2 {
-			float: left;
-			width: 16.66666667%!important;
-		}
-		.col-1 {
-			float: left;
-			width: 8.33333333%!important;
-		}
-		.col-0 {
-			float: left;
-			width: 100%!important;
-			opacity: 0.5;
+		.slot {
+			&.col-12 {
+				float: left;
+				width: 100% !important;
+			}
+			&.col-11 {
+				float: left;
+				width: 91.66666667% !important;
+			}
+			&.col-10 {
+				float: left;
+				width: 83.33333333% !important;
+			}
+			&.col-9 {
+				float: left;
+				width: 75% !important;
+			}
+			&.col-8 {
+				float: left;
+				width: 66.66666667% !important;
+			}
+			&.col-7 {
+				float: left;
+				width: 58.33333333% !important;
+			}
+			&.col-6 {
+				float: left;
+				width: 50% !important;
+			}
+			&.col-5 {
+				float: left;
+				width: 41.66666667% !important;
+			}
+			&.col-4 {
+				float: left;
+				width: 33.33333333% !important;
+			}
+			&.col-3 {
+				float: left;
+				width: 25% !important;
+			}
+			&.col-2 {
+				float: left;
+				width: 16.66666667% !important;
+			}
+			&.col-1 {
+				float: left;
+				width: 8.33333333% !important;
+			}
+			&.col-0 {
+				float: left;
+				width: 100% !important;
+				opacity: 0.5;
+
+				> .portlets {
+					display: none;
+				}
+			}
+
+			@media (max-width: 767px) {
+				&.col-xs-12 {
+					width: 100% !important;
+				}
+				&.col-xs-11 {
+					width: 91.66666667% !important;
+				}
+				&.col-xs-10 {
+					width: 83.33333333% !important;
+				}
+				&.col-xs-9 {
+					width: 75% !important;
+				}
+				&.col-xs-8 {
+					width: 66.66666667% !important;
+				}
+				&.col-xs-7 {
+					width: 58.33333333% !important;
+				}
+				&.col-xs-6 {
+					width: 50% !important;
+				}
+				&.col-xs-5 {
+					width: 41.66666667% !important;
+				}
+				&.col-xs-4 {
+					width: 33.33333333% !important;
+				}
+				&.col-xs-3 {
+					width: 25% !important;
+				}
+				&.col-xs-2 {
+					width: 16.66666667% !important;
+				}
+				&.col-xs-1 {
+					width: 8.33333333% !important;
+				}
+				&.col-xs-0 {
+					width: 0 !important;
+				}
+			}
 
-			>.portlets {
-				display: none;
+			@media (min-width: 768px) {
+				&.col-sm-12,
+				&.col-md-12,
+				&.col-lg-12 {
+					width: 100% !important;
+				}
+				&.col-sm-11,
+				&.col-md-11,
+				&.col-lg-11 {
+					width: 91.66666667% !important;
+				}
+				&.col-sm-10,
+				&.col-md-10,
+				&.col-lg-10 {
+					width: 83.33333333% !important;
+				}
+				&.col-sm-9,
+				&.col-md-9,
+				&.col-lg-9 {
+					width: 75% !important;
+				}
+				&.col-sm-8,
+				&.col-md-8,
+				&.col-lg-8 {
+					width: 66.66666667% !important;
+				}
+				&.col-sm-7,
+				&.col-md-7,
+				&.col-lg-7 {
+					width: 58.33333333% !important;
+				}
+				&.col-sm-6,
+				&.col-md-6,
+				&.col-lg-6 {
+					width: 50% !important;
+				}
+				&.col-sm-5,
+				&.col-md-5,
+				&.col-lg-5 {
+					width: 41.66666667% !important;
+				}
+				&.col-sm-4,
+				&.col-md-4,
+				&.col-lg-4 {
+					width: 33.33333333% !important;
+				}
+				&.col-sm-3,
+				&.col-md-3,
+				&.col-lg-3 {
+					width: 25% !important;
+				}
+				&.col-sm-2,
+				&.col-md-2,
+				&.col-lg-2 {
+					width: 16.66666667% !important;
+				}
+				&.col-sm-1,
+				&.col-md-1,
+				&.col-lg-1 {
+					width: 8.33333333% !important;
+				}
+				&.col-sm-0,
+				&.col-md-0,
+				&.col-lg-0 {
+					width: 0 !important;
+				}
+			}
+
+			@media (min-width: 992px) {
+				&.col-md-12,
+				&.col-lg-12 {
+					width: 100% !important;
+				}
+				&.col-md-11,
+				&.col-lg-11 {
+					width: 91.66666667% !important;
+				}
+				&.col-md-10,
+				&.col-lg-10 {
+					width: 83.33333333% !important;
+				}
+				&.col-md-9,
+				&.col-lg-9 {
+					width: 75% !important;
+				}
+				&.col-md-8,
+				&.col-lg-8 {
+					width: 66.66666667% !important;
+				}
+				&.col-md-7,
+				&.col-lg-7 {
+					width: 58.33333333% !important;
+				}
+				&.col-md-6,
+				&.col-lg-6 {
+					width: 50% !important;
+				}
+				&.col-md-5,
+				&.col-lg-5 {
+					width: 41.66666667% !important;
+				}
+				&.col-md-4,
+				&.col-lg-4 {
+					width: 33.33333333% !important;
+				}
+				&.col-md-3,
+				&.col-lg-3 {
+					width: 25% !important;
+				}
+				&.col-md-2,
+				&.col-lg-2 {
+					width: 16.66666667% !important;
+				}
+				&.col-md-1,
+				&.col-lg-1 {
+					width: 8.33333333% !important;
+				}
+				&.col-md-0,
+				&.col-lg-0 {
+					width: 0 !important;
+				}
+			}
+
+			@media (min-width: 1200px) {
+				&.col-lg-12 {
+					width: 100% !important;
+				}
+				&.col-lg-11 {
+					width: 91.66666667% !important;
+				}
+				&.col-lg-10 {
+					width: 83.33333333% !important;
+				}
+				&.col-lg-9 {
+					width: 75% !important;
+				}
+				&.col-lg-8 {
+					width: 66.66666667% !important;
+				}
+				&.col-lg-7 {
+					width: 58.33333333% !important;
+				}
+				&.col-lg-6 {
+					width: 50% !important;
+				}
+				&.col-lg-5 {
+					width: 41.66666667% !important;
+				}
+				&.col-lg-4 {
+					width: 33.33333333% !important;
+				}
+				&.col-lg-3 {
+					width: 25% !important;
+				}
+				&.col-lg-2 {
+					width: 16.66666667% !important;
+				}
+				&.col-lg-1 {
+					width: 8.33333333% !important;
+				}
+				&.col-lg-0 {
+					width: 0 !important;
+				}
 			}
 		}
 	}
 	&.container-xs {
-		max-width: 750px!important;
+		max-width: 750px !important;
+
+		.slot {
+			&.col-xs-offset-11 {
+				margin-left: 91.66666667% !important;
+			}
+			&.col-xs-offset-10 {
+				margin-left: 83.33333333% !important;
+			}
+			&.col-xs-offset-9 {
+				margin-left: 75% !important;
+			}
+			&.col-xs-offset-8 {
+				margin-left: 66.66666667% !important;
+			}
+			&.col-xs-offset-7 {
+				margin-left: 58.33333333% !important;
+			}
+			&.col-xs-offset-6 {
+				margin-left: 50% !important;
+			}
+			&.col-xs-offset-5 {
+				margin-left: 41.66666667% !important;
+			}
+			&.col-xs-offset-4 {
+				margin-left: 33.33333333% !important;
+			}
+			&.col-xs-offset-3 {
+				margin-left: 25% !important;
+			}
+			&.col-xs-offset-2 {
+				margin-left: 16.66666667% !important;
+			}
+			&.col-xs-offset-1 {
+				margin-left: 8.33333333% !important;
+			}
+			&.col-xs-offset-0 {
+				margin-left: 0 !important;
+			}
+		}
 	}
 	&.container-sm {
-		width: 750px!important;
+		width: 750px !important;
+
+		.slot {
+			&.col-xs-offset-11,
+			&.col-sm-offset-11 {
+				margin-left: 91.66666667% !important;
+			}
+			&.col-xs-offset-10,
+			&.col-sm-offset-10 {
+				margin-left: 83.33333333% !important;
+			}
+			&.col-xs-offset-9,
+			&.col-sm-offset-9 {
+				margin-left: 75% !important;
+			}
+			&.col-xs-offset-8,
+			&.col-sm-offset-8 {
+				margin-left: 66.66666667% !important;
+			}
+			&.col-xs-offset-7,
+			&.col-sm-offset-7 {
+				margin-left: 58.33333333% !important;
+			}
+			&.col-xs-offset-6,
+			&.col-sm-offset-6 {
+				margin-left: 50% !important;
+			}
+			&.col-xs-offset-5,
+			&.col-sm-offset-5 {
+				margin-left: 41.66666667% !important;
+			}
+			&.col-xs-offset-4,
+			&.col-sm-offset-4 {
+				margin-left: 33.33333333% !important;
+			}
+			&.col-xs-offset-3,
+			&.col-sm-offset-3 {
+				margin-left: 25% !important;
+			}
+			&.col-xs-offset-2,
+			&.col-sm-offset-2 {
+				margin-left: 16.66666667% !important;
+			}
+			&.col-xs-offset-1,
+			&.col-sm-offset-1 {
+				margin-left: 8.33333333% !important;
+			}
+			&.col-xs-offset-0,
+			&.col-sm-offset-0 {
+				margin-left: 0 !important;
+			}
+		}
 	}
 	&.container-md {
-		width: 970px!important;
+		width: 970px !important;
+
+		.slot {
+			&.col-xs-offset-11,
+			&.col-sm-offset-11,
+			&.col-md-offset-11 {
+				margin-left: 91.66666667% !important;
+			}
+			&.col-xs-offset-10,
+			&.col-sm-offset-10,
+			&.col-md-offset-10 {
+				margin-left: 83.33333333% !important;
+			}
+			&.col-xs-offset-9,
+			&.col-sm-offset-9,
+			&.col-md-offset-9 {
+				margin-left: 75% !important;
+			}
+			&.col-xs-offset-8,
+			&.col-sm-offset-8,
+			&.col-md-offset-8 {
+				margin-left: 66.66666667% !important;
+			}
+			&.col-xs-offset-7,
+			&.col-sm-offset-7,
+			&.col-md-offset-7 {
+				margin-left: 58.33333333% !important;
+			}
+			&.col-xs-offset-6,
+			&.col-sm-offset-6,
+			&.col-md-offset-6 {
+				margin-left: 50% !important;
+			}
+			&.col-xs-offset-5,
+			&.col-sm-offset-5,
+			&.col-md-offset-5 {
+				margin-left: 41.66666667% !important;
+			}
+			&.col-xs-offset-4,
+			&.col-sm-offset-4,
+			&.col-md-offset-4 {
+				margin-left: 33.33333333% !important;
+			}
+			&.col-xs-offset-3,
+			&.col-sm-offset-3,
+			&.col-md-offset-3 {
+				margin-left: 25% !important;
+			}
+			&.col-xs-offset-2,
+			&.col-sm-offset-2,
+			&.col-md-offset-2 {
+				margin-left: 16.66666667% !important;
+			}
+			&.col-xs-offset-1,
+			&.col-sm-offset-1,
+			&.col-md-offset-1 {
+				margin-left: 8.33333333% !important;
+			}
+			&.col-xs-offset-0,
+			&.col-sm-offset-0,
+			&.col-md-offset-0 {
+				margin-left: 0 !important;
+			}
+		}
 	}
 	&.container-lg {
-		width: 1170px!important;
+		width: 1170px !important;
+
+		.slot {
+			&.col-xs-offset-11,
+			&.col-sm-offset-11,
+			&.col-md-offset-11,
+			&.col-lg-offset-11 {
+				margin-left: 91.66666667% !important;
+			}
+			&.col-xs-offset-10,
+			&.col-sm-offset-10,
+			&.col-md-offset-10,
+			&.col-lg-offset-10 {
+				margin-left: 83.33333333% !important;
+			}
+			&.col-xs-offset-9,
+			&.col-sm-offset-9,
+			&.col-md-offset-9,
+			&.col-lg-offset-9 {
+				margin-left: 75% !important;
+			}
+			&.col-xs-offset-8,
+			&.col-sm-offset-8,
+			&.col-md-offset-8,
+			&.col-lg-offset-8 {
+				margin-left: 66.66666667% !important;
+			}
+			&.col-xs-offset-7,
+			&.col-sm-offset-7,
+			&.col-md-offset-7,
+			&.col-lg-offset-7 {
+				margin-left: 58.33333333% !important;
+			}
+			&.col-xs-offset-6,
+			&.col-sm-offset-6,
+			&.col-md-offset-6,
+			&.col-lg-offset-6 {
+				margin-left: 50% !important;
+			}
+			&.col-xs-offset-5,
+			&.col-sm-offset-5,
+			&.col-md-offset-5,
+			&.col-lg-offset-5 {
+				margin-left: 41.66666667% !important;
+			}
+			&.col-xs-offset-4,
+			&.col-sm-offset-4,
+			&.col-md-offset-4,
+			&.col-lg-offset-4 {
+				margin-left: 33.33333333% !important;
+			}
+			&.col-xs-offset-3,
+			&.col-sm-offset-3,
+			&.col-md-offset-3,
+			&.col-lg-offset-3 {
+				margin-left: 25% !important;
+			}
+			&.col-xs-offset-2,
+			&.col-sm-offset-2,
+			&.col-md-offset-2,
+			&.col-lg-offset-2 {
+				margin-left: 16.66666667% !important;
+			}
+			&.col-xs-offset-1,
+			&.col-sm-offset-1,
+			&.col-md-offset-1,
+			&.col-lg-offset-1 {
+				margin-left: 8.33333333% !important;
+			}
+			&.col-xs-offset-0,
+			&.col-sm-offset-0,
+			&.col-md-offset-0,
+			&.col-lg-offset-0 {
+				margin-left: 0 !important;
+			}
+		}
 	}
 }
--- a/src/pyams_portal/template.py	Fri Oct 18 16:55:07 2019 +0200
+++ b/src/pyams_portal/template.py	Wed Sep 02 17:16:04 2020 +0200
@@ -225,6 +225,7 @@
         result = {}
         for slot_name, config in self.slot_config.items():
             result[slot_name] = config.get_width(device)
+            result[slot_name]['css'] = config.get_css_class(device)
         return result
 
     def set_slot_width(self, slot_name, device, width):
--- a/src/pyams_portal/zmi/layout.py	Fri Oct 18 16:55:07 2019 +0200
+++ b/src/pyams_portal/zmi/layout.py	Wed Sep 02 17:16:04 2020 +0200
@@ -369,7 +369,8 @@
                 'callback': 'PyAMS_portal.template.editSlotCallback',
                 'options': {
                     'slot_name': slot_name,
-                    'width': slot_config.get_width()
+                    'width': slot_config.get_width(),
+                    'css': slot_config.css_class or ''
                 }
             }
         else:
--- a/src/pyams_portal/zmi/templates/layout.pt	Fri Oct 18 16:55:07 2019 +0200
+++ b/src/pyams_portal/zmi/templates/layout.pt	Wed Sep 02 17:16:04 2020 +0200
@@ -59,16 +59,15 @@
 						<select id="device_selector" class="select2"
 								data-ams-select2-width="300px"
 								data-ams-change-handler="PyAMS_portal.template.selectDisplay">
-							<option value="" selected i18n:translate="">Current device</option>
 							<option value="xs" i18n:translate="">Extra small device (phone)</option>
 							<option value="sm" i18n:translate="">Small device (tablet)</option>
-							<option value="md" i18n:translate="">Medium desktop device (> 970px)</option>
+							<option value="md" selected i18n:translate="">Medium desktop device (> 970px)</option>
 							<option value="lg" i18n:translate="">Large desktop device (> 1170px)</option>
 						</select>
 					</div>
 				</div>
 			</div>
-			<div id="portal_config" class="container"
+			<div id="portal_config" class="container container-md"
 				 data-ams-allowed-change="${'true' if can_change else 'false'}">
 				<div class="rows"
 					 data-ams-sortable-placeholder="row-highlight"
@@ -87,7 +86,7 @@
 							 data-ams-sortable-over="PyAMS_portal.template.overSlots"
 							 data-ams-sortable-stop="PyAMS_portal.template.sortSlots">
 							<div tal:repeat="slot_name template_config.get_slots(row)"
-								 class="slot context-menu no-padding col ${template_config.get_slot_configuration(slot_name).get_css_class()}"
+								 class="slot context-menu no-padding col ${template_config.get_slot_configuration(slot_name).get_css_class('md')}"
 								 data-ams-contextmenu-selector="#slotMenu"
 								 data-ams-resizable-start="PyAMS_portal.template.startSlotResize"
 								 data-ams-resizable-stop="PyAMS_portal.template.stopSlotResize"