Skip to content

Commit

Permalink
Fix to GCWU intranet SVG icons in mobile view. More extends/placehold…
Browse files Browse the repository at this point in the history 
…ers in SCSS. Changed pe. to _pe. where feasible.
  • Loading branch information
Paul Jackson authored and Paul Jackson committed Mar 18, 2013
1 parent 87a09f4 commit 378ebc0
Show file tree
Hide file tree
Showing 43 changed files with 1,744 additions and 1,306 deletions.
73 changes: 32 additions & 41 deletions src/js/dependencies/calendar.js
View file
Expand Up @@ -80,7 +80,7 @@
calHeader = $('<div class="cal-header"></div>');
}

calHeader.prepend('<div class="cal-month">' + pe.dic.get('%calendar-monthNames')[month] + ' ' + year + '</div>');
calHeader.prepend('<div class="cal-month">' + _pe.dic.get('%calendar-monthNames')[month] + ' ' + year + '</div>');

if (shownav) {
//Create the month navigation
Expand All @@ -106,10 +106,11 @@
},

createMonthNav : function (calendarid, year, month, minDate, maxDate) {
var monthNav, suffix, titleSuffix, newMonth, newYear, showButton, btnCtn, btn, n, alt;
if ($('#cal-' + calendarid + '-monthnav').length > 0) {
monthNav = $('#cal-' + calendarid + '-monthnav');
} else {
var monthNav = $('#cal-' + calendarid + '-monthnav'),
suffix, titleSuffix, newMonth, newYear, showButton, btnCtn, btn, n, alt,
monthNames = _pe.dic.get('%calendar-monthNames');

if (monthNav.length === 0) {
monthNav = $('<div id="cal-' + calendarid + '-monthnav"></div>');
}

Expand All @@ -122,7 +123,7 @@
switch (n) {
case 0:
suffix = 'prevmonth';
titleSuffix = pe.dic.get('%calendar-previousMonth');
titleSuffix = _pe.dic.get('%calendar-previousMonth');
if (month > 0) {
newMonth = month - 1;
newYear = year;
Expand All @@ -141,7 +142,7 @@
monthNav.append(_pe.fn.calendar.createGoToForm(calendarid, year, month, minDate, maxDate));
}
suffix = 'nextmonth';
titleSuffix = pe.dic.get('%calendar-nextMonth');
titleSuffix = _pe.dic.get('%calendar-nextMonth');
if (month < 11) {
newMonth = month + 1;
newYear = year;
Expand All @@ -161,7 +162,7 @@
}

if (showButton) {
alt = titleSuffix + pe.dic.get('%calendar-monthNames')[newMonth] + ' ' + newYear;
alt = titleSuffix + monthNames[newMonth] + ' ' + newYear;

if (btnCtn) {
btn = btnCtn.children('a').unbind();
Expand Down Expand Up @@ -193,9 +194,9 @@
_pe.fn.calendar.create(event.data.calID, event.data.year, event.data.month, true, event.data.mindate, event.data.maxdate);

if (ctn.find('.' + btnClass).length < 1) {
pe.focus(ctn.find('.cal-goto-link a'));
_pe.focus(ctn.find('.cal-goto-link a'));
} else {
pe.focus(ctn.find('.' + btnClass + ' a'));
_pe.focus(ctn.find('.' + btnClass + ' a'));
}
},
yearChanged : function (event) {
Expand All @@ -206,6 +207,7 @@
minMonth = 0,
maxMonth = 11,
month,
monthNames = _pe.dic.get('%calendar-monthNames'),
i;
if (year === minDate.getFullYear()) {
minMonth = minDate.getMonth();
Expand All @@ -224,13 +226,13 @@
}

for (i = minMonth; i <= maxMonth; i += 1) {
monthField.append('<option value="' + i + '"' + ((i === month) ? ' selected="selected"' : '') + '>' + pe.dic.get('%calendar-monthNames')[i] + '</option>');
monthField.append('<option value="' + i + '"' + ((i === month) ? ' selected="selected"' : '') + '>' + monthNames[i] + '</option>');
}
},

createGoToForm : function (calendarid, year, month, minDate, maxDate) {
var goToForm = $('<div class="cal-goto"></div>'),
form = $('<form id="cal-' + calendarid + '-goto" role="form" style="display:none;" action=""><fieldset><legend>' + pe.dic.get('%calendar-goToTitle') + '</legend></fieldset></form>'),
form = $('<form id="cal-' + calendarid + '-goto" role="form" style="display:none;" action=""><fieldset><legend>' + _pe.dic.get('%calendar-goToTitle') + '</legend></fieldset></form>'),
fieldset,
yearContainer,
yearField,
Expand All @@ -252,7 +254,7 @@

//Create the year field
yearContainer = $('<div class="cal-goto-year"></div>');
yearField = $('<select title="' + pe.dic.get('%calendar-goToYear') + '" id="cal-' + calendarid + '-goto-year"></select>');
yearField = $('<select title="' + _pe.dic.get('%calendar-goToYear') + '" id="cal-' + calendarid + '-goto-year"></select>');
for (y = minDate.getFullYear(), _ylen = maxDate.getFullYear(); y <= _ylen; y += 1) {
yearField.append($('<option value="' + y + '"' + (y === year ? ' selected="selected"' : '') + '>' + y + '</option>'));
}
Expand All @@ -262,37 +264,30 @@

//Create the list of month field
monthContainer = $('<div class="cal-goto-month"></div>');
monthField = $('<select title="' + pe.dic.get('%calendar-goToMonth') + '" id="cal-' + calendarid + '-goto-month"></select>');
monthField = $('<select title="' + _pe.dic.get('%calendar-goToMonth') + '" id="cal-' + calendarid + '-goto-month"></select>');

monthContainer.append(monthField);
fieldset.append(monthContainer);

// FIXME: Handle month filtering for IE6
if (pe.ie === 6) {
$(pe.dic.get('%calendar-monthNames')).each(function (index, value) {
monthField.append('<option value="' + index + '"' + ((index === month) ? ' selected="selected"' : '') + '>' + value + '</option>');
});
} else {
// Update the list of available months when changing the year
yearField.bind('change', {minDate: minDate, maxDate: maxDate, monthField: monthField}, _pe.fn.calendar.yearChanged);
yearField.change(); // Populate initial month list
}
// Update the list of available months when changing the year
yearField.bind('change', {minDate: minDate, maxDate: maxDate, monthField: monthField}, _pe.fn.calendar.yearChanged);
yearField.change(); // Populate initial month list

buttonContainer = $('<div class="cal-goto-button"></div>');
button = $('<input type="submit" class="button button-accent" value="' + pe.dic.get('%calendar-goToButton') + '" />');
button = $('<input type="submit" class="button button-accent" value="' + _pe.dic.get('%calendar-goToButton') + '" />');
buttonContainer.append(button);
fieldset.append(buttonContainer);

buttonCancelContainer = $('<div class="cal-goto-button"></div>');
buttonCancel = $('<input type="button" class="button button-dark" value="' + pe.dic.get('%calendar-cancelButton') + '" />');
buttonCancel = $('<input type="button" class="button button-dark" value="' + _pe.dic.get('%calendar-cancelButton') + '" />');
buttonCancel.click(function () {
_pe.fn.calendar.hideGoToForm(calendarid);
});
buttonCancelContainer.append(buttonCancel);
fieldset.append(buttonCancelContainer);

goToLinkContainer = $('<p class="cal-goto-link" id="cal-' + calendarid + '-goto-link"></p>');
goToLink = $('<a href="javascript:;" role="button" aria-controls="cal-' + calendarid + '-goto" aria-expanded="false">' + pe.dic.get('%calendar-goToLink') + '</a>');
goToLink = $('<a href="javascript:;" role="button" aria-controls="cal-' + calendarid + '-goto" aria-expanded="false">' + _pe.dic.get('%calendar-goToLink') + '</a>');
goToLink.on('click', function () {
_pe.fn.calendar.showGoToForm(calendarid);
});
Expand All @@ -310,7 +305,7 @@
txt,
wday;
for (wd = 0; wd < 7; wd += 1) {
txt = pe.dic.get('%calendar-weekDayNames')[wd];
txt = _pe.dic.get('%calendar-weekDayNames')[wd];
wday = $('<li id="cal-' + calendarid + '-wd' + (wd + 1) + '" class="cal-wd' + (wd + 1) + '"><abbr title="' + txt + '">' + txt.substr(0, 1) + '</abbr></li>');
if (wd === 0 || wd === 6) {
wday.addClass = 'we';
Expand All @@ -332,8 +327,12 @@
day,
element,
elementParent,
child,
isCurrentDate;
isCurrentDate,
textWeekDayNames = _pe.dic.get('%calendar-weekDayNames'),
textMonthNames = _pe.dic.get('%calendar-monthNames'),
textCurrentDay = _pe.dic.get('%calendar-currentDay'),
frenchLang = (_pe.language === 'fr');

//Get the day of the week of the first day of the month | Determine le jour de la semaine du premier jour du mois
date.setFullYear(year, month, 1);
firstday = date.getDay();
Expand Down Expand Up @@ -366,15 +365,7 @@
if (daycount > lastday) {
breakAtEnd = true;
}
element = $('<li></li>');
child = $('<div></div>');

if (pe.language === 'en') {
child.append('<span class="wb-invisible">' + pe.dic.get('%calendar-weekDayNames')[day] + ' ' + pe.dic.get('%calendar-monthNames')[month] + ' </span>' + daycount + '<span class="wb-invisible"> ' + year + ((isCurrentDate) ? pe.dic.get('%calendar-currentDay') : '') + '</span>');
} else if (pe.language === 'fr') {
child.append('<span class="wb-invisible">' + pe.dic.get('%calendar-weekDayNames')[day] + ' </span>' + daycount + '<span class="wb-invisible"> ' + pe.dic.get('%calendar-monthNames')[month].toLowerCase() + ' ' + year + ((isCurrentDate) ? pe.dic.get('%calendar-currentDay') : '') + '</span>');
}
element.append(child);
element = $('<li><div><span class="wb-invisible">' + textWeekDayNames[day] + (frenchLang ? (' </span>' + daycount + '<span class="wb-invisible"> ' +textMonthNames[month].toLowerCase() + ' ') : (' ' + textMonthNames[month] + ' </span>' + daycount + '<span class="wb-invisible"> ')) + year + (isCurrentDate ? textCurrentDay : '') + '</span></div></li>');
elementParent = days;
}
element.attr('id', 'cal-' + calendarid + '-w' + week + 'd' + (day + 1)).addClass('cal-w' + week + 'd' + (day + 1) + ' cal-index-' + daycount);
Expand Down Expand Up @@ -404,7 +395,7 @@

link.stop().slideUp(0);
form.stop().slideDown(0).queue(function () {
pe.focus($(this).find(':input:eq(0)'));
_pe.focus($(this).find(':input:eq(0)'));
});

link.children('a').attr('aria-hidden', 'true').attr('aria-expanded', 'true');
Expand Down Expand Up @@ -434,7 +425,7 @@
_pe.fn.calendar.hideGoToForm(calendarid);

//Go to the first day to avoid having to tab opver the navigation again.
pe.focus($('#cal-' + calendarid + '-days').find('a:eq(0)'));
_pe.focus($('#cal-' + calendarid + '-days').find('a:eq(0)'));
}
}
};
Expand Down
22 changes: 12 additions & 10 deletions src/js/sass/includes/_archived.scss
View file
Expand Up @@ -2,15 +2,21 @@
* Web Experience Toolkit (WET) / Boîte à outils de l'expérience Web (BOEW)
* wet-boew.github.com/wet-boew/License-eng.txt / wet-boew.github.com/wet-boew/Licence-fra.txt
*/

@import '../../../grids/sass/includes/mixins';

%archived-color-FFF {
color: #FFF;
}
%archived-background-color-C00 {
background-color: #C00;
}

#archived {
background-color: #FFC;
border: 1px solid #C00;
h2 {
background-color: #C00;
color: #FFF;
@extend %archived-background-color-C00;
@extend %archived-color-FFF;
margin: 0;
padding: 2px 0 2px 10px;
}
Expand All @@ -20,13 +26,9 @@
}
}

%archived-color-FFF {
color: #FFF;
}

.archived {
display: none;
background-color: #C00;
@extend %archived-background-color-C00;
border: 1px solid #000;
border-image: initial;
clear: both;
Expand All @@ -52,10 +54,10 @@
}
.archived-top-page {
background-color: transparent;
color: #FFF;
@extend %archived-color-FFF;
display: block;
font-size: 1.4em;
font-weight: bold;
font-weight: 700;
text-align: center;
}
}
67 changes: 50 additions & 17 deletions src/js/sass/includes/_calendar-theme.scss
View file
Expand Up @@ -2,28 +2,40 @@
* Web Experience Toolkit (WET) / Boîte à outils de l'expérience Web (BOEW)
* wet-boew.github.com/wet-boew/License-eng.txt / wet-boew.github.com/wet-boew/Licence-fra.txt
*/
%cal-color-fff {
color: #FFF;
}
%cal-color-fff-important {
color: #FFF !important;
}
%cal-background-333 {
background: #333;
}
%cal-background-color-333 {
background-color: #333;
}

