diff options
Diffstat (limited to 'app/assets')
55 files changed, 2099 insertions, 409 deletions
diff --git a/app/assets/images/search.png b/app/assets/images/search.png Binary files differnew file mode 100644 index 000000000..9e427ba94 --- /dev/null +++ b/app/assets/images/search.png diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index d8aed6346..fd49d3b53 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -1,6 +1,8 @@ // ... //= require jquery +//= require jquery_ujs //= require jquery.ui.datepicker +//= require jquery.ui.position //= require jquery.cookie //= require general //= require ba-throttle-debounce diff --git a/app/assets/javascripts/general.js b/app/assets/javascripts/general.js index 529bbeb04..002eef760 100644 --- a/app/assets/javascripts/general.js +++ b/app/assets/javascripts/general.js @@ -27,8 +27,8 @@ $(document).ready(function() { return false; }); - // "link to this" widget - $('a.link_to_this').click(function() { + // "link to this" widget + $('a.link_to_this').click(function() { var box = $('div#link_box'); var location = window.location.protocol + "//" + window.location.hostname + $(this).attr('href'); box.width(location.length + " em"); @@ -36,12 +36,12 @@ $(document).ready(function() { box.show(); box.find('input').select(); box.position({ - my: "left top", + my: "right center", at: "left bottom", of: this, collision: "fit" }); return false; - }); + }); $('.close-button').click(function() { $(this).parent().hide() }); $('div#variety-filter a').each(function() { diff --git a/app/assets/javascripts/jquery.fancybox-1.3.4.pack.js b/app/assets/javascripts/jquery.fancybox-1.3.4.pack.js deleted file mode 100755 index 1373ed083..000000000 --- a/app/assets/javascripts/jquery.fancybox-1.3.4.pack.js +++ /dev/null @@ -1,46 +0,0 @@ -/* - * FancyBox - jQuery Plugin - * Simple and fancy lightbox alternative - * - * Examples and documentation at: http://fancybox.net - * - * Copyright (c) 2008 - 2010 Janis Skarnelis - * That said, it is hardly a one-person project. Many people have submitted bugs, code, and offered their advice freely. Their support is greatly appreciated. - * - * Version: 1.3.4 (11/11/2010) - * Requires: jQuery v1.3+ - * - * Dual licensed under the MIT and GPL licenses: - * http://www.opensource.org/licenses/mit-license.php - * http://www.gnu.org/licenses/gpl.html - */ - -;(function(b){var m,t,u,f,D,j,E,n,z,A,q=0,e={},o=[],p=0,d={},l=[],G=null,v=new Image,J=/\.(jpg|gif|png|bmp|jpeg)(.*)?$/i,W=/[^\.]\.(swf)\s*$/i,K,L=1,y=0,s="",r,i,h=false,B=b.extend(b("<div/>")[0],{prop:0}),M=b.browser.msie&&b.browser.version<7&&!window.XMLHttpRequest,N=function(){t.hide();v.onerror=v.onload=null;G&&G.abort();m.empty()},O=function(){if(false===e.onError(o,q,e)){t.hide();h=false}else{e.titleShow=false;e.width="auto";e.height="auto";m.html('<p id="fancybox-error">The requested content cannot be loaded.<br />Please try again later.</p>'); -F()}},I=function(){var a=o[q],c,g,k,C,P,w;N();e=b.extend({},b.fn.fancybox.defaults,typeof b(a).data("fancybox")=="undefined"?e:b(a).data("fancybox"));w=e.onStart(o,q,e);if(w===false)h=false;else{if(typeof w=="object")e=b.extend(e,w);k=e.title||(a.nodeName?b(a).attr("title"):a.title)||"";if(a.nodeName&&!e.orig)e.orig=b(a).children("img:first").length?b(a).children("img:first"):b(a);if(k===""&&e.orig&&e.titleFromAlt)k=e.orig.attr("alt");c=e.href||(a.nodeName?b(a).attr("href"):a.href)||null;if(/^(?:javascript)/i.test(c)|| -c=="#")c=null;if(e.type){g=e.type;if(!c)c=e.content}else if(e.content)g="html";else if(c)g=c.match(J)?"image":c.match(W)?"swf":b(a).hasClass("iframe")?"iframe":c.indexOf("#")===0?"inline":"ajax";if(g){if(g=="inline"){a=c.substr(c.indexOf("#"));g=b(a).length>0?"inline":"ajax"}e.type=g;e.href=c;e.title=k;if(e.autoDimensions)if(e.type=="html"||e.type=="inline"||e.type=="ajax"){e.width="auto";e.height="auto"}else e.autoDimensions=false;if(e.modal){e.overlayShow=true;e.hideOnOverlayClick=false;e.hideOnContentClick= -false;e.enableEscapeButton=false;e.showCloseButton=false}e.padding=parseInt(e.padding,10);e.margin=parseInt(e.margin,10);m.css("padding",e.padding+e.margin);b(".fancybox-inline-tmp").unbind("fancybox-cancel").bind("fancybox-change",function(){b(this).replaceWith(j.children())});switch(g){case "html":m.html(e.content);F();break;case "inline":if(b(a).parent().is("#fancybox-content")===true){h=false;break}b('<div class="fancybox-inline-tmp" />').hide().insertBefore(b(a)).bind("fancybox-cleanup",function(){b(this).replaceWith(j.children())}).bind("fancybox-cancel", -function(){b(this).replaceWith(m.children())});b(a).appendTo(m);F();break;case "image":h=false;b.fancybox.showActivity();v=new Image;v.onerror=function(){O()};v.onload=function(){h=true;v.onerror=v.onload=null;e.width=v.width;e.height=v.height;b("<img />").attr({id:"fancybox-img",src:v.src,alt:e.title}).appendTo(m);Q()};v.src=c;break;case "swf":e.scrolling="no";C='<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="'+e.width+'" height="'+e.height+'"><param name="movie" value="'+c+ -'"></param>';P="";b.each(e.swf,function(x,H){C+='<param name="'+x+'" value="'+H+'"></param>';P+=" "+x+'="'+H+'"'});C+='<embed src="'+c+'" type="application/x-shockwave-flash" width="'+e.width+'" height="'+e.height+'"'+P+"></embed></object>";m.html(C);F();break;case "ajax":h=false;b.fancybox.showActivity();e.ajax.win=e.ajax.success;G=b.ajax(b.extend({},e.ajax,{url:c,data:e.ajax.data||{},error:function(x){x.status>0&&O()},success:function(x,H,R){if((typeof R=="object"?R:G).status==200){if(typeof e.ajax.win== -"function"){w=e.ajax.win(c,x,H,R);if(w===false){t.hide();return}else if(typeof w=="string"||typeof w=="object")x=w}m.html(x);F()}}}));break;case "iframe":Q()}}else O()}},F=function(){var a=e.width,c=e.height;a=a.toString().indexOf("%")>-1?parseInt((b(window).width()-e.margin*2)*parseFloat(a)/100,10)+"px":a=="auto"?"auto":a+"px";c=c.toString().indexOf("%")>-1?parseInt((b(window).height()-e.margin*2)*parseFloat(c)/100,10)+"px":c=="auto"?"auto":c+"px";m.wrapInner('<div style="width:'+a+";height:"+c+ -";overflow: "+(e.scrolling=="auto"?"auto":e.scrolling=="yes"?"scroll":"hidden")+';position:relative;"></div>');e.width=m.width();e.height=m.height();Q()},Q=function(){var a,c;t.hide();if(f.is(":visible")&&false===d.onCleanup(l,p,d)){b.event.trigger("fancybox-cancel");h=false}else{h=true;b(j.add(u)).unbind();b(window).unbind("resize.fb scroll.fb");b(document).unbind("keydown.fb");f.is(":visible")&&d.titlePosition!=="outside"&&f.css("height",f.height());l=o;p=q;d=e;if(d.overlayShow){u.css({"background-color":d.overlayColor, -opacity:d.overlayOpacity,cursor:d.hideOnOverlayClick?"pointer":"auto",height:b(document).height()});if(!u.is(":visible")){M&&b("select:not(#fancybox-tmp select)").filter(function(){return this.style.visibility!=="hidden"}).css({visibility:"hidden"}).one("fancybox-cleanup",function(){this.style.visibility="inherit"});u.show()}}else u.hide();i=X();s=d.title||"";y=0;n.empty().removeAttr("style").removeClass();if(d.titleShow!==false){if(b.isFunction(d.titleFormat))a=d.titleFormat(s,l,p,d);else a=s&&s.length? -d.titlePosition=="float"?'<table id="fancybox-title-float-wrap" cellpadding="0" cellspacing="0"><tr><td id="fancybox-title-float-left"></td><td id="fancybox-title-float-main">'+s+'</td><td id="fancybox-title-float-right"></td></tr></table>':'<div id="fancybox-title-'+d.titlePosition+'">'+s+"</div>":false;s=a;if(!(!s||s==="")){n.addClass("fancybox-title-"+d.titlePosition).html(s).appendTo("body").show();switch(d.titlePosition){case "inside":n.css({width:i.width-d.padding*2,marginLeft:d.padding,marginRight:d.padding}); -y=n.outerHeight(true);n.appendTo(D);i.height+=y;break;case "over":n.css({marginLeft:d.padding,width:i.width-d.padding*2,bottom:d.padding}).appendTo(D);break;case "float":n.css("left",parseInt((n.width()-i.width-40)/2,10)*-1).appendTo(f);break;default:n.css({width:i.width-d.padding*2,paddingLeft:d.padding,paddingRight:d.padding}).appendTo(f)}}}n.hide();if(f.is(":visible")){b(E.add(z).add(A)).hide();a=f.position();r={top:a.top,left:a.left,width:f.width(),height:f.height()};c=r.width==i.width&&r.height== -i.height;j.fadeTo(d.changeFade,0.3,function(){var g=function(){j.html(m.contents()).fadeTo(d.changeFade,1,S)};b.event.trigger("fancybox-change");j.empty().removeAttr("filter").css({"border-width":d.padding,width:i.width-d.padding*2,height:e.autoDimensions?"auto":i.height-y-d.padding*2});if(c)g();else{B.prop=0;b(B).animate({prop:1},{duration:d.changeSpeed,easing:d.easingChange,step:T,complete:g})}})}else{f.removeAttr("style");j.css("border-width",d.padding);if(d.transitionIn=="elastic"){r=V();j.html(m.contents()); -f.show();if(d.opacity)i.opacity=0;B.prop=0;b(B).animate({prop:1},{duration:d.speedIn,easing:d.easingIn,step:T,complete:S})}else{d.titlePosition=="inside"&&y>0&&n.show();j.css({width:i.width-d.padding*2,height:e.autoDimensions?"auto":i.height-y-d.padding*2}).html(m.contents());f.css(i).fadeIn(d.transitionIn=="none"?0:d.speedIn,S)}}}},Y=function(){if(d.enableEscapeButton||d.enableKeyboardNav)b(document).bind("keydown.fb",function(a){if(a.keyCode==27&&d.enableEscapeButton){a.preventDefault();b.fancybox.close()}else if((a.keyCode== -37||a.keyCode==39)&&d.enableKeyboardNav&&a.target.tagName!=="INPUT"&&a.target.tagName!=="TEXTAREA"&&a.target.tagName!=="SELECT"){a.preventDefault();b.fancybox[a.keyCode==37?"prev":"next"]()}});if(d.showNavArrows){if(d.cyclic&&l.length>1||p!==0)z.show();if(d.cyclic&&l.length>1||p!=l.length-1)A.show()}else{z.hide();A.hide()}},S=function(){if(!b.support.opacity){j.get(0).style.removeAttribute("filter");f.get(0).style.removeAttribute("filter")}e.autoDimensions&&j.css("height","auto");f.css("height","auto"); -s&&s.length&&n.show();d.showCloseButton&&E.show();Y();d.hideOnContentClick&&j.bind("click",b.fancybox.close);d.hideOnOverlayClick&&u.bind("click",b.fancybox.close);b(window).bind("resize.fb",b.fancybox.resize);d.centerOnScroll&&b(window).bind("scroll.fb",b.fancybox.center);if(d.type=="iframe")b('<iframe id="fancybox-frame" name="fancybox-frame'+(new Date).getTime()+'" frameborder="0" hspace="0" '+(b.browser.msie?'allowtransparency="true""':"")+' scrolling="'+e.scrolling+'" src="'+d.href+'"></iframe>').appendTo(j); -f.show();h=false;b.fancybox.center();d.onComplete(l,p,d);var a,c;if(l.length-1>p){a=l[p+1].href;if(typeof a!=="undefined"&&a.match(J)){c=new Image;c.src=a}}if(p>0){a=l[p-1].href;if(typeof a!=="undefined"&&a.match(J)){c=new Image;c.src=a}}},T=function(a){var c={width:parseInt(r.width+(i.width-r.width)*a,10),height:parseInt(r.height+(i.height-r.height)*a,10),top:parseInt(r.top+(i.top-r.top)*a,10),left:parseInt(r.left+(i.left-r.left)*a,10)};if(typeof i.opacity!=="undefined")c.opacity=a<0.5?0.5:a;f.css(c); -j.css({width:c.width-d.padding*2,height:c.height-y*a-d.padding*2})},U=function(){return[b(window).width()-d.margin*2,b(window).height()-d.margin*2,b(document).scrollLeft()+d.margin,b(document).scrollTop()+d.margin]},X=function(){var a=U(),c={},g=d.autoScale,k=d.padding*2;c.width=d.width.toString().indexOf("%")>-1?parseInt(a[0]*parseFloat(d.width)/100,10):d.width+k;c.height=d.height.toString().indexOf("%")>-1?parseInt(a[1]*parseFloat(d.height)/100,10):d.height+k;if(g&&(c.width>a[0]||c.height>a[1]))if(e.type== -"image"||e.type=="swf"){g=d.width/d.height;if(c.width>a[0]){c.width=a[0];c.height=parseInt((c.width-k)/g+k,10)}if(c.height>a[1]){c.height=a[1];c.width=parseInt((c.height-k)*g+k,10)}}else{c.width=Math.min(c.width,a[0]);c.height=Math.min(c.height,a[1])}c.top=parseInt(Math.max(a[3]-20,a[3]+(a[1]-c.height-40)*0.5),10);c.left=parseInt(Math.max(a[2]-20,a[2]+(a[0]-c.width-40)*0.5),10);return c},V=function(){var a=e.orig?b(e.orig):false,c={};if(a&&a.length){c=a.offset();c.top+=parseInt(a.css("paddingTop"), -10)||0;c.left+=parseInt(a.css("paddingLeft"),10)||0;c.top+=parseInt(a.css("border-top-width"),10)||0;c.left+=parseInt(a.css("border-left-width"),10)||0;c.width=a.width();c.height=a.height();c={width:c.width+d.padding*2,height:c.height+d.padding*2,top:c.top-d.padding-20,left:c.left-d.padding-20}}else{a=U();c={width:d.padding*2,height:d.padding*2,top:parseInt(a[3]+a[1]*0.5,10),left:parseInt(a[2]+a[0]*0.5,10)}}return c},Z=function(){if(t.is(":visible")){b("div",t).css("top",L*-40+"px");L=(L+1)%12}else clearInterval(K)}; -b.fn.fancybox=function(a){if(!b(this).length)return this;b(this).data("fancybox",b.extend({},a,b.metadata?b(this).metadata():{})).unbind("click.fb").bind("click.fb",function(c){c.preventDefault();if(!h){h=true;b(this).blur();o=[];q=0;c=b(this).attr("rel")||"";if(!c||c==""||c==="nofollow")o.push(this);else{o=b("a[rel="+c+"], area[rel="+c+"]");q=o.index(this)}I()}});return this};b.fancybox=function(a,c){var g;if(!h){h=true;g=typeof c!=="undefined"?c:{};o=[];q=parseInt(g.index,10)||0;if(b.isArray(a)){for(var k= -0,C=a.length;k<C;k++)if(typeof a[k]=="object")b(a[k]).data("fancybox",b.extend({},g,a[k]));else a[k]=b({}).data("fancybox",b.extend({content:a[k]},g));o=jQuery.merge(o,a)}else{if(typeof a=="object")b(a).data("fancybox",b.extend({},g,a));else a=b({}).data("fancybox",b.extend({content:a},g));o.push(a)}if(q>o.length||q<0)q=0;I()}};b.fancybox.showActivity=function(){clearInterval(K);t.show();K=setInterval(Z,66)};b.fancybox.hideActivity=function(){t.hide()};b.fancybox.next=function(){return b.fancybox.pos(p+ -1)};b.fancybox.prev=function(){return b.fancybox.pos(p-1)};b.fancybox.pos=function(a){if(!h){a=parseInt(a);o=l;if(a>-1&&a<l.length){q=a;I()}else if(d.cyclic&&l.length>1){q=a>=l.length?0:l.length-1;I()}}};b.fancybox.cancel=function(){if(!h){h=true;b.event.trigger("fancybox-cancel");N();e.onCancel(o,q,e);h=false}};b.fancybox.close=function(){function a(){u.fadeOut("fast");n.empty().hide();f.hide();b.event.trigger("fancybox-cleanup");j.empty();d.onClosed(l,p,d);l=e=[];p=q=0;d=e={};h=false}if(!(h||f.is(":hidden"))){h= -true;if(d&&false===d.onCleanup(l,p,d))h=false;else{N();b(E.add(z).add(A)).hide();b(j.add(u)).unbind();b(window).unbind("resize.fb scroll.fb");b(document).unbind("keydown.fb");j.find("iframe").attr("src",M&&/^https/i.test(window.location.href||"")?"javascript:void(false)":"about:blank");d.titlePosition!=="inside"&&n.empty();f.stop();if(d.transitionOut=="elastic"){r=V();var c=f.position();i={top:c.top,left:c.left,width:f.width(),height:f.height()};if(d.opacity)i.opacity=1;n.empty().hide();B.prop=1; -b(B).animate({prop:0},{duration:d.speedOut,easing:d.easingOut,step:T,complete:a})}else f.fadeOut(d.transitionOut=="none"?0:d.speedOut,a)}}};b.fancybox.resize=function(){u.is(":visible")&&u.css("height",b(document).height());b.fancybox.center(true)};b.fancybox.center=function(a){var c,g;if(!h){g=a===true?1:0;c=U();!g&&(f.width()>c[0]||f.height()>c[1])||f.stop().animate({top:parseInt(Math.max(c[3]-20,c[3]+(c[1]-j.height()-40)*0.5-d.padding)),left:parseInt(Math.max(c[2]-20,c[2]+(c[0]-j.width()-40)*0.5- -d.padding))},typeof a=="number"?a:200)}};b.fancybox.init=function(){if(!b("#fancybox-wrap").length){b("body").append(m=b('<div id="fancybox-tmp"></div>'),t=b('<div id="fancybox-loading"><div></div></div>'),u=b('<div id="fancybox-overlay"></div>'),f=b('<div id="fancybox-wrap"></div>'));D=b('<div id="fancybox-outer"></div>').append('<div class="fancybox-bg" id="fancybox-bg-n"></div><div class="fancybox-bg" id="fancybox-bg-ne"></div><div class="fancybox-bg" id="fancybox-bg-e"></div><div class="fancybox-bg" id="fancybox-bg-se"></div><div class="fancybox-bg" id="fancybox-bg-s"></div><div class="fancybox-bg" id="fancybox-bg-sw"></div><div class="fancybox-bg" id="fancybox-bg-w"></div><div class="fancybox-bg" id="fancybox-bg-nw"></div>').appendTo(f); -D.append(j=b('<div id="fancybox-content"></div>'),E=b('<a id="fancybox-close"></a>'),n=b('<div id="fancybox-title"></div>'),z=b('<a href="javascript:;" id="fancybox-left"><span class="fancy-ico" id="fancybox-left-ico"></span></a>'),A=b('<a href="javascript:;" id="fancybox-right"><span class="fancy-ico" id="fancybox-right-ico"></span></a>'));E.click(b.fancybox.close);t.click(b.fancybox.cancel);z.click(function(a){a.preventDefault();b.fancybox.prev()});A.click(function(a){a.preventDefault();b.fancybox.next()}); -b.fn.mousewheel&&f.bind("mousewheel.fb",function(a,c){if(h)a.preventDefault();else if(b(a.target).get(0).clientHeight==0||b(a.target).get(0).scrollHeight===b(a.target).get(0).clientHeight){a.preventDefault();b.fancybox[c>0?"prev":"next"]()}});b.support.opacity||f.addClass("fancybox-ie");if(M){t.addClass("fancybox-ie6");f.addClass("fancybox-ie6");b('<iframe id="fancybox-hide-sel-frame" src="'+(/^https/i.test(window.location.href||"")?"javascript:void(false)":"about:blank")+'" scrolling="no" border="0" frameborder="0" tabindex="-1"></iframe>').prependTo(D)}}}; -b.fn.fancybox.defaults={padding:10,margin:40,opacity:false,modal:false,cyclic:false,scrolling:"auto",width:560,height:340,autoScale:true,autoDimensions:true,centerOnScroll:false,ajax:{},swf:{wmode:"transparent"},hideOnOverlayClick:true,hideOnContentClick:false,overlayShow:true,overlayOpacity:0.7,overlayColor:"#777",titleShow:true,titlePosition:"float",titleFormat:null,titleFromAlt:false,transitionIn:"fade",transitionOut:"fade",speedIn:300,speedOut:300,changeSpeed:300,changeFade:"fast",easingIn:"swing", -easingOut:"swing",showCloseButton:true,showNavArrows:true,enableEscapeButton:true,enableKeyboardNav:true,onStart:function(){},onCancel:function(){},onComplete:function(){},onCleanup:function(){},onClosed:function(){},onError:function(){}};b(document).ready(function(){b.fancybox.init()})})(jQuery);
\ No newline at end of file diff --git a/app/assets/stylesheets/jquery.fancybox-1.3.4.css b/app/assets/stylesheets/jquery.fancybox-1.3.4.css deleted file mode 100755 index 6f53d8f4a..000000000 --- a/app/assets/stylesheets/jquery.fancybox-1.3.4.css +++ /dev/null @@ -1,359 +0,0 @@ -/*
- * FancyBox - jQuery Plugin
- * Simple and fancy lightbox alternative
- *
- * Examples and documentation at: http://fancybox.net
- *
- * Copyright (c) 2008 - 2010 Janis Skarnelis
- * That said, it is hardly a one-person project. Many people have submitted bugs, code, and offered their advice freely. Their support is greatly appreciated.
- *
- * Version: 1.3.4 (11/11/2010)
- * Requires: jQuery v1.3+
- *
- * Dual licensed under the MIT and GPL licenses:
- * http://www.opensource.org/licenses/mit-license.php
- * http://www.gnu.org/licenses/gpl.html
- */
-
-#fancybox-loading {
- position: fixed;
- top: 50%;
- left: 50%;
- width: 40px;
- height: 40px;
- margin-top: -20px;
- margin-left: -20px;
- cursor: pointer;
- overflow: hidden;
- z-index: 1104;
- display: none;
-}
-
-#fancybox-loading div {
- position: absolute;
- top: 0;
- left: 0;
- width: 40px;
- height: 480px;
- background-image: url('fancybox.png');
-}
-
-#fancybox-overlay {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- z-index: 1100;
- display: none;
-}
-
-#fancybox-tmp {
- padding: 0;
- margin: 0;
- border: 0;
- overflow: auto;
- display: none;
-}
-
-#fancybox-wrap {
- position: absolute;
- top: 0;
- left: 0;
- padding: 20px;
- z-index: 1101;
- outline: none;
- display: none;
-}
-
-#fancybox-outer {
- position: relative;
- width: 100%;
- height: 100%;
- background: #fff;
-}
-
-#fancybox-content {
- width: 0;
- height: 0;
- padding: 0;
- outline: none;
- position: relative;
- overflow: hidden;
- z-index: 1102;
- border: 0px solid #fff;
-}
-
-#fancybox-hide-sel-frame {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- background: transparent;
- z-index: 1101;
-}
-
-#fancybox-close {
- position: absolute;
- top: -15px;
- right: -15px;
- width: 30px;
- height: 30px;
- background: transparent url('fancybox.png') -40px 0px;
- cursor: pointer;
- z-index: 1103;
- display: none;
-}
-
-#fancybox-error {
- color: #444;
- font: normal 12px/20px Arial;
- padding: 14px;
- margin: 0;
-}
-
-#fancybox-img {
- width: 100%;
- height: 100%;
- padding: 0;
- margin: 0;
- border: none;
- outline: none;
- line-height: 0;
- vertical-align: top;
-}
-
-#fancybox-frame {
- width: 100%;
- height: 100%;
- border: none;
- display: block;
-}
-
-#fancybox-left, #fancybox-right {
- position: absolute;
- bottom: 0px;
- height: 100%;
- width: 35%;
- cursor: pointer;
- outline: none;
- background: transparent url('blank.gif');
- z-index: 1102;
- display: none;
-}
-
-#fancybox-left {
- left: 0px;
-}
-
-#fancybox-right {
- right: 0px;
-}
-
-#fancybox-left-ico, #fancybox-right-ico {
- position: absolute;
- top: 50%;
- left: -9999px;
- width: 30px;
- height: 30px;
- margin-top: -15px;
- cursor: pointer;
- z-index: 1102;
- display: block;
-}
-
-#fancybox-left-ico {
- background-image: url('fancybox.png');
- background-position: -40px -30px;
-}
-
-#fancybox-right-ico {
- background-image: url('fancybox.png');
- background-position: -40px -60px;
-}
-
-#fancybox-left:hover, #fancybox-right:hover {
- visibility: visible; /* IE6 */
-}
-
-#fancybox-left:hover span {
- left: 20px;
-}
-
-#fancybox-right:hover span {
- left: auto;
- right: 20px;
-}
-
-.fancybox-bg {
- position: absolute;
- padding: 0;
- margin: 0;
- border: 0;
- width: 20px;
- height: 20px;
- z-index: 1001;
-}
-
-#fancybox-bg-n {
- top: -20px;
- left: 0;
- width: 100%;
- background-image: url('fancybox-x.png');
-}
-
-#fancybox-bg-ne {
- top: -20px;
- right: -20px;
- background-image: url('fancybox.png');
- background-position: -40px -162px;
-}
-
-#fancybox-bg-e {
- top: 0;
- right: -20px;
- height: 100%;
- background-image: url('fancybox-y.png');
- background-position: -20px 0px;
-}
-
-#fancybox-bg-se {
- bottom: -20px;
- right: -20px;
- background-image: url('fancybox.png');
- background-position: -40px -182px;
-}
-
-#fancybox-bg-s {
- bottom: -20px;
- left: 0;
- width: 100%;
- background-image: url('fancybox-x.png');
- background-position: 0px -20px;
-}
-
-#fancybox-bg-sw {
- bottom: -20px;
- left: -20px;
- background-image: url('fancybox.png');
- background-position: -40px -142px;
-}
-
-#fancybox-bg-w {
- top: 0;
- left: -20px;
- height: 100%;
- background-image: url('fancybox-y.png');
-}
-
-#fancybox-bg-nw {
- top: -20px;
- left: -20px;
- background-image: url('fancybox.png');
- background-position: -40px -122px;
-}
-
-#fancybox-title {
- font-family: Helvetica;
- font-size: 12px;
- z-index: 1102;
-}
-
-.fancybox-title-inside {
- padding-bottom: 10px;
- text-align: center;
- color: #333;
- background: #fff;
- position: relative;
-}
-
-.fancybox-title-outside {
- padding-top: 10px;
- color: #fff;
-}
-
-.fancybox-title-over {
- position: absolute;
- bottom: 0;
- left: 0;
- color: #FFF;
- text-align: left;
-}
-
-#fancybox-title-over {
- padding: 10px;
- background-image: url('fancy_title_over.png');
- display: block;
-}
-
-.fancybox-title-float {
- position: absolute;
- left: 0;
- bottom: -20px;
- height: 32px;
-}
-
-#fancybox-title-float-wrap {
- border: none;
- border-collapse: collapse;
- width: auto;
-}
-
-#fancybox-title-float-wrap td {
- border: none;
- white-space: nowrap;
-}
-
-#fancybox-title-float-left {
- padding: 0 0 0 15px;
- background: url('fancybox.png') -40px -90px no-repeat;
-}
-
-#fancybox-title-float-main {
- color: #FFF;
- line-height: 29px;
- font-weight: bold;
- padding: 0 0 3px 0;
- background: url('fancybox-x.png') 0px -40px;
-}
-
-#fancybox-title-float-right {
- padding: 0 0 0 15px;
- background: url('fancybox.png') -55px -90px no-repeat;
-}
-
-/* IE6 */
-
-.fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_close.png', sizingMethod='scale'); }
-
-.fancybox-ie6 #fancybox-left-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_left.png', sizingMethod='scale'); }
-.fancybox-ie6 #fancybox-right-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_right.png', sizingMethod='scale'); }
-
-.fancybox-ie6 #fancybox-title-over { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_over.png', sizingMethod='scale'); zoom: 1; }
-.fancybox-ie6 #fancybox-title-float-left { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_left.png', sizingMethod='scale'); }
-.fancybox-ie6 #fancybox-title-float-main { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_main.png', sizingMethod='scale'); }
-.fancybox-ie6 #fancybox-title-float-right { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_right.png', sizingMethod='scale'); }
-
-.fancybox-ie6 #fancybox-bg-w, .fancybox-ie6 #fancybox-bg-e, .fancybox-ie6 #fancybox-left, .fancybox-ie6 #fancybox-right, #fancybox-hide-sel-frame {
- height: expression(this.parentNode.clientHeight + "px");
-}
-
-#fancybox-loading.fancybox-ie6 {
- position: absolute; margin-top: 0;
- top: expression( (-20 + (document.documentElement.clientHeight ? document.documentElement.clientHeight/2 : document.body.clientHeight/2 ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop )) + 'px');
-}
-
-#fancybox-loading.fancybox-ie6 div { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_loading.png', sizingMethod='scale'); }
-
-/* IE6, IE7, IE8 */
-
-.fancybox-ie .fancybox-bg { background: transparent !important; }
-
-.fancybox-ie #fancybox-bg-n { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_n.png', sizingMethod='scale'); }
-.fancybox-ie #fancybox-bg-ne { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_ne.png', sizingMethod='scale'); }
-.fancybox-ie #fancybox-bg-e { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_e.png', sizingMethod='scale'); }
-.fancybox-ie #fancybox-bg-se { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_se.png', sizingMethod='scale'); }
-.fancybox-ie #fancybox-bg-s { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_s.png', sizingMethod='scale'); }
-.fancybox-ie #fancybox-bg-sw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_sw.png', sizingMethod='scale'); }
-.fancybox-ie #fancybox-bg-w { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_w.png', sizingMethod='scale'); }
-.fancybox-ie #fancybox-bg-nw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_nw.png', sizingMethod='scale'); }
\ No newline at end of file diff --git a/app/assets/stylesheets/main.scss b/app/assets/stylesheets/main.scss index 3118eab3d..8aa8010ae 100644 --- a/app/assets/stylesheets/main.scss +++ b/app/assets/stylesheets/main.scss @@ -134,6 +134,10 @@ overflow:visible; margin:0; } +#wrapper_google_embed iframe { +min-height: 800px; +} + #content { position:relative; width:875px; diff --git a/app/assets/stylesheets/responsive/_attachments_layout.scss b/app/assets/stylesheets/responsive/_attachments_layout.scss new file mode 100644 index 000000000..1eedc601b --- /dev/null +++ b/app/assets/stylesheets/responsive/_attachments_layout.scss @@ -0,0 +1,66 @@ +/* Layout for the HTML view of attachments */ + +/* Generated HTML should be full row width */ +#view-html-content { + @include grid-column(12); + @include ie8{ + padding-left: 0.9375em; + padding-right: 0.9375em; + } + table { + border-collapse:collapse; + margin-bottom:1em; + } + + td { + vertical-align:top; + max-width:30em; + overflow:auto; + } + +} + +.view_html_prefix { + + @include grid-column(12); + @include ie8{ + padding-left: 0.9375em; + padding-right: 0.9375em; + width: $main_menu-mobile_menu_cutoff; + } + + .view_html_logo { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:3); + @include ie8{ + padding-right: 0.9375em; + } + } + } + + .view_html_description { + @include grid-column(12); + @include respond-min($main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:7, $pull: 2); + @include ie8{ + padding-left: 0.9375em; + padding-right: 0.9375em; + } + } + } + + .view_html_download_link { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:2, $push: 7); + @include ie8{ + padding-left: 0.9375em; + } + } + } +} + + + + diff --git a/app/assets/stylesheets/responsive/_attachments_style.scss b/app/assets/stylesheets/responsive/_attachments_style.scss new file mode 100644 index 000000000..79d52b7f6 --- /dev/null +++ b/app/assets/stylesheets/responsive/_attachments_style.scss @@ -0,0 +1,26 @@ +/* Styling for the HTML view of attachments */ + +#view-html-content { + + td,th { + border:solid 1px #000; + } + + tr:nth-child(odd) { + background-color:#bbb; + } + + tr:nth-child(even) { + background-color:#ddd; + } +} + +.view_html_prefix { + text-align:center; + @include respond-min( $main_menu-mobile_menu_cutoff ){ + text-align:left; + min-height:3em; + padding:0.5em 1em; + } + border-bottom: 1px solid #5F5F5F; +} diff --git a/app/assets/stylesheets/responsive/_blog_layout.scss b/app/assets/stylesheets/responsive/_blog_layout.scss new file mode 100644 index 000000000..d15f46c76 --- /dev/null +++ b/app/assets/stylesheets/responsive/_blog_layout.scss @@ -0,0 +1,4 @@ +/* Layout for blog */ +.blog_post { + margin-bottom:2em; +} diff --git a/app/assets/stylesheets/responsive/_blog_style.scss b/app/assets/stylesheets/responsive/_blog_style.scss new file mode 100644 index 000000000..1d27289fc --- /dev/null +++ b/app/assets/stylesheets/responsive/_blog_style.scss @@ -0,0 +1,10 @@ +.blog_post { + h2 a { + text-decoration: none; + &:hover, + &:active, + &:focus { + text-decoration: underline; + } + } +} diff --git a/app/assets/stylesheets/responsive/_categorization_game_layout.scss b/app/assets/stylesheets/responsive/_categorization_game_layout.scss new file mode 100644 index 000000000..138dfe005 --- /dev/null +++ b/app/assets/stylesheets/responsive/_categorization_game_layout.scss @@ -0,0 +1,41 @@ +/* Layout for categorisation game */ + +#request_game_play { + @include grid-row($behavior: nest); +} + +#game_sidebar { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:4, $float:right); + @include ie8{ + padding-left: 0.9375em; + } + @include lte-ie7 { + width: 17.438em; + } + } +} + +#game { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:8); + @include ie8{ + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 36.813em; + } + } +} + +/* Don't display request extracts floated right as there is constrained space */ +#request_game_play{ + span.desc { + float: none; + padding: 0; + background: none; + min-height: inherit; + } +} diff --git a/app/assets/stylesheets/responsive/_categorization_game_style.scss b/app/assets/stylesheets/responsive/_categorization_game_style.scss new file mode 100644 index 000000000..59c971a89 --- /dev/null +++ b/app/assets/stylesheets/responsive/_categorization_game_style.scss @@ -0,0 +1,8 @@ +/* Styling for categorisation game */ +#game_sidebar { + font-size:0.9em; + @include respond-min( $main_menu-mobile_menu_cutoff ){ + text-align: center; + } + +} diff --git a/app/assets/stylesheets/responsive/_contact_layout.scss b/app/assets/stylesheets/responsive/_contact_layout.scss new file mode 100644 index 000000000..9fb7bd2f1 --- /dev/null +++ b/app/assets/stylesheets/responsive/_contact_layout.scss @@ -0,0 +1,4 @@ +/* Layout for contact form page */ +#contact_preamble { + margin-bottom: 30px; +} diff --git a/app/assets/stylesheets/responsive/_contact_style.scss b/app/assets/stylesheets/responsive/_contact_style.scss new file mode 100644 index 000000000..6a4abfcac --- /dev/null +++ b/app/assets/stylesheets/responsive/_contact_style.scss @@ -0,0 +1 @@ +/* Styles for contact form page */ diff --git a/app/assets/stylesheets/responsive/_footer_layout.scss b/app/assets/stylesheets/responsive/_footer_layout.scss new file mode 100644 index 000000000..2b0c956fa --- /dev/null +++ b/app/assets/stylesheets/responsive/_footer_layout.scss @@ -0,0 +1,50 @@ +/* Footer layout */ +#footer { + width:100%; + margin:5em 0 0; + padding:0.5em 0; +} + +#footer-nav{ + + @include grid-row(); + @include ie8{ + width: $main_menu-mobile_menu_cutoff; + } + img { + display: none; + } + + ul{ + padding: 0; + list-style: none outside none; + } + + @include respond-min( $main_menu-mobile_menu_cutoff ){ + ul { + @include block-grid(4); + } + @include ie8{ + #footer-nav ul > li:nth-child(4n+1) { + padding-left: 0em; + padding-right: 1.40625em; + } + #footer-nav ul > li:nth-child(4n+2) { + padding-left: 0.46875rem; + padding-right: 0.9375rem; + } + #footer-nav ul > li:nth-child(4n+3) { + padding-left: 0.9375em; + padding-right: 0.46875em; + } + #footer-nav ul > li:nth-child(4n) { + padding-left: 1.40625em; + padding-right: 0em; + } + } + + img { + display: inherit; + } + } +} diff --git a/app/assets/stylesheets/responsive/_footer_style.scss b/app/assets/stylesheets/responsive/_footer_style.scss new file mode 100644 index 000000000..81d29b7e1 --- /dev/null +++ b/app/assets/stylesheets/responsive/_footer_style.scss @@ -0,0 +1,5 @@ +/* Footer styles */ +#footer { + text-align: center; + font-size:0.85em; +} diff --git a/app/assets/stylesheets/responsive/_frontpage_layout.scss b/app/assets/stylesheets/responsive/_frontpage_layout.scss new file mode 100644 index 000000000..4559c0f6d --- /dev/null +++ b/app/assets/stylesheets/responsive/_frontpage_layout.scss @@ -0,0 +1,86 @@ +/* Frontpage layout */ + +#frontpage_splash { + @include grid-row($behavior: nest); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + min-height: 375px; + } + + #left_column { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column(8); + margin-top:66px; + @include ie8{ + padding-right: 0.9375em; + } + @include lte-ie7{ + width: 36.813em; + } + } + } + + #right_column { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column(4); + margin-top: 30px; + @include ie8{ + padding-left: 0.9375em; + } + @include lte-ie7{ + width: 17.438em; + } + } + + input[type=text] { + width:180px; + } + } + + #frontpage_splash #frontpage_search_box { + margin-bottom:30px; + margin-top:-10px; + } + + #frontpage_right_to_know { + line-height:20px; + } +} + +/* Two even columns */ +#frontpage_examples { + @include grid-row($behavior: nest); + margin-top: 2em; + @include respond-min( $main_menu-mobile_menu_cutoff ){ + margin-top: 0; + } + + #examples_0 { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:6); + @include ie8{ + padding-right: 0.9375em; + } + @include lte-ie7{ + width: 27.125em; + } + } + } + + #examples_1 { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:6); + @include ie8{ + padding-left: 0.9375em; + } + @include lte-ie7{ + width: 27.125em; + } + } + } + + +} diff --git a/app/assets/stylesheets/responsive/_frontpage_style.scss b/app/assets/stylesheets/responsive/_frontpage_style.scss new file mode 100644 index 000000000..99270231f --- /dev/null +++ b/app/assets/stylesheets/responsive/_frontpage_style.scss @@ -0,0 +1,28 @@ +/* Frontpage styles */ +#frontpage_splash { + h1, h2 { + font-weight: normal; + } + strong { + font-weight: bold; + } +} + +#frontpage_examples { + ul { + list-style:none outside none; + padding: 0; + } + .excerpt { + cursor:pointer; + font-style:italic; + padding:0 0 0 2em; + } + + #examples_1 { + li { + border-bottom:1px solid #ddd; + padding-top: 1em; + } + } +} diff --git a/app/assets/stylesheets/responsive/_global_layout.scss b/app/assets/stylesheets/responsive/_global_layout.scss new file mode 100644 index 000000000..d7b24df41 --- /dev/null +++ b/app/assets/stylesheets/responsive/_global_layout.scss @@ -0,0 +1,100 @@ +/* Layout across the site */ +#wrapper{ + @include grid-row(); + @include ie8{ + width: $main_menu-mobile_menu_cutoff; + } +} + +/* A global 12 column element provides padding for all pages */ +#content{ + @include grid-column(12); + @include ie8{ + padding-left: 0.9375em; + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 56.125em; + } +} + + +textarea{ + @include respond-min( $main_menu-mobile_menu_cutoff ){ + width: inherit; + } +} + + +/* Container grid-rows for pages that use these generic headers and columns */ +#public_body_list, +#user_profile_header, +#general_blog, +#request_show, +#info_request_batch_show { + @include grid-row($behavior: nest); +} + +/* Column headers */ +#header_right { + @include grid-column(12); + + + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:4, $float:right); + padding-top:27px; + @include ie8{ + padding-left: 0.9375em; + } + @include lte-ie7 { + width: 17.438em; + } + } +} + +#header_left { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column(8); + @include ie8{ + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 36.813em; + } + } +} + +/* Columns */ +#left_column_flip, #left_column{ + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column(9); + @include lte-ie7 { + width: 41.625em; + } + } +} + +#right_column_flip, #right_column { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:3); + margin-top:20px; + @include lte-ie7 { + width: 12.625em; + } + } +} + +#left_column_flip, #right_column { + @include ie8{ + padding-left: 0.9375em; + } +} + +#right_column_flip, #left_column { + @include ie8{ + padding-right: 0.9375em; + } +} diff --git a/app/assets/stylesheets/responsive/_global_style.scss b/app/assets/stylesheets/responsive/_global_style.scss new file mode 100644 index 000000000..5b268f3a6 --- /dev/null +++ b/app/assets/stylesheets/responsive/_global_style.scss @@ -0,0 +1,225 @@ +html { + height: 100%; + font-size: 1em; +} + +body { + color: #333; + line-height: 1.5em; + height: 100%; + min-height: 100%; +} + +a { + color: #2688dc; + &:hover, + &:active, + &:focus { + color: #333333; + } +} + +h1, h2, h3, h4, h5, h6 { + margin-bottom: 18px; + margin-bottom: 1rem; + line-height: 1.1em; + text-rendering: optimizeLegibility; +} + +h1 { + font-size: 2.5em; +} + + +h2 { + font-size: 2em; +} + +h3 { + font-size: 1.6em +} + +h4 { + font-size: 1.3em; +} + +h5 { + font-size: 1em; +} + +p { + margin-top: 0; + margin-bottom: 1em; +} + +p.subtitle { + margin-top:0.5em; + margin-bottom:1.5em; + font-size:1.2em; + font-style:normal; + color:#222; +} + +hr { + border: none; + border-top: 1px solid #e9e9e9; + margin: 0; +} + +img { + max-width: 100%; + height: auto; +} + +dt { + margin-top: 1em; +} + +dd { + margin-left: 2em; +} + +dt + dd { + margin-top: 0.5em; + > p { + margin-top: 0; + } +} + + +/* Links in sidebars usually only underlined on hover */ +.feed_link,.act_link { + margin-bottom:10px; + a{ + text-decoration:none; + } + a:hover{ + text-decoration:underline; + } +} + +#header_right { + > a { + text-decoration:none; + } + > a:hover{ + text-decoration:underline; + } + + br{ + line-height:200%; + } + +} + +/* Notices to the user (usually on action completion) */ +#notice, #error { + font-size:1em; + border-radius:3px; + margin:1em 0; + padding:1.5em; + + p:first-child { + margin-top:0; + } + + p:last-child { + margin-bottom:0; + } + +} + +#notice { + background-color: lighten(#62b356, 23%); +} + +#error { + background-color: lighten(#b05460, 23%); +} + +.big { + font-size: 1.2em; +} + +/* Form styling */ + +label.form_label { + font-size: 1.1em; +} + +.form_item_note,.form_note { + font-size:0.875em; +} + +p + .form_item_note { + position: relative; + top: -1.25em; +} + +form input[type=text],form input[type=password] { + font-size:1.1em; + width:200px; + border-radius:3px; + -moz-border-radius:3px; + border-color:#BBB; + border-style:solid; + border-width:1px; + padding:5px; + display: inline-block; +} + +.fieldWithErrors { + display:block; + padding:0.2em; + textarea, input { + border:solid 1px Red !important; + } +} + +.errorExplanation { + border-radius:6px; + -moz-border-radius:6px; + font-weight: normal; + margin:20px 0 30px; +} + +#error,#hidden_request { + font-weight: bold; + padding:0.5em; +} + +#preview_form ul { + margin:0; + padding:1px 32px 10px; +} + +#preview_form ul li { + margin:10px 0; +} + +label small{ + text-transform: none; +} + +/* Pagination */ + +div.pagination { + text-align:center; + padding-top:0.3em; + + span.current { + padding:0 0.6em 0.1em; + } + + span.disabled { + padding:0 0.6em 0.1em; + } + + a, a:visited { + text-decoration:none; + padding:0 0.6em 0.1em; + } + +} + + diff --git a/app/assets/stylesheets/responsive/_header_layout.scss b/app/assets/stylesheets/responsive/_header_layout.scss new file mode 100644 index 000000000..b3103e3a9 --- /dev/null +++ b/app/assets/stylesheets/responsive/_header_layout.scss @@ -0,0 +1,205 @@ +/* Header layout */ + +#banner_content{ + @include grid-row; + position: relative; + @include ie8{ + width: $main_menu-mobile_menu_cutoff; + } +} + +#banner{ + // Hide menu items by default on mobile + #logged_in_bar, + #topnav, + #user_locale_switcher{ + display:none; + } + + // …and show a button to reveal them + .rsp_menu_button{ + @include grid-column(4); + padding: 1em 1em 0 1em; + float: right; + a { + text-align: right; + &.open{ + display: block; + } + &.close{ + display: none; + } + } + } + + // Squeeze the logo up on small screens to make room for the button + #logo_wrapper{ + @include grid-column(8); + padding: 1em 1em 0 1em; + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column(4); + padding: 1em; + margin-bottom: 1em; + @include lte-ie7 { + width: 17.313em; + } + } + } + + &:target{ + // Hide menu button when menu is open + .rsp_menu_button{ + .open{ + display:none; + } + .close{ + display:block; + } + } + @media( max-width: $main_menu-mobile_menu_cutoff ){ + // Show menu items when menu is targeted + #logged_in_bar, + #topnav, + #user_locale_switcher{ + display:block; + clear:both; + } + } + + + } + + @include respond-min( $main_menu-mobile_menu_cutoff ){ + // On larger screens show the menu + #banner_nav, + #logged_in_bar, + #topnav, + #user_locale_switcher{ + display:block; + } + + // …and hide the menu button + .rsp_menu_button{ + display:none; + } + } + +} + + +#topnav{ + padding: 0 0 1em 0; + @include respond-min( $main_menu-mobile_menu_cutoff ){ + padding: 0; + } +} + +#navigation { + list-style: none outside none; + @include grid-row; + padding: 0; + position: relative; + @include ie8{ + width: $main_menu-mobile_menu_cutoff; + } + /* Spread the nav elements horizontally on larger screens */ + li{ + display: block; + + @include respond-min( $main_menu-mobile_menu_cutoff ){ + display: inline-block; + float: left; + } + @include lte-ie7 { + display: inline; + } + } + a{ + padding: 0.5em 1em; + display: block; + @include respond-min( $main_menu-mobile_menu_cutoff ){ + display: inline-block; + } + } +} + +#navigation_search { + @include respond-min( $main_menu-mobile_menu_cutoff ){ + position: absolute; + top: 0; + right: 0; + } + form{ + @include grid-row; + padding-right: 1em; + @include lte-ie7 { + display: inline; + } + } + input{ + @include grid-column($columns:9); + margin:0; + @include lte-ie7 { + width: 10.063em; + } + } + label{ + @include prefix-postfix-base; + @include grid-column($columns:3,$float:left); + border:none; + img{ + max-width: 100%; + } + @include lte-ie7 { + width: 2.125em; + } + } +} + +#logged_in_bar{ + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column(8); + @include ie8{ + padding-left: 0.9375em; + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 36.813em; + } + } + + a, .greeting { + display:block; + padding: 0.5em 1em; + } + + @include respond-min( $main_menu-mobile_menu_cutoff ){ + #logged_in_links { + top: 3em; + position: absolute; + right: 0.9375em; + a, .greeting{ + display:inline; + font-weight: bold; + padding:0 0 0 1em; + } + + } + } +} + +#user_locale_switcher { + @include respond-min( $main_menu-mobile_menu_cutoff ){ + position: absolute; + right: 0; + top: 0; + } + a{ + display: block; + padding: 0.5em 1em; + @include respond-min( $main_menu-mobile_menu_cutoff ){ + display: inline-block; + } + } + +} diff --git a/app/assets/stylesheets/responsive/_header_style.scss b/app/assets/stylesheets/responsive/_header_style.scss new file mode 100644 index 000000000..9008a73a7 --- /dev/null +++ b/app/assets/stylesheets/responsive/_header_style.scss @@ -0,0 +1,4 @@ +/* Header style */ +#navigation { + border-bottom: 1px solid #e9e9e9; +} diff --git a/app/assets/stylesheets/responsive/_help_layout.scss b/app/assets/stylesheets/responsive/_help_layout.scss new file mode 100644 index 000000000..60e557660 --- /dev/null +++ b/app/assets/stylesheets/responsive/_help_layout.scss @@ -0,0 +1,17 @@ +/* Help layout */ + +/* These help pages use grid-column elements, so need grid-row mixed in */ +#help_about, +#help_alaveteli, +#help_api, +#help_credits, +#help_officers, +#help_privacy, +#help_requesting, +#help_unhappy { + @include grid-row($behavior: nest); +} + +#hash_link_padding { + margin-bottom:10em; +} diff --git a/app/assets/stylesheets/responsive/_help_style.scss b/app/assets/stylesheets/responsive/_help_style.scss new file mode 100644 index 000000000..f339bec8c --- /dev/null +++ b/app/assets/stylesheets/responsive/_help_style.scss @@ -0,0 +1,29 @@ +/* Help style */ + +div.controller_help { + /* Underline links on hover */ + dt a, h1 a { + text-decoration:none; + font-size:0.9em; + } + dt:hover, h1:hover { + > a { + color:#777; + } + > a:hover{ + text-decoration: underline; + } + } +} + + + +ul.no_bullets { + list-style-type:none; + margin:0 0 30px; + padding:0; + + li { + margin-bottom:6px; + } +} diff --git a/app/assets/stylesheets/responsive/_lists_layout.scss b/app/assets/stylesheets/responsive/_lists_layout.scss new file mode 100644 index 000000000..69237ae91 --- /dev/null +++ b/app/assets/stylesheets/responsive/_lists_layout.scss @@ -0,0 +1,84 @@ +/* Layout for lists of requests, authorities, users */ +.request_listing,.body_listing,.user_listing { + overflow:hidden; + margin-top: 1.5em; + .head { + display:block; + margin-bottom: 0.33em; + } + .requester { + margin-bottom: 0.5em; + } + .bottomline { + display:block; + margin-bottom: 0.5em; + @include respond-min( $main_menu-mobile_menu_cutoff ){ + margin-bottom: 1.5em; + } + } +} + +.desc { + display:block; + float:right; + clear:none; + overflow:hidden; + margin-bottom: 1.5em; +} + +.body_listing, .user_listing { + .desc, .bottomline { + clear: both; + float: none; + margin-bottom: 0; + } + .bottomline { + margin-bottom: 1.5em + } +} + +.info_request_batch_intro{ + @include grid-column(12); +} + +.request_listing{ + @include grid-row($behavior:nest); + margin-top: 1.5em; + .request_right { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:4, $float:right); + @include ie8{ + padding-left: 0.9375em; + } + @include lte-ie7 { + width: 17.438em; + } + } + } + + .request_left { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:8); + @include ie8{ + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 36.813em; + } + } + } + + .desc { + width:100%; + @include respond-min( $main_menu-mobile_menu_cutoff ){ + padding:0 0 0 2em; + @include lte-ie7 { + padding: 0; + } + } + } +} + + diff --git a/app/assets/stylesheets/responsive/_lists_style.scss b/app/assets/stylesheets/responsive/_lists_style.scss new file mode 100644 index 000000000..762901a5f --- /dev/null +++ b/app/assets/stylesheets/responsive/_lists_style.scss @@ -0,0 +1,107 @@ +/* Styles for lists of requests, authorities, users */ +.request_listing,.body_listing,.user_listing { + border-bottom:1px solid #e9e9e9; + .head { + font-weight: bold; + font-size: 1.6em; // =h3 + } + a { + text-decoration: none; + &:hover, + &:active, + &:focus { + text-decoration: underline; + } + } +} + +.request_listing{ + .bottomline { + background-position:top left; + background-repeat: no-repeat; + padding:0 0 0 27px; + } + .desc { + font-style: italic; + } +} + +.request_icon_line { + background-repeat:no-repeat; + background-position:left center; + padding:0 0 0 42px; +} + +.request_short_listing { + margin-top:1em; + h3 { + font-size: 1.3em; + margin-bottom: 0.33em; + } + a { + text-decoration: none; + &:hover, + &:active, + &:focus { + text-decoration: underline; + } + } +} + +/* Status lines and icons */ +.icon_waiting_response,.icon_waiting_classification,.icon_waiting_clarification { + background-image:image-url('status-pending.png'); + color:#A68C2E; +} + + +.icon_not_held, .icon_attention_requested { + background-image:image-url('status-not-held.png'); + color:#A68C2E; +} + +.icon_successful,.icon_partially_successful { + background-image:image-url('status-complete.png'); + color:#69952F; +} + +.icon_requires_admin,.icon_waiting_response_overdue,.icon_waiting_response_very_overdue { + background-image:image-url('status-overdue.png'); + color:#C1272D; +} + +.icon_gone_postal { + background-image:image-url('status-gone-postal.png'); + color:#A68C2E; +} + +.icon_error_message { + background-image:image-url('status-error.png'); + color:#C1272D; +} + +.icon_internal_review { + background-image:image-url('status-internal-review.png'); + color:#A68C2E; +} + +.icon_user_withdrawn { + background-image:image-url('status-withdrawn.png'); + color:#A68C2E; +} + +.icon_failed,.icon_rejected { + background-image:image-url('status-denied.png'); + color:#C1272D; +} + +#public_body_list { + ul { + list-style: none outside none; + padding-left: 0; + } + li { + line-height: 1.2em; + margin-bottom: 0.4em; + } +} diff --git a/app/assets/stylesheets/responsive/_new_request_layout.scss b/app/assets/stylesheets/responsive/_new_request_layout.scss new file mode 100644 index 000000000..eec95ae77 --- /dev/null +++ b/app/assets/stylesheets/responsive/_new_request_layout.scss @@ -0,0 +1,184 @@ +/* Layout for pages in making a new request */ + +/* /select_authority page */ +#authority_selection { + @include grid-column($columns: 12, $collapse: true); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns: 6, $collapse: true); + @include ie8{ + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 27.125em; + } + } +} + +.new_info_request{ + @include grid-row($behavior: nest); +} + +#authority_preview { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column(6); + margin-top:-67px; + @include ie8{ + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 26.188em; + } + } + + /* Hide some elements of the public body that aren't appropriate in this + context */ + #list-filter, h2.foi_results, .public-body-name-prefix { + display: none; + } + + /* Compact request list for viewing in authority preview column */ + .request_left, #header_left { + @include grid-column(12, $collapse: true); + } + + .request_right { + @include grid-column(12, $collapse: true); + } + + span.desc { + background:none; + line-height:18px; + padding: 0; + } + +} +/* /new/[body_name] page */ +#request_header { + @include grid-row; + + /* Restrict width of form elements on wide screens */ + #request_header_body, #request_header_subject, #typeahead_response { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:8, $last-column:true); + @include ie8{ + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 36.813em; + } + } + } + + span#to_public_body { + display:block; + margin-bottom:15px; + } +} + +/* Advice sits on right hand side */ +#request_advice { + + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:4, $push: 8); + @include ie8{ + padding-left: 0.9375em; + } + @include lte-ie7 { + width: 17.438em; + } + } +} + +#request_form { + + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:8, $pull: 4); + @include ie8{ + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 36.813em; + } + } + +} + +#preview_form { + @include grid-column(12); +} + + +/* Batch request page*/ + +div.batch_public_body_toggle { + display:none; +} + +#body_selection { + @include grid-row($behavior: nest); + /* Equal columns */ + .body_list { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column(5); + } + @include lte-ie7 { + width: 22.313em; + } + } + + select { + height: inherit; + } + + #body_candidates { + float: left; + @include ie8{ + padding-right: 0.9375em; + } + } + + #body_selections { + float: right; + @include ie8{ + padding-left: 0.9375em; + } + } + + input[type='submit'] { + margin: 10px 0; + width: 45%; + } + + #body_select_all_button, #body_deselect_button { + float: right; + } + + #body_submission { + input[type='submit'] { + margin: 10px 0; + width:100%; + } + } + + .select_all_button { + display: none; + } + + .body_select { + width: 100%; + } + +} + +.batch_public_body_list { + margin-left: 110px; +} + + + + diff --git a/app/assets/stylesheets/responsive/_new_request_style.scss b/app/assets/stylesheets/responsive/_new_request_style.scss new file mode 100644 index 000000000..ab144b39f --- /dev/null +++ b/app/assets/stylesheets/responsive/_new_request_style.scss @@ -0,0 +1,56 @@ +/* Styles for pages in making a new request */ + +/* /new/[body_name] page */ +.new_info_request { + label { + display: block; + margin-bottom: 0.5em; + } + input[type=text], + textarea { + width: 100%; + font-size: 1em; + } +} + +#request_header { + padding-top:0.5em; + padding-bottom:1em; + +} + +#to_public_body { + font-weight: bold; + font-size: 1.3em; +} + +#request_header_text { + border-radius:3px; + background-color: lighten(#62b356, 23%); + padding:0 1em; + margin-bottom: 1.5em; + margin-top: 1.5em; + overflow: hidden; + h3 { + font-size: 1em; + } + +} + +#request_advice { + ul { + margin:0 auto; + + li { + margin:0 0 1em; + } + } +} + + +/* Batch request page */ + +.batch_public_body_toggle { + color: #0000EE; + font-size: 0.9em; +} diff --git a/app/assets/stylesheets/responsive/_popups_layout.scss b/app/assets/stylesheets/responsive/_popups_layout.scss new file mode 100644 index 000000000..700361609 --- /dev/null +++ b/app/assets/stylesheets/responsive/_popups_layout.scss @@ -0,0 +1,31 @@ +/* Layout for popup messages */ + +.popup { + @include ie8{ + width: 100%; + } +} +.popup .popup-content{ + margin:0.5em; + width: 95%; + float: left; +} + +.popup .popup-close { + display:inline-block; + overflow:hidden; + float:right; + padding:10px 0; +} + +#other-country-notice{ + display:none; +} + +#link_box { + position:absolute; + z-index:999; + display:none; +} + + diff --git a/app/assets/stylesheets/responsive/_popups_style.scss b/app/assets/stylesheets/responsive/_popups_style.scss new file mode 100644 index 000000000..dd6af7ba5 --- /dev/null +++ b/app/assets/stylesheets/responsive/_popups_style.scss @@ -0,0 +1,57 @@ +/* Styles for popup messages */ +.popup { + background-color:#D5FFD8; + border:solid 3px #16C132; + z-index:2000; + overflow:auto; + text-align:center; + margin-top:2px; +} + +.popup p { + margin: 0; +} + +#everypage h2,#everypage h3 { + margin:0.5em 0; +} + +.popup .popup-close { + color:#FFF; + text-decoration:none; + border-radius:2px; + -moz-border-radius:2px; + width:15px; + height:15px; + cursor:pointer; + background: image-url('small-green-cross.png') no-repeat 0; + border:solid 0 #FFF; + text-indent:-999px; + overflow:hidden; + float:right; +} + +/* Box that appears when you click the link icon in a request thread */ +#link_box { + text-align:left; + background-color:#FFF; + opacity:0.9; + border-radius:6px; + -moz-border-radius:6px; + border:1px solid #444; + padding:5px; +} + +#link_box .close-button { + background-color:#444; + margin-left:15px; + padding:0; +} + +a.link_to_this { + display:inline-block; + width:20px; + letter-spacing:-1000em; + overflow:hidden; + background:image-url('link-icon.png') no-repeat; +} diff --git a/app/assets/stylesheets/responsive/_print_layout.scss b/app/assets/stylesheets/responsive/_print_layout.scss new file mode 100644 index 000000000..514d22f83 --- /dev/null +++ b/app/assets/stylesheets/responsive/_print_layout.scss @@ -0,0 +1,45 @@ +div#content, div#left_column, div.entirebody div#wrapper { + width: 100%; + margin: 0; + float: none; +} + +div#content { + padding-right: 0; + width: 96%; +} + +#wrapper { + width: auto; + padding: 0; + +} + +p.event_actions, +div#after_actions, +#right_column, +#banner, +.admin .navbar, +#header_right, +#describe_state_form_1, +#describe_state_form_2, +.attachment_image, +#footer { + display: none; +} + +p#request_status { + page-break-after: avoid; +} +div.correspondence { + page-break-before: avoid; +} + +#other-country-notice { + display: none; +} + +.not-for-print { + display: none !IMPORTANT; +} + diff --git a/app/assets/stylesheets/responsive/_print_style.scss b/app/assets/stylesheets/responsive/_print_style.scss new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/app/assets/stylesheets/responsive/_print_style.scss diff --git a/app/assets/stylesheets/responsive/_public_body_layout.scss b/app/assets/stylesheets/responsive/_public_body_layout.scss new file mode 100644 index 000000000..ac02b1c10 --- /dev/null +++ b/app/assets/stylesheets/responsive/_public_body_layout.scss @@ -0,0 +1,5 @@ +/* Layout for public body pages */ + +#foi_results_section { + @include grid-column(12); +} diff --git a/app/assets/stylesheets/responsive/_public_body_stats_layout.scss b/app/assets/stylesheets/responsive/_public_body_stats_layout.scss new file mode 100644 index 000000000..81e784094 --- /dev/null +++ b/app/assets/stylesheets/responsive/_public_body_stats_layout.scss @@ -0,0 +1,24 @@ +/* Layout for public body stats page */ +.public-body-ranking { + margin-bottom: 40px; +} + +.public-body-ranking-title { + margin-top: 25px; + margin-bottom: 10px; +} + +.public-body-ranking table { + margin-top: 20px; + margin-left: 30px; +} + +.public-body-ranking td, th { + border: 0px; + padding: 5px; + padding-right: 20px; +} + +.public-body-ranking td.statistic { + text-align: center; +} diff --git a/app/assets/stylesheets/responsive/_public_body_stats_style.scss b/app/assets/stylesheets/responsive/_public_body_stats_style.scss new file mode 100644 index 000000000..79a379af1 --- /dev/null +++ b/app/assets/stylesheets/responsive/_public_body_stats_style.scss @@ -0,0 +1,11 @@ +/* Style for public body stats page */ +.public-body-ranking .axisLabels { + /* Justification for using !important here: the axis label color is + set in the style attribute in Flot's Javascript to the same + colour as the grid background. Changing this requires quite + invasive changes to the Javascript, and is likely to be + irrelevant in the next version of Flot anyway, which will have + core support for axis labels. So, just use !important to make + the axes black rather than transparent grey for the moment: */ + color: #000 !important; +} diff --git a/app/assets/stylesheets/responsive/_public_body_style.scss b/app/assets/stylesheets/responsive/_public_body_style.scss new file mode 100644 index 000000000..240d92618 --- /dev/null +++ b/app/assets/stylesheets/responsive/_public_body_style.scss @@ -0,0 +1,14 @@ +/* Style for public body pages */ +.public-body-name-prefix { + color:#888; + font-size: 1.3em; + position: relative; + top: 1em; +} + +#follow_count { + font-weight: bold; + font-size: 3em; + position: relative; + top: 0.25em; +} diff --git a/app/assets/stylesheets/responsive/_request_layout.scss b/app/assets/stylesheets/responsive/_request_layout.scss new file mode 100644 index 000000000..ec2d0d149 --- /dev/null +++ b/app/assets/stylesheets/responsive/_request_layout.scss @@ -0,0 +1,50 @@ +/* Layout for request page */ + + +.gone_postal_help{ + @include grid-column(12); +} + +#describe_state_form_1 { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column(9); + } +} + +#show_response_view { + @include grid-row(); + + > h2 { + @include grid-column($columns: 12, $collapse: true); + } + + .correspondence { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column(9); + @include ie8{ + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 41.625em; + } + } + } + + + #followup { + @include grid-column(12, $collapse: true); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column(8, $collapse: true); + } + } +} + + +/* Event history details */ +#request_details { + table { + margin-bottom:1em; + } +} diff --git a/app/assets/stylesheets/responsive/_request_style.scss b/app/assets/stylesheets/responsive/_request_style.scss new file mode 100644 index 000000000..c33688793 --- /dev/null +++ b/app/assets/stylesheets/responsive/_request_style.scss @@ -0,0 +1,112 @@ +/* Style for request page */ + +div.correspondence { + border: 1px solid #ccc; + margin: 0 0 1em; + padding: 0.5em 1em 0 0.5em; + + h2 { + text-align:right; + font-size:1em; + } +} + +div.comment_in_request { + border: 1px dotted #ccc; + margin:0 0 1em 3em; + padding:0 0.5em; + + h2 { + font-size:1em; + } + p { + font-size: 0.9em; + } +} + +.event_actions { + text-align:right; + line-height: 1em; + margin-bottom: 1em; +} + +.correspondence_text,.comment_in_request_text { + margin:0 1.2em 0 0.9em; +} + +.user_photo_on_request img { + width:48px; + height:48px; + float:left; + vertical-align:middle; + margin-right:0.5em; +} + +.user_photo_on_comment img { + width:36px; + height:36px; + float:left; + vertical-align:middle; + margin-top: 0.5em; + margin-right:0.5em; +} + +a img.attachment_image { + float:left; + border:0; + vertical-align:middle; + margin:0 0.2em 0.2em 0; +} + +.attachments hr.top { + clear:both; + margin:0 0 1em; +} + +.attachments hr.bottom { + clear:both; + margin:1em 0 0; +} + +.describe_state_form,#other_recipients { + + border-radius:3px; + -moz-border-radius:3px; + margin:1em 0; + padding:0.5em 1em; +} + +.describe_state_form { + hr { + margin-top: 1em; + &+p { + margin-top: 1em; + } + } +} + +#follow_box .feed_link { + text-align: center; +} + + +/* Event history details */ + +#request_details { + + table { + border-collapse: collapse; + } + + td,th { + border:solid 1px #000; + } + + tr.odd { + background-color:#bbb; + } + + tr.even { + background-color:#ddd; + } +} diff --git a/app/assets/stylesheets/responsive/_search_layout.scss b/app/assets/stylesheets/responsive/_search_layout.scss new file mode 100644 index 000000000..48dd0c6a7 --- /dev/null +++ b/app/assets/stylesheets/responsive/_search_layout.scss @@ -0,0 +1,59 @@ +/* Layout for search (and filters on request list)*/ +/* These pages use grid-columns, so are contained in a grid-row */ +#general_search, +#general_search_redirect, +#public_body_show, +#request_list { + @include grid-row($behavior: nest); +} + + +#filter_requests_form, #search_form, #filter_form { + + label { + display:inline; + float:none; + padding-right:5px; + } + + label.title { + @include respond-min( $main_menu-mobile_menu_cutoff ){ + display:inline-block; + float:none; + width:110px; + } + } + + .filter-request-types { + display: inline-block; + line-height: 1.5em; + } + + #requests-subfilters div { + margin-top:10px; + } + + .list-filter-item{ + margin-bottom:0.5em; + } +} + + +.results_section { + @include grid-column(12); + .results-block:last-child { + border-bottom: none; + padding-bottom:0; + } + .results_section { + @include grid-column(12, $collapse:true); + } +} + +#advanced-search input[type=text] { + width:50%; +} + +#advanced-search-tips{ + @include grid-column(12); +} diff --git a/app/assets/stylesheets/responsive/_search_style.scss b/app/assets/stylesheets/responsive/_search_style.scss new file mode 100644 index 000000000..dfd40fc67 --- /dev/null +++ b/app/assets/stylesheets/responsive/_search_style.scss @@ -0,0 +1,54 @@ +/* Style for search (and filters on request list) */ +.user_photo_on_search img { + width:48px; + height:48px; + vertical-align:middle; + border:1px solid #ddd; + margin-right:5px; + padding:2px; + float: left; +} + +input.use-datepicker[type=text] { + width: 130px; + background:image-url('calendar.png') no-repeat 100px 5px; +} + +#ui-datepicker-div.ui-widget { + font-family:Arial, sans-serif; +} + +#ui-datepicker-div .ui-datepicker-header,#ui-datepicker-div .ui-widget-header { + background:none; + border:solid 0 #FFF; + color:#444; + font-size:17px; + font-weight:normal; + line-height:1.5em !important; +} + +#ui-datepicker-div { + .ui-datepicker-prev, .ui-datepicker-next { + margin-top:2px; + opacity:0.5; + } + .ui-datepicker-prev-hover { + left:2px; + top:2px; + border:none; + background:#FFF; + cursor:pointer; + opacity:1; + } + + .ui-datepicker-next-hover { + right:2px; + top:2px; + border:none; + background:#FFF; + cursor:pointer; + opacity:1; + } +} + + diff --git a/app/assets/stylesheets/responsive/_settings.scss b/app/assets/stylesheets/responsive/_settings.scss new file mode 100644 index 000000000..c52451b46 --- /dev/null +++ b/app/assets/stylesheets/responsive/_settings.scss @@ -0,0 +1,5 @@ +$main_menu-mobile_menu_cutoff: 58em; +$row-width: 64em; +$body-font-family: "Helvetica Neue", Arial, Helvetica, Helmet, Freesans, sans-serif; +$form-label-font-color: #333333; +$base-font-size: 16px; diff --git a/app/assets/stylesheets/responsive/_signin_layout.scss b/app/assets/stylesheets/responsive/_signin_layout.scss new file mode 100644 index 000000000..44999d31b --- /dev/null +++ b/app/assets/stylesheets/responsive/_signin_layout.scss @@ -0,0 +1,82 @@ +/* Signin layout */ + +#sign_in_reason { + @include grid-column(12); +} +#left_half { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:5,$float:left); + @include ie8{ + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 22.313em; + } + } +} + +#right_half { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:5,$float:right); + @include ie8{ + padding-left: 0.9375em; + } + @include lte-ie7 { + width: 22.313em; + } + } +} + +#middle_strip { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:2,$float:left); + @include ie8{ + padding-left: 0.9375em; + padding-right: 0.9375em; + } + @include lte-ie7 { + width: 7.438em; + } + } +} + +#sign_together{ + @include grid-row($behavior: nest); +} + +#sign_alone{ + @include grid-row($behavior: nest); + #signin { + @include grid-column(12); + @include respond-min( $main_menu-mobile_menu_cutoff ){ + @include grid-column($columns:6,$push:3); + @include ie8{ + padding-left: 0.9375em; + padding-right: 0.9375em; + } + } + } + +} + +#signup, #signin { +margin-top:20px; + + .form_checkbox { + input{ + margin-bottom: 0; + } + label { + font-size:1em; + display:inline; + margin-right: 0; + } + } +} + +#sign_in_reason { + margin-top: 0.5em; +} diff --git a/app/assets/stylesheets/responsive/_signin_style.scss b/app/assets/stylesheets/responsive/_signin_style.scss new file mode 100644 index 000000000..2bd2802b4 --- /dev/null +++ b/app/assets/stylesheets/responsive/_signin_style.scss @@ -0,0 +1,28 @@ +/* Signin styles */ +#signup, #signin { + input[type=text], + input[type=password] { + width: 100%; + } +} + +#middle_strip { + text-align:center; + position: relative; + @include respond-min( $main_menu-mobile_menu_cutoff ){ + top: 3em; + } + font-size:1.2em; +} + +p#sign_in_reason, p#superuser_message { + font-size:2em; + font-weight:bold; + line-height:1em; +} + +p#superuser_message { + font-size:1.2em; +} + + diff --git a/app/assets/stylesheets/responsive/_user_layout.scss b/app/assets/stylesheets/responsive/_user_layout.scss new file mode 100644 index 000000000..8087f978c --- /dev/null +++ b/app/assets/stylesheets/responsive/_user_layout.scss @@ -0,0 +1,2 @@ +/* Layout for user pages */ + diff --git a/app/assets/stylesheets/responsive/_user_style.scss b/app/assets/stylesheets/responsive/_user_style.scss new file mode 100644 index 000000000..31e7e6bc0 --- /dev/null +++ b/app/assets/stylesheets/responsive/_user_style.scss @@ -0,0 +1,36 @@ +/* Style for user pages */ + +#set_photo { + background:image-url('defaultprofilepic.png'); +} + +#user_public_banned { + background-color:#d0d0d0; +} + +#user_photo_on_profile { + img, #set_photo { + width:96px; + height:96px; + float:left; + vertical-align:middle; + text-align:center; + margin-right:0.5em; + } +} + +div.user_about_me { + overflow:auto; + margin:1em 1.5em; + padding:0 0.5em; +} + +#user_public_banned { + + padding:0.5em 1em; + + .details { + font-size:0.9em; + font-style:italic; + } +} diff --git a/app/assets/stylesheets/responsive/_utils.scss b/app/assets/stylesheets/responsive/_utils.scss new file mode 100644 index 000000000..68884fa7a --- /dev/null +++ b/app/assets/stylesheets/responsive/_utils.scss @@ -0,0 +1,35 @@ +$fix-mqs: false !default; + +@mixin respond-min($width) { + // If we're outputting for a fixed media query set... + @if $fix-mqs { + // ...and if we should apply these rules... + @if $fix-mqs >= $width { + // ...output the content the user gave us. + @content; + } + } + @else { + // Otherwise, output it using a regular media query + @media(min-width: $width) { + @content; + } + } +} + +$ie8: false !default; +$lte-ie7: false !default; + +@mixin ie8 { + // Only use this content if we're dealing with IE8 + @if $ie8 { + @content; + } +} + +@mixin lte-ie7 { + // Only use this content if we're dealing with oldest IE (<= 7) + @if $lte-ie7 { + @content; + } +} diff --git a/app/assets/stylesheets/responsive/all.scss b/app/assets/stylesheets/responsive/all.scss new file mode 100644 index 000000000..4c935bed3 --- /dev/null +++ b/app/assets/stylesheets/responsive/all.scss @@ -0,0 +1,68 @@ +@import "foundation/functions"; +@import "_settings"; + +@import "foundation/components/grid"; +@import "foundation/components/block-grid"; +@import "foundation/components/forms"; + + +// Our own style components +@import "_utils"; + +// Global styles +@import "_global_layout"; +@import "_global_style"; + +@import "_header_layout"; +@import "_header_style"; + +@import "_popups_layout"; +@import "_popups_style"; + +@import "_footer_layout"; +@import "_footer_style"; + +@import "_lists_layout"; +@import "_lists_style"; + +// Styles that are only used on particular pages +@import "_attachments_layout"; +@import "_attachments_style"; + +@import "_blog_layout"; +@import "_blog_style"; + +@import "_categorization_game_style"; +@import "_categorization_game_layout"; + +@import "_contact_style"; +@import "_contact_layout"; + +@import "_frontpage_layout"; +@import "_frontpage_style"; + +@import "_help_style"; +@import "_help_layout"; + +@import "_new_request_layout"; +@import "_new_request_style"; + +@import "_search_layout"; +@import "_search_style"; + +@import "_request_layout"; +@import "_request_style"; + +@import "_signin_layout"; +@import "_signin_style"; + +@import "_public_body_layout"; +@import "_public_body_style"; + +@import "_public_body_stats_layout"; +@import "_public_body_stats_style"; + +@import "_user_style"; +@import "_user_layout"; + +@import "custom"; diff --git a/app/assets/stylesheets/responsive/application-ie8.css b/app/assets/stylesheets/responsive/application-ie8.css new file mode 100644 index 000000000..38cdf3b47 --- /dev/null +++ b/app/assets/stylesheets/responsive/application-ie8.css @@ -0,0 +1,7 @@ +/* ... +*= require_self +*= require normalize +*= require responsive/ie8 +*= require jquery.ui.datepicker +*= require jquery.ui.tabs +*/ diff --git a/app/assets/stylesheets/responsive/application-lte-ie7.css b/app/assets/stylesheets/responsive/application-lte-ie7.css new file mode 100644 index 000000000..5b8802cd5 --- /dev/null +++ b/app/assets/stylesheets/responsive/application-lte-ie7.css @@ -0,0 +1,7 @@ +/* ... +*= require_self +*= require normalize +*= require responsive/lte-ie7 +*= require jquery.ui.datepicker +*= require jquery.ui.tabs +*/ diff --git a/app/assets/stylesheets/responsive/application.css b/app/assets/stylesheets/responsive/application.css new file mode 100644 index 000000000..0b5aa8d66 --- /dev/null +++ b/app/assets/stylesheets/responsive/application.css @@ -0,0 +1,7 @@ +/* ... +*= require_self +*= require normalize +*= require responsive/main +*= require jquery.ui.datepicker +*= require jquery.ui.tabs +*/ diff --git a/app/assets/stylesheets/responsive/custom.scss b/app/assets/stylesheets/responsive/custom.scss new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/app/assets/stylesheets/responsive/custom.scss diff --git a/app/assets/stylesheets/responsive/ie8.scss b/app/assets/stylesheets/responsive/ie8.scss new file mode 100644 index 000000000..32d545c47 --- /dev/null +++ b/app/assets/stylesheets/responsive/ie8.scss @@ -0,0 +1,3 @@ +$ie8: true; +$fix-mqs: 58em; +@import 'all'; diff --git a/app/assets/stylesheets/responsive/lte-ie7.scss b/app/assets/stylesheets/responsive/lte-ie7.scss new file mode 100644 index 000000000..b1519d6f0 --- /dev/null +++ b/app/assets/stylesheets/responsive/lte-ie7.scss @@ -0,0 +1,4 @@ +$lte-ie7: true; +$ie8: true; +$fix-mqs: 58em; +@import 'all'; diff --git a/app/assets/stylesheets/responsive/main.scss b/app/assets/stylesheets/responsive/main.scss new file mode 100644 index 000000000..ff4314781 --- /dev/null +++ b/app/assets/stylesheets/responsive/main.scss @@ -0,0 +1 @@ +@import 'all'; diff --git a/app/assets/stylesheets/responsive/print.scss b/app/assets/stylesheets/responsive/print.scss new file mode 100644 index 000000000..b643c11ff --- /dev/null +++ b/app/assets/stylesheets/responsive/print.scss @@ -0,0 +1,2 @@ +@import "_print_layout"; +@import "_print_style"; |