Latest design changes for 15.04 - from Evonne (Bug #1433776)

Change-Id: Iaf5af0bc039a6fecaa36bbef1e15ad441b23e1d0
Signed-off-by: Robert Lyon <robertl@catalyst.net.nz>

htdocs/artefact/multirecipientnotification/sendmessage.php

@@ -196,14 +196,13 @@ $form = pieform(array(
             'initfunction' => 'translate_ids_to_names',
             'multiple' => true,
             'ajaxextraparams' => array(),
-            'width' => '400px',
             'rules' => array('required' => true),
         ),
         'subject' => array(
             'title' => get_string('titlesubject', 'artefact.multirecipientnotification'),
             'type' => 'text',
             'name' => 'subject',
-            'size' => '80',
+            'size' => '40',
             'defaultvalue' => $subject,
             'rules' => array('required' => true),
         ),

htdocs/theme/aqua/static/style/style.css

@@ -34,6 +34,10 @@ a:hover,
 a:focus {
     text-decoration: underline;
 }
+.bar-before,
+#footer-nav .bar-before {
+    border-left: 1px solid #8fa3df;
+}
 /* some common listing text styles */
 .title a {
     color: #03219d;
@@ -270,6 +274,7 @@ div.pagination a {
 #header,
 .main-nav ul,
 #sub-nav ul,
+#tertiary-nav ul,
 #mainmiddle,
 #footer {
     width: 95%;
@@ -410,6 +415,23 @@ div.pagination a {
 .main-nav .dropdown-sub li a:focus {
     background: #1F97D5;
 }
+.main-nav .dropdown-sub li.has-sub a,
+.main-nav .dropdown-sub li.selected.has-sub a {
+    background-image: url(../../../raw/static/images/expand.png);
+    background-repeat: no-repeat;
+    background-position: calc(100% - 8px) 50%;
+}
+.main-nav .dropdown-tertiary {
+    left: calc(100% - 3px);
+}
+/******************** Tertiary navigation ********************/
+#tertiary-nav {
+    background: none;
+}
+#tertiary-nav ul {
+    background: #eeeeee;
+    text-align: right;
+}
 /******************** Tabs ********************/
 ul.in-page-tabs li a,
 ul.in-page-tabs li a:link,

htdocs/theme/custom/static/style/style.css

@@ -77,7 +77,8 @@ div.pagination a {
     width: 95%;
 }
 .main-nav,
-#sub-nav {
+#sub-nav,
+#tertiary-nav {
     max-width: 1280px;
     min-width: 960px;
     margin: 0 auto;
@@ -213,6 +214,17 @@ div.pagination a {
     color: #1A428F;
     background: #FFF4EA;
 }
+.main-nav .dropdown-sub li.has-sub a,
+.main-nav .dropdown-sub li.selected.has-sub a {
+    background-image: url(../../../raw/static/images/expand.png);
+    background-repeat: no-repeat;
+    background-position: calc(100% - 8px) 50%;
+}
+/******************** Tertiary navigation ********************/
+#tertiary-nav {
+    background: #FFFFFF;
+    border-bottom: 1px solid #EEEEEE;
+}
 /******************** Tabs ********************/
 ul.in-page-tabs li a,
 ul.in-page-tabs li a:link,

htdocs/theme/default/static/style/style.css

@@ -296,6 +296,7 @@ div.pagination a {
 #header,
 .main-nav ul,
 #sub-nav ul,
+#tertiary-nav ul,
 #mainmiddle,
 #footer {
     min-width: 0;
@@ -427,8 +428,8 @@ div.pagination a {
     border-right: 0;
 }
 .main-nav .dropdown-sub li a:hover,
-.main-nav .dropdown-sub li.selected a:hover,
 .main-nav .dropdown-sub li a:focus,
+.main-nav .dropdown-sub li.selected a:hover,
 .main-nav .dropdown-sub li.selected a:focus {
     color: #4C711D;
     background: #d5d5d5;
@@ -441,34 +442,15 @@ div.pagination a {
 .main-nav .dropdown-sub li.selected.has-sub a {
     background-image: url(../../../raw/static/images/expand.png);
     background-repeat: no-repeat;
-    background-position: 100% 50%;
+    background-position: calc(100% - 8px) 50%;
 }
 /******************** Tertiary navigation ********************/
 #tertiary-nav {
-    font-weight: bold;
-}
-#tertiary-nav ul {
-    background: #FFFFFF;
-    margin: 0;
-    padding: 10px;
-}
-#tertiary-nav li {
-    margin: 5px;
-}
-#tertiary-nav li a,
-#tertiary-nav li a:link,
-#tertiary-nav li a:visited,
-#tertiary-nav li a:active {
-    padding: 5px 10px;
-    text-decoration: none;
-    background: #f7f9ee;
-    -webkit-border-radius: 5px;
-    -moz-border-radius: 5px;
-    border-radius: 5px;
+    background: #eeeeee;
 }
 #tertiary-nav li a:hover,
