From eb646151206a0b8ee61ecf1945a6af2eab1ab505 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20P=C3=A9ters?= <fpeters@entrouvert.com>
Date: Wed, 6 May 2015 18:17:13 +0200
Subject: [PATCH] backoffice: replace navigational tabs by a sidepage (#7284)

---
 data/print-html-as-pdf.js                     |   2 +
 wcs/backoffice/root.py                        |   6 +-
 wcs/qommon/static/css/dc2/gadjo.css           | 111 +++++++++++++++++-
 .../css/dc2/small-icon-categories-hover.png   | Bin 0 -> 360 bytes
 .../static/css/dc2/small-icon-categories.png  | Bin 0 -> 359 bytes
 .../static/css/dc2/small-icon-forms-hover.png | Bin 0 -> 797 bytes
 .../static/css/dc2/small-icon-forms.png       | Bin 0 -> 784 bytes
 .../static/css/dc2/small-icon-home-hover.png  | Bin 0 -> 598 bytes
 wcs/qommon/static/css/dc2/small-icon-home.png | Bin 0 -> 608 bytes
 .../css/dc2/small-icon-management-hover.png   | Bin 0 -> 635 bytes
 .../static/css/dc2/small-icon-management.png  | Bin 0 -> 576 bytes
 .../static/css/dc2/small-icon-roles-hover.png | Bin 0 -> 669 bytes
 .../static/css/dc2/small-icon-roles.png       | Bin 0 -> 658 bytes
 .../css/dc2/small-icon-settings-hover.png     | Bin 0 -> 843 bytes
 .../static/css/dc2/small-icon-settings.png    | Bin 0 -> 655 bytes
 .../css/dc2/small-icon-submission-hover.png   | Bin 0 -> 487 bytes
 .../static/css/dc2/small-icon-submission.png  | Bin 0 -> 447 bytes
 .../static/css/dc2/small-icon-users-hover.png | Bin 0 -> 467 bytes
 .../static/css/dc2/small-icon-users.png       | Bin 0 -> 421 bytes
 .../css/dc2/small-icon-workflows-hover.png    | Bin 0 -> 703 bytes
 .../static/css/dc2/small-icon-workflows.png   | Bin 0 -> 646 bytes
 wcs/qommon/static/css/dc2/texture.png         | Bin 0 -> 2418 bytes
 wcs/qommon/static/js/gadjo.sidepage.js        |  19 +++
 wcs/qommon/template.py                        |  10 +-
 24 files changed, 141 insertions(+), 7 deletions(-)
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-categories-hover.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-categories.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-forms-hover.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-forms.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-home-hover.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-home.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-management-hover.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-management.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-roles-hover.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-roles.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-settings-hover.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-settings.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-submission-hover.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-submission.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-users-hover.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-users.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-workflows-hover.png
 create mode 100644 wcs/qommon/static/css/dc2/small-icon-workflows.png
 create mode 100644 wcs/qommon/static/css/dc2/texture.png
 create mode 100644 wcs/qommon/static/js/gadjo.sidepage.js

diff --git a/data/print-html-as-pdf.js b/data/print-html-as-pdf.js
index d8ab46198..71b3491f1 100644
--- a/data/print-html-as-pdf.js
+++ b/data/print-html-as-pdf.js
@@ -12,7 +12,9 @@ page.paperSize = {
 page.open(system.args[1], function() {
   x = page.evaluate(function() {
     $('#top, #header, #sidebar, #sidebar-toggle, #breadcrumb, a.back').hide();
+    $('#sidepage, #main').removeClass('sidepage-expanded');
     $('html').css('background', 'white').css('font-size', '8pt');
+    $('div#main').css('width', '95%');
     $('div#main-content').css('width', '95%').css('border', 'none');
   });
   page.render(system.args[1] + '.pdf');
diff --git a/wcs/backoffice/root.py b/wcs/backoffice/root.py
index f6b7706d1..e973a12c2 100644
--- a/wcs/backoffice/root.py
+++ b/wcs/backoffice/root.py
@@ -68,7 +68,7 @@ class RootDirectory(BackofficeRootDirectory):
     ]
 
     def _q_traverse(self, path):
-        get_response().add_javascript(['jquery.js'])
+        get_response().add_javascript(['jquery.js', 'gadjo.sidepage.js'])
         return super(RootDirectory, self)._q_traverse(path)
 
     @classmethod
@@ -139,7 +139,7 @@ class RootDirectory(BackofficeRootDirectory):
         return _('''Welcome.''')
 
     def generate_header_menu(self, selected=None):
-        s = ['<ul id="menu">\n']
+        s = ['<ul id="sidepage-menu">\n']
         for menu_item in self.get_menu_items():
             if not 'icon' in menu_item:
                 continue
@@ -147,7 +147,7 @@ class RootDirectory(BackofficeRootDirectory):
                 s.append('<li class="active">')
             else:
                 s.append('<li>')
-            s.append('<a href="%(url)s">%(label)s</a></li>\n' % menu_item)
+            s.append('<a href="%(url)s" class="icon-%(icon)s">%(label)s</a></li>\n' % menu_item)
         s.append('</ul>\n')
         return ''.join(s)
 
diff --git a/wcs/qommon/static/css/dc2/gadjo.css b/wcs/qommon/static/css/dc2/gadjo.css
index 57654c82e..41a1c752e 100644
--- a/wcs/qommon/static/css/dc2/gadjo.css
+++ b/wcs/qommon/static/css/dc2/gadjo.css
@@ -7,6 +7,15 @@ html, body {
 	color: #3c3c33;
 }
 
+html {
+	min-height: 100%;
+	position: relative;
+}
+
+body {
+	height: 100%;
+}
+
 a {
 	color: #0066cc;
 	text-decoration: none;
@@ -94,7 +103,7 @@ div#header {
 	padding-left: 25px;
 	border-bottom: 1px solid #888;
 	position: relative;
-	height: 92px;
+	height: 5em;
 }
 
 div#header h1:after {
@@ -324,8 +333,8 @@ a[class^="icon-"], a[class*=" icon-"] {
 	color: #FF7800;
 }
 
-.icon-home-space:before           { content: "\f015  "; }
-.icon-remove-sign:before          { content: "\f057"; }
+.icon-home-space:before	   { content: "\f015  "; }
+.icon-remove-sign:before	  { content: "\f057"; }
 
 /* misc */
 
@@ -520,3 +529,99 @@ form.small button + button,
 form.small button + a.button {
 	margin-left: 1em;
 }
+
+#sidepage {
+	position: absolute;
+	z-index: 10000;
+	background: black;
+	width: 220px;
+	height: 2em;
+	text-align: left;
+	transition: all 0ms ease-in;
+	overflow: hidden;
+}
+
+#main.sidepage-expanded {
+	margin-left: 220px;
+}
+
+#main.enable-transitions,
+#sidepage.enable-transitions {
+	transition-duration: 100ms;
+}
+
+#sidepage.sidepage-expanded {
+	height: 100%;
+	background: #23282d url(texture.png);
+	overflow: initial;
+}
+
+#main {
+	transition: margin-left 0ms ease-in;
+}
+
+#sidepage span#applabel {
+	padding-left: 1em;
+	font-weight: bold;
+	cursor: pointer;
+	display: block;
+	background: black;
+}
+
+#sidepage ul#sidepage-menu {
+	list-style: none;
+	padding: 0;
+}
+
+#sidepage ul#sidepage-menu a {
+	border: none;
+	display: block;
+}
+
+#sidepage ul#sidepage-menu li {
+	padding-left: 1em;
+	position: relative;
+	line-height: 24px;
+}
+
+ul#sidepage-menu li a {
+	background: transparent no-repeat 0 50%;
+	padding: 5px 0 5px 25px;
+}
+
+#sidepage ul#sidepage-menu .active a {
+	color: #eee;
+}
+
+#sidepage ul#sidepage-menu li.active,
+#sidepage ul#sidepage-menu li.active:hover {
+	background: #215D9C;
+}
+
+#sidepage ul#sidepage-menu li:hover {
+	background: rgba(0, 0, 0, 0.3);
+}
+
+
+#sidepage ul#sidepage-menu li.active:after {
+	content: "";
+	position: absolute;
+	display: block;
+	top: 0;
+	background: #215D9C;
+	right: -17px;
+	width: 34px;
+	height: 34px;
+	-moz-transform: scale(0.4, 0.707) rotate(45deg);
+	-webkit-transform: scale(0.4, 0.707) rotate(45deg);
+	transform: scale(0.4, 0.707) rotate(45deg);
+}
+
+ul#sidepage-menu li a.icon-management { background-image: url(small-icon-management.png); }
+ul#sidepage-menu li a.icon-submission { background-image: url(small-icon-submission.png); }
+ul#sidepage-menu li a.icon-categories { background-image: url(small-icon-categories.png); }
+ul#sidepage-menu li a.icon-workflows { background-image: url(small-icon-workflows.png); }
+ul#sidepage-menu li a.icon-forms { background-image: url(small-icon-forms.png); }
+ul#sidepage-menu li a.icon-roles { background-image: url(small-icon-roles.png); }
+ul#sidepage-menu li a.icon-users { background-image: url(small-icon-users.png); }
+ul#sidepage-menu li a.icon-settings { background-image: url(small-icon-settings.png); }
diff --git a/wcs/qommon/static/css/dc2/small-icon-categories-hover.png b/wcs/qommon/static/css/dc2/small-icon-categories-hover.png
new file mode 100644
index 0000000000000000000000000000000000000000..6469f77735b41b0947a2a3b86a05ba5a40fb6636
GIT binary patch
literal 360
zcmeAS@N?(olHy`uVBq!ia0vp^B0wz6!3HEJ^yqE{Qfx`y?k)`fL2$v|<&%LToCO|{
z#S9FtrXb8%(-{5}D7eGZ#WBR<^xI3jc@G(gI9$x0Y{0~;yn$ttL}Q=mikS^fyb?`a
zQeU1eSm@TGX4*01*u*o(E%rAxY40qUSEJ({s8qzpwkMpSI3c%ZVU|_H(X@k8I&SEH
zw%t%%u|j(TYu_=6Nhex`w<mpV6#c+*uR&&mD8qi19lvL9;@yzLp!MJrr_GLsOfRmw
zm@aUA@}!y7fF;c#N?2#}u7?L7eBRCWv)P_+S>8&s1^<)%8$X`j9`<0xYW4J3hjnil
z&95u)ojW}{2IvRL64!{5;QX|b^2DN4hVt@qz0ADq;^f4FRK5J7^x5xhq=1U#L5e~$
xOL9^f-1G8tQx$?MbCdFOGLscNlk@WwLNZcwQ~Q=^t_CV)@O1TaS?83{1OOPnib((f

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-categories.png b/wcs/qommon/static/css/dc2/small-icon-categories.png
new file mode 100644
index 0000000000000000000000000000000000000000..4793373bd2e9bcc5f673e071260c2df9b64a25d2
GIT binary patch
literal 359
zcmeAS@N?(olHy`uVBq!ia0vp^B0wz6!3HEJ^yqE{Qfx`y?k)`fL2$v|<&%LToCO|{
z#S9FtrXb8%(-{5}D7f9z#WBR<^xI3jc@G(gI9$x0Y``?>D2I;YL5`9&4rf_Jat;WD
zTruF_{VKe0A)DZ3i%CBvo<DAC(%xAxuSUl^P^pNCZBIB;aYAm-!aS>nqiF}HbllMY
zY`dYjVukhw*1lsBn@+R}Z%_K#DEfirUITYRHbb3c!FTge>4ck1AqRd6R}>s(y^!6J
z<<Q;nBY~5rQF4Mg%jz|Gl?FflTv4e1aQxsM-K(r$>fdM@)cw51DYLYyXd+XQD8G}H
zLg$@~lP`f@kSuYHC<)F_D=AMbN@XZ7FW1Y=%Pvk%EJ)SMFG`>N&PEETNFJmpB(o$Z
umBBqPKQ~n&xH2~>KPNL;!818OPaz~DH8-_yiRNmcQU*^~KbLh*2~7a;OoiqE

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-forms-hover.png b/wcs/qommon/static/css/dc2/small-icon-forms-hover.png
new file mode 100644
index 0000000000000000000000000000000000000000..15307c7be5b142e5c9fd8b7845446cf8df4539b1
GIT binary patch
literal 797
zcmV+&1LFLNP)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmYMKu5bMKu9@fmite00M1EL_t(I%cayih+K6P2Jqkc&*WlO
zQG?NdXcGb!qFAU=F|fP3sEa6A1Ql%*e5Df<K@l7Afse`}(SV(?F<=!&XIB?R1sfq4
zBt8(46cHa;vbwXA`?r|0IE+MA{knVZx!-ww-#sDG@ApN-W^9d!AJNXt%oxYw;-XsX
zxp)NkqaP7_u(qBX>&XiX3vdgb!~^&qx8pN>1GUzvh<E`H;b+`|k0Sy)=ysQumJEl(
zPATP7+qM_rTD*i6%;BDO!ibp9&boLLpJXA}i5t7a;qVMR-L~xxY{pag4!dz2hhZ=n
zMAI}kWzI<)LYo7giAS-kWN;O?;sZQ~19&*ceirvOO>-8uB*7H!#>J%+Ir==#>0*Ev
zaS6T})8MD<aCZ_N!qI#exDPwqw*3Or+4+|x=f5F?^O(xm6<Op#+?C`#EGKEfWx3;v
z@H_T*ODUz+dOeP1!hwi5hF#c>6Zkc|x+=$=#4=vPzUcS+N-1Y&SKIL(e!v^Kr;qSN
zs`w5rOp=xC_$c0wh!1P6tCK!F5Bu>p-op85i(k@zcczF12l05Vb*0nkn4X^g%h<hM
zPt!Eow%wEhoJ_H5*6Y?<w?#yg-$d?oxz?(bvNjwJ&CSh;{GH%ZJcey!MB`{Do&%e5
z_s`?VdS$pAdvT5bh8^jK!zGvf`u`w<>#z@3mK5RY^wFnS`xit5qyPC2qZ_cdq+%!V
z3SK_V{!WM1=#adM-!SYNov5v~*3Tni*4Rng00PSq@l37tAdXM^@MgSgq~1obirdhe
zot-7e9mgqux5q!BPUcS%el7j9K^(!i<AFZ`m;2Wrih#aj0000PbVXQnQ*UN;cVTj6
z0C#tHE@^ISb7Ns}WiD@WXPfRk8UO$QA9O`nbW~|{Y-IpPZf|X6AX9m5VsC6|V<1Um
bZ*Cw|Xk~3>j-)B800000NkvXXu0mjfXz_J)

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-forms.png b/wcs/qommon/static/css/dc2/small-icon-forms.png
new file mode 100644
index 0000000000000000000000000000000000000000..7f6c8cbb793c31848b30efc257fc598f66293fdd
GIT binary patch
literal 784
zcmV+r1MmEaP)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmYMKu5bMKu9@fmite00Ll1L_t(I%cayyXdQJF2JqjRJ2z>f
zXp1#6qMK51A&OEZDi*{CVh{uuMMXCXR_#u(6clkIKJc+}VYT4Sy3uX%0SbzU4=4nK
z#3&Nv1|mKh+R|I+{$1P?nMNwDeyf=|-~aoc@0>FyBnE>4Okpd2#;9o;T_k5S9>YWU
z2zzjHof{j-ci>4pjGu59zQ9t_rttzE!LPU*pG5@pP}fUKOQxo#dJ)l<Qf6>HUcxcl
zhWk5$bD3F<w<6+mD5bzGZmp-Mr#Ip0Qp)zU{1kq~F05ic#R9h{=O_-9Qbrj&2ajWC
zg%M8RPJE2#a1f8C?Pu`-&c&9F_4{yX+qTmB9L}#X#EZBL-*tNMOJ=w$g$`k{lkJ0;
z?e%(xaZ_ggZI%9S$&Yh+J6x5Q?8dz*{yx?+Ug3(Y@g+Ep19e1HxDkUS9L(pP*oGtc
zePUuFhQr~toeR5I!)w?dD=RBXDd%Ni8$Q4?-po3ET2<A)(P%V_cX4rYk7dS-_%I?q
zDW#m)IENSD0N%mdxG=-N<^0`~O|0-9_NK5?277sV+2rJ;wr%^_fTP*0l7clZ!bF}4
ztVYBdv~7E`-|w55nGu;8T#hI5;JQ#3qYdwYe%AYWER<5z8N3p&<2wHh+p#+$<}2f0
z=8gX$1~*_ou8F~5FrRjh<1lull{3K*U*l?Q!Z%fR><C`L%crT|=`b>0B(LHR{8<~X
zsI3w4RVn3Wot1V52;-rC#(0cY>!xWIv6$UH8?mnFuxXkv@pqTk(fa3j{2NL{oWid*
z5WdI4SqLtaQhvw<1O5WO*~3=xko`gc000?uMObuGZ)S9NVRB^vcXxL#X>MzCV_|S*
zE^l&Yo9;Xs0000VbVXQnRB3c<WdKKRZ*65DQ+aJ-Z)|B}AW36yZXi@>Wo>1Sq$#Ta
O0000<MNUMnLSTZ{sbZ@D

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-home-hover.png b/wcs/qommon/static/css/dc2/small-icon-home-hover.png
new file mode 100644
index 0000000000000000000000000000000000000000..62ff302a06f4d7db5c8022ecd7f4ae512e48bab2
GIT binary patch
literal 598
zcmV-c0;&CpP)<h;3K|Lk000e1NJLTq000yK000mO1^@s678qX}00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmYMGXJ|MGXOiH*UfJ00E{+L_t(I%dOHqXcbWq1>kSjRZ<vG
zgj6b)f|Xi{VzKYl0kMe0!k<DEL>mhWCGn@zMjI8uUQjH=M&7%XHeyP_Qj8#ZA_{i0
z*=I8goA(1EPId2@Ip?04JDCa5@AqX{1_h4eCNf;db5z6OP^Z%w<7T5kN~t-{;S$bc
zM_}La5ce^FvMi?yrj%4wr6`KSSVkvm2CYYi=wrF6s<%Z^Y!J;xT+QMvu3%@76K+I)
z31#rU;4YrvSK~HoiS3IS9m5v<zysVHad;UQupPhg0=Mu1a?D^6&#-{aSiz}qG^p!Z
zUDrZ*DRL`OyAa$(%oMnT)7Tm=zQsqppEUH8QiYfJidW%!FCO7gmQor<Z53;>iX(Mh
zf6nuKY%R*N)a&)+dA=KOu&c#Y;BmCF2Pd1)>UO(QN(XQ-uo|zi8oBm{JjEx>6*w2*
zHRCZKGiy4Sj}AuTBW^>{%qXRlPbeHtIgdu(=;Z!$6jSgj_Ol+r*IRpA{jK0EF5)MS
zw%fu9?2r4lsGTaf-YUF0;h{}9Go_=3yJ3d!u=WpQTMI7u1BonwuH`w=m;e9(8FWQh
zbW?9;ba!ELWdL_~cP?peYja~^aAhuUa%Y?FJQ@H103UQkSaeirbZlh+M{aLzWgt^|
kZDMb1X=5NsV{dLCRA^;wWsamNs{jB107*qoM6N<$g4YlJ-v9sr

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-home.png b/wcs/qommon/static/css/dc2/small-icon-home.png
new file mode 100644
index 0000000000000000000000000000000000000000..6321a233085a3b7099d5a4f1a756cbb37abf9d23
GIT binary patch
literal 608
zcmV-m0-ybfP)<h;3K|Lk000e1NJLTq000yK000mO1^@s678qX}00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmYMGXJ|MGXOiH*UfJ00FQ`L_t(I%dOH+h|FOa2k_53X5?Ut
z)HXBWpp<g5+{l5G)D|vs5hqGGI5?1H9bHIqlH43{l2V+wNN#G6vYK~y%b((8X7_b@
zrhYR!Q<CTO{+{3S{XXC4`#i~rSXfw4N`X3#;RX_};t6^wCCz4Y6*dhga?btdB+lau
zHbw3$?&A)Ypw()PC(Jo(G#a|y?q1B`VAL#CniRakOrz0w+wFD-NE38A9VsQ4z-e5<
z<^aFO^{Bsw1A+U3TX=w<r4;RUTgo|0DJiAw43CarExzL(ZVxHEfV0?$-*|@El+wpi
zij;F+hoeEZBUF6|RWHyRvbl~!p>`_N&S4f$Q_lG=PGWrkmT(yFN10w(+8#U))$j`s
zQ_lHY$nQn>dF)FmeU8%^h*qoBKdY^HgDn-TIxb=xw&O&9S<Pls&Up&EBe#N=n2&$e
z3wexBn5^SbB(GQ<)8Um+F&z^O#~f}#z3)-Zxi+G(jCl`7t<O{QpQAn|--~Uo4CR+A
zTkicW;RMd%2liLT!g1`1?+sBqmT<XJczHylH8?e9qCR%O!*^Kx2iq0{3;qCK)r<H5
z+Tr~G000?uMObuGZ)S9NVRB^vcXxL#X>MzCV_|S*E^l&Yo9;Xs0000VbVXQnRB3c<
uWdKKRZ*65DQ+aJ-Z)|B}AW36yZXi@>Wo>1Sq$#Ta0000<MNUMnLSTZRv<Hg-

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-management-hover.png b/wcs/qommon/static/css/dc2/small-icon-management-hover.png
new file mode 100644
index 0000000000000000000000000000000000000000..9dc0d77e96fbf0e00b2e691ea7270dff231be401
GIT binary patch
literal 635
zcmV->0)+jEP)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmYMKu5bMKu9@fmite00GNML_t(I%bnD{Ym`9{$MMfTPn5tF
zg7`}841$m<on6QUK@bEXg8za=f^Q&Ls0aZIg(wzQqNNu}<yG>K*23N*rC=a}BB;T8
z?pcd$;Ng<oljH{r%M9~nW_D&nQ54I#j1jwQ126Chzo)0CLATr0>-Dr+tqc`}qA331
zkY;V*DHiZ2#wdgUXK)MO@p_~NTS0-W28lR=>o|?OIE)7&gufvKF~$j8#Cc5A%Ur?Z
zt#Y6!3JCawMV!JIavX~>j-|M(c#C#Dn{7()hz@Sz6>g)2m#Lx!e8m&o8w%V3I+yOx
zF^i+PflK4#<I7c5y=es2p#22cf`#P%fnTeut7c|qs*xsGx7#&3Ix6*VaR9c4`LZlO
z=6TM*iyjEp@Ao@-p2v2(Jsh|fSd4Kg&+{zJ<L<ycz~*9%oe;tmOx9zw1Hk61s#*#m
z%qIWwdi=IWNw5s}ajoWB!+Z$gU6y5&c!rZU$7p!THaFqyAgnCQPK;3kofw4em|;@H
zI=<m29+qX<$@4sF&~6#_aR(RBjxoNkkH#=<%doa;>y6P3z$sKkQ8cY%g>$LT{hfe4
zn}6a|I{Q%%<zNp#3>x>L&-hX|{0DTyp<{}r7~%i`02y>eSaefwW^{L9a%BK_cXuvn
zZfkR6VQ^(GZ*pgw?mQX*0019!MObuHX>@F507q_bZDk-+d2M2EY-wX4Nn>wrAXI2&
VZDo$6DXRbg002ovPDHLkV1h@@7x4f9

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-management.png b/wcs/qommon/static/css/dc2/small-icon-management.png
new file mode 100644
index 0000000000000000000000000000000000000000..5494b302b53d3e4fbef26dd11b2a13d636ce8ac5
GIT binary patch
literal 576
zcmV-G0>Ax<P)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmYMKu5bMKu9@fmite00EFmL_t(I%dOPCiWET<hT*5%b%HVQ
z2i>*MOb~>Pyn+G6NDzb-yafXV(MUl>5DXMnFF-VO{E5s&CfUHi+&d^yK@n`1ZD+<{
zs-b9RXLi&B1>Ikre)-O+I$gvVU*jy6Y#*C=j63)lLI5#FbzSRpI%QE5BPe2wTi9)W
zY~lg#q0025xQefMvXsFFc!x4e9%C;qBH%hYxP@OSXBB5~0;_qM1Ke%OX-YzY_gKea
z9KkLeOwR+H$1|Lo)i)soF~%|a$$1aAu?LTE8c%T(_pxs#a0>Jl_9xg{a(@XM-EQ|~
zRaIp<57<C4#DNwJzTrnzRYC}(xeikwrT(qAV4rXWZ=0m@KfwAJH-}mNBkV<+QT`?D
za&mSKCuaf|aJH8A59Qx)cPJ%p;6kP~u;<CuL#&ug)9jK>CgIo=SU<h5V7U#O<#3EI
zi1=<Y9sOy5odSorhAy`7S-Kiok9P)4_o;EXaOA)qMlr^D<2b_c)aT(eU~TeG?4`9x
z)cBnXCEm2f1>yrf=E5J#<AcX&D6O&p000?uMObuGZ)S9NVRB^vcXxL#X>MzCV_|S*
zE^l&Yo9;Xs0000VbVXQnRB3c<WdKKRZ*65DQ+aJ-Z)|B}AW36yZXi@>Wo>1Sq$#Ta
O0000<MNUMnLSTX`LGMfe

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-roles-hover.png b/wcs/qommon/static/css/dc2/small-icon-roles-hover.png
new file mode 100644
index 0000000000000000000000000000000000000000..8f1200b09ac71a1d856cdeac1ca5f7f89ce5ec6c
GIT binary patch
literal 669
zcmV;O0%HA%P)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmYMKu5bMKu9@fmite00HeuL_t(I%aznUXcSQt1>o<^jHp3_
zMGz#W5iA0NKVWB-T{VJWF9=4k5D`QztxT^7f+<8nP_Y)Q+_m-x4F)?aHI)$rLu_{E
zS?t>|S$4CV0|PVj?wohtJ?BnPL8H+SV+>iA<uS%Ggiy}R%-9M-mneh)`!R=O_>L#7
zR%<cObG2G+B*Fq+vI#uI*~<FKqA1Q|aa4s_<^Bw2d)B9M37XC3mI)`jihD3M;Qinu
zCoEwVyLxIqq1An8Hk)FMA%u{ZW!Xlo*X!%Wp>muZxPz-0LmRJg1<Nr;?RHyH6h~7V
zrqX7Q@iWG#R;z7L*v13A#UcE_d;CeJDT?9<o~7QxIUL7a2w?@Xq;5NIV<Gi*5x;N)
zPh*TzF-A$*w2hcehHmKL30%iG>XqU=ZSW<8Ft3x-em+dDyPRbioJwS{t#Wl!P>V5+
z;d39t)nsUguq?|02Zp3!UkG709^qB$H>~LlL!&A;ORf&Wx76D;l(>cG$>k+{t)`_&
zMIRG+yN4{tJKV!T+}D}$m-wB&S-@Z1#B!k%+WGD-eNdKVDa*2JIGqGs>@g+iMC|S$
zl69n5P2dd<Z&LaK7qVf52|KZ8NX<C%Q3=B)EveRw{1^GBGm?7|`>f~qfO1sA6<i*o
zvPA1Y+aQVcE>F-?0000PbVXQnQ*UN;cVTj60C#tHE@^ISb7Ns}WiD@WXPfRk8UO$Q
zA9O`nbW~|{Y-IpPZf|X6AX9m5VsC6|V<1UmZ*Cw|Xk~3>j-)B800000NkvXXu0mjf
DEo2?#

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-roles.png b/wcs/qommon/static/css/dc2/small-icon-roles.png
new file mode 100644
index 0000000000000000000000000000000000000000..1b1210130b7ab9afff6255aa0920314b08aac2f7
GIT binary patch
literal 658
zcmV;D0&V??P)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmYMKu5bMKu9@fmite00H7jL_t(I%azo<YZOrw1@PaS8Sw)R
z7D1TZq!BDc3l&Q{KQQ25V5gnfh_STNUeU%BqF^CdD|TY-2O1PRD>Yd}t&FkRooBJ{
zg>lIyn*#$g^X@zM-gEAIK?}>v%VLb7D2g)1*n|+8x~^>nArplVU<Ma(3}5iD-|sJ$
zWvSEYOhi~AlTG6u&b8K0S5<W$i<4GZwBF}%c4Yk^E<&%@+cIG{S3H8*G5^Q6obVAV
z*gX>S4*mSm>-EGKLkOX4nr495?RM9KL#v$~xPi;qg#n)95|(0&27`gBs*WZZW>c~U
z_!eW->2&@h+=d#5a2Q|l8sG6J6>tQPleQVp3@77fUDt|4wjI~8kaS(d4_w8gRE<<w
zn@lotZdAh)xPmF1Y6X`m!G{pS%^2g%7$4R|%r2ivWV!YH<n@zD*Z1oXt|UX(2rKO0
zWE$!i;~w0{(_|Q|8Xkrh?Q)BheH=a~ZC67GO^oqcGG;ba_NhHB6&k!v<bx5i60dL@
z2V#tO4A1xz{7QQk@Eh}33d!XvXITdgBJLW_Xfu*H@14i3DqT<gF=Tm0rwu0|>t3uA
zdK_h8GVH|OO=70DLKrrXq#ZNyE%FyHu`lU4iV|<oY?d`^7;J1DL$mt-02TO--jBn2
zp8x;=8FWQhbW?9;ba!ELWdL_~cP?peYja~^aAhuUa%Y?FJQ@H103UQkSaeirbZlh+
sM{aLzWgt^|ZDMb1X=5NsV{dLCRA^;wWsamNs{jB107*qoM6N<$f^tI^9{>OV

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-settings-hover.png b/wcs/qommon/static/css/dc2/small-icon-settings-hover.png
new file mode 100644
index 0000000000000000000000000000000000000000..8ed8c68f20873bac823c0f98f98b3cb517132d55
GIT binary patch
literal 843
zcmV-R1GM~!P)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmY4c7nw4c7reD4Tcy00QetL_t(I%XQRCsFhU|2k_tC-&fsC
zZg9hzl|qt(CJmZ|r1zYzg%LEcq6a;QLa_pSXbs95MO08pSX7kNFw7nUjqW+=AcPv#
zL@cBSK}lM0Gw;3J?^_MdK63Qhn(ejr{_nN^>%UflUato=p2Y+B8Sh8Lu9VVDr_*t!
z^?E%KkyA?dU<0<`a2~m{fL-_=SL3CW()N_n`Tc%>5m?hSDW!A=p2vE;idDJa@1F}1
z0YBhDe1-F{DI(TK#ITA}R#nw<JcCP$YaKS{h}e!RQcA<SNAMn6EWwRP7TZ!>IC9>P
z*E8<JPF!9B6Sx6GI+jI5T`Cx6I)>W{P2XWR9>Sp-zhV;a;9XpgTSk69nsaVO${xd0
zxE-5u04J-eIypZ-uP%+a64zq&NM=KujEE`hE4*&SU3d(8U{nRU0PeuQX90s1xV3Qh
zIPS$0<KyFdQcBL0RE-mO4hKsEmf?>=!%FPM3#GjKv2}cWeD}=EjLFH#MZcfw-t_de
zh)6l-YGPty;rQ|6okIMJxCswqYeamGd9>Yb_x}Nh*6a0DRV5;-wr$4@Cg%}sGZ6iD
ze2`Mw+qUgFSZLd}sj5n+(>Wb*dV1R2+?=tov2Fpn0ILi}@>{%#HTVf%7kd80XZRE+
zPAj>tYfaOvFS@+6gg%alyHiR#N<+?Ob9e(!SJ3bGwQZ|ta3?Msx%^E^=_CA&YjDv>
zY_|B9;wl`=WoyVeuPb27M;;t1zBZ+Fpp-eZzwjik!-qwqch)61RZ?Ct^58HwwrzVb
z=PV*BTwG#-mvhcL+CgcL7T;uTFt@Lr0rn#{rj+)NER6;HJ_7h#M6_+&$~hl1n4p_;
z(b>uoup`*iwrxKmbh}+S=OM@^_{U(PwnfD1A~8+V9BrEBty~B_4J;zQ9O??zu3bBf
z@53tw)3pk3N5mSa>)O=RR17oxrEs=oc6RoQob#fwD&TVl8+tQ(r4buaN=t_8?LWzI
VA&ZP%$ol{Q002ovPDHLkV1lndiz)yB

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-settings.png b/wcs/qommon/static/css/dc2/small-icon-settings.png
new file mode 100644
index 0000000000000000000000000000000000000000..d2b551dddd8babedfbb81be0385c3e19d6488868
GIT binary patch
literal 655
zcmV;A0&x9_P)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmY4c7nw4c7reD4Tcy00J*bL_t(I%Z1d-i;r;>$MM(qnHiUu
zVIlRiP>6p(N@=7K%36wCLW86z<d#b*mtrhkb1TBeN)|NP%1SB8WyL(C<Tey$9*gJ5
z7xUxPv-p0`>HVB@zMpdvlw}DWxQ+#Qg)8W(s_JD*Nu$w_TVG!vw561`Vk6e#W@{Gn
z0Y@<vld&1oQcA1wCWl1=Be4$~(2gFYqAbg?C?fU_y74^j7GhZj$!&TDgK5}b;2P#;
zfxS_>fX+dizil}33ZG(Mf%!Ozu5e62XBOB|RaIM6Re8A`ScE~mz`eYOW%TTHWY&pU
z8E_z_RQ&-vf+g668~9vR)!USkRF>s2Y(k5n?IU*L1V(4D-BH;<u7Dz5=N1N<0NdkX
zCgSkFV34AWaagR@U|W1MFa}SsEqqHO+tWkAAZ5KtQFe;V*I)$>VP0gpEBgEn-<tw+
z%iv=$UM=vY*dEe2h)Xz+vFd^7N7ZOFeg_7u1*@<+N}q(ic#KmatM_<-389iZIENQ$
z2-vzPvm;!0u~Iz%Gc~u{SljX+7(BwoXv1vvg#5HB)KRFloQnUzKHzfn=mPF%z5$$7
zPfTz8aB-`89=n^scH(NBhhbFazltqt;Xe#1brtF<IoJet$}hq9<8>C(7kBUs>v68Y
zo_PKtVVTyx#RCn-d0jw$j_ea`EHEO2y~mC}VHxzIdKnBxMTgWou{Gkp6gZBr_=E#E
pqsds|t$N+}sF!d%maDfs_yPLcw}Ni0{RaR5002ovPDHLkV1jj#Dq#Qs

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-submission-hover.png b/wcs/qommon/static/css/dc2/small-icon-submission-hover.png
new file mode 100644
index 0000000000000000000000000000000000000000..211cffa8ebed9031db8794000ad189b00e65a7c6
GIT binary patch
literal 487
zcmV<D0T}*?P)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmYMKu5bMKu9@fmite00B2iL_t(I%gxijE(B2&$MMg#L!#1H
zjp%p=3WbaZ&}b-m4hjACD&_J3qTJC)WWy84c1n7Q|HYh<wJ~E?<(J&d&AIn{?{CgM
zm;bKR>-C_OQd-42W+!Ak;~H0Z%~DFRg<~xI(byyQaGs%s?SMVS;>Wmui1`@XxTt`0
zv7wKByp9RXaDt71X4%MwC*0#D&+|r7Q4}y8Ip0qBEom7$5jw-5>99s%Xaxr`zs2CU
z8q~RKV+L(y@x^?xD2iu1Oajc%!Dc{P5$`DbuBW`bv4N>_GZJqPebXesH*}S4w2a+|
zpGFM_v8OefI8_6D&-1*Cqkz1{IK@${z1KNh()@m_-mK<zn#EFvOJ$eWsjqwql+UtG
zYq+c&{-|i+VTVona(FmY&%3DAxT-Girmm*{PoGtwNWpRsbS3}*02y>eSaefwW^{L9
za%BK_cXuvnZfkR6VQ^(GZ*pgw?mQX*0019!MObuHX>@F507q_bZDk-+d2M2EY-wX4
dNn>wrAXI2&ZDo$6DXRbg002ovPDHLkV1l?^*b@K%

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-submission.png b/wcs/qommon/static/css/dc2/small-icon-submission.png
new file mode 100644
index 0000000000000000000000000000000000000000..1d4f08720ffd883efc646e39e711b6d018f94d6f
GIT binary patch
literal 447
zcmeAS@N?(olHy`uVBq!ia0vp^B0$W~!3HFs%y=IPq}Y<Y-CY>|gW!U_%O?XxI14-?
ziy0VPO+lEkrZM~{0|O(!r;B5V#p$`1*ZMI#im*Od|5lH&KeADA?coUmzZf{0oIX!Z
z2zYTS?CNK>452s%X3qDFOwMi%>I+p}-^4Ch^md#2%r{T&%`{ejJ}-C4lmzMP7DskH
zH8{k)?!&E~N2-0{3e7U^I~sJjtS{Ca)ZLdoX=_1~S=q$&3>W5khDTOtbnWy>4DH*i
zaOUEPte9H|(x%vbuzbI9+0hq|G{ed-KFqn;7_j4O{(hlE<E0@p?|ys!QS)1{*VPYM
z!rKa#^&GCBbNstp`Dp>a4}IoqX3Cuk|DtxP<%*KbV(}FA9i3JD{f<^)ZmG9cM?MpC
z4b)t7<<F|VduJAYxo9XIdSmrpostXZ4Q4E!^r>7Xs)vuQv}vzM9fO&&?Gmn^6Se`v
zOR~f@q9iy!t)x7$D3zhSyj(9cFS|H7u^?41zbJk7I~ysWB6*Oakj#>tR0j9F{M=N9
n;L6;j{G7~W1<&OCJcW>q)ZEm*C7P>&N*O#|{an^LB{Ts5#6P-m

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-users-hover.png b/wcs/qommon/static/css/dc2/small-icon-users-hover.png
new file mode 100644
index 0000000000000000000000000000000000000000..5221589634eaa55b3e7fc2f24ed4ee5112590203
GIT binary patch
literal 467
zcmV;^0WAKBP)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmY4c7nw4c7reD4Tcy00DDJL_t(I%gxiViW5;3#_``xCfNat
z)faFVL|CvE#4?gXWGj1Zwig#=pFspcu(Ptz&Pr?y89NbFQdw-LzQAH3nAuEXa~WqR
znc1j~AKd1g@BC-(Ip^}fD>NmtEQ3BS<4O#_#|Pwt!C-x0grzvZ9h{4)BRs|f{9FZH
z0**!_-EJ3d;u+4=EI)7?FN>lu91c$;J9S`$b+EevCdPIVqPHDbiJxuh{U*9ig{w5f
zqy;#Mp3{MqMnA`=6*V96qUJ5NG?XmMgb>W<^CX0@gS)sI)9>&Ihec7$ur!oVhatfY
z+`?PDu6^@5uEiU?!g2LaOW=4sHl0qTX}X7paVW?5f^X4w9^2^QJMQ=U{ik`Jm)B29
zatP8i-Nrq?C)~ruc<S23exB!V@U>|u7qDf0ZN-{Wbzo1!el;k;MjP;-RR@N@qO<^W
z6n{`Zi!~>DP}Kxaa0!c3U;&@ip6JqIhY&i8#UinuW|&tO`xmy?S>UUfYd8P^002ov
JPDHLkV1hOK%Ig3C

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-users.png b/wcs/qommon/static/css/dc2/small-icon-users.png
new file mode 100644
index 0000000000000000000000000000000000000000..a95140415615bba380bcb095baf59a7fa10dce52
GIT binary patch
literal 421
zcmV;W0b2fvP)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmY4c7nw4c7reD4Tcy00BiwL_t(I%hl7NPaHuM$MMfwwslZ?
zigQhBDp0jeT8peDp(GH3ZR+ShKyU=xR8%ynt*pbN5eRUXJsgzapiIRLVOe%L3WmO9
zk~eSW_s!(}-tgEX+KR*B@G^adIlRjIJ^aFN==b|Kv}GGGr6eMzv4wd&$wz1SfsZMr
z<2G&4EL2scC<<7?LJcP83s{N>RaK1#Mue17iMMU%x%LiaM2rX4dRyv_r(ON;0-j@V
z3viI{j0a}t624%+MRR~}NNq0Pcy=C{0@HYnHN33BHn4+JTr{E40-MBgUfcL-G%k!>
zevdas<MS0Kb!aqTCD!pN=LttR$=9avJnQ~o6Q6N@32pXp7K^SN4)pLMuU_pD6Znud
zou>4&=&sSrnoi(@<NpJudoZqPn*Vhd-!XFsc;GN=I)MYM{zEG+H2(Bod-qCR7Rzx<
P00000NkvXXu0mjf@AkJ(

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-workflows-hover.png b/wcs/qommon/static/css/dc2/small-icon-workflows-hover.png
new file mode 100644
index 0000000000000000000000000000000000000000..0e772ca5c097c77a8f9ade26c6520e6ed354a313
GIT binary patch
literal 703
zcmV;w0zmzVP)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmY4c7nw4c7reD4Tcy00Li0L_t(I%Z=1ch}C5j$MMf|-;6Ac
z(x7b7i=Y|QAT4Uwy_47rL{d>G3X_|tMN+FMiP}`qx<!R%AVSbW7jc8SAt?@S$|w_|
zFeO|lL0XdDm(${ZMy9cu>)Ac$Ih_Cbo!|HQ7h|H=>%q;q8;5WSx8PNLh~u43=W=~*
zT*Hh9@hKj|^>`Z3=ZF3ijjL>U64&7aoW||A26siobg$RD4fTllr7R%xCal3JY{naC
z%_%*L{kRujV%tI!K7dc~H<o9!llTU8w6OwD;Rrs$aG@RU$2+(Y*Wy=fiioMvXtV`W
z_&sZn;-`5{N!R|uXE>ATeK=4`iCV1|5%G1(oKf=}?z}>B?hkIj<5-sGOS9`rDWh4r
zJFo-O^X;&P*YOe-W$sbziio476j+Og^X?!%#)-===VVLL*(10Iw_*aXsWACIrPr|`
zYlqm1UBlt<3Jxc*8{5*&_4pancqs2DX4OZkS&e$VULTfjx2x4^EzOJds^|102Dl&Z
zV<Y-1sP9YXr?DpuS(*5pYP4Fd2HwUx6~t3H)gvnY&fqZK!!f*qx9~3ZVyBA7(^OAy
zfUodGV(>Xc#PL$f8oY=D+4v&5=-@;mc0NC3rXhTha{ru##UNQ+o`%#j|3gGPi*x^n
zN28P?BA&sfboN{Pmb;n6%Mr0Bxzld9hxlV2+%zJB>QB<e1=Z^~n|oP>mCa^z)bICA
zPEHyZGYxk}#Ex36wk&a3f*0^477qr4W+|mVwj1Vxy$IX!U7FL(-ThNa(QdcLPdMj%
l5pSx1)#-HlD*moI{so$0yfV19V1WPt002ovPDHLkV1kWjRha+)

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/small-icon-workflows.png b/wcs/qommon/static/css/dc2/small-icon-workflows.png
new file mode 100644
index 0000000000000000000000000000000000000000..c39100e9e7fdf02688ba7a4e753d07192004e658
GIT binary patch
literal 646
zcmV;10(t$3P)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmY4c7nw4c7reD4Tcy00JgSL_t(I%aznkh>dX+2Jqi|yMrM~
zOz!KWe3XzT`Pj_PU@#~fB^C%J&B9J8B8n+2j1t+{h_X?V5wVddlv#)c^3i(}gCUw3
zbFalcB<9YHvwQ#N{Gaoj=RE&6F-T-t2Gg+=m(Yn>IEKA=n5OCP`rKfE5i8M#ZJ3Bn
zScVCI7v_fu_$r$3M+?Tq-3HvvvTPPc;#M-im~&8%7ubsJ{gig&aY*tA>jq-DB6R9P
zZJd3;!(g`%qp=8Ya0H(Q((ocqVmNB>ImTU8E|;6J2VbN1CGJB~4K2p5#|_k}Y<MGj
zqGTklU~x1%j%)cUKnbRWZsQ`=RVtNwlO&NO36#(mxiL6^UDY%kffHC27h!oWms^6H
zvGJvt7rAG+fET|<4rX;|iZL587b!Le>$kWXOId^Qas6;;`j4>};0!jzHfQ2phz^rN
zhAn@9!PL-Hl4V&E$zfO>o9)DRObJE}@!b`dYw;YHF&{I~jE;N=dNzF3i+w64Z3-sc
z!Ekq+AHohC#VHgp8&8E6U(k*vIEU6)#GPo;7@`+djNKj!c>-yg79-~uU?0w7y^2wP
zZM8SpjSBCLi1T(l!2AB}kuMYqipAp2&?&`rbOhu2kf1Fzl&0x-yslz5`C_q{U@Y#1
zHO}Ls%5Q44%ERwL`Op7eRX~(+5I-;(w^iP63)V)n+R%E?=+D@vgKcZ*SA$P6?tcS{
gG5hdsC;)%QPjfDt6i^~tumAu607*qoM6N<$f;18xq5uE@

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/css/dc2/texture.png b/wcs/qommon/static/css/dc2/texture.png
new file mode 100644
index 0000000000000000000000000000000000000000..eb5ccb5ec3cdf7f20c344483958a2684e11e6df5
GIT binary patch
literal 2418
zcmbW3_dgqmAI3u{;VQTYX9cMm!38m*6tPKT7uQhKERv7}7geKnOWmm%BeAMyma1K=
zEn14!s5o~*ts0G*tya(XU-&++*Ymue-#(uopL7SD)p-F)0RRAS-p1P8>5L}-Ge7Vw
zOWG2)&d}h1b+I@j1OkzekdTy=l$Ms3mzRgb;fjiiN=iy9Dk^GfY8o0ENF-8AOACcU
z>FVkl8ymx5Ff<x{>Cz<-2qY*d$iu^P{``3`7z~9%`S|#ZjEqD?L`+Rh&CSg%EiJ9B
zt!-^>u~;k)hjVmvbaQiac6N4kb>-&f#^do`US1v^9^T&GzP`S}!NFl+VF3XFAt51t
zettwEF+4n+LZL)PMn*?R(`dBh<m4xnyL)FJ8&I5Z&Sw|@Pu=!nzyJV#w2ir`i~C@5
zzFVXx8fpe6XX&l&Hz#^FOd0)1KX7xkd#ZLn{;pgT7dNG_N3AyKx*V9Vq^#H;SCGK1
z|JLhEGkBVT_T{f%mRa8rjq*5UI^I)}T@z9jX{cavmZ}U(((&0GR8&V$8HnhbADmC6
z7G-<PV<Q;|{`*A-Jgu1_RS7`;5($QEj@<%We>^H~uHNOM7py2y-6!=p(~~7x0I73J
zk=^mRIQIJk&?-is?uIWh)sY)HG+e-Fe|Z`9)K4%rj;U_cSvmB=5YtQo(oA+;CU6jO
z)R<$|BMsZ2#uGAo5*0yuX)RP99*b^u2U9UAKg9e}?QbeBrr!ZmVxmT^I(w#NAp0yJ
z3gpG)vA7C?7k?G@bRH;hvH6-tF&|%ko<*;Wx@=7s!#Gc7js%h_l1haH!vuZgwR%XJ
zAIO1&tV}$=@&y4>|3$(ru9knIu8wq22VJ6l!jl|Z-rng-E*su{Jo6fWq}m0oLnno8
z4@|CI<lO~JumzGD8(1%LRMu$Quz;Y6>*j`Xy1u=JlRj0G&lNyMNgQSO!3%WDIE7N~
z6^K9!yL@fakNp%IJY(Lt_s81lCn!QV0$x&}tgQQY{9@x;R@o?bkcrept_pBmuP9HX
zf=P$H3jJ)mEsW(Y7T|DE4+(UsEsM!*NqZpz*{A5Lnd8bzhX`LEvHX`;`V5yeNCu)P
zUPoqI-QR#s#(kD825KIitZMG%PV4j>7(5`~xs}Q!G|t?7Al~%zdMRVojvvdXex+<(
zmg+Bl)U>5G8&Mn$KVg(z5Y@|tOuhgdU`#)X<R~67XN8(YYOYyt&RLWq>I}*~HIb&c
z)X8rDqzZp$Yn`?MYD!`cPDH#EJPREP+$t`t&G?I<&NjQrXs3UGN?2&44H7n+UK)|-
z+2HBd-u*GRi<9QAHq4@RmrIx#!`JG+Q!2_~Mscn*{noS`_x;NQ=<W=`I@z{gNAh@0
zPV}O<tO}UZ?$nr7_*Fe;Q1Ox28!BsjyhNY=a1<1l(-w}r+dNq767ZD>%y*jD%6(aD
zP)7ynHD_>Kj!W{!r9wE)RD(^=-EtpB<Fc-ip^NyC*q$a!``(Q(fuDlW3846=xo)A_
zk1Wkj1WX2o?$b40Uaj|Owb$~pHg^0S4nEOq*YmS(b!3Xa^M5$z1!0A*sS4TCxGr68
z?<P^+{!@{`u9rgYC(vK}S1U+QUT7+}AiNy&8=@6RSKdbko~Tu4H0B^>pZ_MmdPLn?
z|87d=iJcuL@}?u+RaaMI+Yeng$bo*#2DIlwQyM?ZysET47XYvCa#Jb`ReYlTC+gt`
zJOm<2m>3Q(+zVPDW<uAv4!gxA^XsRO9T2N?1RYoWd~B#DG1~xmjS)1;?eAFru|JRK
zJX4^)p{P{b=Tq*C;MNeGf3t8Q{u*jTKC4ynIrql6gs`{5N11<-TQ5@W;ZnZ{>}+ZB
z22lm8Mtz!78uzQi@JcW~dDBG-|741n)9sL<;t`6Z;WOeCUh3ec>NAi{9O~$Z%}C=0
z^wI~oX)pJ?NPS0t*()y%eX_f|86p(F7&9Fg-Fl25w2fifYVHbw7lJUr>rPD$hz$wj
z73ghBFDYaD%P6ACx7xV#M=Wj8Y@&y&>f_i>7W@!W^csmr1f|CUZI6|nrZlzmeNWSq
zb60O13c%Wb=MY2VL}QK%O;0r?+_#wGYsObRiX53)VhAPw;~{TOs-NoJorih7T@0$r
zW1m9a7EeoeNs3jC73YD>+iaw@l~U9uwkjiKrT@hAP3jeIVO0^WJC9`Q=1|G;?+L%N
z7x>BNs>Uk$zZGzfk{smo-ULWJaLnP*{Xc=YVEZdw&+0L?A_{<>8Oi=m@7)F>TiviT
z#eIeCltY2nSPwds{yVS?KkiGV9#rq(PR{k)SivAM74I-#zlJUJU!onq!y9+Z<PeqI
zdl!Q#oGe+`1fRxsn~{y%IfopwuxzI$)8Zt*QEOyC#&}nJ>ie@^ykY8f_3WbV%HIaE
zq3*^`5dH7BD&C*0N%0ok$SX3;M&y<bq7~8$E`w^S6|jNp5aQ~WYBxn_^P=yK$ZENQ
zgsqL=RiD`%-KTIS7xZo(9WV@QU>g9~cKNXUR74$Km2g(ux&*WyKTP}<nD2|kVCsR7
zTCP0ZQsjv}j41YN7mb(!_!W8}?A=<IbZTb)`bnbM+VqDAKJcApq=`v)FZG7D+0Jv;
z<Nj&X33C&x8lCJsn&G8G8HlnyO$Sf&!X=uM-z)F7v1#C+SG|5Lne9HhViX{Ihj2GA
zgf%j*tv8frP4Q&Nik&_o0?IgV75^TNv)Zex-Qx=Z3e_y-PCY2ebRtpSZ{3#rwL<-U
zcK?k&`zLb)6Jm=M2%NqlgKH@?!u)av4~!fX3Pp;BroqVTKcs;%(Qjge1t$hvo#wwT
zzW%U${OTSgyl2ogbmxh<_G*0bwXOi(*{E#_Dy>y|Ke^9u=3&Sm`oo0I&7-j6k*J$|
zB=B)}yKlOR=&wyR)rAq6;Lkm+>^<tDMp+|};3KXy9?;I!<g`D>M=Bs`7U$)hhr-pB
zSxZwlgz2_4@_KEeT<OyO{GPKk`WrW2{`JLp;7n8Ec3>BZc3FLOb?S2;ShWA@lJZ;G
zOf_CnY`~#{A(OQGq4V2m%)h@)u^Rh)qz+v?(Dh2ds-Z7b&j$Y#=_wstAJb+6P>`r@
zC&wmf(&9(N1lOx)NNnJ2ha%+{%R*mSfX%?_vzAVlBEh)ivlH;!{GY}lb3@vFg^tHI
buTQ~y@sPxsykY#=6am;+;LIB^-iiMKh=Eg;

literal 0
HcmV?d00001

diff --git a/wcs/qommon/static/js/gadjo.sidepage.js b/wcs/qommon/static/js/gadjo.sidepage.js
new file mode 100644
index 000000000..eedfb9864
--- /dev/null
+++ b/wcs/qommon/static/js/gadjo.sidepage.js
@@ -0,0 +1,19 @@
+$(function() {
+  var sidepage_button = $('#sidepage #applabel');
+  sidepage_button.on('click', function() {
+    $('#sidepage, #main').addClass('enable-transitions');
+    $('#sidepage, #main').toggleClass('sidepage-expanded');
+    if ($('#sidepage').hasClass('sidepage-expanded')) {
+       window.localStorage.sidepage_status = 'expanded';
+    } else {
+       window.localStorage.sidepage_status = null;
+    }
+  });
+  if (window.location.protocol == 'file:') {
+       /* don't open sidepage when loading from a file:// */
+       window.localStorage.sidepage_status = null;
+  }
+  if (window.localStorage.sidepage_status == 'expanded' || window.localStorage.sidepage_status === undefined) {
+    $('#sidepage, #main').toggleClass('sidepage-expanded');
+  }
+});
diff --git a/wcs/qommon/template.py b/wcs/qommon/template.py
index bff852852..a3261a905 100644
--- a/wcs/qommon/template.py
+++ b/wcs/qommon/template.py
@@ -171,15 +171,21 @@ ADMIN_TEMPLATE_EZT = """<!DOCTYPE html>
     [if-any extra_css]
     <link rel="stylesheet" type="text/css" href="[extra_css]"/>
     [end]
+    [if-any extra_head]
+    [extra_head]
+    [end]
   </head>
   <body [if-any admin_for_all]class="admin-for-all"[end]>
   <div id="top">
+    <div id="sidepage">
+      <span id="applabel">[if-any app_label][app_label][end]</span>
+      [header_menu]
+    </div>
     [user_info]
   </div>
   <div id="main">
   <div id="header">
     <h1><span>[site_name]</span></h1>
-    <div id="main-menu">[header_menu]</div>
   </div>
   <div id="main-content">
     <div id="more-user-links">
@@ -351,6 +357,8 @@ def decorate(body, response):
             if os.path.exists(filename):
                 extra_css = root_url + 'themes/%s/admin.css' % current_theme
                 break
+        extra_head = get_publisher().get_site_option('backoffice_extra_head')
+        app_label = get_publisher().get_site_option('app_label') or 'w.c.s.'
     else:
         if current_theme == 'default':
             css = root_url + 'css/%s.css' % get_publisher().APP_NAME