.cal-cnt {
.cal-header {
background: #333;
color: #FFF;
font-weight: bold;
@extend %cal-background-333;
@extend %cal-color-fff;
font-weight: 700;
}
.cal-nextmonth, .cal-prevmonth {
a {
&:link, &:visited {
border: 1px solid #333;
}
@include pseudo-focus {
color: #FFF;
@extend %cal-color-fff;
border: 1px solid #FFF;
}
}
}
.cal-goto-link {
a {
&:link, &:visited {
color: #FFF !important;
@extend %cal-color-fff-important;
}
@include pseudo-focus {
color: #36C !important;
Expand All @@ -33,7 +45,7 @@
}
.cal-goto {
legend {
color: #FFF;
@extend %cal-color-fff;
}
}
}
Expand All @@ -47,17 +59,22 @@
span.cal-we, ol.cal-day-list li.cal-we {
background: #EEE;
}
.cal-day-list a {
color: #111;
@include pseudo-focus {
/* active is for IE, focus is for Firefox | active est pour IE, focus est pour Firefox */
background: #333;
color: #FFF;
.cal-day-list {
a {
color: #111;
@include pseudo-focus {
/* active is for IE, focus is for Firefox | active est pour IE, focus est pour Firefox */
@extend %cal-background-333;
@extend %cal-color-fff-important;
}
}
}
.cal-currentday {
&, a {
color: #FFF;
@extend %cal-color-fff;
a {
&, &:link {
@extend %cal-color-fff-important;
}
}
}
}
Expand All @@ -83,11 +100,27 @@ ol {
border-color: #333;
font-weight: bolder;
background: #555;
color: #FFF;
@extend %cal-color-fff;
}
}
}

div.cal-days ol.cal-day-list li.cal-currentday, .cal-currentday a {
background-color: #333;
div {
&.cal-days {
ol {
&.cal-day-list {
li {
&.cal-currentday {
@extend %cal-background-color-333;
}
}
}
}
}
}

.cal-currentday {
a {
@extend %cal-background-color-333;
}
}

0 comments on commit 378ebc0

Please sign in to comment.