-#tertiary-nav li.selected a:hover,
 #tertiary-nav li a:focus,
+#tertiary-nav li.selected a:hover,
 #tertiary-nav li.selected a:focus {
     color: #335804;
 }
@@ -476,39 +458,20 @@ div.pagination a {
 #tertiary-nav li.selected a:link,
 #tertiary-nav li.selected a:visited,
 #tertiary-nav li.selected a:active {
-    background: #FFFFFF url(../images/submenu-active.gif) repeat-x right top;
+    background: #FFFFFF;
     color: #211C00;
 }
 #tertiary-nav li a:hover,
-#tertiary-nav li.selected a:hover,
 #tertiary-nav li a:focus,
+#tertiary-nav li.selected a:hover,
 #tertiary-nav li.selected a:focus {
     color: #7e7327;
 }
 /******************** Dropdown tertiary navigation ********************/
-.main-nav .dropdown-tertiary {
-    display: none;
-    position: absolute;
-    left: 100%;
-    top: 0;
-    z-index: 3;
-    clear: both;
-    padding: 0;
-    margin: 0;
-    min-width: 0;
-}
 .main-nav .dropdown-sub li.has-sub
 .dropdown-tertiary li a {
     background-image: none;
 }
-.main-nav ul ul li:hover .dropdown-tertiary,
-.main-nav ul ul li .dropdown-tertiary.show-menu {
-    display: block;
-}
-.main-nav .dropdown-tertiary li {
-    list-style: none;
-    display: block;
-}
 .main-nav .dropdown-sub li.selected ul li a,
 .main-nav .dropdown-sub li.selected ul li a:link,
 .main-nav .dropdown-sub li.selected ul li a:visited,
@@ -544,7 +507,6 @@ div.pagination a {
     border-left: 0;
     border-right: 0;
 }
