From 1b61ef8766e0d11c6f0ce95c3a9fdf672412747f Mon Sep 17 00:00:00 2001 From: Gonzalo Guevara Date: Wed, 22 Jul 2015 16:14:48 -0300 Subject: [PATCH 1/2] Npm packages sass,watch. Comun gitignore props and simple grunt sass compile tasks --- .gitignore | 3 +++ Gruntfile.js | 35 +++++++++++++++++++++++++++++++++++ package.json | 24 ++++++++++++++++++++++++ 3 files changed, 62 insertions(+) create mode 100644 .gitignore create mode 100644 Gruntfile.js create mode 100644 package.json diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..6dc35e3 --- /dev/null +++ b/.gitignore @@ -0,0 +1,3 @@ +.sass-cache +.idea +node_modules \ No newline at end of file diff --git a/Gruntfile.js b/Gruntfile.js new file mode 100644 index 0000000..85eff25 --- /dev/null +++ b/Gruntfile.js @@ -0,0 +1,35 @@ +module.exports = function(grunt) { +// Project configuration. + grunt.initConfig({ + + sass: { + dist: { + options: { + style: 'expanded' + },//options + + files: { + 'scss/css/eventCalendar.css': 'scss/eventCalendar.scss', + 'scss/css/eventCalendar_theme_responsive.css': 'scss/eventCalendar_theme_responsive.scss' + } + }//dist + + },//sass + watch: { + options: { livereload: false }, + sass: { + files: ['scss/**/*.scss'], + tasks: ['sass:dist'] + }//sass + + }//watch + + + });//initConfig + + grunt.loadNpmTasks('grunt-contrib-watch'); + grunt.loadNpmTasks('grunt-contrib-sass'); + grunt.registerTask("default", ['watch']); + + +}; \ No newline at end of file diff --git a/package.json b/package.json new file mode 100644 index 0000000..20726ee --- /dev/null +++ b/package.json @@ -0,0 +1,24 @@ +{ + "name": "jQueryEventCalendar", + "version": "0.6.8", + "description": "Event Calendar Plugin", + "main": "index.js", + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1" + }, + "repository": { + "type": "git", + "url": "https://github.com/Gonzalo2683/jQueryEventCalendar.git" + }, + "author": "Fork Jaime Fernandez", + "license": "ISC", + "bugs": { + "url": "https://github.com/Gonzalo2683/jQueryEventCalendar/issues" + }, + "homepage": "https://github.com/Gonzalo2683/jQueryEventCalendar", + "devDependencies": { + "grunt": "^0.4.5", + "grunt-contrib-sass": "^0.9.2", + "grunt-contrib-watch": "^0.6.1" + } +} From a5d2343eac14f0b3e48e8d970d7139f0dfb7d30b Mon Sep 17 00:00:00 2001 From: Gonzalo Guevara Date: Wed, 22 Jul 2015 16:15:30 -0300 Subject: [PATCH 2/2] sass version of the current styles --- scss/config/_vars.scss | 18 + scss/css/eventCalendar.css | 83 ++++ scss/css/eventCalendar.css.map | 7 + scss/css/eventCalendar_theme_responsive.css | 384 ++++++++++++++++ .../eventCalendar_theme_responsive.css.map | 7 + scss/eventCalendar.scss | 111 +++++ scss/eventCalendar_theme_responsive.scss | 4 + scss/modules/_for-demo.scss | 62 +++ scss/modules/_responsive.scss | 411 ++++++++++++++++++ 9 files changed, 1087 insertions(+) create mode 100644 scss/config/_vars.scss create mode 100644 scss/css/eventCalendar.css create mode 100644 scss/css/eventCalendar.css.map create mode 100644 scss/css/eventCalendar_theme_responsive.css create mode 100644 scss/css/eventCalendar_theme_responsive.css.map create mode 100644 scss/eventCalendar.scss create mode 100644 scss/eventCalendar_theme_responsive.scss create mode 100644 scss/modules/_for-demo.scss create mode 100644 scss/modules/_responsive.scss diff --git a/scss/config/_vars.scss b/scss/config/_vars.scss new file mode 100644 index 0000000..64d808c --- /dev/null +++ b/scss/config/_vars.scss @@ -0,0 +1,18 @@ +//Vars +$main-font: 'Arial'; + +//Current Month block and arrows +$current-month-block-bg-color : #138DA5; +$current-month-block-border-color : #E3E3E3; +$current-mont-text-color: #fff; +$arrow-color : #fff; + +//Events +$event-cell-bg-color : #89B814; +$event-cell-text-color : #fff; + +//Subtitle Block +$next-event-title-color : #807E7E; +$event-title-color : #0E8EAB; +$time-box-bg-color : #807E7E; +$time-box-text-color : #fff; diff --git a/scss/css/eventCalendar.css b/scss/css/eventCalendar.css new file mode 100644 index 0000000..6535451 --- /dev/null +++ b/scss/css/eventCalendar.css @@ -0,0 +1,83 @@ +/*= CORE CSS */ +.eventCalendar-hidden { + display: none; +} +.eventCalendar-wrap { + position: relative; + overflow: hidden; +} +.eventCalendar-arrow { + position: absolute; + z-index: 5; + top: 3px; +} +.eventCalendar-prev { + left: 3px; +} +.eventCalendar-next { + right: 3px; +} +.eventCalendar-monthTitle { + display: block; + text-align: center; +} +.eventCalendar-monthWrap { + position: absolute; + top: 0; + left: 0; + z-index: 2; +} +.eventCalendar-currentMonth { + z-index: 1; +} +.eventCalendar-daysList { + display: table; + width: 100%; +} +.eventCalendar-daysList li { + display: table-cell; +} +.eventCalendar-daysList a { + padding: 0; + display: block; + text-align: center; + font-size: 8px; + min-width: 7px; +} +.eventCalendar-showAsWeek { + display: block; +} +.eventCalendar-showAsWeek li { + display: block; + float: left; + width: 14.28%; + height: 20px; +} +.eventCalendar-dayWithEvents { + background: rgba(0, 0, 0, 0.15); +} +.eventCalendar-current { + background: rgba(0, 0, 0, 0.35); +} +.eventCalendar-loading { + display: block; + min-width: 100px; + height: 40px; + line-height: 40px; +} +.eventCalendar-list { + position: relative; + z-index: 1; +} +.eventCalendar-oldEventList { + z-index: 2; +} +.eventCalendar-subtitle { + padding-left: 5px; + font-weight: bold; + font-size: 120%; +} + +/* end of core CSS new */ + +/*# sourceMappingURL=eventCalendar.css.map */ diff --git a/scss/css/eventCalendar.css.map b/scss/css/eventCalendar.css.map new file mode 100644 index 0000000..b7ea23f --- /dev/null +++ b/scss/css/eventCalendar.css.map @@ -0,0 +1,7 @@ +{ +"version": 3, +"mappings": ";AAQE,qBAAS;EACP,OAAO,EAAE,IAAI;;AAGf,mBAAO;EACL,QAAQ,EAAE,QAAQ;EAClB,QAAQ,EAAE,MAAM;;AAGlB,oBAAQ;EACN,QAAQ,EAAE,QAAQ;EAClB,OAAO,EAAE,CAAC;EACV,GAAG,EAAE,GAAG;;AAGV,mBAAO;EACL,IAAI,EAAE,GAAG;;AAGX,mBAAO;EACL,KAAK,EAAE,GAAG;;AAGZ,yBAAa;EACX,OAAO,EAAE,KAAK;EACd,UAAU,EAAE,MAAM;;AAGpB,wBAAY;EACV,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,CAAC;EACN,IAAI,EAAE,CAAC;EACP,OAAO,EAAE,CAAC;;AAGZ,2BAAe;EACb,OAAO,EAAE,CAAC;;AAKZ,uBAAW;EACT,OAAO,EAAE,KAAK;EACd,KAAK,EAAE,IAAI;;AAEX,0BAAG;EACD,OAAO,EAAE,UAAU;;AAGrB,yBAAE;EACA,OAAO,EAAE,CAAC;EACV,OAAO,EAAE,KAAK;EACd,UAAU,EAAE,MAAM;EAClB,SAAS,EAAE,GAAG;EACd,SAAS,EAAE,GAAG;;AAKlB,yBAAa;EACX,OAAO,EAAE,KAAK;;AAEd,4BAAG;EACD,OAAO,EAAE,KAAK;EACd,KAAK,EAAE,IAAI;EACX,KAAK,EAAE,MAAM;EACb,MAAM,EAAE,IAAI;;AAIhB,4BAAgB;EACd,UAAU,EAAE,mBAAmB;;AAGjC,sBAAU;EACR,UAAU,EAAE,mBAAmB;;AAGjC,sBAAU;EACR,OAAO,EAAE,KAAK;EACd,SAAS,EAAE,KAAK;EAChB,MAAM,EAAE,IAAI;EACZ,WAAW,EAAE,IAAI;;AAGnB,mBAAO;EACL,QAAQ,EAAE,QAAQ;EAClB,OAAO,EAAE,CAAC;;AAGZ,2BAAe;EACb,OAAO,EAAE,CAAC;;AAGZ,uBAAW;EACT,YAAY,EAAE,GAAG;EACjB,WAAW,EAAE,IAAI;EACjB,SAAS,EAAE,IAAI", +"sources": ["../eventCalendar.scss"], +"names": [], +"file": "eventCalendar.css" +} diff --git a/scss/css/eventCalendar_theme_responsive.css b/scss/css/eventCalendar_theme_responsive.css new file mode 100644 index 0000000..9020508 --- /dev/null +++ b/scss/css/eventCalendar_theme_responsive.css @@ -0,0 +1,384 @@ +/* Theme CSS */ +html { + background-color: #eee; +} + +body { + font-family: "Arial", "Lucida Grande", sans-serif; + font-size: 13px; + line-height: 18px; + color: #555; + background-color: #fff; +} + +.eventCalendar-wrap { + border: solid 1px #d3d3d3; + box-shadow: 0 0 15px #999; + border-radius: 5px; + margin-bottom: 20px; + background-color: #fff; + color: #807E7E; +} +.eventCalendar-wrap .eventCalendar-arrow { + text-decoration: none; + color: #fff; + padding: 0 5px; + /* overriding padding */ + line-height: 28px; + top: 9px; + padding: 8px 10px; +} +.eventCalendar-wrap .eventCalendar-arrow:hover { + opacity: 0.7; +} +.eventCalendar-wrap .eventCalendar-arrow span { + height: 0; + width: 0; + font-size: 0; + line-height: 0; + border-top: 6px solid transparent; + border-bottom: 6px solid transparent; + border-left: 6px solid #fff; + float: left; + text-indent: -5000px; +} +.eventCalendar-wrap .eventCalendar-arrow.eventCalendar-prev span { + border-left-width: 0; + border-right: 6px solid #fff; +} +.eventCalendar-slider { + height: 80px; +} +.eventCalendar-monthWrap { + border-radius: 5px; + top: 10px; + left: 0px; +} +.eventCalendar-currentTitle { + line-height: 25px; + background-color: #138DA5; + outline: 1px solid #138DA5; + border: 1px solid #E3E3E3; + border-width: 1px 0; +} +.eventCalendar-currentTitle .eventCalendar-monthTitle { + font-size: 110%; + text-decoration: none; + font-weight: bold; + color: #fff; +} +.eventCalendar-daysList { + zoom: 1; + padding: 0; + width: 100%; +} +.eventCalendar-daysList.eventCalendar-showAsWeek { + margin: 10px 5px; + width: auto; + border: solid 1px #BCBCBC; + border-bottom-width: 0; + border-radius: 0; + background-color: #CCCCCC; + background-image: linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); + background-image: -o-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); + background-image: -moz-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); + background-image: -webkit-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); + background-image: -ms-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.42, #EEEEEE), color-stop(0.71, #CCCCCC)); +} +.eventCalendar-daysList.showDayNames.eventCalendar-showAsWeek { + border-radius: 5px 5px 0 0; +} +.eventCalendar-daysList:before, .eventCalendar-daysList:after { + content: ""; + display: table; +} +.eventCalendar-daysList:after { + clear: both; +} +.eventCalendar-daysList.eventCalendar-showAsWeek li { + height: auto; + margin: 0; +} +.eventCalendar-daysList.eventCalendar-showAsWeek li.eventCalendar-empty { + background-color: #ccc; + min-height: 27px; + border-top: solid 1px #ccc; +} +.eventCalendar-daysList li.today a { + color: #fff; + background: #aaa; + /* box-shadow:inset 5px 5px 10px #777; + text-shadow: 2px 2px 2px #777;*/ +} +.eventCalendar-daysList li.eventCalendar-dayWithEvents a { + background: #89B814; + /*box-shadow:inset 5px 5px 10px #698B10; + text-shadow: 2px 2px 2px #698B10;*/ + color: #fff; +} +.eventCalendar-daysList li.current a { + color: #fff; + background: #449FB2; + box-shadow: inset 5px 5px 10px #216B7A; + text-shadow: 2px 2px 2px #216B7A; +} +.eventCalendar-day-header { + text-transform: lowercase; + text-align: center; + font-size: 10px; + border-bottom: solid 1px #BCBCBC; +} +.eventCalendar-day { + border-left: solid 1px #BCBCBC; +} +.eventCalendar-day a { + text-decoration: none; + font-size: 10px; + color: #424242; + border: solid 1px #BCBCBC; + border-width: 0 1px 1px 0; +} +.eventCalendar-day.today a:hover { + /*locos*/ + background-color: #ccc; + /*box-shadow:inset 5px 5px 10px #999;*/ +} +.eventCalendar-showAsWeek .eventCalendar-day { + border-left-width: 0; +} +.eventCalendar-showAsWeek .eventCalendar-day a { + border: solid 1px red; + border-color: #fff #BCBCBC #BCBCBC #eee; + line-height: 27px; + font-size: 11px; +} +.eventCalendar-showAsWeek .eventCalendar-day a:hover { + background-color: #E4E4E4; + /*box-shadow:inset 5px 5px 10px #C1C1C1; + text-shadow: 2px 2px 2px #C1C1C1;*/ +} +.eventCalendar-loading { + border-radius: 4px; + margin: 5px auto; + padding: 0 10px; + background-color: #ccc; + color: #fff; + text-align: center; + font-weight: bold; + box-shadow: 0 0 10px #ccc; + text-shadow: 0 0 3px #aaa; + position: absolute; + z-index: 4; + top: 25px; + left: 5px; +} +.eventCalendar-loading.error { + background-color: red; +} +.eventCalendar-subtitle { + padding-top: 10px; + color: #807E7E; +} +.eventCalendar-list-wrap { + min-height: 100px; + position: relative; +} +.eventCalendar-list-content.scrollable { + height: 100px; + overflow-y: auto; + margin: 0 5px 5px 0; +} +.eventCalendar-list { + margin: 0; + padding: 0; + list-style-type: none; +} +.eventCalendar-list li { + padding: 0 5px 15px; + margin: 0; + clear: both; +} +.eventCalendar-list li time { + font-size: 10px; + line-height: 13px; +} +.eventCalendar-list li time em { + float: left; + font-style: normal; +} +.eventCalendar-list li time small { + font-size: 10px; + float: left; + background-color: #807E7E; + color: #fff; + padding: 0 5px 0 4px; + margin: 0 0 0 3px; +} +.eventCalendar-list li .eventCalendar-eventTitle { + display: block; + clear: both; + font-weight: bold; + text-decoration: none; +} +.eventCalendar-list li a.eventCalendar-eventTitle { + color: #0E8EAB; +} +.eventCalendar-list li a.eventCalendar-eventTitle:hover { + text-decoration: underline; +} +.eventCalendar-list li .eventDesc { + clear: both; + margin: 0 0 5px 0; + font-size: 80%; + line-height: 1.2em; +} +.eventCalendar-list .eventCalendar-noEvents { + font-size: 120%; + border-radius: 4px; + margin: 5px; + padding: 5px; + background-color: #ccc; + color: #fff; + text-align: center; + font-weight: bold; + box-shadow: 0 0 10px #ccc; + text-shadow: 0 0 3px #aaa; +} + +li.eventCalendar-day.today a:hover { + background-color: #ccc; + /* loco box-shadow:inset 5px 5px 10px #999;*/ +} +li.eventCalendar-day.eventCalendar-dayWithEvents a:hover { + background-color: #b9ea3e; + /* loco box-shadow:inset 5px 5px 10px #89B814; + text-shadow: 2px 2px 2px #89B814;*/ +} +li.eventCalendar-day.current a:hover { + /* loco*/ + background-color: #79BDCC; + box-shadow: inset 5px 5px 10px #449FB2; + text-shadow: 2px 2px 2px #449FB2; +} + +/* Bt */ +.bt { + font-size: 12px; + display: block; + clear: both; + text-align: center; + margin-top: 10px; + padding: 9px 34px 11px; + text-decoration: none; + font-weight: bold; + line-height: 1; + color: #ffffff; + background-color: #698B10; + background-repeat: repeat-x; + background-image: -khtml-gradient(linear, left top, left bottom, from(#89B814), to(#698B10)); + background-image: -moz-linear-gradient(top, #89B814, #698B10); + background-image: -ms-linear-gradient(top, #89B814, #698B10); + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #89B814), color-stop(100%, #698B10)); + background-image: -webkit-linear-gradient(top, #89B814, #698B10); + background-image: -o-linear-gradient(top, #89B814, #698B10); + background-image: linear-gradient(top, #89B814, #698B10); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#89B814', endColorstr='#698B10', GradientType=0); + text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); + border: 1px solid #698B10; + border-color: #698B10 #698B10 #465F05; + border-radius: 4px; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); + -webkit-transition: 0.1s linear all; + -moz-transition: 0.1s linear all; + -ms-transition: 0.1s linear all; + -o-transition: 0.1s linear all; + transition: 0.1s linear all; +} +.bt:hover { + background-position: 0 -15px; + text-decoration: none; +} + +/*= ONLY FOR DEMO PAGE */ +body { + /* + width:978px; + box-shadow:0 0 10px #777; + padding: 20px 40px; + margin:0 auto; + */ +} + +a { + color: #0E8EAB; +} + +/* +.eventCalendar-wrap { + width:265px; +} +*/ +.features li { + margin-bottom: 3px; +} + +#thanksPanel li { + margin-bottom: 0; +} + +#introPanel { + padding-top: 20px; +} + +.poweredBy img { + float: left; + margin-right: 3px; +} + +.poweredBy .data { + float: left; +} + +.poweredBy .name { + font-weight: bold; + color: #555; + text-decoration: none; + display: block; + margin-top: 28px; +} + +.poweredBy .twitter { + text-decoration: none; + display: block; + float: left; +} + +.features { + padding-left: 20px; + float: left; +} + +#appLogo { + margin-right: 30px; +} + +pre { + clear: both; + background-color: #FFFFCC; + padding: 5px; + border: solid 1px #FED17E; + overflow: auto; +} + +#license { + width: 300px; + float: right; + font-size: 10px; + line-height: 12px; + text-align: center; +} + +/* end of demo page */ + +/*# sourceMappingURL=eventCalendar_theme_responsive.css.map */ diff --git a/scss/css/eventCalendar_theme_responsive.css.map b/scss/css/eventCalendar_theme_responsive.css.map new file mode 100644 index 0000000..cbb3bfa --- /dev/null +++ b/scss/css/eventCalendar_theme_responsive.css.map @@ -0,0 +1,7 @@ +{ +"version": 3, +"mappings": "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", +"sources": ["../modules/_responsive.scss","../config/_vars.scss","../modules/_for-demo.scss"], +"names": [], +"file": "eventCalendar_theme_responsive.css" +} diff --git a/scss/eventCalendar.scss b/scss/eventCalendar.scss new file mode 100644 index 0000000..44e7c1e --- /dev/null +++ b/scss/eventCalendar.scss @@ -0,0 +1,111 @@ +//Imports +@import "config/vars"; + +/*= CORE CSS */ + +.eventCalendar { + + //Hidden + &-hidden { + display: none; + } + + &-wrap { + position: relative; + overflow: hidden; + } + + &-arrow { + position: absolute; + z-index: 5; + top: 3px; + } + + &-prev { + left: 3px; + } + + &-next { + right: 3px; + } + + &-monthTitle { + display: block; + text-align: center; + } + + &-monthWrap { + position: absolute; + top: 0; + left: 0; + z-index: 2; + } + + &-currentMonth { + z-index: 1; + } + + + //Days List + &-daysList { + display: table; + width: 100%; + + li { + display: table-cell; + } + + a { + padding: 0; + display: block; + text-align: center; + font-size: 8px; + min-width: 7px; + } + + } + + &-showAsWeek { + display: block; + + li { + display: block; + float: left; + width: 14.28%; + height: 20px; + } + } + + &-dayWithEvents { + background: rgba(0, 0, 0, 0.15); + } + + &-current { + background: rgba(0, 0, 0, 0.35); + } + + &-loading { + display: block; + min-width: 100px; + height: 40px; + line-height: 40px; + } + + &-list { + position: relative; + z-index: 1; + } + + &-oldEventList { + z-index: 2; + } + + &-subtitle { + padding-left: 5px; + font-weight: bold; + font-size: 120%; + } + +}//eventCalendar + +/* end of core CSS new */ \ No newline at end of file diff --git a/scss/eventCalendar_theme_responsive.scss b/scss/eventCalendar_theme_responsive.scss new file mode 100644 index 0000000..1e8c96d --- /dev/null +++ b/scss/eventCalendar_theme_responsive.scss @@ -0,0 +1,4 @@ +//Imports +@import "config/vars"; +@import "modules/responsive"; +@import "modules/for-demo"; \ No newline at end of file diff --git a/scss/modules/_for-demo.scss b/scss/modules/_for-demo.scss new file mode 100644 index 0000000..a6a4df8 --- /dev/null +++ b/scss/modules/_for-demo.scss @@ -0,0 +1,62 @@ +/*= ONLY FOR DEMO PAGE */ +body { + /* + width:978px; + box-shadow:0 0 10px #777; + padding: 20px 40px; + margin:0 auto; + */ +} +a { color: #0E8EAB} +/* +.eventCalendar-wrap { + width:265px; +} +*/ +.features li { margin-bottom:3px;} +#thanksPanel li { margin-bottom:0;} +#introPanel { padding-top:20px;} + +.poweredBy img { + float:left; + margin-right:3px; +} +.poweredBy .data { + float:left; +} +.poweredBy .name { + font-weight:bold; + color:#555; + text-decoration:none; + display:block; + margin-top:28px; +} +.poweredBy .twitter { + text-decoration:none; + display:block; + float:left; +} +.features { + padding-left:20px; + float:left; +} +#appLogo { + margin-right:30px; +} +pre { + clear:both; + background-color:#FFFFCC; + padding:5px; + border:solid 1px #FED17E; + overflow:auto; +} +#license { + width:300px; + float:right; + font-size:10px; + line-height:12px; + text-align:center; +} + + +/* end of demo page */ \ No newline at end of file diff --git a/scss/modules/_responsive.scss b/scss/modules/_responsive.scss new file mode 100644 index 0000000..2401287 --- /dev/null +++ b/scss/modules/_responsive.scss @@ -0,0 +1,411 @@ +/* Theme CSS */ +html { + background-color:#eee; +} +body { + font-family: $main-font, "Lucida Grande", sans-serif; + font-size: 13px; + line-height: 18px; + color: #555; + background-color:#fff; +} + +.eventCalendar { + + &-wrap { + border:solid 1px #d3d3d3; + box-shadow:0 0 15px #999; + border-radius:5px; + margin-bottom:20px; + background-color:#fff; + color:#807E7E; + + .eventCalendar-arrow { + text-decoration:none; + color:#fff; + padding:0 5px; /* overriding padding */ + line-height:28px; + top:9px; + padding:8px 10px; + + &:hover { + opacity:0.7; + } + + span { + height: 0; + width: 0; + font-size: 0; + line-height: 0; + border-top: 6px solid transparent; + border-bottom: 6px solid transparent; + border-left: 6px solid $arrow-color; + float:left; + text-indent:-5000px; + }//span + + + &.eventCalendar-prev { + span { + border-left-width:0; + border-right: 6px solid $arrow-color; + } + } + + }//eventCalendar-arrow + + }//wrap + + &-slider { + height:80px; + }//slider + + &-monthWrap { + border-radius:5px; + top:10px; + left:0px; + } + + &-currentTitle { + line-height:25px; + background-color: $current-month-block-bg-color; + outline:1px solid $current-month-block-bg-color; + border:1px solid $current-month-block-border-color ; + border-width:1px 0; + + .eventCalendar-monthTitle { + font-size:110%; + text-decoration:none; + font-weight:bold; + color: $current-mont-text-color; + } + + }//currentTitle + + &-daysList { + zoom: 1; + padding:0; + width:100%; + + &.eventCalendar-showAsWeek { + margin:10px 5px; + width:auto; + + border:solid 1px #BCBCBC; + border-bottom-width:0; + border-radius:0; + background-color:#CCCCCC; + background-image: linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); + background-image: -o-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); + background-image: -moz-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); + background-image: -webkit-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); + background-image: -ms-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); + + background-image: -webkit-gradient( + linear, + left top, + left bottom, + color-stop(0.42, #EEEEEE), + color-stop(0.71, #CCCCCC) + ); + + } + + &.showDayNames.eventCalendar-showAsWeek { + border-radius:5px 5px 0 0; + } + + &:before, + &:after { + content:""; + display:table; + } + + &:after { + clear: both; + } + + &.eventCalendar-showAsWeek li { + height:auto; margin:0; + + &.eventCalendar-empty { + background-color: #ccc; + min-height:27px; + border-top: solid 1px #ccc; + } + } + + + li { + &.today a { + color:#fff; + background:#aaa; + /* box-shadow:inset 5px 5px 10px #777; + text-shadow: 2px 2px 2px #777;*/ + } + + &.eventCalendar-dayWithEvents a { + background: $event-cell-bg-color; + /*box-shadow:inset 5px 5px 10px #698B10; + text-shadow: 2px 2px 2px #698B10;*/ + color: $event-cell-text-color; + } + + &.current a { + color:#fff; + background:#449FB2; + box-shadow:inset 5px 5px 10px #216B7A; + text-shadow: 2px 2px 2px #216B7A; + } + + }//li + + + }//dayList + + + &-day-header { + text-transform:lowercase; + text-align:center; + font-size:10px; + border-bottom:solid 1px #BCBCBC; + + }//day-header + + + &-day { + border-left:solid 1px #BCBCBC; + + a { + text-decoration:none; + font-size:10px; + color:#424242; + border:solid 1px #BCBCBC; + border-width:0 1px 1px 0; + } + + &.today a:hover { + + + /*locos*/ + background-color:#ccc; + /*box-shadow:inset 5px 5px 10px #999;*/ + } + + + }//day + + &-showAsWeek { + + .eventCalendar-day { + border-left-width:0; + + a { + border:solid 1px red; + border-color:#fff #BCBCBC #BCBCBC #eee; + line-height:27px; + font-size:11px; + + &:hover { + background-color:#E4E4E4; + /*box-shadow:inset 5px 5px 10px #C1C1C1; + text-shadow: 2px 2px 2px #C1C1C1;*/ + } + + } + } + + }//showAsWeek + + + &-loading { + border-radius:4px; + margin:5px auto; + padding:0 10px; + background-color:#ccc; + color:#fff; + text-align:center; + font-weight:bold; + box-shadow:0 0 10px #ccc; + text-shadow:0 0 3px #aaa; + position:absolute; + z-index:4; + top:25px; + left:5px; + + &.error { + background-color:red; + } + + }//loading + + + &-subtitle { + padding-top:10px; + color: $next-event-title-color; + } + + &-list-wrap { + min-height:100px; + position:relative; + } + + &-list-content { + + &.scrollable { + + height:100px; + overflow-y:auto; + margin:0 5px 5px 0; + } + }//list-content + + + + &-list { + margin:0; + padding:0; + list-style-type:none; + + li { + padding:0 5px 15px; + margin:0; + clear:both; + + time { + font-size:10px; + line-height:13px; + } + + time em { + float:left; + font-style:normal; + } + + time small { + font-size:10px; + float:left; + background-color: $time-box-bg-color; + color: $time-box-text-color; + padding:0 5px 0 4px; + margin:0 0 0 3px; + } + + .eventCalendar-eventTitle { + display:block; + clear:both; + + font-weight:bold; + text-decoration:none; + } + + + a { + &.eventCalendar-eventTitle { + color:$event-title-color; + &:hover { + text-decoration:underline; + } + } + } + + .eventDesc { + clear: both; + margin:0 0 5px 0; + font-size:80%; + line-height:1.2em; + } + + + }//li + + .eventCalendar-noEvents { + font-size:120%; + border-radius:4px; + margin:5px; + padding:5px; + + background-color:#ccc; + color:#fff; + text-align:center; + font-weight:bold; + box-shadow:0 0 10px #ccc; + text-shadow:0 0 3px #aaa; + } + + + }//list + + +}//.eventCalendar + +li { + &.eventCalendar-day { + + &.today a:hover { + background-color:#ccc; + /* loco box-shadow:inset 5px 5px 10px #999;*/ + } + + &.eventCalendar-dayWithEvents a:hover { + background-color: lighten($event-cell-bg-color, 18%); + /* loco box-shadow:inset 5px 5px 10px #89B814; + text-shadow: 2px 2px 2px #89B814;*/ + } + + &.current a:hover { + /* loco*/ + background-color:#79BDCC; + box-shadow:inset 5px 5px 10px #449FB2; + text-shadow: 2px 2px 2px #449FB2; + } + + } +} + +/* Bt */ + +.bt { + font-size:12px; + display:block; + clear:both; + text-align: center; + margin-top:10px; + padding: 9px 34px 11px; + text-decoration: none; + font-weight: bold; + line-height: 1; + + color: #ffffff; + background-color: #698B10; + background-repeat: repeat-x; + + background-image: -khtml-gradient(linear, left top, left bottom, from(#89B814), to(#698B10)); + background-image: -moz-linear-gradient(top, #89B814, #698B10); + background-image: -ms-linear-gradient(top, #89B814, #698B10); + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #89B814), color-stop(100%, #698B10)); + background-image: -webkit-linear-gradient(top, #89B814, #698B10); + background-image: -o-linear-gradient(top, #89B814, #698B10); + background-image: linear-gradient(top, #89B814, #698B10); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#89B814', endColorstr='#698B10', GradientType=0); + + text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); + + border: 1px solid #698B10; + border-color: #698B10 #698B10 #465F05; + + border-radius: 4px; + + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); + + -webkit-transition: 0.1s linear all; + -moz-transition: 0.1s linear all; + -ms-transition: 0.1s linear all; + -o-transition: 0.1s linear all; + transition: 0.1s linear all; + + &:hover { + background-position: 0 -15px; + text-decoration: none; + } +}