"),this.o.calendarWeeks)){var ws=new Date(+prevMonth+864e5*((this.o.weekStart-prevMonth.getUTCDay()-7)%7)),th=new Date(+ws+864e5*((11-ws.getUTCDay())%7)),yth=new Date(+(yth=UTCDate(th.getUTCFullYear(),0,1))+864e5*((11-yth.getUTCDay())%7)),calWeek=(th-yth)/864e5/7+1;html.push('| '+calWeek+" | ")}if(clsName=this.getClassNames(prevMonth),clsName.push("day"),this.o.beforeShowDay!==$.noop){var before=this.o.beforeShowDay(this._utc_to_local(prevMonth));void 0===before?before={}:"boolean"==typeof before?before={enabled:before}:"string"==typeof before&&(before={classes:before}),before.enabled===!1&&clsName.push("disabled"),before.classes&&(clsName=clsName.concat(before.classes.split(/\s+/))),before.tooltip&&(tooltip=before.tooltip)}clsName=$.unique(clsName),html.push('"+prevMonth.getUTCDate()+" | "),prevMonth.getUTCDay()==this.o.weekEnd&&html.push(""),prevMonth.setUTCDate(prevMonth.getUTCDate()+1)}this.picker.find(".datepicker-days tbody").empty().append(html.join(""));var currentYear=this.date&&this.date.getUTCFullYear(),months=this.picker.find(".datepicker-months").find("th:eq(1)").text(year).end().find("span").removeClass("active");currentYear&¤tYear==year&&months.eq(this.date.getUTCMonth()).addClass("active"),(startYear>year||year>endYear)&&months.addClass("disabled"),year==startYear&&months.slice(0,startMonth).addClass("disabled"),year==endYear&&months.slice(endMonth+1).addClass("disabled"),html="",year=10*parseInt(year/10,10);var yearCont=this.picker.find(".datepicker-years").find("th:eq(1)").text(year+"-"+(year+9)).end().find("td");year-=1;for(var i=-1;11>i;i++)html+='year||year>endYear?" disabled":"")+'">'+year+"",year+=1;yearCont.html(html)},updateNavArrows:function(){if(this._allow_update){var d=new Date(this.viewDate),year=d.getUTCFullYear(),month=d.getUTCMonth();switch(this.viewMode){case 0:this.o.startDate!==-1/0&&year<=this.o.startDate.getUTCFullYear()&&month<=this.o.startDate.getUTCMonth()?this.picker.find(".prev").css({visibility:"hidden"}):this.picker.find(".prev").css({visibility:"visible"}),1/0!==this.o.endDate&&year>=this.o.endDate.getUTCFullYear()&&month>=this.o.endDate.getUTCMonth()?this.picker.find(".next").css({visibility:"hidden"}):this.picker.find(".next").css({visibility:"visible"});break;case 1:case 2:this.o.startDate!==-1/0&&year<=this.o.startDate.getUTCFullYear()?this.picker.find(".prev").css({visibility:"hidden"}):this.picker.find(".prev").css({visibility:"visible"}),1/0!==this.o.endDate&&year>=this.o.endDate.getUTCFullYear()?this.picker.find(".next").css({visibility:"hidden"}):this.picker.find(".next").css({visibility:"visible"})}}},click:function(e){e.preventDefault();var target=$(e.target).closest("span, td, th");if(1==target.length)switch(target[0].nodeName.toLowerCase()){case"th":switch(target[0].className){case"datepicker-switch":this.showMode(1);break;case"prev":case"next":var dir=DPGlobal.modes[this.viewMode].navStep*("prev"==target[0].className?-1:1);switch(this.viewMode){case 0:this.viewDate=this.moveMonth(this.viewDate,dir),this._trigger("changeMonth",this.viewDate);break;case 1:case 2:this.viewDate=this.moveYear(this.viewDate,dir),1===this.viewMode&&this._trigger("changeYear",this.viewDate)}this.fill();break;case"today":var date=new Date;date=UTCDate(date.getFullYear(),date.getMonth(),date.getDate(),0,0,0),this.showMode(-2);var which="linked"==this.o.todayBtn?null:"view";this._setDate(date,which);break;case"clear":var element;this.isInput?element=this.element:this.component&&(element=this.element.find("input")),element&&element.val("").change(),this._trigger("changeDate"),this.update(),this.o.autoclose&&this.hide()}break;case"span":if(!target.is(".disabled")){if(this.viewDate.setUTCDate(1),target.is(".month")){var day=1,month=target.parent().find("span").index(target),year=this.viewDate.getUTCFullYear();this.viewDate.setUTCMonth(month),this._trigger("changeMonth",this.viewDate),1===this.o.minViewMode&&this._setDate(UTCDate(year,month,day,0,0,0,0))}else{var year=parseInt(target.text(),10)||0,day=1,month=0;this.viewDate.setUTCFullYear(year),this._trigger("changeYear",this.viewDate),2===this.o.minViewMode&&this._setDate(UTCDate(year,month,day,0,0,0,0))}this.showMode(-1),this.fill()}break;case"td":if(target.is(".day")&&!target.is(".disabled")){var day=parseInt(target.text(),10)||1,year=this.viewDate.getUTCFullYear(),month=this.viewDate.getUTCMonth();target.is(".old")?0===month?(month=11,year-=1):month-=1:target.is(".new")&&(11==month?(month=0,year+=1):month+=1),this._setDate(UTCDate(year,month,day,0,0,0,0))}}},_setDate:function(date,which){which&&"date"!=which||(this.date=new Date(date)),which&&"view"!=which||(this.viewDate=new Date(date)),this.fill(),this.setValue(),this._trigger("changeDate");var element;this.isInput?element=this.element:this.component&&(element=this.element.find("input")),element&&element.change(),!this.o.autoclose||which&&"date"!=which||this.hide()},moveMonth:function(date,dir){if(!dir)return date;var new_month,test,new_date=new Date(date.valueOf()),day=new_date.getUTCDate(),month=new_date.getUTCMonth(),mag=Math.abs(dir);if(dir=dir>0?1:-1,1==mag)test=-1==dir?function(){return new_date.getUTCMonth()==month}:function(){return new_date.getUTCMonth()!=new_month},new_month=month+dir,new_date.setUTCMonth(new_month),(0>new_month||new_month>11)&&(new_month=(new_month+12)%12);else{for(var i=0;mag>i;i++)new_date=this.moveMonth(new_date,dir);new_month=new_date.getUTCMonth(),new_date.setUTCDate(day),test=function(){return new_month!=new_date.getUTCMonth()}}for(;test();)new_date.setUTCDate(--day),new_date.setUTCMonth(new_month);return new_date},moveYear:function(date,dir){return this.moveMonth(date,12*dir)},dateWithinRange:function(date){return date>=this.o.startDate&&date<=this.o.endDate},keydown:function(e){if(this.picker.is(":not(:visible)"))return 27==e.keyCode&&this.show(),void 0;var dir,newDate,newViewDate,dateChanged=!1;switch(e.keyCode){case 27:this.hide(),e.preventDefault();break;case 37:case 39:if(!this.o.keyboardNavigation)break;dir=37==e.keyCode?-1:1,e.ctrlKey?(newDate=this.moveYear(this.date,dir),newViewDate=this.moveYear(this.viewDate,dir),this._trigger("changeYear",this.viewDate)):e.shiftKey?(newDate=this.moveMonth(this.date,dir),newViewDate=this.moveMonth(this.viewDate,dir),this._trigger("changeMonth",this.viewDate)):(newDate=new Date(this.date),newDate.setUTCDate(this.date.getUTCDate()+dir),newViewDate=new Date(this.viewDate),newViewDate.setUTCDate(this.viewDate.getUTCDate()+dir)),this.dateWithinRange(newDate)&&(this.date=newDate,this.viewDate=newViewDate,this.setValue(),this.update(),e.preventDefault(),dateChanged=!0);break;case 38:case 40:if(!this.o.keyboardNavigation)break;dir=38==e.keyCode?-1:1,e.ctrlKey?(newDate=this.moveYear(this.date,dir),newViewDate=this.moveYear(this.viewDate,dir),this._trigger("changeYear",this.viewDate)):e.shiftKey?(newDate=this.moveMonth(this.date,dir),newViewDate=this.moveMonth(this.viewDate,dir),this._trigger("changeMonth",this.viewDate)):(newDate=new Date(this.date),newDate.setUTCDate(this.date.getUTCDate()+7*dir),newViewDate=new Date(this.viewDate),newViewDate.setUTCDate(this.viewDate.getUTCDate()+7*dir)),this.dateWithinRange(newDate)&&(this.date=newDate,this.viewDate=newViewDate,this.setValue(),this.update(),e.preventDefault(),dateChanged=!0);break;case 13:this.hide(),e.preventDefault();break;case 9:this.hide()}if(dateChanged){this._trigger("changeDate");var element;this.isInput?element=this.element:this.component&&(element=this.element.find("input")),element&&element.change()}},showMode:function(dir){dir&&(this.viewMode=Math.max(this.o.minViewMode,Math.min(2,this.viewMode+dir))),this.picker.find(">div").hide().filter(".datepicker-"+DPGlobal.modes[this.viewMode].clsName).css("display","block"),this.updateNavArrows()}};var DateRangePicker=function(element,options){this.element=$(element),this.inputs=$.map(options.inputs,function(i){return i.jquery?i[0]:i}),delete options.inputs,$(this.inputs).datepicker(options).bind("changeDate",$.proxy(this.dateUpdated,this)),this.pickers=$.map(this.inputs,function(i){return $(i).data("datepicker")}),this.updateDates()};DateRangePicker.prototype={updateDates:function(){this.dates=$.map(this.pickers,function(i){return i.date}),this.updateRanges()},updateRanges:function(){var range=$.map(this.dates,function(d){return d.valueOf()});$.each(this.pickers,function(i,p){p.setRange(range)})},dateUpdated:function(e){var dp=$(e.target).data("datepicker"),new_date=dp.getUTCDate(),i=$.inArray(e.target,this.inputs),l=this.inputs.length;if(-1!=i){if(new_date=0&&new_datethis.dates[i])for(;l>i&&new_date>this.dates[i];)this.pickers[i++].setUTCDate(new_date);this.updateDates()}},remove:function(){$.map(this.pickers,function(p){p.remove()}),delete this.element.data().datepicker}};var old=$.fn.datepicker;$.fn.datepicker=function(option){var args=Array.apply(null,arguments);args.shift();var internal_return;return this.each(function(){var $this=$(this),data=$this.data("datepicker"),options="object"==typeof option&&option;if(!data){var elopts=opts_from_el(this,"date"),xopts=$.extend({},defaults,elopts,options),locopts=opts_from_locale(xopts.language),opts=$.extend({},defaults,locopts,elopts,options);if($this.is(".input-daterange")||opts.inputs){var ropts={inputs:opts.inputs||$this.find("input").toArray()};$this.data("datepicker",data=new DateRangePicker(this,$.extend(opts,ropts)))}else $this.data("datepicker",data=new Datepicker(this,opts))}return"string"==typeof option&&"function"==typeof data[option]&&(internal_return=data[option].apply(data,args),void 0!==internal_return)?!1:void 0}),void 0!==internal_return?internal_return:this};var defaults=$.fn.datepicker.defaults={autoclose:!1,beforeShowDay:$.noop,calendarWeeks:!1,clearBtn:!1,daysOfWeekDisabled:[],endDate:1/0,forceParse:!0,format:"mm/dd/yyyy",keyboardNavigation:!0,language:"en",minViewMode:0,orientation:"auto",rtl:!1,startDate:-1/0,startView:0,todayBtn:!1,todayHighlight:!1,weekStart:0},locale_opts=$.fn.datepicker.locale_opts=["format","rtl","weekStart"];$.fn.datepicker.Constructor=Datepicker;var dates=$.fn.datepicker.dates={en:{days:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"],daysShort:["Sun","Mon","Tue","Wed","Thu","Fri","Sat","Sun"],daysMin:["Su","Mo","Tu","We","Th","Fr","Sa","Su"],months:["January","February","March","April","May","June","July","August","September","October","November","December"],monthsShort:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],today:"Today",clear:"Clear"}},DPGlobal={modes:[{clsName:"days",navFnc:"Month",navStep:1},{clsName:"months",navFnc:"FullYear",navStep:1},{clsName:"years",navFnc:"FullYear",navStep:10}],isLeapYear:function(year){return 0===year%4&&0!==year%100||0===year%400},getDaysInMonth:function(year,month){return[31,DPGlobal.isLeapYear(year)?29:28,31,30,31,30,31,31,30,31,30,31][month]},validParts:/dd?|DD?|mm?|MM?|yy(?:yy)?/g,nonpunctuation:/[^ -\/:-@\[\u3400-\u9fff-`{-~\t\n\r]+/g,parseFormat:function(format){var separators=format.replace(this.validParts,"\x00").split("\x00"),parts=format.match(this.validParts);if(!separators||!separators.length||!parts||0===parts.length)throw new Error("Invalid date format.");return{separators:separators,parts:parts}},parseDate:function(date,format,language){if(date instanceof Date)return date;if("string"==typeof format&&(format=DPGlobal.parseFormat(format)),/^[\-+]\d+[dmwy]([\s,]+[\-+]\d+[dmwy])*$/.test(date)){var part,dir,part_re=/([\-+]\d+)([dmwy])/,parts=date.match(/([\-+]\d+)([dmwy])/g);date=new Date;for(var i=0;iv;)v+=12;for(v%=12,d.setUTCMonth(v);d.getUTCMonth()!=v;)d.setUTCDate(d.getUTCDate()-1);return d},d:function(d,v){return d.setUTCDate(v)}};setters_map.M=setters_map.MM=setters_map.mm=setters_map.m,setters_map.dd=setters_map.d,date=UTCDate(date.getFullYear(),date.getMonth(),date.getDate(),0,0,0);var fparts=format.parts.slice();if(parts.length!=fparts.length&&(fparts=$(fparts).filter(function(i,p){return-1!==$.inArray(p,setters_order)}).toArray()),parts.length==fparts.length){for(var i=0,cnt=fparts.length;cnt>i;i++){if(val=parseInt(parts[i],10),part=fparts[i],isNaN(val))switch(part){case"MM":filtered=$(dates[language].months).filter(function(){var m=this.slice(0,parts[i].length),p=parts[i].slice(0,m.length);return m==p}),val=$.inArray(filtered[0],dates[language].months)+1;break;case"M":filtered=$(dates[language].monthsShort).filter(function(){var m=this.slice(0,parts[i].length),p=parts[i].slice(0,m.length);return m==p}),val=$.inArray(filtered[0],dates[language].monthsShort)+1}parsed[part]=val}for(var _date,s,i=0;i=i;i++)seps.length&&date.push(seps.shift()),date.push(val[format.parts[i]]);return date.join("")},headTemplate:'| « | | » |
|---|
',contTemplate:' |
',footTemplate:' |
|---|
|
|---|
'};DPGlobal.template=''+DPGlobal.headTemplate+""+DPGlobal.footTemplate+'
'+DPGlobal.headTemplate+DPGlobal.contTemplate+DPGlobal.footTemplate+'
'+DPGlobal.headTemplate+DPGlobal.contTemplate+DPGlobal.footTemplate+"
\n \n
',link:function(scope,element){return scope.inputHasFocus=!1,element.datepicker(scope.ngOptions).on("changeDate",function(e){var defaultFormat,defaultLanguage,format,language;return defaultFormat=$.fn.datepicker.defaults.format,format=scope.ngOptions.format||defaultFormat,defaultLanguage=$.fn.datepicker.defaults.language,language=scope.ngOptions.language||defaultLanguage,scope.$apply(function(){return scope.ngModel=$.fn.datepicker.DPGlobal.formatDate(e.date,format,language)})}),element.find("input").on("focus",function(){return scope.inputHasFocus=!0}).on("blur",function(){return scope.inputHasFocus=!1}),scope.$watch("ngModel",function(newValue){return scope.inputHasFocus?void 0:element.datepicker("update",newValue)})}}});
--------------------------------------------------------------------------------
/example/angular-bootstrap-datepicker.css:
--------------------------------------------------------------------------------
1 | /*!
2 | * Datepicker for Bootstrap
3 | *
4 | * Copyright 2012 Stefan Petre
5 | * Improvements by Andrew Rowls
6 | * Licensed under the Apache License v2.0
7 | * http://www.apache.org/licenses/LICENSE-2.0
8 | *
9 | */
10 | .datepicker {
11 | padding: 4px;
12 | -webkit-border-radius: 4px;
13 | -moz-border-radius: 4px;
14 | border-radius: 4px;
15 | direction: ltr;
16 | /*.dow {
17 | border-top: 1px solid #ddd !important;
18 | }*/
19 |
20 | }
21 | .datepicker-inline {
22 | width: 220px;
23 | }
24 | .datepicker.datepicker-rtl {
25 | direction: rtl;
26 | }
27 | .datepicker.datepicker-rtl table tr td span {
28 | float: right;
29 | }
30 | .datepicker-dropdown {
31 | top: 0;
32 | left: 0;
33 | }
34 | .datepicker-dropdown:before {
35 | content: '';
36 | display: inline-block;
37 | border-left: 7px solid transparent;
38 | border-right: 7px solid transparent;
39 | border-bottom: 7px solid #ccc;
40 | border-top: 0;
41 | border-bottom-color: rgba(0, 0, 0, 0.2);
42 | position: absolute;
43 | }
44 | .datepicker-dropdown:after {
45 | content: '';
46 | display: inline-block;
47 | border-left: 6px solid transparent;
48 | border-right: 6px solid transparent;
49 | border-bottom: 6px solid #ffffff;
50 | border-top: 0;
51 | position: absolute;
52 | }
53 | .datepicker-dropdown.datepicker-orient-left:before {
54 | left: 6px;
55 | }
56 | .datepicker-dropdown.datepicker-orient-left:after {
57 | left: 7px;
58 | }
59 | .datepicker-dropdown.datepicker-orient-right:before {
60 | right: 6px;
61 | }
62 | .datepicker-dropdown.datepicker-orient-right:after {
63 | right: 7px;
64 | }
65 | .datepicker-dropdown.datepicker-orient-top:before {
66 | top: -7px;
67 | }
68 | .datepicker-dropdown.datepicker-orient-top:after {
69 | top: -6px;
70 | }
71 | .datepicker-dropdown.datepicker-orient-bottom:before {
72 | bottom: -7px;
73 | border-bottom: 0;
74 | border-top: 7px solid #999;
75 | }
76 | .datepicker-dropdown.datepicker-orient-bottom:after {
77 | bottom: -6px;
78 | border-bottom: 0;
79 | border-top: 6px solid #ffffff;
80 | }
81 | .datepicker > div {
82 | display: none;
83 | }
84 | .datepicker.days div.datepicker-days {
85 | display: block;
86 | }
87 | .datepicker.months div.datepicker-months {
88 | display: block;
89 | }
90 | .datepicker.years div.datepicker-years {
91 | display: block;
92 | }
93 | .datepicker table {
94 | margin: 0;
95 | -webkit-touch-callout: none;
96 | -webkit-user-select: none;
97 | -khtml-user-select: none;
98 | -moz-user-select: none;
99 | -ms-user-select: none;
100 | user-select: none;
101 | }
102 | .datepicker td,
103 | .datepicker th {
104 | text-align: center;
105 | width: 20px;
106 | height: 20px;
107 | -webkit-border-radius: 4px;
108 | -moz-border-radius: 4px;
109 | border-radius: 4px;
110 | border: none;
111 | }
112 | .table-striped .datepicker table tr td,
113 | .table-striped .datepicker table tr th {
114 | background-color: transparent;
115 | }
116 | .datepicker table tr td.day:hover {
117 | background: #eeeeee;
118 | cursor: pointer;
119 | }
120 | .datepicker table tr td.old,
121 | .datepicker table tr td.new {
122 | color: #999999;
123 | }
124 | .datepicker table tr td.disabled,
125 | .datepicker table tr td.disabled:hover {
126 | background: none;
127 | color: #999999;
128 | cursor: default;
129 | }
130 | .datepicker table tr td.today,
131 | .datepicker table tr td.today:hover,
132 | .datepicker table tr td.today.disabled,
133 | .datepicker table tr td.today.disabled:hover {
134 | background-color: #fde19a;
135 | background-image: -moz-linear-gradient(top, #fdd49a, #fdf59a);
136 | background-image: -ms-linear-gradient(top, #fdd49a, #fdf59a);
137 | background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fdd49a), to(#fdf59a));
138 | background-image: -webkit-linear-gradient(top, #fdd49a, #fdf59a);
139 | background-image: -o-linear-gradient(top, #fdd49a, #fdf59a);
140 | background-image: linear-gradient(top, #fdd49a, #fdf59a);
141 | background-repeat: repeat-x;
142 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdd49a', endColorstr='#fdf59a', GradientType=0);
143 | border-color: #fdf59a #fdf59a #fbed50;
144 | border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
145 | filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
146 | color: #000;
147 | }
148 | .datepicker table tr td.today:hover,
149 | .datepicker table tr td.today:hover:hover,
150 | .datepicker table tr td.today.disabled:hover,
151 | .datepicker table tr td.today.disabled:hover:hover,
152 | .datepicker table tr td.today:active,
153 | .datepicker table tr td.today:hover:active,
154 | .datepicker table tr td.today.disabled:active,
155 | .datepicker table tr td.today.disabled:hover:active,
156 | .datepicker table tr td.today.active,
157 | .datepicker table tr td.today:hover.active,
158 | .datepicker table tr td.today.disabled.active,
159 | .datepicker table tr td.today.disabled:hover.active,
160 | .datepicker table tr td.today.disabled,
161 | .datepicker table tr td.today:hover.disabled,
162 | .datepicker table tr td.today.disabled.disabled,
163 | .datepicker table tr td.today.disabled:hover.disabled,
164 | .datepicker table tr td.today[disabled],
165 | .datepicker table tr td.today:hover[disabled],
166 | .datepicker table tr td.today.disabled[disabled],
167 | .datepicker table tr td.today.disabled:hover[disabled] {
168 | background-color: #fdf59a;
169 | }
170 | .datepicker table tr td.today:active,
171 | .datepicker table tr td.today:hover:active,
172 | .datepicker table tr td.today.disabled:active,
173 | .datepicker table tr td.today.disabled:hover:active,
174 | .datepicker table tr td.today.active,
175 | .datepicker table tr td.today:hover.active,
176 | .datepicker table tr td.today.disabled.active,
177 | .datepicker table tr td.today.disabled:hover.active {
178 | background-color: #fbf069 \9;
179 | }
180 | .datepicker table tr td.today:hover:hover {
181 | color: #000;
182 | }
183 | .datepicker table tr td.today.active:hover {
184 | color: #fff;
185 | }
186 | .datepicker table tr td.range,
187 | .datepicker table tr td.range:hover,
188 | .datepicker table tr td.range.disabled,
189 | .datepicker table tr td.range.disabled:hover {
190 | background: #eeeeee;
191 | -webkit-border-radius: 0;
192 | -moz-border-radius: 0;
193 | border-radius: 0;
194 | }
195 | .datepicker table tr td.range.today,
196 | .datepicker table tr td.range.today:hover,
197 | .datepicker table tr td.range.today.disabled,
198 | .datepicker table tr td.range.today.disabled:hover {
199 | background-color: #f3d17a;
200 | background-image: -moz-linear-gradient(top, #f3c17a, #f3e97a);
201 | background-image: -ms-linear-gradient(top, #f3c17a, #f3e97a);
202 | background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f3c17a), to(#f3e97a));
203 | background-image: -webkit-linear-gradient(top, #f3c17a, #f3e97a);
204 | background-image: -o-linear-gradient(top, #f3c17a, #f3e97a);
205 | background-image: linear-gradient(top, #f3c17a, #f3e97a);
206 | background-repeat: repeat-x;
207 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3c17a', endColorstr='#f3e97a', GradientType=0);
208 | border-color: #f3e97a #f3e97a #edde34;
209 | border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
210 | filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
211 | -webkit-border-radius: 0;
212 | -moz-border-radius: 0;
213 | border-radius: 0;
214 | }
215 | .datepicker table tr td.range.today:hover,
216 | .datepicker table tr td.range.today:hover:hover,
217 | .datepicker table tr td.range.today.disabled:hover,
218 | .datepicker table tr td.range.today.disabled:hover:hover,
219 | .datepicker table tr td.range.today:active,
220 | .datepicker table tr td.range.today:hover:active,
221 | .datepicker table tr td.range.today.disabled:active,
222 | .datepicker table tr td.range.today.disabled:hover:active,
223 | .datepicker table tr td.range.today.active,
224 | .datepicker table tr td.range.today:hover.active,
225 | .datepicker table tr td.range.today.disabled.active,
226 | .datepicker table tr td.range.today.disabled:hover.active,
227 | .datepicker table tr td.range.today.disabled,
228 | .datepicker table tr td.range.today:hover.disabled,
229 | .datepicker table tr td.range.today.disabled.disabled,
230 | .datepicker table tr td.range.today.disabled:hover.disabled,
231 | .datepicker table tr td.range.today[disabled],
232 | .datepicker table tr td.range.today:hover[disabled],
233 | .datepicker table tr td.range.today.disabled[disabled],
234 | .datepicker table tr td.range.today.disabled:hover[disabled] {
235 | background-color: #f3e97a;
236 | }
237 | .datepicker table tr td.range.today:active,
238 | .datepicker table tr td.range.today:hover:active,
239 | .datepicker table tr td.range.today.disabled:active,
240 | .datepicker table tr td.range.today.disabled:hover:active,
241 | .datepicker table tr td.range.today.active,
242 | .datepicker table tr td.range.today:hover.active,
243 | .datepicker table tr td.range.today.disabled.active,
244 | .datepicker table tr td.range.today.disabled:hover.active {
245 | background-color: #efe24b \9;
246 | }
247 | .datepicker table tr td.selected,
248 | .datepicker table tr td.selected:hover,
249 | .datepicker table tr td.selected.disabled,
250 | .datepicker table tr td.selected.disabled:hover {
251 | background-color: #9e9e9e;
252 | background-image: -moz-linear-gradient(top, #b3b3b3, #808080);
253 | background-image: -ms-linear-gradient(top, #b3b3b3, #808080);
254 | background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b3b3b3), to(#808080));
255 | background-image: -webkit-linear-gradient(top, #b3b3b3, #808080);
256 | background-image: -o-linear-gradient(top, #b3b3b3, #808080);
257 | background-image: linear-gradient(top, #b3b3b3, #808080);
258 | background-repeat: repeat-x;
259 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3b3b3', endColorstr='#808080', GradientType=0);
260 | border-color: #808080 #808080 #595959;
261 | border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
262 | filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
263 | color: #fff;
264 | text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
265 | }
266 | .datepicker table tr td.selected:hover,
267 | .datepicker table tr td.selected:hover:hover,
268 | .datepicker table tr td.selected.disabled:hover,
269 | .datepicker table tr td.selected.disabled:hover:hover,
270 | .datepicker table tr td.selected:active,
271 | .datepicker table tr td.selected:hover:active,
272 | .datepicker table tr td.selected.disabled:active,
273 | .datepicker table tr td.selected.disabled:hover:active,
274 | .datepicker table tr td.selected.active,
275 | .datepicker table tr td.selected:hover.active,
276 | .datepicker table tr td.selected.disabled.active,
277 | .datepicker table tr td.selected.disabled:hover.active,
278 | .datepicker table tr td.selected.disabled,
279 | .datepicker table tr td.selected:hover.disabled,
280 | .datepicker table tr td.selected.disabled.disabled,
281 | .datepicker table tr td.selected.disabled:hover.disabled,
282 | .datepicker table tr td.selected[disabled],
283 | .datepicker table tr td.selected:hover[disabled],
284 | .datepicker table tr td.selected.disabled[disabled],
285 | .datepicker table tr td.selected.disabled:hover[disabled] {
286 | background-color: #808080;
287 | }
288 | .datepicker table tr td.selected:active,
289 | .datepicker table tr td.selected:hover:active,
290 | .datepicker table tr td.selected.disabled:active,
291 | .datepicker table tr td.selected.disabled:hover:active,
292 | .datepicker table tr td.selected.active,
293 | .datepicker table tr td.selected:hover.active,
294 | .datepicker table tr td.selected.disabled.active,
295 | .datepicker table tr td.selected.disabled:hover.active {
296 | background-color: #666666 \9;
297 | }
298 | .datepicker table tr td.active,
299 | .datepicker table tr td.active:hover,
300 | .datepicker table tr td.active.disabled,
301 | .datepicker table tr td.active.disabled:hover {
302 | background-color: #006dcc;
303 | background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
304 | background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
305 | background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
306 | background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
307 | background-image: -o-linear-gradient(top, #0088cc, #0044cc);
308 | background-image: linear-gradient(top, #0088cc, #0044cc);
309 | background-repeat: repeat-x;
310 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
311 | border-color: #0044cc #0044cc #002a80;
312 | border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
313 | filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
314 | color: #fff;
315 | text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
316 | }
317 | .datepicker table tr td.active:hover,
318 | .datepicker table tr td.active:hover:hover,
319 | .datepicker table tr td.active.disabled:hover,
320 | .datepicker table tr td.active.disabled:hover:hover,
321 | .datepicker table tr td.active:active,
322 | .datepicker table tr td.active:hover:active,
323 | .datepicker table tr td.active.disabled:active,
324 | .datepicker table tr td.active.disabled:hover:active,
325 | .datepicker table tr td.active.active,
326 | .datepicker table tr td.active:hover.active,
327 | .datepicker table tr td.active.disabled.active,
328 | .datepicker table tr td.active.disabled:hover.active,
329 | .datepicker table tr td.active.disabled,
330 | .datepicker table tr td.active:hover.disabled,
331 | .datepicker table tr td.active.disabled.disabled,
332 | .datepicker table tr td.active.disabled:hover.disabled,
333 | .datepicker table tr td.active[disabled],
334 | .datepicker table tr td.active:hover[disabled],
335 | .datepicker table tr td.active.disabled[disabled],
336 | .datepicker table tr td.active.disabled:hover[disabled] {
337 | background-color: #0044cc;
338 | }
339 | .datepicker table tr td.active:active,
340 | .datepicker table tr td.active:hover:active,
341 | .datepicker table tr td.active.disabled:active,
342 | .datepicker table tr td.active.disabled:hover:active,
343 | .datepicker table tr td.active.active,
344 | .datepicker table tr td.active:hover.active,
345 | .datepicker table tr td.active.disabled.active,
346 | .datepicker table tr td.active.disabled:hover.active {
347 | background-color: #003399 \9;
348 | }
349 | .datepicker table tr td span {
350 | display: block;
351 | width: 23%;
352 | height: 54px;
353 | line-height: 54px;
354 | float: left;
355 | margin: 1%;
356 | cursor: pointer;
357 | -webkit-border-radius: 4px;
358 | -moz-border-radius: 4px;
359 | border-radius: 4px;
360 | }
361 | .datepicker table tr td span:hover {
362 | background: #eeeeee;
363 | }
364 | .datepicker table tr td span.disabled,
365 | .datepicker table tr td span.disabled:hover {
366 | background: none;
367 | color: #999999;
368 | cursor: default;
369 | }
370 | .datepicker table tr td span.active,
371 | .datepicker table tr td span.active:hover,
372 | .datepicker table tr td span.active.disabled,
373 | .datepicker table tr td span.active.disabled:hover {
374 | background-color: #006dcc;
375 | background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
376 | background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
377 | background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
378 | background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
379 | background-image: -o-linear-gradient(top, #0088cc, #0044cc);
380 | background-image: linear-gradient(top, #0088cc, #0044cc);
381 | background-repeat: repeat-x;
382 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
383 | border-color: #0044cc #0044cc #002a80;
384 | border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
385 | filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
386 | color: #fff;
387 | text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
388 | }
389 | .datepicker table tr td span.active:hover,
390 | .datepicker table tr td span.active:hover:hover,
391 | .datepicker table tr td span.active.disabled:hover,
392 | .datepicker table tr td span.active.disabled:hover:hover,
393 | .datepicker table tr td span.active:active,
394 | .datepicker table tr td span.active:hover:active,
395 | .datepicker table tr td span.active.disabled:active,
396 | .datepicker table tr td span.active.disabled:hover:active,
397 | .datepicker table tr td span.active.active,
398 | .datepicker table tr td span.active:hover.active,
399 | .datepicker table tr td span.active.disabled.active,
400 | .datepicker table tr td span.active.disabled:hover.active,
401 | .datepicker table tr td span.active.disabled,
402 | .datepicker table tr td span.active:hover.disabled,
403 | .datepicker table tr td span.active.disabled.disabled,
404 | .datepicker table tr td span.active.disabled:hover.disabled,
405 | .datepicker table tr td span.active[disabled],
406 | .datepicker table tr td span.active:hover[disabled],
407 | .datepicker table tr td span.active.disabled[disabled],
408 | .datepicker table tr td span.active.disabled:hover[disabled] {
409 | background-color: #0044cc;
410 | }
411 | .datepicker table tr td span.active:active,
412 | .datepicker table tr td span.active:hover:active,
413 | .datepicker table tr td span.active.disabled:active,
414 | .datepicker table tr td span.active.disabled:hover:active,
415 | .datepicker table tr td span.active.active,
416 | .datepicker table tr td span.active:hover.active,
417 | .datepicker table tr td span.active.disabled.active,
418 | .datepicker table tr td span.active.disabled:hover.active {
419 | background-color: #003399 \9;
420 | }
421 | .datepicker table tr td span.old,
422 | .datepicker table tr td span.new {
423 | color: #999999;
424 | }
425 | .datepicker th.datepicker-switch {
426 | width: 145px;
427 | }
428 | .datepicker thead tr:first-child th,
429 | .datepicker tfoot tr th {
430 | cursor: pointer;
431 | }
432 | .datepicker thead tr:first-child th:hover,
433 | .datepicker tfoot tr th:hover {
434 | background: #eeeeee;
435 | }
436 | .datepicker .cw {
437 | font-size: 10px;
438 | width: 12px;
439 | padding: 0 2px 0 5px;
440 | vertical-align: middle;
441 | }
442 | .datepicker thead tr:first-child th.cw {
443 | cursor: default;
444 | background-color: transparent;
445 | }
446 | .input-append.date .add-on i,
447 | .input-prepend.date .add-on i {
448 | display: block;
449 | cursor: pointer;
450 | width: 16px;
451 | height: 16px;
452 | }
453 | .input-daterange input {
454 | text-align: center;
455 | }
456 | .input-daterange input:first-child {
457 | -webkit-border-radius: 3px 0 0 3px;
458 | -moz-border-radius: 3px 0 0 3px;
459 | border-radius: 3px 0 0 3px;
460 | }
461 | .input-daterange input:last-child {
462 | -webkit-border-radius: 0 3px 3px 0;
463 | -moz-border-radius: 0 3px 3px 0;
464 | border-radius: 0 3px 3px 0;
465 | }
466 | .input-daterange .add-on {
467 | display: inline-block;
468 | width: auto;
469 | min-width: 16px;
470 | height: 18px;
471 | padding: 4px 5px;
472 | font-weight: normal;
473 | line-height: 18px;
474 | text-align: center;
475 | text-shadow: 0 1px 0 #ffffff;
476 | vertical-align: middle;
477 | background-color: #eeeeee;
478 | border: 1px solid #ccc;
479 | margin-left: -5px;
480 | margin-right: -5px;
481 | }
482 |
--------------------------------------------------------------------------------
/example/bootstrap/css/bootstrap-responsive.css:
--------------------------------------------------------------------------------
1 | /*!
2 | * Bootstrap Responsive v2.3.2
3 | *
4 | * Copyright 2012 Twitter, Inc
5 | * Licensed under the Apache License v2.0
6 | * http://www.apache.org/licenses/LICENSE-2.0
7 | *
8 | * Designed and built with all the love in the world @twitter by @mdo and @fat.
9 | */
10 |
11 | .clearfix {
12 | *zoom: 1;
13 | }
14 |
15 | .clearfix:before,
16 | .clearfix:after {
17 | display: table;
18 | line-height: 0;
19 | content: "";
20 | }
21 |
22 | .clearfix:after {
23 | clear: both;
24 | }
25 |
26 | .hide-text {
27 | font: 0/0 a;
28 | color: transparent;
29 | text-shadow: none;
30 | background-color: transparent;
31 | border: 0;
32 | }
33 |
34 | .input-block-level {
35 | display: block;
36 | width: 100%;
37 | min-height: 30px;
38 | -webkit-box-sizing: border-box;
39 | -moz-box-sizing: border-box;
40 | box-sizing: border-box;
41 | }
42 |
43 | @-ms-viewport {
44 | width: device-width;
45 | }
46 |
47 | .hidden {
48 | display: none;
49 | visibility: hidden;
50 | }
51 |
52 | .visible-phone {
53 | display: none !important;
54 | }
55 |
56 | .visible-tablet {
57 | display: none !important;
58 | }
59 |
60 | .hidden-desktop {
61 | display: none !important;
62 | }
63 |
64 | .visible-desktop {
65 | display: inherit !important;
66 | }
67 |
68 | @media (min-width: 768px) and (max-width: 979px) {
69 | .hidden-desktop {
70 | display: inherit !important;
71 | }
72 | .visible-desktop {
73 | display: none !important ;
74 | }
75 | .visible-tablet {
76 | display: inherit !important;
77 | }
78 | .hidden-tablet {
79 | display: none !important;
80 | }
81 | }
82 |
83 | @media (max-width: 767px) {
84 | .hidden-desktop {
85 | display: inherit !important;
86 | }
87 | .visible-desktop {
88 | display: none !important;
89 | }
90 | .visible-phone {
91 | display: inherit !important;
92 | }
93 | .hidden-phone {
94 | display: none !important;
95 | }
96 | }
97 |
98 | .visible-print {
99 | display: none !important;
100 | }
101 |
102 | @media print {
103 | .visible-print {
104 | display: inherit !important;
105 | }
106 | .hidden-print {
107 | display: none !important;
108 | }
109 | }
110 |
111 | @media (min-width: 1200px) {
112 | .row {
113 | margin-left: -30px;
114 | *zoom: 1;
115 | }
116 | .row:before,
117 | .row:after {
118 | display: table;
119 | line-height: 0;
120 | content: "";
121 | }
122 | .row:after {
123 | clear: both;
124 | }
125 | [class*="span"] {
126 | float: left;
127 | min-height: 1px;
128 | margin-left: 30px;
129 | }
130 | .container,
131 | .navbar-static-top .container,
132 | .navbar-fixed-top .container,
133 | .navbar-fixed-bottom .container {
134 | width: 1170px;
135 | }
136 | .span12 {
137 | width: 1170px;
138 | }
139 | .span11 {
140 | width: 1070px;
141 | }
142 | .span10 {
143 | width: 970px;
144 | }
145 | .span9 {
146 | width: 870px;
147 | }
148 | .span8 {
149 | width: 770px;
150 | }
151 | .span7 {
152 | width: 670px;
153 | }
154 | .span6 {
155 | width: 570px;
156 | }
157 | .span5 {
158 | width: 470px;
159 | }
160 | .span4 {
161 | width: 370px;
162 | }
163 | .span3 {
164 | width: 270px;
165 | }
166 | .span2 {
167 | width: 170px;
168 | }
169 | .span1 {
170 | width: 70px;
171 | }
172 | .offset12 {
173 | margin-left: 1230px;
174 | }
175 | .offset11 {
176 | margin-left: 1130px;
177 | }
178 | .offset10 {
179 | margin-left: 1030px;
180 | }
181 | .offset9 {
182 | margin-left: 930px;
183 | }
184 | .offset8 {
185 | margin-left: 830px;
186 | }
187 | .offset7 {
188 | margin-left: 730px;
189 | }
190 | .offset6 {
191 | margin-left: 630px;
192 | }
193 | .offset5 {
194 | margin-left: 530px;
195 | }
196 | .offset4 {
197 | margin-left: 430px;
198 | }
199 | .offset3 {
200 | margin-left: 330px;
201 | }
202 | .offset2 {
203 | margin-left: 230px;
204 | }
205 | .offset1 {
206 | margin-left: 130px;
207 | }
208 | .row-fluid {
209 | width: 100%;
210 | *zoom: 1;
211 | }
212 | .row-fluid:before,
213 | .row-fluid:after {
214 | display: table;
215 | line-height: 0;
216 | content: "";
217 | }
218 | .row-fluid:after {
219 | clear: both;
220 | }
221 | .row-fluid [class*="span"] {
222 | display: block;
223 | float: left;
224 | width: 100%;
225 | min-height: 30px;
226 | margin-left: 2.564102564102564%;
227 | *margin-left: 2.5109110747408616%;
228 | -webkit-box-sizing: border-box;
229 | -moz-box-sizing: border-box;
230 | box-sizing: border-box;
231 | }
232 | .row-fluid [class*="span"]:first-child {
233 | margin-left: 0;
234 | }
235 | .row-fluid .controls-row [class*="span"] + [class*="span"] {
236 | margin-left: 2.564102564102564%;
237 | }
238 | .row-fluid .span12 {
239 | width: 100%;
240 | *width: 99.94680851063829%;
241 | }
242 | .row-fluid .span11 {
243 | width: 91.45299145299145%;
244 | *width: 91.39979996362975%;
245 | }
246 | .row-fluid .span10 {
247 | width: 82.90598290598291%;
248 | *width: 82.8527914166212%;
249 | }
250 | .row-fluid .span9 {
251 | width: 74.35897435897436%;
252 | *width: 74.30578286961266%;
253 | }
254 | .row-fluid .span8 {
255 | width: 65.81196581196582%;
256 | *width: 65.75877432260411%;
257 | }
258 | .row-fluid .span7 {
259 | width: 57.26495726495726%;
260 | *width: 57.21176577559556%;
261 | }
262 | .row-fluid .span6 {
263 | width: 48.717948717948715%;
264 | *width: 48.664757228587014%;
265 | }
266 | .row-fluid .span5 {
267 | width: 40.17094017094017%;
268 | *width: 40.11774868157847%;
269 | }
270 | .row-fluid .span4 {
271 | width: 31.623931623931625%;
272 | *width: 31.570740134569924%;
273 | }
274 | .row-fluid .span3 {
275 | width: 23.076923076923077%;
276 | *width: 23.023731587561375%;
277 | }
278 | .row-fluid .span2 {
279 | width: 14.52991452991453%;
280 | *width: 14.476723040552828%;
281 | }
282 | .row-fluid .span1 {
283 | width: 5.982905982905983%;
284 | *width: 5.929714493544281%;
285 | }
286 | .row-fluid .offset12 {
287 | margin-left: 105.12820512820512%;
288 | *margin-left: 105.02182214948171%;
289 | }
290 | .row-fluid .offset12:first-child {
291 | margin-left: 102.56410256410257%;
292 | *margin-left: 102.45771958537915%;
293 | }
294 | .row-fluid .offset11 {
295 | margin-left: 96.58119658119658%;
296 | *margin-left: 96.47481360247316%;
297 | }
298 | .row-fluid .offset11:first-child {
299 | margin-left: 94.01709401709402%;
300 | *margin-left: 93.91071103837061%;
301 | }
302 | .row-fluid .offset10 {
303 | margin-left: 88.03418803418803%;
304 | *margin-left: 87.92780505546462%;
305 | }
306 | .row-fluid .offset10:first-child {
307 | margin-left: 85.47008547008548%;
308 | *margin-left: 85.36370249136206%;
309 | }
310 | .row-fluid .offset9 {
311 | margin-left: 79.48717948717949%;
312 | *margin-left: 79.38079650845607%;
313 | }
314 | .row-fluid .offset9:first-child {
315 | margin-left: 76.92307692307693%;
316 | *margin-left: 76.81669394435352%;
317 | }
318 | .row-fluid .offset8 {
319 | margin-left: 70.94017094017094%;
320 | *margin-left: 70.83378796144753%;
321 | }
322 | .row-fluid .offset8:first-child {
323 | margin-left: 68.37606837606839%;
324 | *margin-left: 68.26968539734497%;
325 | }
326 | .row-fluid .offset7 {
327 | margin-left: 62.393162393162385%;
328 | *margin-left: 62.28677941443899%;
329 | }
330 | .row-fluid .offset7:first-child {
331 | margin-left: 59.82905982905982%;
332 | *margin-left: 59.72267685033642%;
333 | }
334 | .row-fluid .offset6 {
335 | margin-left: 53.84615384615384%;
336 | *margin-left: 53.739770867430444%;
337 | }
338 | .row-fluid .offset6:first-child {
339 | margin-left: 51.28205128205128%;
340 | *margin-left: 51.175668303327875%;
341 | }
342 | .row-fluid .offset5 {
343 | margin-left: 45.299145299145295%;
344 | *margin-left: 45.1927623204219%;
345 | }
346 | .row-fluid .offset5:first-child {
347 | margin-left: 42.73504273504273%;
348 | *margin-left: 42.62865975631933%;
349 | }
350 | .row-fluid .offset4 {
351 | margin-left: 36.75213675213675%;
352 | *margin-left: 36.645753773413354%;
353 | }
354 | .row-fluid .offset4:first-child {
355 | margin-left: 34.18803418803419%;
356 | *margin-left: 34.081651209310785%;
357 | }
358 | .row-fluid .offset3 {
359 | margin-left: 28.205128205128204%;
360 | *margin-left: 28.0987452264048%;
361 | }
362 | .row-fluid .offset3:first-child {
363 | margin-left: 25.641025641025642%;
364 | *margin-left: 25.53464266230224%;
365 | }
366 | .row-fluid .offset2 {
367 | margin-left: 19.65811965811966%;
368 | *margin-left: 19.551736679396257%;
369 | }
370 | .row-fluid .offset2:first-child {
371 | margin-left: 17.094017094017094%;
372 | *margin-left: 16.98763411529369%;
373 | }
374 | .row-fluid .offset1 {
375 | margin-left: 11.11111111111111%;
376 | *margin-left: 11.004728132387708%;
377 | }
378 | .row-fluid .offset1:first-child {
379 | margin-left: 8.547008547008547%;
380 | *margin-left: 8.440625568285142%;
381 | }
382 | input,
383 | textarea,
384 | .uneditable-input {
385 | margin-left: 0;
386 | }
387 | .controls-row [class*="span"] + [class*="span"] {
388 | margin-left: 30px;
389 | }
390 | input.span12,
391 | textarea.span12,
392 | .uneditable-input.span12 {
393 | width: 1156px;
394 | }
395 | input.span11,
396 | textarea.span11,
397 | .uneditable-input.span11 {
398 | width: 1056px;
399 | }
400 | input.span10,
401 | textarea.span10,
402 | .uneditable-input.span10 {
403 | width: 956px;
404 | }
405 | input.span9,
406 | textarea.span9,
407 | .uneditable-input.span9 {
408 | width: 856px;
409 | }
410 | input.span8,
411 | textarea.span8,
412 | .uneditable-input.span8 {
413 | width: 756px;
414 | }
415 | input.span7,
416 | textarea.span7,
417 | .uneditable-input.span7 {
418 | width: 656px;
419 | }
420 | input.span6,
421 | textarea.span6,
422 | .uneditable-input.span6 {
423 | width: 556px;
424 | }
425 | input.span5,
426 | textarea.span5,
427 | .uneditable-input.span5 {
428 | width: 456px;
429 | }
430 | input.span4,
431 | textarea.span4,
432 | .uneditable-input.span4 {
433 | width: 356px;
434 | }
435 | input.span3,
436 | textarea.span3,
437 | .uneditable-input.span3 {
438 | width: 256px;
439 | }
440 | input.span2,
441 | textarea.span2,
442 | .uneditable-input.span2 {
443 | width: 156px;
444 | }
445 | input.span1,
446 | textarea.span1,
447 | .uneditable-input.span1 {
448 | width: 56px;
449 | }
450 | .thumbnails {
451 | margin-left: -30px;
452 | }
453 | .thumbnails > li {
454 | margin-left: 30px;
455 | }
456 | .row-fluid .thumbnails {
457 | margin-left: 0;
458 | }
459 | }
460 |
461 | @media (min-width: 768px) and (max-width: 979px) {
462 | .row {
463 | margin-left: -20px;
464 | *zoom: 1;
465 | }
466 | .row:before,
467 | .row:after {
468 | display: table;
469 | line-height: 0;
470 | content: "";
471 | }
472 | .row:after {
473 | clear: both;
474 | }
475 | [class*="span"] {
476 | float: left;
477 | min-height: 1px;
478 | margin-left: 20px;
479 | }
480 | .container,
481 | .navbar-static-top .container,
482 | .navbar-fixed-top .container,
483 | .navbar-fixed-bottom .container {
484 | width: 724px;
485 | }
486 | .span12 {
487 | width: 724px;
488 | }
489 | .span11 {
490 | width: 662px;
491 | }
492 | .span10 {
493 | width: 600px;
494 | }
495 | .span9 {
496 | width: 538px;
497 | }
498 | .span8 {
499 | width: 476px;
500 | }
501 | .span7 {
502 | width: 414px;
503 | }
504 | .span6 {
505 | width: 352px;
506 | }
507 | .span5 {
508 | width: 290px;
509 | }
510 | .span4 {
511 | width: 228px;
512 | }
513 | .span3 {
514 | width: 166px;
515 | }
516 | .span2 {
517 | width: 104px;
518 | }
519 | .span1 {
520 | width: 42px;
521 | }
522 | .offset12 {
523 | margin-left: 764px;
524 | }
525 | .offset11 {
526 | margin-left: 702px;
527 | }
528 | .offset10 {
529 | margin-left: 640px;
530 | }
531 | .offset9 {
532 | margin-left: 578px;
533 | }
534 | .offset8 {
535 | margin-left: 516px;
536 | }
537 | .offset7 {
538 | margin-left: 454px;
539 | }
540 | .offset6 {
541 | margin-left: 392px;
542 | }
543 | .offset5 {
544 | margin-left: 330px;
545 | }
546 | .offset4 {
547 | margin-left: 268px;
548 | }
549 | .offset3 {
550 | margin-left: 206px;
551 | }
552 | .offset2 {
553 | margin-left: 144px;
554 | }
555 | .offset1 {
556 | margin-left: 82px;
557 | }
558 | .row-fluid {
559 | width: 100%;
560 | *zoom: 1;
561 | }
562 | .row-fluid:before,
563 | .row-fluid:after {
564 | display: table;
565 | line-height: 0;
566 | content: "";
567 | }
568 | .row-fluid:after {
569 | clear: both;
570 | }
571 | .row-fluid [class*="span"] {
572 | display: block;
573 | float: left;
574 | width: 100%;
575 | min-height: 30px;
576 | margin-left: 2.7624309392265194%;
577 | *margin-left: 2.709239449864817%;
578 | -webkit-box-sizing: border-box;
579 | -moz-box-sizing: border-box;
580 | box-sizing: border-box;
581 | }
582 | .row-fluid [class*="span"]:first-child {
583 | margin-left: 0;
584 | }
585 | .row-fluid .controls-row [class*="span"] + [class*="span"] {
586 | margin-left: 2.7624309392265194%;
587 | }
588 | .row-fluid .span12 {
589 | width: 100%;
590 | *width: 99.94680851063829%;
591 | }
592 | .row-fluid .span11 {
593 | width: 91.43646408839778%;
594 | *width: 91.38327259903608%;
595 | }
596 | .row-fluid .span10 {
597 | width: 82.87292817679558%;
598 | *width: 82.81973668743387%;
599 | }
600 | .row-fluid .span9 {
601 | width: 74.30939226519337%;
602 | *width: 74.25620077583166%;
603 | }
604 | .row-fluid .span8 {
605 | width: 65.74585635359117%;
606 | *width: 65.69266486422946%;
607 | }
608 | .row-fluid .span7 {
609 | width: 57.18232044198895%;
610 | *width: 57.12912895262725%;
611 | }
612 | .row-fluid .span6 {
613 | width: 48.61878453038674%;
614 | *width: 48.56559304102504%;
615 | }
616 | .row-fluid .span5 {
617 | width: 40.05524861878453%;
618 | *width: 40.00205712942283%;
619 | }
620 | .row-fluid .span4 {
621 | width: 31.491712707182323%;
622 | *width: 31.43852121782062%;
623 | }
624 | .row-fluid .span3 {
625 | width: 22.92817679558011%;
626 | *width: 22.87498530621841%;
627 | }
628 | .row-fluid .span2 {
629 | width: 14.3646408839779%;
630 | *width: 14.311449394616199%;
631 | }
632 | .row-fluid .span1 {
633 | width: 5.801104972375691%;
634 | *width: 5.747913483013988%;
635 | }
636 | .row-fluid .offset12 {
637 | margin-left: 105.52486187845304%;
638 | *margin-left: 105.41847889972962%;
639 | }
640 | .row-fluid .offset12:first-child {
641 | margin-left: 102.76243093922652%;
642 | *margin-left: 102.6560479605031%;
643 | }
644 | .row-fluid .offset11 {
645 | margin-left: 96.96132596685082%;
646 | *margin-left: 96.8549429881274%;
647 | }
648 | .row-fluid .offset11:first-child {
649 | margin-left: 94.1988950276243%;
650 | *margin-left: 94.09251204890089%;
651 | }
652 | .row-fluid .offset10 {
653 | margin-left: 88.39779005524862%;
654 | *margin-left: 88.2914070765252%;
655 | }
656 | .row-fluid .offset10:first-child {
657 | margin-left: 85.6353591160221%;
658 | *margin-left: 85.52897613729868%;
659 | }
660 | .row-fluid .offset9 {
661 | margin-left: 79.8342541436464%;
662 | *margin-left: 79.72787116492299%;
663 | }
664 | .row-fluid .offset9:first-child {
665 | margin-left: 77.07182320441989%;
666 | *margin-left: 76.96544022569647%;
667 | }
668 | .row-fluid .offset8 {
669 | margin-left: 71.2707182320442%;
670 | *margin-left: 71.16433525332079%;
671 | }
672 | .row-fluid .offset8:first-child {
673 | margin-left: 68.50828729281768%;
674 | *margin-left: 68.40190431409427%;
675 | }
676 | .row-fluid .offset7 {
677 | margin-left: 62.70718232044199%;
678 | *margin-left: 62.600799341718584%;
679 | }
680 | .row-fluid .offset7:first-child {
681 | margin-left: 59.94475138121547%;
682 | *margin-left: 59.838368402492065%;
683 | }
684 | .row-fluid .offset6 {
685 | margin-left: 54.14364640883978%;
686 | *margin-left: 54.037263430116376%;
687 | }
688 | .row-fluid .offset6:first-child {
689 | margin-left: 51.38121546961326%;
690 | *margin-left: 51.27483249088986%;
691 | }
692 | .row-fluid .offset5 {
693 | margin-left: 45.58011049723757%;
694 | *margin-left: 45.47372751851417%;
695 | }
696 | .row-fluid .offset5:first-child {
697 | margin-left: 42.81767955801105%;
698 | *margin-left: 42.71129657928765%;
699 | }
700 | .row-fluid .offset4 {
701 | margin-left: 37.01657458563536%;
702 | *margin-left: 36.91019160691196%;
703 | }
704 | .row-fluid .offset4:first-child {
705 | margin-left: 34.25414364640884%;
706 | *margin-left: 34.14776066768544%;
707 | }
708 | .row-fluid .offset3 {
709 | margin-left: 28.45303867403315%;
710 | *margin-left: 28.346655695309746%;
711 | }
712 | .row-fluid .offset3:first-child {
713 | margin-left: 25.69060773480663%;
714 | *margin-left: 25.584224756083227%;
715 | }
716 | .row-fluid .offset2 {
717 | margin-left: 19.88950276243094%;
718 | *margin-left: 19.783119783707537%;
719 | }
720 | .row-fluid .offset2:first-child {
721 | margin-left: 17.12707182320442%;
722 | *margin-left: 17.02068884448102%;
723 | }
724 | .row-fluid .offset1 {
725 | margin-left: 11.32596685082873%;
726 | *margin-left: 11.219583872105325%;
727 | }
728 | .row-fluid .offset1:first-child {
729 | margin-left: 8.56353591160221%;
730 | *margin-left: 8.457152932878806%;
731 | }
732 | input,
733 | textarea,
734 | .uneditable-input {
735 | margin-left: 0;
736 | }
737 | .controls-row [class*="span"] + [class*="span"] {
738 | margin-left: 20px;
739 | }
740 | input.span12,
741 | textarea.span12,
742 | .uneditable-input.span12 {
743 | width: 710px;
744 | }
745 | input.span11,
746 | textarea.span11,
747 | .uneditable-input.span11 {
748 | width: 648px;
749 | }
750 | input.span10,
751 | textarea.span10,
752 | .uneditable-input.span10 {
753 | width: 586px;
754 | }
755 | input.span9,
756 | textarea.span9,
757 | .uneditable-input.span9 {
758 | width: 524px;
759 | }
760 | input.span8,
761 | textarea.span8,
762 | .uneditable-input.span8 {
763 | width: 462px;
764 | }
765 | input.span7,
766 | textarea.span7,
767 | .uneditable-input.span7 {
768 | width: 400px;
769 | }
770 | input.span6,
771 | textarea.span6,
772 | .uneditable-input.span6 {
773 | width: 338px;
774 | }
775 | input.span5,
776 | textarea.span5,
777 | .uneditable-input.span5 {
778 | width: 276px;
779 | }
780 | input.span4,
781 | textarea.span4,
782 | .uneditable-input.span4 {
783 | width: 214px;
784 | }
785 | input.span3,
786 | textarea.span3,
787 | .uneditable-input.span3 {
788 | width: 152px;
789 | }
790 | input.span2,
791 | textarea.span2,
792 | .uneditable-input.span2 {
793 | width: 90px;
794 | }
795 | input.span1,
796 | textarea.span1,
797 | .uneditable-input.span1 {
798 | width: 28px;
799 | }
800 | }
801 |
802 | @media (max-width: 767px) {
803 | body {
804 | padding-right: 20px;
805 | padding-left: 20px;
806 | }
807 | .navbar-fixed-top,
808 | .navbar-fixed-bottom,
809 | .navbar-static-top {
810 | margin-right: -20px;
811 | margin-left: -20px;
812 | }
813 | .container-fluid {
814 | padding: 0;
815 | }
816 | .dl-horizontal dt {
817 | float: none;
818 | width: auto;
819 | clear: none;
820 | text-align: left;
821 | }
822 | .dl-horizontal dd {
823 | margin-left: 0;
824 | }
825 | .container {
826 | width: auto;
827 | }
828 | .row-fluid {
829 | width: 100%;
830 | }
831 | .row,
832 | .thumbnails {
833 | margin-left: 0;
834 | }
835 | .thumbnails > li {
836 | float: none;
837 | margin-left: 0;
838 | }
839 | [class*="span"],
840 | .uneditable-input[class*="span"],
841 | .row-fluid [class*="span"] {
842 | display: block;
843 | float: none;
844 | width: 100%;
845 | margin-left: 0;
846 | -webkit-box-sizing: border-box;
847 | -moz-box-sizing: border-box;
848 | box-sizing: border-box;
849 | }
850 | .span12,
851 | .row-fluid .span12 {
852 | width: 100%;
853 | -webkit-box-sizing: border-box;
854 | -moz-box-sizing: border-box;
855 | box-sizing: border-box;
856 | }
857 | .row-fluid [class*="offset"]:first-child {
858 | margin-left: 0;
859 | }
860 | .input-large,
861 | .input-xlarge,
862 | .input-xxlarge,
863 | input[class*="span"],
864 | select[class*="span"],
865 | textarea[class*="span"],
866 | .uneditable-input {
867 | display: block;
868 | width: 100%;
869 | min-height: 30px;
870 | -webkit-box-sizing: border-box;
871 | -moz-box-sizing: border-box;
872 | box-sizing: border-box;
873 | }
874 | .input-prepend input,
875 | .input-append input,
876 | .input-prepend input[class*="span"],
877 | .input-append input[class*="span"] {
878 | display: inline-block;
879 | width: auto;
880 | }
881 | .controls-row [class*="span"] + [class*="span"] {
882 | margin-left: 0;
883 | }
884 | .modal {
885 | position: fixed;
886 | top: 20px;
887 | right: 20px;
888 | left: 20px;
889 | width: auto;
890 | margin: 0;
891 | }
892 | .modal.fade {
893 | top: -100px;
894 | }
895 | .modal.fade.in {
896 | top: 20px;
897 | }
898 | }
899 |
900 | @media (max-width: 480px) {
901 | .nav-collapse {
902 | -webkit-transform: translate3d(0, 0, 0);
903 | }
904 | .page-header h1 small {
905 | display: block;
906 | line-height: 20px;
907 | }
908 | input[type="checkbox"],
909 | input[type="radio"] {
910 | border: 1px solid #ccc;
911 | }
912 | .form-horizontal .control-label {
913 | float: none;
914 | width: auto;
915 | padding-top: 0;
916 | text-align: left;
917 | }
918 | .form-horizontal .controls {
919 | margin-left: 0;
920 | }
921 | .form-horizontal .control-list {
922 | padding-top: 0;
923 | }
924 | .form-horizontal .form-actions {
925 | padding-right: 10px;
926 | padding-left: 10px;
927 | }
928 | .media .pull-left,
929 | .media .pull-right {
930 | display: block;
931 | float: none;
932 | margin-bottom: 10px;
933 | }
934 | .media-object {
935 | margin-right: 0;
936 | margin-left: 0;
937 | }
938 | .modal {
939 | top: 10px;
940 | right: 10px;
941 | left: 10px;
942 | }
943 | .modal-header .close {
944 | padding: 10px;
945 | margin: -10px;
946 | }
947 | .carousel-caption {
948 | position: static;
949 | }
950 | }
951 |
952 | @media (max-width: 979px) {
953 | body {
954 | padding-top: 0;
955 | }
956 | .navbar-fixed-top,
957 | .navbar-fixed-bottom {
958 | position: static;
959 | }
960 | .navbar-fixed-top {
961 | margin-bottom: 20px;
962 | }
963 | .navbar-fixed-bottom {
964 | margin-top: 20px;
965 | }
966 | .navbar-fixed-top .navbar-inner,
967 | .navbar-fixed-bottom .navbar-inner {
968 | padding: 5px;
969 | }
970 | .navbar .container {
971 | width: auto;
972 | padding: 0;
973 | }
974 | .navbar .brand {
975 | padding-right: 10px;
976 | padding-left: 10px;
977 | margin: 0 0 0 -5px;
978 | }
979 | .nav-collapse {
980 | clear: both;
981 | }
982 | .nav-collapse .nav {
983 | float: none;
984 | margin: 0 0 10px;
985 | }
986 | .nav-collapse .nav > li {
987 | float: none;
988 | }
989 | .nav-collapse .nav > li > a {
990 | margin-bottom: 2px;
991 | }
992 | .nav-collapse .nav > .divider-vertical {
993 | display: none;
994 | }
995 | .nav-collapse .nav .nav-header {
996 | color: #777777;
997 | text-shadow: none;
998 | }
999 | .nav-collapse .nav > li > a,
1000 | .nav-collapse .dropdown-menu a {
1001 | padding: 9px 15px;
1002 | font-weight: bold;
1003 | color: #777777;
1004 | -webkit-border-radius: 3px;
1005 | -moz-border-radius: 3px;
1006 | border-radius: 3px;
1007 | }
1008 | .nav-collapse .btn {
1009 | padding: 4px 10px 4px;
1010 | font-weight: normal;
1011 | -webkit-border-radius: 4px;
1012 | -moz-border-radius: 4px;
1013 | border-radius: 4px;
1014 | }
1015 | .nav-collapse .dropdown-menu li + li a {
1016 | margin-bottom: 2px;
1017 | }
1018 | .nav-collapse .nav > li > a:hover,
1019 | .nav-collapse .nav > li > a:focus,
1020 | .nav-collapse .dropdown-menu a:hover,
1021 | .nav-collapse .dropdown-menu a:focus {
1022 | background-color: #f2f2f2;
1023 | }
1024 | .navbar-inverse .nav-collapse .nav > li > a,
1025 | .navbar-inverse .nav-collapse .dropdown-menu a {
1026 | color: #999999;
1027 | }
1028 | .navbar-inverse .nav-collapse .nav > li > a:hover,
1029 | .navbar-inverse .nav-collapse .nav > li > a:focus,
1030 | .navbar-inverse .nav-collapse .dropdown-menu a:hover,
1031 | .navbar-inverse .nav-collapse .dropdown-menu a:focus {
1032 | background-color: #111111;
1033 | }
1034 | .nav-collapse.in .btn-group {
1035 | padding: 0;
1036 | margin-top: 5px;
1037 | }
1038 | .nav-collapse .dropdown-menu {
1039 | position: static;
1040 | top: auto;
1041 | left: auto;
1042 | display: none;
1043 | float: none;
1044 | max-width: none;
1045 | padding: 0;
1046 | margin: 0 15px;
1047 | background-color: transparent;
1048 | border: none;
1049 | -webkit-border-radius: 0;
1050 | -moz-border-radius: 0;
1051 | border-radius: 0;
1052 | -webkit-box-shadow: none;
1053 | -moz-box-shadow: none;
1054 | box-shadow: none;
1055 | }
1056 | .nav-collapse .open > .dropdown-menu {
1057 | display: block;
1058 | }
1059 | .nav-collapse .dropdown-menu:before,
1060 | .nav-collapse .dropdown-menu:after {
1061 | display: none;
1062 | }
1063 | .nav-collapse .dropdown-menu .divider {
1064 | display: none;
1065 | }
1066 | .nav-collapse .nav > li > .dropdown-menu:before,
1067 | .nav-collapse .nav > li > .dropdown-menu:after {
1068 | display: none;
1069 | }
1070 | .nav-collapse .navbar-form,
1071 | .nav-collapse .navbar-search {
1072 | float: none;
1073 | padding: 10px 15px;
1074 | margin: 10px 0;
1075 | border-top: 1px solid #f2f2f2;
1076 | border-bottom: 1px solid #f2f2f2;
1077 | -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
1078 | -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
1079 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
1080 | }
1081 | .navbar-inverse .nav-collapse .navbar-form,
1082 | .navbar-inverse .nav-collapse .navbar-search {
1083 | border-top-color: #111111;
1084 | border-bottom-color: #111111;
1085 | }
1086 | .navbar .nav-collapse .nav.pull-right {
1087 | float: none;
1088 | margin-left: 0;
1089 | }
1090 | .nav-collapse,
1091 | .nav-collapse.collapse {
1092 | height: 0;
1093 | overflow: hidden;
1094 | }
1095 | .navbar .btn-navbar {
1096 | display: block;
1097 | }
1098 | .navbar-static .navbar-inner {
1099 | padding-right: 10px;
1100 | padding-left: 10px;
1101 | }
1102 | }
1103 |
1104 | @media (min-width: 980px) {
1105 | .nav-collapse.collapse {
1106 | height: auto !important;
1107 | overflow: visible !important;
1108 | }
1109 | }
1110 |
--------------------------------------------------------------------------------
/example/bootstrap/css/docs.css:
--------------------------------------------------------------------------------
1 | /* Add additional stylesheets below
2 | -------------------------------------------------- */
3 | /*
4 | Bootstrap's documentation styles
5 | Special styles for presenting Bootstrap's documentation and examples
6 | */
7 |
8 |
9 |
10 | /* Body and structure
11 | -------------------------------------------------- */
12 |
13 | body {
14 | position: relative;
15 | padding-top: 40px;
16 | }
17 |
18 | /* Code in headings */
19 | h3 code {
20 | font-size: 14px;
21 | font-weight: normal;
22 | }
23 |
24 |
25 |
26 | /* Tweak navbar brand link to be super sleek
27 | -------------------------------------------------- */
28 |
29 | body > .navbar {
30 | font-size: 13px;
31 | }
32 |
33 | /* Change the docs' brand */
34 | body > .navbar .brand {
35 | padding-right: 0;
36 | padding-left: 0;
37 | margin-left: 20px;
38 | float: right;
39 | font-weight: bold;
40 | color: #000;
41 | text-shadow: 0 1px 0 rgba(255,255,255,.1), 0 0 30px rgba(255,255,255,.125);
42 | -webkit-transition: all .2s linear;
43 | -moz-transition: all .2s linear;
44 | transition: all .2s linear;
45 | }
46 | body > .navbar .brand:hover {
47 | text-decoration: none;
48 | text-shadow: 0 1px 0 rgba(255,255,255,.1), 0 0 30px rgba(255,255,255,.4);
49 | }
50 |
51 |
52 | /* Sections
53 | -------------------------------------------------- */
54 |
55 | /* padding for in-page bookmarks and fixed navbar */
56 | section {
57 | padding-top: 30px;
58 | }
59 | section > .page-header,
60 | section > .lead {
61 | color: #5a5a5a;
62 | }
63 | section > ul li {
64 | margin-bottom: 5px;
65 | }
66 |
67 | /* Separators (hr) */
68 | .bs-docs-separator {
69 | margin: 40px 0 39px;
70 | }
71 |
72 | /* Faded out hr */
73 | hr.soften {
74 | height: 1px;
75 | margin: 70px 0;
76 | background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0));
77 | background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0));
78 | background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0));
79 | background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0));
80 | border: 0;
81 | }
82 |
83 |
84 |
85 | /* Jumbotrons
86 | -------------------------------------------------- */
87 |
88 | /* Base class
89 | ------------------------- */
90 | .jumbotron {
91 | position: relative;
92 | padding: 40px 0;
93 | color: #fff;
94 | text-align: center;
95 | text-shadow: 0 1px 3px rgba(0,0,0,.4), 0 0 30px rgba(0,0,0,.075);
96 | background: #020031; /* Old browsers */
97 | background: -moz-linear-gradient(45deg, #020031 0%, #6d3353 100%); /* FF3.6+ */
98 | background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#020031), color-stop(100%,#6d3353)); /* Chrome,Safari4+ */
99 | background: -webkit-linear-gradient(45deg, #020031 0%,#6d3353 100%); /* Chrome10+,Safari5.1+ */
100 | background: -o-linear-gradient(45deg, #020031 0%,#6d3353 100%); /* Opera 11.10+ */
101 | background: -ms-linear-gradient(45deg, #020031 0%,#6d3353 100%); /* IE10+ */
102 | background: linear-gradient(45deg, #020031 0%,#6d3353 100%); /* W3C */
103 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#020031', endColorstr='#6d3353',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
104 | -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
105 | -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
106 | box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
107 | }
108 | .jumbotron h1 {
109 | font-size: 80px;
110 | font-weight: bold;
111 | letter-spacing: -1px;
112 | line-height: 1;
113 | }
114 | .jumbotron p {
115 | font-size: 24px;
116 | font-weight: 300;
117 | line-height: 1.25;
118 | margin-bottom: 30px;
119 | }
120 |
121 | /* Link styles (used on .masthead-links as well) */
122 | .jumbotron a {
123 | color: #fff;
124 | color: rgba(255,255,255,.5);
125 | -webkit-transition: all .2s ease-in-out;
126 | -moz-transition: all .2s ease-in-out;
127 | transition: all .2s ease-in-out;
128 | }
129 | .jumbotron a:hover {
130 | color: #fff;
131 | text-shadow: 0 0 10px rgba(255,255,255,.25);
132 | }
133 |
134 | /* Download button */
135 | .masthead .btn {
136 | padding: 19px 24px;
137 | font-size: 24px;
138 | font-weight: 200;
139 | color: #fff; /* redeclare to override the `.jumbotron a` */
140 | border: 0;
141 | -webkit-border-radius: 6px;
142 | -moz-border-radius: 6px;
143 | border-radius: 6px;
144 | -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
145 | -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
146 | box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
147 | -webkit-transition: none;
148 | -moz-transition: none;
149 | transition: none;
150 | }
151 | .masthead .btn:hover {
152 | -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
153 | -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
154 | box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
155 | }
156 | .masthead .btn:active {
157 | -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
158 | -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
159 | box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
160 | }
161 |
162 |
163 | /* Pattern overlay
164 | ------------------------- */
165 | .jumbotron .container {
166 | position: relative;
167 | z-index: 2;
168 | }
169 | .jumbotron:after {
170 | content: '';
171 | display: block;
172 | position: absolute;
173 | top: 0;
174 | right: 0;
175 | bottom: 0;
176 | left: 0;
177 | background: url(../img/bs-docs-masthead-pattern.png) repeat center center;
178 | opacity: .4;
179 | }
180 | @media
181 | only screen and (-webkit-min-device-pixel-ratio: 2),
182 | only screen and ( min--moz-device-pixel-ratio: 2),
183 | only screen and ( -o-min-device-pixel-ratio: 2/1) {
184 |
185 | .jumbotron:after {
186 | background-size: 150px 150px;
187 | }
188 |
189 | }
190 |
191 | /* Masthead (docs home)
192 | ------------------------- */
193 | .masthead {
194 | padding: 70px 0 80px;
195 | margin-bottom: 0;
196 | color: #fff;
197 | }
198 | .masthead h1 {
199 | font-size: 120px;
200 | line-height: 1;
201 | letter-spacing: -2px;
202 | }
203 | .masthead p {
204 | font-size: 40px;
205 | font-weight: 200;
206 | line-height: 1.25;
207 | }
208 |
209 | /* Textual links in masthead */
210 | .masthead-links {
211 | margin: 0;
212 | list-style: none;
213 | }
214 | .masthead-links li {
215 | display: inline;
216 | padding: 0 10px;
217 | color: rgba(255,255,255,.25);
218 | }
219 |
220 | /* Social proof buttons from GitHub & Twitter */
221 | .bs-docs-social {
222 | padding: 15px 0;
223 | text-align: center;
224 | background-color: #f5f5f5;
225 | border-top: 1px solid #fff;
226 | border-bottom: 1px solid #ddd;
227 | }
228 |
229 | /* Quick links on Home */
230 | .bs-docs-social-buttons {
231 | margin-left: 0;
232 | margin-bottom: 0;
233 | padding-left: 0;
234 | list-style: none;
235 | }
236 | .bs-docs-social-buttons li {
237 | display: inline-block;
238 | padding: 5px 8px;
239 | line-height: 1;
240 | *display: inline;
241 | *zoom: 1;
242 | }
243 |
244 | /* Subhead (other pages)
245 | ------------------------- */
246 | .subhead {
247 | text-align: left;
248 | border-bottom: 1px solid #ddd;
249 | }
250 | .subhead h1 {
251 | font-size: 60px;
252 | }
253 | .subhead p {
254 | margin-bottom: 20px;
255 | }
256 | .subhead .navbar {
257 | display: none;
258 | }
259 |
260 |
261 |
262 | /* Marketing section of Overview
263 | -------------------------------------------------- */
264 |
265 | .marketing {
266 | text-align: center;
267 | color: #5a5a5a;
268 | }
269 | .marketing h1 {
270 | margin: 60px 0 10px;
271 | font-size: 60px;
272 | font-weight: 200;
273 | line-height: 1;
274 | letter-spacing: -1px;
275 | }
276 | .marketing h2 {
277 | font-weight: 200;
278 | margin-bottom: 5px;
279 | }
280 | .marketing p {
281 | font-size: 16px;
282 | line-height: 1.5;
283 | }
284 | .marketing .marketing-byline {
285 | margin-bottom: 40px;
286 | font-size: 20px;
287 | font-weight: 300;
288 | line-height: 1.25;
289 | color: #999;
290 | }
291 | .marketing-img {
292 | display: block;
293 | margin: 0 auto 30px;
294 | max-height: 145px;
295 | }
296 |
297 |
298 |
299 | /* Footer
300 | -------------------------------------------------- */
301 |
302 | .footer {
303 | text-align: center;
304 | padding: 30px 0;
305 | margin-top: 70px;
306 | border-top: 1px solid #e5e5e5;
307 | background-color: #f5f5f5;
308 | }
309 | .footer p {
310 | margin-bottom: 0;
311 | color: #777;
312 | }
313 | .footer-links {
314 | margin: 10px 0;
315 | }
316 | .footer-links li {
317 | display: inline;
318 | padding: 0 2px;
319 | }
320 | .footer-links li:first-child {
321 | padding-left: 0;
322 | }
323 |
324 |
325 |
326 | /* Special grid styles
327 | -------------------------------------------------- */
328 |
329 | .show-grid {
330 | margin-top: 10px;
331 | margin-bottom: 20px;
332 | }
333 | .show-grid [class*="span"] {
334 | background-color: #eee;
335 | text-align: center;
336 | -webkit-border-radius: 3px;
337 | -moz-border-radius: 3px;
338 | border-radius: 3px;
339 | min-height: 40px;
340 | line-height: 40px;
341 | }
342 | .show-grid [class*="span"]:hover {
343 | background-color: #ddd;
344 | }
345 | .show-grid .show-grid {
346 | margin-top: 0;
347 | margin-bottom: 0;
348 | }
349 | .show-grid .show-grid [class*="span"] {
350 | margin-top: 5px;
351 | }
352 | .show-grid [class*="span"] [class*="span"] {
353 | background-color: #ccc;
354 | }
355 | .show-grid [class*="span"] [class*="span"] [class*="span"] {
356 | background-color: #999;
357 | }
358 |
359 |
360 |
361 | /* Mini layout previews
362 | -------------------------------------------------- */
363 | .mini-layout {
364 | border: 1px solid #ddd;
365 | -webkit-border-radius: 6px;
366 | -moz-border-radius: 6px;
367 | border-radius: 6px;
368 | -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.075);
369 | -moz-box-shadow: 0 1px 2px rgba(0,0,0,.075);
370 | box-shadow: 0 1px 2px rgba(0,0,0,.075);
371 | }
372 | .mini-layout,
373 | .mini-layout .mini-layout-body,
374 | .mini-layout.fluid .mini-layout-sidebar {
375 | height: 300px;
376 | }
377 | .mini-layout {
378 | margin-bottom: 20px;
379 | padding: 9px;
380 | }
381 | .mini-layout div {
382 | -webkit-border-radius: 3px;
383 | -moz-border-radius: 3px;
384 | border-radius: 3px;
385 | }
386 | .mini-layout .mini-layout-body {
387 | background-color: #dceaf4;
388 | margin: 0 auto;
389 | width: 70%;
390 | }
391 | .mini-layout.fluid .mini-layout-sidebar,
392 | .mini-layout.fluid .mini-layout-header,
393 | .mini-layout.fluid .mini-layout-body {
394 | float: left;
395 | }
396 | .mini-layout.fluid .mini-layout-sidebar {
397 | background-color: #bbd8e9;
398 | width: 20%;
399 | }
400 | .mini-layout.fluid .mini-layout-body {
401 | width: 77.5%;
402 | margin-left: 2.5%;
403 | }
404 |
405 |
406 |
407 | /* Download page
408 | -------------------------------------------------- */
409 |
410 | .download .page-header {
411 | margin-top: 36px;
412 | }
413 | .page-header .toggle-all {
414 | margin-top: 5px;
415 | }
416 |
417 | /* Space out h3s when following a section */
418 | .download h3 {
419 | margin-bottom: 5px;
420 | }
421 | .download-builder input + h3,
422 | .download-builder .checkbox + h3 {
423 | margin-top: 9px;
424 | }
425 |
426 | /* Fields for variables */
427 | .download-builder input[type=text] {
428 | margin-bottom: 9px;
429 | font-family: Menlo, Monaco, "Courier New", monospace;
430 | font-size: 12px;
431 | color: #d14;
432 | }
433 | .download-builder input[type=text]:focus {
434 | background-color: #fff;
435 | }
436 |
437 | /* Custom, larger checkbox labels */
438 | .download .checkbox {
439 | padding: 6px 10px 6px 25px;
440 | font-size: 13px;
441 | line-height: 18px;
442 | color: #555;
443 | background-color: #f9f9f9;
444 | -webkit-border-radius: 3px;
445 | -moz-border-radius: 3px;
446 | border-radius: 3px;
447 | cursor: pointer;
448 | }
449 | .download .checkbox:hover {
450 | color: #333;
451 | background-color: #f5f5f5;
452 | }
453 | .download .checkbox small {
454 | font-size: 12px;
455 | color: #777;
456 | }
457 |
458 | /* Variables section */
459 | #variables label {
460 | margin-bottom: 0;
461 | }
462 |
463 | /* Giant download button */
464 | .download-btn {
465 | margin: 36px 0 108px;
466 | }
467 | #download p,
468 | #download h4 {
469 | max-width: 50%;
470 | margin: 0 auto;
471 | color: #999;
472 | text-align: center;
473 | }
474 | #download h4 {
475 | margin-bottom: 0;
476 | }
477 | #download p {
478 | margin-bottom: 18px;
479 | }
480 | .download-btn .btn {
481 | display: block;
482 | width: auto;
483 | padding: 19px 24px;
484 | margin-bottom: 27px;
485 | font-size: 30px;
486 | line-height: 1;
487 | text-align: center;
488 | -webkit-border-radius: 6px;
489 | -moz-border-radius: 6px;
490 | border-radius: 6px;
491 | }
492 |
493 |
494 |
495 | /* Misc
496 | -------------------------------------------------- */
497 |
498 | /* Make tables spaced out a bit more */
499 | h2 + table,
500 | h3 + table,
501 | h4 + table,
502 | h2 + .row {
503 | margin-top: 5px;
504 | }
505 |
506 | /* Example sites showcase */
507 | .example-sites {
508 | xmargin-left: 20px;
509 | }
510 | .example-sites img {
511 | max-width: 100%;
512 | margin: 0 auto;
513 | }
514 |
515 | .scrollspy-example {
516 | height: 200px;
517 | overflow: auto;
518 | position: relative;
519 | }
520 |
521 |
522 | /* Fake the :focus state to demo it */
523 | .focused {
524 | border-color: rgba(82,168,236,.8);
525 | -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6);
526 | -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6);
527 | box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6);
528 | outline: 0;
529 | }
530 |
531 | /* For input sizes, make them display block */
532 | .docs-input-sizes select,
533 | .docs-input-sizes input[type=text] {
534 | display: block;
535 | margin-bottom: 9px;
536 | }
537 |
538 | /* Icons
539 | ------------------------- */
540 | .the-icons {
541 | margin-left: 0;
542 | list-style: none;
543 | }
544 | .the-icons li {
545 | float: left;
546 | width: 25%;
547 | line-height: 25px;
548 | }
549 | .the-icons i:hover {
550 | background-color: rgba(255,0,0,.25);
551 | }
552 |
553 | /* Example page
554 | ------------------------- */
555 | .bootstrap-examples h4 {
556 | margin: 10px 0 5px;
557 | }
558 | .bootstrap-examples p {
559 | font-size: 13px;
560 | line-height: 18px;
561 | }
562 | .bootstrap-examples .thumbnail {
563 | margin-bottom: 9px;
564 | background-color: #fff;
565 | }
566 |
567 |
568 |
569 | /* Bootstrap code examples
570 | -------------------------------------------------- */
571 |
572 | /* Base class */
573 | .bs-docs-example {
574 | position: relative;
575 | margin: 15px 0;
576 | padding: 39px 19px 14px;
577 | *padding-top: 19px;
578 | background-color: #fff;
579 | border: 1px solid #ddd;
580 | -webkit-border-radius: 4px;
581 | -moz-border-radius: 4px;
582 | border-radius: 4px;
583 | }
584 |
585 | /* Echo out a label for the example */
586 | .bs-docs-example:after {
587 | content: "Example";
588 | position: absolute;
589 | top: -1px;
590 | left: -1px;
591 | padding: 3px 7px;
592 | font-size: 12px;
593 | font-weight: bold;
594 | background-color: #f5f5f5;
595 | border: 1px solid #ddd;
596 | color: #9da0a4;
597 | -webkit-border-radius: 4px 0 4px 0;
598 | -moz-border-radius: 4px 0 4px 0;
599 | border-radius: 4px 0 4px 0;
600 | }
601 |
602 | /* Remove spacing between an example and it's code */
603 | .bs-docs-example + .prettyprint {
604 | margin-top: -20px;
605 | padding-top: 15px;
606 | }
607 |
608 | /* Tweak examples
609 | ------------------------- */
610 | .bs-docs-example > p:last-child {
611 | margin-bottom: 0;
612 | }
613 | .bs-docs-example .table,
614 | .bs-docs-example .progress,
615 | .bs-docs-example .well,
616 | .bs-docs-example .alert,
617 | .bs-docs-example .hero-unit,
618 | .bs-docs-example .pagination,
619 | .bs-docs-example .navbar,
620 | .bs-docs-example > .nav,
621 | .bs-docs-example blockquote {
622 | margin-bottom: 5px;
623 | }
624 | .bs-docs-example .pagination {
625 | margin-top: 0;
626 | }
627 | .bs-navbar-top-example,
628 | .bs-navbar-bottom-example {
629 | z-index: 1;
630 | padding: 0;
631 | height: 90px;
632 | overflow: hidden; /* cut the drop shadows off */
633 | }
634 | .bs-navbar-top-example .navbar-fixed-top,
635 | .bs-navbar-bottom-example .navbar-fixed-bottom {
636 | margin-left: 0;
637 | margin-right: 0;
638 | }
639 | .bs-navbar-top-example {
640 | -webkit-border-radius: 0 0 4px 4px;
641 | -moz-border-radius: 0 0 4px 4px;
642 | border-radius: 0 0 4px 4px;
643 | }
644 | .bs-navbar-top-example:after {
645 | top: auto;
646 | bottom: -1px;
647 | -webkit-border-radius: 0 4px 0 4px;
648 | -moz-border-radius: 0 4px 0 4px;
649 | border-radius: 0 4px 0 4px;
650 | }
651 | .bs-navbar-bottom-example {
652 | -webkit-border-radius: 4px 4px 0 0;
653 | -moz-border-radius: 4px 4px 0 0;
654 | border-radius: 4px 4px 0 0;
655 | }
656 | .bs-navbar-bottom-example .navbar {
657 | margin-bottom: 0;
658 | }
659 | form.bs-docs-example {
660 | padding-bottom: 19px;
661 | }
662 |
663 | /* Images */
664 | .bs-docs-example-images img {
665 | margin: 10px;
666 | display: inline-block;
667 | }
668 |
669 | /* Tooltips */
670 | .bs-docs-tooltip-examples {
671 | text-align: center;
672 | margin: 0 0 10px;
673 | list-style: none;
674 | }
675 | .bs-docs-tooltip-examples li {
676 | display: inline;
677 | padding: 0 10px;
678 | }
679 |
680 | /* Popovers */
681 | .bs-docs-example-popover {
682 | padding-bottom: 24px;
683 | background-color: #f9f9f9;
684 | }
685 | .bs-docs-example-popover .popover {
686 | position: relative;
687 | display: block;
688 | float: left;
689 | width: 260px;
690 | margin: 20px;
691 | }
692 |
693 | /* Dropdowns */
694 | .bs-docs-example-submenus {
695 | min-height: 180px;
696 | }
697 | .bs-docs-example-submenus > .pull-left + .pull-left {
698 | margin-left: 20px;
699 | }
700 | .bs-docs-example-submenus .dropup > .dropdown-menu,
701 | .bs-docs-example-submenus .dropdown > .dropdown-menu {
702 | display: block;
703 | position: static;
704 | margin-bottom: 5px;
705 | *width: 180px;
706 | }
707 |
708 |
709 |
710 | /* Responsive docs
711 | -------------------------------------------------- */
712 |
713 | /* Utility classes table
714 | ------------------------- */
715 | .responsive-utilities th small {
716 | display: block;
717 | font-weight: normal;
718 | color: #999;
719 | }
720 | .responsive-utilities tbody th {
721 | font-weight: normal;
722 | }
723 | .responsive-utilities td {
724 | text-align: center;
725 | }
726 | .responsive-utilities td.is-visible {
727 | color: #468847;
728 | background-color: #dff0d8 !important;
729 | }
730 | .responsive-utilities td.is-hidden {
731 | color: #ccc;
732 | background-color: #f9f9f9 !important;
733 | }
734 |
735 | /* Responsive tests
736 | ------------------------- */
737 | .responsive-utilities-test {
738 | margin-top: 5px;
739 | margin-left: 0;
740 | list-style: none;
741 | overflow: hidden; /* clear floats */
742 | }
743 | .responsive-utilities-test li {
744 | position: relative;
745 | float: left;
746 | width: 25%;
747 | height: 43px;
748 | font-size: 14px;
749 | font-weight: bold;
750 | line-height: 43px;
751 | color: #999;
752 | text-align: center;
753 | border: 1px solid #ddd;
754 | -webkit-border-radius: 4px;
755 | -moz-border-radius: 4px;
756 | border-radius: 4px;
757 | }
758 | .responsive-utilities-test li + li {
759 | margin-left: 10px;
760 | }
761 | .responsive-utilities-test span {
762 | position: absolute;
763 | top: -1px;
764 | left: -1px;
765 | right: -1px;
766 | bottom: -1px;
767 | -webkit-border-radius: 4px;
768 | -moz-border-radius: 4px;
769 | border-radius: 4px;
770 | }
771 | .responsive-utilities-test span {
772 | color: #468847;
773 | background-color: #dff0d8;
774 | border: 1px solid #d6e9c6;
775 | }
776 |
777 |
778 |
779 | /* Sidenav for Docs
780 | -------------------------------------------------- */
781 |
782 | .bs-docs-sidenav {
783 | width: 228px;
784 | margin: 30px 0 0;
785 | padding: 0;
786 | background-color: #fff;
787 | -webkit-border-radius: 6px;
788 | -moz-border-radius: 6px;
789 | border-radius: 6px;
790 | -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.065);
791 | -moz-box-shadow: 0 1px 4px rgba(0,0,0,.065);
792 | box-shadow: 0 1px 4px rgba(0,0,0,.065);
793 | }
794 | .bs-docs-sidenav > li > a {
795 | display: block;
796 | width: 190px \9;
797 | margin: 0 0 -1px;
798 | padding: 8px 14px;
799 | border: 1px solid #e5e5e5;
800 | }
801 | .bs-docs-sidenav > li:first-child > a {
802 | -webkit-border-radius: 6px 6px 0 0;
803 | -moz-border-radius: 6px 6px 0 0;
804 | border-radius: 6px 6px 0 0;
805 | }
806 | .bs-docs-sidenav > li:last-child > a {
807 | -webkit-border-radius: 0 0 6px 6px;
808 | -moz-border-radius: 0 0 6px 6px;
809 | border-radius: 0 0 6px 6px;
810 | }
811 | .bs-docs-sidenav > .active > a {
812 | position: relative;
813 | z-index: 2;
814 | padding: 9px 15px;
815 | border: 0;
816 | text-shadow: 0 1px 0 rgba(0,0,0,.15);
817 | -webkit-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
818 | -moz-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
819 | box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
820 | }
821 | /* Chevrons */
822 | .bs-docs-sidenav .icon-chevron-right {
823 | float: right;
824 | margin-top: 2px;
825 | margin-right: -6px;
826 | opacity: .25;
827 | }
828 | .bs-docs-sidenav > li > a:hover {
829 | background-color: #f5f5f5;
830 | }
831 | .bs-docs-sidenav a:hover .icon-chevron-right {
832 | opacity: .5;
833 | }
834 | .bs-docs-sidenav .active .icon-chevron-right,
835 | .bs-docs-sidenav .active a:hover .icon-chevron-right {
836 | background-image: url(../img/glyphicons-halflings-white.png);
837 | opacity: 1;
838 | }
839 | .bs-docs-sidenav.affix {
840 | top: 40px;
841 | }
842 | .bs-docs-sidenav.affix-bottom {
843 | position: absolute;
844 | top: auto;
845 | bottom: 270px;
846 | }
847 |
848 |
849 |
850 |
851 | /* Responsive
852 | -------------------------------------------------- */
853 |
854 | /* Desktop large
855 | ------------------------- */
856 | @media (min-width: 1200px) {
857 | .bs-docs-container {
858 | max-width: 970px;
859 | }
860 | .bs-docs-sidenav {
861 | width: 258px;
862 | }
863 | .bs-docs-sidenav > li > a {
864 | width: 230px \9; /* Override the previous IE8-9 hack */
865 | }
866 | }
867 |
868 | /* Desktop
869 | ------------------------- */
870 | @media (max-width: 980px) {
871 | /* Unfloat brand */
872 | body > .navbar-fixed-top .brand {
873 | float: left;
874 | margin-left: 0;
875 | padding-left: 10px;
876 | padding-right: 10px;
877 | }
878 |
879 | /* Inline-block quick links for more spacing */
880 | .quick-links li {
881 | display: inline-block;
882 | margin: 5px;
883 | }
884 |
885 | /* When affixed, space properly */
886 | .bs-docs-sidenav {
887 | top: 0;
888 | width: 218px;
889 | margin-top: 30px;
890 | margin-right: 0;
891 | }
892 | }
893 |
894 | /* Tablet to desktop
895 | ------------------------- */
896 | @media (min-width: 768px) and (max-width: 979px) {
897 | /* Remove any padding from the body */
898 | body {
899 | padding-top: 0;
900 | }
901 | /* Widen masthead and social buttons to fill body padding */
902 | .jumbotron {
903 | margin-top: -20px; /* Offset bottom margin on .navbar */
904 | }
905 | /* Adjust sidenav width */
906 | .bs-docs-sidenav {
907 | width: 166px;
908 | margin-top: 20px;
909 | }
910 | .bs-docs-sidenav.affix {
911 | top: 0;
912 | }
913 | }
914 |
915 | /* Tablet
916 | ------------------------- */
917 | @media (max-width: 767px) {
918 | /* Remove any padding from the body */
919 | body {
920 | padding-top: 0;
921 | }
922 |
923 | /* Widen masthead and social buttons to fill body padding */
924 | .jumbotron {
925 | padding: 40px 20px;
926 | margin-top: -20px; /* Offset bottom margin on .navbar */
927 | margin-right: -20px;
928 | margin-left: -20px;
929 | }
930 | .masthead h1 {
931 | font-size: 90px;
932 | }
933 | .masthead p,
934 | .masthead .btn {
935 | font-size: 24px;
936 | }
937 | .marketing .span4 {
938 | margin-bottom: 40px;
939 | }
940 | .bs-docs-social {
941 | margin: 0 -20px;
942 | }
943 |
944 | /* Space out the show-grid examples */
945 | .show-grid [class*="span"] {
946 | margin-bottom: 5px;
947 | }
948 |
949 | /* Sidenav */
950 | .bs-docs-sidenav {
951 | width: auto;
952 | margin-bottom: 20px;
953 | }
954 | .bs-docs-sidenav.affix {
955 | position: static;
956 | width: auto;
957 | top: 0;
958 | }
959 |
960 | /* Unfloat the back to top link in footer */
961 | .footer {
962 | margin-left: -20px;
963 | margin-right: -20px;
964 | padding-left: 20px;
965 | padding-right: 20px;
966 | }
967 | .footer p {
968 | margin-bottom: 9px;
969 | }
970 | }
971 |
972 | /* Landscape phones
973 | ------------------------- */
974 | @media (max-width: 480px) {
975 | /* Remove padding above jumbotron */
976 | body {
977 | padding-top: 0;
978 | }
979 |
980 | /* Change up some type stuff */
981 | h2 small {
982 | display: block;
983 | }
984 |
985 | /* Downsize the jumbotrons */
986 | .jumbotron h1 {
987 | font-size: 45px;
988 | }
989 | .jumbotron p,
990 | .jumbotron .btn {
991 | font-size: 18px;
992 | }
993 | .jumbotron .btn {
994 | display: block;
995 | margin: 0 auto;
996 | }
997 |
998 | /* center align subhead text like the masthead */
999 | .subhead h1,
1000 | .subhead p {
1001 | text-align: center;
1002 | }
1003 |
1004 | /* Marketing on home */
1005 | .marketing h1 {
1006 | font-size: 30px;
1007 | }
1008 | .marketing-byline {
1009 | font-size: 18px;
1010 | }
1011 |
1012 | /* center example sites */
1013 | .example-sites {
1014 | margin-left: 0;
1015 | }
1016 | .example-sites > li {
1017 | float: none;
1018 | display: block;
1019 | max-width: 280px;
1020 | margin: 0 auto 18px;
1021 | text-align: center;
1022 | }
1023 | .example-sites .thumbnail > img {
1024 | max-width: 270px;
1025 | }
1026 |
1027 | /* Do our best to make tables work in narrow viewports */
1028 | table code {
1029 | white-space: normal;
1030 | word-wrap: break-word;
1031 | word-break: break-all;
1032 | }
1033 |
1034 | /* Examples: dropdowns */
1035 | .bs-docs-example-submenus > .pull-left {
1036 | float: none;
1037 | clear: both;
1038 | }
1039 | .bs-docs-example-submenus > .pull-left,
1040 | .bs-docs-example-submenus > .pull-left + .pull-left {
1041 | margin-left: 0;
1042 | }
1043 | .bs-docs-example-submenus p {
1044 | margin-bottom: 0;
1045 | }
1046 | .bs-docs-example-submenus .dropup > .dropdown-menu,
1047 | .bs-docs-example-submenus .dropdown > .dropdown-menu {
1048 | margin-bottom: 10px;
1049 | float: none;
1050 | max-width: 180px;
1051 | }
1052 |
1053 | /* Examples: modal */
1054 | .modal-example .modal {
1055 | position: relative;
1056 | top: auto;
1057 | right: auto;
1058 | bottom: auto;
1059 | left: auto;
1060 | }
1061 |
1062 | /* Tighten up footer */
1063 | .footer {
1064 | padding-top: 20px;
1065 | padding-bottom: 20px;
1066 | }
1067 | }
1068 |
--------------------------------------------------------------------------------
/example/bootstrap/ico/apple-touch-icon-114-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/ico/apple-touch-icon-114-precomposed.png
--------------------------------------------------------------------------------
/example/bootstrap/ico/apple-touch-icon-144-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/ico/apple-touch-icon-144-precomposed.png
--------------------------------------------------------------------------------
/example/bootstrap/ico/apple-touch-icon-57-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/ico/apple-touch-icon-57-precomposed.png
--------------------------------------------------------------------------------
/example/bootstrap/ico/apple-touch-icon-72-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/ico/apple-touch-icon-72-precomposed.png
--------------------------------------------------------------------------------
/example/bootstrap/ico/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/ico/favicon.ico
--------------------------------------------------------------------------------
/example/bootstrap/ico/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/ico/favicon.png
--------------------------------------------------------------------------------
/example/bootstrap/img/bootstrap-docs-readme.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/bootstrap-docs-readme.png
--------------------------------------------------------------------------------
/example/bootstrap/img/bootstrap-mdo-sfmoma-01.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/bootstrap-mdo-sfmoma-01.jpg
--------------------------------------------------------------------------------
/example/bootstrap/img/bootstrap-mdo-sfmoma-02.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/bootstrap-mdo-sfmoma-02.jpg
--------------------------------------------------------------------------------
/example/bootstrap/img/bootstrap-mdo-sfmoma-03.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/bootstrap-mdo-sfmoma-03.jpg
--------------------------------------------------------------------------------
/example/bootstrap/img/bs-docs-bootstrap-features.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/bs-docs-bootstrap-features.png
--------------------------------------------------------------------------------
/example/bootstrap/img/bs-docs-masthead-pattern.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/bs-docs-masthead-pattern.png
--------------------------------------------------------------------------------
/example/bootstrap/img/bs-docs-responsive-illustrations.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/bs-docs-responsive-illustrations.png
--------------------------------------------------------------------------------
/example/bootstrap/img/bs-docs-twitter-github.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/bs-docs-twitter-github.png
--------------------------------------------------------------------------------
/example/bootstrap/img/example-sites/8020select.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/example-sites/8020select.png
--------------------------------------------------------------------------------
/example/bootstrap/img/example-sites/adoptahydrant.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/example-sites/adoptahydrant.png
--------------------------------------------------------------------------------
/example/bootstrap/img/example-sites/breakingnews.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/example-sites/breakingnews.png
--------------------------------------------------------------------------------
/example/bootstrap/img/example-sites/fleetio.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/example-sites/fleetio.png
--------------------------------------------------------------------------------
/example/bootstrap/img/example-sites/gathercontent.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/example-sites/gathercontent.png
--------------------------------------------------------------------------------
/example/bootstrap/img/example-sites/jshint.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/example-sites/jshint.png
--------------------------------------------------------------------------------
/example/bootstrap/img/example-sites/kippt.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/example-sites/kippt.png
--------------------------------------------------------------------------------
/example/bootstrap/img/example-sites/soundready.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/example-sites/soundready.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/bootstrap-example-carousel.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/bootstrap-example-carousel.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/bootstrap-example-fluid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/bootstrap-example-fluid.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/bootstrap-example-justified-nav.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/bootstrap-example-justified-nav.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/bootstrap-example-marketing-narrow.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/bootstrap-example-marketing-narrow.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/bootstrap-example-marketing.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/bootstrap-example-marketing.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/bootstrap-example-signin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/bootstrap-example-signin.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/bootstrap-example-starter.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/bootstrap-example-starter.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/bootstrap-example-sticky-footer.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/bootstrap-example-sticky-footer.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/browser-icon-chrome.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/browser-icon-chrome.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/browser-icon-firefox.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/browser-icon-firefox.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/browser-icon-safari.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/browser-icon-safari.png
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/slide-01.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/slide-01.jpg
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/slide-02.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/slide-02.jpg
--------------------------------------------------------------------------------
/example/bootstrap/img/examples/slide-03.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/examples/slide-03.jpg
--------------------------------------------------------------------------------
/example/bootstrap/img/glyphicons-halflings-white.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/glyphicons-halflings-white.png
--------------------------------------------------------------------------------
/example/bootstrap/img/glyphicons-halflings.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/glyphicons-halflings.png
--------------------------------------------------------------------------------
/example/bootstrap/img/grid-baseline-20px.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/grid-baseline-20px.png
--------------------------------------------------------------------------------
/example/bootstrap/img/less-logo-large.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/less-logo-large.png
--------------------------------------------------------------------------------
/example/bootstrap/img/responsive-illustrations.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cletourneau/angular-bootstrap-datepicker/9ec123658001d6536485fcd8d46b87e7f01a3f00/example/bootstrap/img/responsive-illustrations.png
--------------------------------------------------------------------------------
/example/demo.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Angular Bootstrap Datepicker Demo
5 |
6 |
7 |
8 |
9 |
15 |
16 |
17 |
18 |
19 |
20 |
34 |
35 |
--------------------------------------------------------------------------------
/grunt.bat:
--------------------------------------------------------------------------------
1 | call node ./node_modules/grunt-cli/bin/grunt %*
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "angular-datepicker",
3 | "version": "0.1.0",
4 | "description": "some description",
5 | "main": "angular-datepicker.js",
6 | "directories": {
7 | "test": "test"
8 | },
9 | "scripts": {
10 | "test": "echo \"Error: no test specified\" && exit 1"
11 | },
12 | "author": "Carl Letourneau",
13 | "license": "Apache License, Version 2.0",
14 | "devDependencies": {
15 | "karma-html2js-preprocessor": "0.1.0",
16 | "karma-jasmine": "0.1.3",
17 | "karma-coffee-preprocessor": "0.1.0",
18 | "karma": "0.10.2",
19 | "karma-ng-scenario": "0.1.0",
20 | "phantomjs": "1.9.1-0",
21 | "coffee-script": "1.6.3",
22 | "grunt": "0.4.1",
23 | "grunt-contrib-concat": "0.3.0",
24 | "grunt-cli": "0.1.9",
25 | "grunt-contrib-connect": "0.5.0",
26 | "grunt-contrib-coffee": "0.7.0",
27 | "grunt-contrib-clean": "0.5.0",
28 | "grunt-contrib-watch": "0.5.3",
29 | "grunt-contrib-uglify": "0.2.4"
30 | }
31 | }
32 |
--------------------------------------------------------------------------------
/src/angular-bootstrap-datepicker.coffee:
--------------------------------------------------------------------------------
1 | dp = angular.module('ng-bootstrap-datepicker', [])
2 |
3 | dp.directive 'ngDatepicker', ->
4 | restrict: 'A'
5 | replace: true
6 | scope:
7 | ngOptions: '='
8 | ngModel: '='
9 | template: """
10 |
11 |
12 |
13 | """
14 | link: (scope, element)->
15 | scope.inputHasFocus = false
16 |
17 | element.datepicker(scope.ngOptions).on('changeDate', (e)->
18 |
19 | defaultFormat = $.fn.datepicker.defaults.format
20 | format = scope.ngOptions.format || defaultFormat
21 | defaultLanguage = $.fn.datepicker.defaults.language
22 | language = scope.ngOptions.language || defaultLanguage
23 |
24 | scope.$apply -> scope.ngModel = $.fn.datepicker.DPGlobal.formatDate(e.date, format, language)
25 | )
26 |
27 | element.find('input').on('focus', ->
28 | scope.inputHasFocus = true
29 | ).on('blur', ->
30 | scope.inputHasFocus = false
31 | )
32 |
33 | scope.$watch 'ngModel', (newValue)->
34 | if not scope.inputHasFocus
35 | element.datepicker('update', newValue)
36 |
--------------------------------------------------------------------------------
/test/system/datepicker.ui.spec.coffee:
--------------------------------------------------------------------------------
1 | describe 'angular-bootstrap-datepicker', ->
2 |
3 | beforeEach ->
4 | browser().navigateTo('/test/system/test.html')
5 |
6 | it 'picking a date from the calendar table updates the scope', ->
7 | element('div #datepicker input').query (elements, done)->
8 | elements.focus()
9 | done()
10 | element('.day:contains(15)').click()
11 | element('#datepickerMirror').click()
12 |
13 | expect(element('#datepickerMirror', 'picked date').val()).toEqual('2012-10-15')
14 |
15 | it 'can be updated by the scope', ->
16 | input('date').enter('2012-10-26')
17 | expect(element('#datepicker input', 'datepicker').val()).toEqual('2012-10-26')
18 |
19 | xit 'can focus on the input -- this test does not work yet', ->
20 | jQueryFn('div #datepicker input', 'focus')
21 | keyboard().keydown('div #datepicker input', 'keydown', 27, false, false, false);
22 | keyboard().keydown('div #datepicker input', 'keypress', 50, false, false, false);
23 |
--------------------------------------------------------------------------------
/test/system/jQueryFnDsl.js:
--------------------------------------------------------------------------------
1 | angular.scenario.dsl('jQueryFn', function() {
2 | return function(selector, functionName /*, args */) {
3 | var args = Array.prototype.slice.call(arguments, 2);
4 | return this.addFutureAction(functionName, function($window, $document, done) {
5 | var $ = $window.$; // jQuery inside the iframe
6 | var elem = $(selector);
7 | if (!elem.length) {
8 | return done('Selector ' + selector + ' did not match any elements.');
9 | }
10 | done(null, elem[functionName].apply(elem, args));
11 | });
12 | };
13 | });
14 |
15 | angular.scenario.dsl('keyboard', function() {
16 | var chain = {};
17 | chain.keydown = function(selector, keyEvent, keyCode, shift, ctrl, alt) {
18 | return this.addFutureAction("keyEvent", function($window, $document, done) {
19 | var jQuery = $window.$;
20 | var e = jQuery.Event(keyEvent);
21 | e.keyCode = keyCode; // # Some key code value
22 | e.altKey = alt;
23 | e.ctrlKey = ctrl;
24 | e.shiftKey = shift;
25 | if (selector == null) selector = '*:focus';
26 | var j = jQuery(selector);
27 | if (j == null) j = jQuery('body');
28 | j.trigger(e);
29 | done();
30 | });
31 | };
32 | return function() {
33 | return chain;
34 | };
35 | });
--------------------------------------------------------------------------------
/test/system/test.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Angular Bootstrap Datepicker Demo
5 |
6 |
7 |
8 |
9 |
15 |
16 |
17 |
18 |
19 |
20 |
34 |
35 |
--------------------------------------------------------------------------------
/test/unit/datepicker.spec.coffee:
--------------------------------------------------------------------------------
1 | describe 'angular-bootstrap-datepicker', ->
2 |
3 | beforeEach module('ng-bootstrap-datepicker')
4 |
5 | beforeEach inject ($rootScope, $compile)->
6 | @element = angular.element(
7 | """
8 |
9 | """
10 | )
11 |
12 | @scope = $rootScope.$new()
13 | $compile(@element)(@scope)
14 | @scope.$digest()
15 |
16 | it 'should create a div', ->
17 | expect(@element.prop('tagName')).toBe('DIV')
18 |
19 | it 'sets the correct div class', ->
20 | expect(@element).toHaveClass('input-append')
21 | expect(@element).toHaveClass('date')
22 |
23 | describe 'input field', ->
24 |
25 | beforeEach ->
26 | @inputs = @element.find('input[type=text]')
27 |
28 | it 'should create the text input field', ->
29 | expect(@inputs.length).toBe(1)
30 |
31 | it 'should set the correct input class', ->
32 | expect(@inputs.eq(0)).toHaveClass('')
33 |
34 | describe 'calendar icon', ->
35 |
36 | beforeEach ->
37 | @spans = @element.find('span')
38 | @icons = @element.find('span i')
39 |
40 | it 'should create the span and icon elements', ->
41 | expect(@spans.length).toBe(1)
42 | expect(@icons.length).toBe(1)
43 |
44 | it 'should set the correct span class', ->
45 | expect(@spans.eq(0)).toHaveClass('add-on')
46 |
47 | it 'should set the correct i class', ->
48 | expect(@icons.eq(0)).toHaveClass('icon-th')
49 |
50 |
51 |
--------------------------------------------------------------------------------