-
 /******************** Responsive navigation ********************/
 /* reset responsive navigation */
 .rd-nav-title {
@@ -625,7 +587,7 @@ div.pagination a {
     position: inherit;
 }
 .rd-navmenu .nav-expand ul.dropdown-tertiary li {
-    font-size: 0.8em;
+    font-size: 0.833em;
 }
 .rd-navmenu .main-nav ul li {
     display: block;
@@ -753,6 +715,17 @@ div.pagination a {
     border: 0;
     text-decoration: underline;
 }
+/* responsive tertiary nav */
+.rd-navmenu .nav-expand .dropdown-tertiary li {
+    clear: none;
+    float: left;
+    width: 100%;
+    margin-right: 0%;
+    background: none;
+    border-top: 1px dotted #FFFFFF;
+    border-bottom: 0;
+    left: 0;
+}
 
 /* js fallback for 768px or less */
 @media screen and (max-width: 768px) {
@@ -790,6 +763,17 @@ div.pagination a {
         -moz-border-radius: 0 0 5px 5px;
         border-radius: 0 0 5px 5px;
     }
+    .no-js .main-nav ul.dropdown-tertiary {
+        left: 0;
+        border: 0;
+        display: block;
+        margin: 0 5px;
+        padding: 0;
+        position: inherit;
+    }
+    .no-js .main-nav ul.dropdown-tertiary li {
+        font-size: 0.833em;
+    }
     .no-js .main-nav ul li {
         display: block;
         clear: left;
@@ -894,6 +878,16 @@ div.pagination a {
     .no-js .main-nav li:hover .dropdown-sub {
         display: block !important;
     }
+    .no-js .main-nav .dropdown-tertiary li {
+        clear: none;
+        float: left;
+        width: 100%;
+        margin-right: 0%;
+        background: none;
+        border-top: 1px dotted #FFFFFF;
+        border-bottom: 0;
+        left: 0;
+    }
     /* hide sub nav when dropdown is turn off */
     .no-js #sub-nav {
         display: none;
@@ -1381,6 +1375,9 @@ a.persona-button:before {
         margin: 10px 0 50px 0;
         float: none;
         width: auto;
+        -webkit-border-radius: 5px;
+        -moz-border-radius: 5px;
+        border-radius: 5px;
     }
     /* Groups > Group's Report */
     .groupreport thead {
@@ -1473,13 +1470,19 @@ a.persona-button:before {
     }
     input.text,
     input.password,
-    textarea,
-    div.grippie,
     input[type=text],
     input[type=password] {
         max-width: 94%;
         margin-bottom: 3px;
     }
+    textarea,
+    div.grippie {
+        width: 100%;
+        margin-bottom: 3px;
+    }
+    .select2-container {
+        width: 100% !important;
+    }
     input#editblog_tags,
     input#editpost_tags,
     select {
@@ -2362,6 +2365,7 @@ a.persona-button:before {
     #header,
     #main-nav,
     #sub-nav,
+    #tertiary-nav,
     #mainmiddle,
     #footer {
         min-width: 300px;

htdocs/theme/fresh/static/style/style.css

@@ -73,6 +73,16 @@ tr.highlight-file td {
 fieldset {
     border: 1px solid #BEE3F1;
 }
+.pseudofieldset .pseudolegend {
+    background-color: #080d0f;
+}
+fieldset.collapsed legend a,
+.pseudofieldset.collapsed .pseudolegend a,
+fieldset.collapsible legend a,
+.pseudofieldset.collapsible .pseudolegend a,
+.no-js fieldset.collapsed legend a {
+    background-color: #080d0f;
+}
 /******************** Buttons ********************/
 /* Buttons to override with colour */
 /* input buttons */
@@ -382,7 +392,6 @@ div.warning,
     max-width: 1280px;
     min-width: 960px;
     text-align: right;
-    height: 26px;
 }
 #sub-nav li a,
 #sub-nav li a:link,
@@ -418,6 +427,37 @@ div.warning,
     background: #00aef1;
     color: #FFFFFF;
 }
+.main-nav .dropdown-sub li.has-sub a,
+.main-nav .dropdown-sub li.selected.has-sub a {
+    background-image: url(../../../raw/static/images/expand.png);
+    background-repeat: no-repeat;
+    background-position: calc(100% - 8px) 50%;
+}
+.main-nav .dropdown-tertiary {
+    left: calc(100% - 3px);
+}
+/******************** Tertiary navigation ********************/
+#tertiary-nav {
+    background: none;
+}
+#tertiary-nav ul {
+    background: #0285b7;
+    text-align: right;
+}
+#tertiary-nav li a,
+#tertiary-nav li a:link,
+#tertiary-nav li a:visited,
+#tertiary-nav li a:active {
+    color: #FFFFFF;
+}
+#tertiary-nav li.selected a,
+#tertiary-nav li.selected a:link,
+#tertiary-nav li.selected a:visited,
+#tertiary-nav li.selected a:active {
+    color: #FFFFFF;
+    text-decoration: underline;
+    font-weight: normal;
+}
 /******************** Tabs ********************/
 ul.in-page-tabs li a,
 ul.in-page-tabs li a:link,

htdocs/theme/primaryschool/static/style/style.css

@@ -278,11 +278,11 @@ div.pagination a {
 }
 #top-wrapper {
     background: transparent url(../images/header-swirl.png) no-repeat right top;
-    height: 150px;
+    min-height: 150px;
 }
 #micro #top-wrapper {
     background: none;
-    height: auto;
+    min-height: 0;
 }
 #main-column-container {
     padding-left: 10px;
@@ -565,6 +565,35 @@ div.pagination a {
     background: #0b1960;
     color: #ffd64d;
 }
+.main-nav .dropdown-sub li.has-sub a,
+.main-nav .dropdown-sub li.selected.has-sub a {
+    background-image: url(../../../raw/static/images/expand.png);
+    background-repeat: no-repeat;
+    background-position: calc(100% - 8px) 50%;
+}
+.main-nav .dropdown-tertiary {
+    left: 100%;
+}
+.main-nav li span span {
+    background: none;
+}
+/******************** Tertiary navigation ********************/
+#tertiary-nav {
+    background: none;
+}
+#tertiary-nav li a,
+#tertiary-nav li a:link,
+#tertiary-nav li a:visited,
+#tertiary-nav li a:active {
+    color: #ffb24e;
+}
+#tertiary-nav li.selected a,
+#tertiary-nav li.selected a:link,
+#tertiary-nav li.selected a:visited,
+#tertiary-nav li.selected a:active {
+    color: #FFFFFF;
+    font-weight: bold;
+}
 /******************** Tabs ********************/
 div.tabswrap {
     background: url(../images/inpage-right.png) no-repeat right 0;

htdocs/theme/raw/artefact/multirecipientnotification/static/style.css

@@ -14,30 +14,35 @@
     margin: .8em 0 .2em;
     line-height: 1.5;
 }
-
-#sendmessage .select2-choices, #sendmessage .text, #sendmessage textarea {
-    width: 400px;
-    padding-left: 0px;
-    padding-right: 0px;
+#messagethread {
+    margin-bottom: 10px;
 }
-
-#messagethread td.profilepicturecolumn {
-    width: 20px;
+#messagethread td label {
+    margin-right: 5px;
+}
+#messagethread td div.recipientsdiv {
+    margin-bottom: 5px;
 }
-
 #messagethread td div.subjectdiv {
     -ms-word-break: break-all;
     word-break: break-all;
     -webkit-hyphens: auto;
     -moz-hyphens: auto;
     hyphens: auto;
+    margin-bottom: 10px;
+}
+#messagethread td div.messagebody {
+    font-size: 1.25em;
+    margin-bottom: 5px;
 }
 
 #activitylist tr.unread {
     font-weight: bold;
 }
 
-.userlist img.togglebtn, .userlist span.recipientlist {
+.userlist img.togglebtn,
+.userlist span.recipientlist {
     float: left;
-    margin-right: 2px;
+    margin-right: 3px;
+    margin-top: 1px;
 }
\ No newline at end of file

htdocs/theme/raw/artefact/multirecipientnotification/templates/sendmessage.tpl

@@ -5,7 +5,7 @@
     <tbody>
     {foreach from=$messages item=message}
         <tr class="{cycle values='r0,r1'}">
-          <td class="profilepicturecolumn">
+          <td class="icon-container">
             <img src="{profile_icon_url user=$message->fromid maxwidth=20 maxheight=20}" alt="">
           </td>
           <td>
@@ -16,7 +16,7 @@
               {if ($message->fromusrlink)}</a>{/if}
               <span class="postedon">{$message->ctime|strtotime|format_date}</span>
             </h5>
-            <div>
+            <div class="recipientsdiv">
                 <label>{str tag='labelrecipients' section='artefact.multirecipientnotification'}</label>
 
                 {foreach from=$message->tousrs item=recipient key="index"}

htdocs/theme/raw/static/style/style.css

@@ -37,7 +37,7 @@ legend,
 fieldset,
 button,
 .select2-container-multi .select2-choices .select2-search-field input,
-.mce-container, .mce-container *, .mce-widget, .mce-widget * {
+.select2-search input {
     font-family: Arial, "Nimbus Sans L", Helvetica, sans-serif;
 }
 #container,
@@ -88,6 +88,9 @@ p span {
 :focus {
     outline: 2px solid #FFFF00;
 }
+div:focus {
+    outline: 0;
+}
 html:focus {
     outline: 0;
 }
@@ -248,6 +251,90 @@ form.oneline.inline div,
 img.close:focus {
     border: 1px solid #FFFF00;
 }
+/******************** UI dialog ********************/
+.ui-widget-overlay {
+    opacity: 0.7;
+    background: #000000;
+    filter: alpha(opacity=70);
+}
+.ui-dialog {
+    background: #FFFFFF;
+    border: 5px solid #DDDDDD;
+    -webkit-border-radius: 10px;
+    -moz-border-radius: 10px;
+    border-radius: 10px;
+    padding: 10px;
+    font-size: 0.75em;
+}
+.ui-dialog .ui-dialog-titlebar {
+    border-bottom: 2px solid #D1D1D1;
+    background: none;
+    padding: 3px 0;
+}
+.ui-dialog .ui-dialog-title {
+    margin: 3px 0;
+    color: #333333;
+    font-size: 1.333em;
+    font-weight: bold;
+}
+.ui-dialog .ui-dialog-titlebar-close {
+    background: transparent url(../images/btn_close.png) no-repeat 0 0;
+    border: 0 !important;
+    margin-right: 0 !important;
+    width: 24px;
+    height: 24px;
+    padding: 0px;
+    vertical-align: top;
+    cursor: pointer !important;
+}
+.ui-dialog .ui-dialog-titlebar-close .ui-icon {
+    background: none;
+}
+.ui-dialog .ui-dialog-content {
+    padding: 0;
+    margin: 10px 0;
+}
+.ui-dialog .ui-dialog-buttonpane {
+    border-top: 0;
+    padding: 0;
+}
+.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
+    float: none;
+}
+/******************** MCE Modal ********************/
+#mce-modal-block {
+    opacity: 0.7 !important;
+    background: #000000 !important;
+    filter: alpha(opacity=70) !important;
+}
+.mce-window {
+    background: #FFFFFF !important;
+    border: 5px solid #DDDDDD !important;
+    -webkit-border-radius: 10px !important;
+    -moz-border-radius: 10px !important;
+    border-radius: 10px !important;
+    padding: 10px !important;
+    font-size: 0.75em !important;
+    font-family: Arial, "Nimbus Sans L", Helvetica, sans-serif !important;
+}
+.mce-window-head {
+    padding: 3px 0 3px 0 !important;
+    border-bottom: 2px solid #D1D1D1 !important;
+}
+button.mce-close {
+    background: transparent url(../images/btn_close.png) no-repeat 0 0 !important;
+    width: 24px !important;
+    height: 24px !important;
+    font-size: 1px;
+    text-indent: -9999px;
+    overflow: hidden;
+    right: 0 !important;
+    top: 0 !important;
+}
+.mce-foot {
+    background: none !important;
+    border: 0 !important;
+}
 /******************** Ajax login ********************/
 #ajax-login-form {
     border: 5px solid #DDDDDD;
@@ -688,7 +775,7 @@ fieldset.collapsible legend {
 fieldset.collapsible legend a,
 .pseudofieldset.collapsible .pseudolegend a {
     padding-left: 15px;
-    background: url(../images/expanded.png) 0 center no-repeat;
+    background: #FFFFFF url(../images/expanded.png) 0 center no-repeat;
     text-decoration: none;
 }
 fieldset legend a:hover,
@@ -697,10 +784,10 @@ fieldset legend a:hover,
 }
 fieldset.collapsed legend a,
 .pseudofieldset.collapsed .pseudolegend a {
-    background: url(../images/expand.png) 0 center no-repeat;
+    background: #FFFFFF url(../images/expand.png) 0 center no-repeat;
 }