@aquera/nile-elements 0.0.86 → 0.0.87
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -0
- package/dist/index.iife.js +5 -0
- package/dist/nile-calendar/nile-calendar.css.cjs.js +1 -1
- package/dist/nile-calendar/nile-calendar.css.cjs.js.map +1 -1
- package/dist/nile-calendar/nile-calendar.css.esm.js +5 -0
- package/dist/src/nile-calendar/nile-calendar.css.js +5 -0
- package/dist/src/nile-calendar/nile-calendar.css.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/nile-calendar/nile-calendar.css.ts +5 -0
package/README.md
CHANGED
|
@@ -79,6 +79,9 @@ To run a local development server that serves the basic demo located in `demo/in
|
|
|
79
79
|
|
|
80
80
|
In this section, you can find the updates for each release of `nile-elements`. It's a good practice to maintain detailed release notes to help users and developers understand what changes have been made from one version to another and how these changes might affect their projects.
|
|
81
81
|
|
|
82
|
+
#### Version 0.0.87
|
|
83
|
+
- nile-calendar - Fixed allowed dates issue.
|
|
84
|
+
|
|
82
85
|
#### Version 0.0.86
|
|
83
86
|
- nile-title - New component (replacement for aq-title)
|
|
84
87
|
|
package/dist/index.iife.js
CHANGED
|
@@ -5172,6 +5172,11 @@ const rN=Symbol.for(""),xN=M=>{if((null==M?void 0:M.r)===rN)return null==M?void
|
|
|
5172
5172
|
background: #005EA6;
|
|
5173
5173
|
}
|
|
5174
5174
|
|
|
5175
|
+
.not-allowed{
|
|
5176
|
+
color: #7f7f7f;
|
|
5177
|
+
pointer-events: none;
|
|
5178
|
+
}
|
|
5179
|
+
|
|
5175
5180
|
/* Date CSS_END */
|
|
5176
5181
|
|
|
5177
5182
|
.calender-input {
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
System.register(["../index-c7ad3b47.cjs.js"],function(_export,_context){"use strict";var e,_templateObject,a;function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0);}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}));}return{setters:[function(_index001CjsJs){e=_index001CjsJs.i;}],execute:function execute(){_export("s",a=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n :host {\n }\n\n .base {\n background-color: white;\n border-radius: 8px;\n width: 300px;\n box-shadow: 0px 8px 8px -4px #10182808;\n box-shadow: 0px 20px 24px -4px #10182814;\n }\n\n .calendar-container {\n font-family: var(--nile-font-family-serif);\n width: 100%;\n height: auto;\n text-align: center;\n background: white;\n border-radius: 8px;\n }\n\n .calendar-wrapper {\n background: white;\n display: flex;\n justify-content: space-between;\n width: 100%;\n border-radius: 8px;\n }\n\n .calendar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n padding: 22px 20px;\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .calendar-header__month-navigation {\n cursor: pointer;\n }\n\n /* Date CSS_START */\n\n .days_container {\n\t\tdisplay: grid;\n padding: 0 12px 12px 12px;\n\t\tgrid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;\n\t\tgrid-row-gap: var(--nile-spacing-spacing-xs, 3px);\n }\n\n\n @media not all and (min-resolution: .001dpcm) {\n @supports (-webkit-appearance:none)\n { .day-names, .days_container {\n /* column-gap: 6px; */\n }\n }\n }\n\n .day_date ,.day_name{\n\t\tfont-family: var( --nile-font-family-serif);\n\t\tfont-style: normal;\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\ttext-align: center;\n\n\t\t/* width: 40px;\n\t\theight: 30px; */\n\t\tpadding: 5px 8px;\n\t\tdisplay:grid;\n\t\tplace-items:center;\n }\n\n .day_name{\n font-weight:500;\n }\n\n .day_date{\n font-weight:400;\n }\n\n\t.current__date__dot{\n\t\tbackground-color:white;\n\t\tposition:absolute;\n\t\tborder-radius:50%;\n\t\theight:5px;\n\t\twidth:5px;\n\t\tleft:25%;\n\t\ttop:90%;\n\t}\n\n .day_date:not(.range-start, .selected-date, .range-end) .current__date__dot{\n\t\tbackground-color:var(--nile-colors-primary-600,#005EA6);\n }\n\n\n .day_date:hover {\n background-color: #F9FAFB;\n }\n\n .filler {\n color: #7f7f7f;\n pointer-events: none;\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n .selected-date:hover {\n background: #005EA6;\n }\n\n .selected-date,\n .range-start,\n .range-end {\n border-radius: 4px;\n background: #005EA6;\n color: white;\n }\n\n .selected-date:hover,\n .range-start:hover,\n .range-end:hover,\n .day_date.in-range:hover {\n background: #005291;\n }\n\n .range-start.in-range {\n background: #005EA6;\n border-radius: 4px 0 0 4px;\n color: white;\n }\n\n .range-end {\n background: #005EA6;\n border-radius: 0 4px 4px 0;\n color: white;\n }\n\n .range-middle {\n background: #005EA6;\n color: white;\n border-radius: 0;\n }\n\n .day_date.selected {\n background: #005EA6;\n color: white;\n border-radius: 4px;\n }\n\n .day_date.in-range:not(.range-start,.range-end, .selected-date) {\n background: #e5e9eb;\n /* color: white; */\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n /* Date CSS_END */\n\n .calender-input {\n box-sizing:border-box;\n padding: 0 16px;\n width:100%;\n justify-content: space-between;\n display: flex;\n gap:8px;\n flex-wrap: wrap;\n }\n\n .from {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n width: auto;\n }\n\n .manual-input-label {\n color: #7f7f7f;\n font-family: Colfax-regular;\n font-size: 12px;\n font-weight: 500;\n line-height: 12px;\n letter-spacing: 0.2px;\n }\n\n .button-container {\n width: 100%;\n text-align: right;\n padding: 12px 16px 16px 16px;\n box-sizing: border-box;\n }\n\n .calendar-config {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .calendar-switcher {\n width: 100%;\n margin: 0 12px;\n margin-top: 16px;\n }\n\n .calendar-switcher ::part(active-tab-indicator){\n bottom:-2px;\n }\n\n .units-wrapper{\n width:min-content;\n margin:auto;\n }\n\n .unit-container{\n display:grid;\n grid-template-columns: auto auto;\n row-gap:var(--nile-spacing-spacing-2xl);\n column-gap: var(--nile-spacing-spacing-sm);\n padding: 16px;\n padding-bottom: 0;\n }\n \n .duration-name{\n display:flex;\n align-items:center;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 20px; \n }\n \n .duration-units{\n display:flex;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n }\n\n .duration__value{\n display: grid;\n place-items:center;\n width: 34px;\n height: 34px;\n cursor: pointer;\n border-radius: 4px;\n }\n\n .duration__value:hover{\n background:#F9FAFB;\n }\n\n .duration__value--selected{\n background-color:#005EA6;\n color: white;\n }\n\n .duration__value--selected:hover{\n background:#005291;\n }\n\n .hidden {\n display: none !important;\n }\n\n .unit-input-container {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n padding: 0 16px;\n padding-top: 16px;\n }\n\n .duration-input,.time-input,.manual-input {\n width: 125px;\n }\n"]))));}};});
|
|
1
|
+
System.register(["../index-c7ad3b47.cjs.js"],function(_export,_context){"use strict";var e,_templateObject,a;function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0);}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}));}return{setters:[function(_index001CjsJs){e=_index001CjsJs.i;}],execute:function execute(){_export("s",a=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n :host {\n }\n\n .base {\n background-color: white;\n border-radius: 8px;\n width: 300px;\n box-shadow: 0px 8px 8px -4px #10182808;\n box-shadow: 0px 20px 24px -4px #10182814;\n }\n\n .calendar-container {\n font-family: var(--nile-font-family-serif);\n width: 100%;\n height: auto;\n text-align: center;\n background: white;\n border-radius: 8px;\n }\n\n .calendar-wrapper {\n background: white;\n display: flex;\n justify-content: space-between;\n width: 100%;\n border-radius: 8px;\n }\n\n .calendar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n padding: 22px 20px;\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .calendar-header__month-navigation {\n cursor: pointer;\n }\n\n /* Date CSS_START */\n\n .days_container {\n\t\tdisplay: grid;\n padding: 0 12px 12px 12px;\n\t\tgrid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;\n\t\tgrid-row-gap: var(--nile-spacing-spacing-xs, 3px);\n }\n\n\n @media not all and (min-resolution: .001dpcm) {\n @supports (-webkit-appearance:none)\n { .day-names, .days_container {\n /* column-gap: 6px; */\n }\n }\n }\n\n .day_date ,.day_name{\n\t\tfont-family: var( --nile-font-family-serif);\n\t\tfont-style: normal;\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\ttext-align: center;\n\n\t\t/* width: 40px;\n\t\theight: 30px; */\n\t\tpadding: 5px 8px;\n\t\tdisplay:grid;\n\t\tplace-items:center;\n }\n\n .day_name{\n font-weight:500;\n }\n\n .day_date{\n font-weight:400;\n }\n\n\t.current__date__dot{\n\t\tbackground-color:white;\n\t\tposition:absolute;\n\t\tborder-radius:50%;\n\t\theight:5px;\n\t\twidth:5px;\n\t\tleft:25%;\n\t\ttop:90%;\n\t}\n\n .day_date:not(.range-start, .selected-date, .range-end) .current__date__dot{\n\t\tbackground-color:var(--nile-colors-primary-600,#005EA6);\n }\n\n\n .day_date:hover {\n background-color: #F9FAFB;\n }\n\n .filler {\n color: #7f7f7f;\n pointer-events: none;\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n .selected-date:hover {\n background: #005EA6;\n }\n\n .selected-date,\n .range-start,\n .range-end {\n border-radius: 4px;\n background: #005EA6;\n color: white;\n }\n\n .selected-date:hover,\n .range-start:hover,\n .range-end:hover,\n .day_date.in-range:hover {\n background: #005291;\n }\n\n .range-start.in-range {\n background: #005EA6;\n border-radius: 4px 0 0 4px;\n color: white;\n }\n\n .range-end {\n background: #005EA6;\n border-radius: 0 4px 4px 0;\n color: white;\n }\n\n .range-middle {\n background: #005EA6;\n color: white;\n border-radius: 0;\n }\n\n .day_date.selected {\n background: #005EA6;\n color: white;\n border-radius: 4px;\n }\n\n .day_date.in-range:not(.range-start,.range-end, .selected-date) {\n background: #e5e9eb;\n /* color: white; */\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n .not-allowed{\n color: #7f7f7f;\n pointer-events: none;\n }\n\n /* Date CSS_END */\n\n .calender-input {\n box-sizing:border-box;\n padding: 0 16px;\n width:100%;\n justify-content: space-between;\n display: flex;\n gap:8px;\n flex-wrap: wrap;\n }\n\n .from {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n width: auto;\n }\n\n .manual-input-label {\n color: #7f7f7f;\n font-family: Colfax-regular;\n font-size: 12px;\n font-weight: 500;\n line-height: 12px;\n letter-spacing: 0.2px;\n }\n\n .button-container {\n width: 100%;\n text-align: right;\n padding: 12px 16px 16px 16px;\n box-sizing: border-box;\n }\n\n .calendar-config {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .calendar-switcher {\n width: 100%;\n margin: 0 12px;\n margin-top: 16px;\n }\n\n .calendar-switcher ::part(active-tab-indicator){\n bottom:-2px;\n }\n\n .units-wrapper{\n width:min-content;\n margin:auto;\n }\n\n .unit-container{\n display:grid;\n grid-template-columns: auto auto;\n row-gap:var(--nile-spacing-spacing-2xl);\n column-gap: var(--nile-spacing-spacing-sm);\n padding: 16px;\n padding-bottom: 0;\n }\n \n .duration-name{\n display:flex;\n align-items:center;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 20px; \n }\n \n .duration-units{\n display:flex;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n }\n\n .duration__value{\n display: grid;\n place-items:center;\n width: 34px;\n height: 34px;\n cursor: pointer;\n border-radius: 4px;\n }\n\n .duration__value:hover{\n background:#F9FAFB;\n }\n\n .duration__value--selected{\n background-color:#005EA6;\n color: white;\n }\n\n .duration__value--selected:hover{\n background:#005291;\n }\n\n .hidden {\n display: none !important;\n }\n\n .unit-input-container {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n padding: 0 16px;\n padding-top: 16px;\n }\n\n .duration-input,.time-input,.manual-input {\n width: 125px;\n }\n"]))));}};});
|
|
2
2
|
//# sourceMappingURL=nile-calendar.css.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-calendar.css.cjs.js","sources":["../../../src/nile-calendar/nile-calendar.css.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit-element';\n\n/**\n * DatePicker CSS\n */\nexport const styles = css`\n :host {\n }\n\n .base {\n background-color: white;\n border-radius: 8px;\n width: 300px;\n box-shadow: 0px 8px 8px -4px #10182808;\n box-shadow: 0px 20px 24px -4px #10182814;\n }\n\n .calendar-container {\n font-family: var(--nile-font-family-serif);\n width: 100%;\n height: auto;\n text-align: center;\n background: white;\n border-radius: 8px;\n }\n\n .calendar-wrapper {\n background: white;\n display: flex;\n justify-content: space-between;\n width: 100%;\n border-radius: 8px;\n }\n\n .calendar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n padding: 22px 20px;\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .calendar-header__month-navigation {\n cursor: pointer;\n }\n\n /* Date CSS_START */\n\n .days_container {\n\t\tdisplay: grid;\n padding: 0 12px 12px 12px;\n\t\tgrid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;\n\t\tgrid-row-gap: var(--nile-spacing-spacing-xs, 3px);\n }\n\n\n @media not all and (min-resolution: .001dpcm) {\n @supports (-webkit-appearance:none)\n { .day-names, .days_container {\n /* column-gap: 6px; */\n }\n }\n }\n\n .day_date ,.day_name{\n\t\tfont-family: var( --nile-font-family-serif);\n\t\tfont-style: normal;\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\ttext-align: center;\n\n\t\t/* width: 40px;\n\t\theight: 30px; */\n\t\tpadding: 5px 8px;\n\t\tdisplay:grid;\n\t\tplace-items:center;\n }\n\n .day_name{\n font-weight:500;\n }\n\n .day_date{\n font-weight:400;\n }\n\n\t.current__date__dot{\n\t\tbackground-color:white;\n\t\tposition:absolute;\n\t\tborder-radius:50%;\n\t\theight:5px;\n\t\twidth:5px;\n\t\tleft:25%;\n\t\ttop:90%;\n\t}\n\n .day_date:not(.range-start, .selected-date, .range-end) .current__date__dot{\n\t\tbackground-color:var(--nile-colors-primary-600,#005EA6);\n }\n\n\n .day_date:hover {\n background-color: #F9FAFB;\n }\n\n .filler {\n color: #7f7f7f;\n pointer-events: none;\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n .selected-date:hover {\n background: #005EA6;\n }\n\n .selected-date,\n .range-start,\n .range-end {\n border-radius: 4px;\n background: #005EA6;\n color: white;\n }\n\n .selected-date:hover,\n .range-start:hover,\n .range-end:hover,\n .day_date.in-range:hover {\n background: #005291;\n }\n\n .range-start.in-range {\n background: #005EA6;\n border-radius: 4px 0 0 4px;\n color: white;\n }\n\n .range-end {\n background: #005EA6;\n border-radius: 0 4px 4px 0;\n color: white;\n }\n\n .range-middle {\n background: #005EA6;\n color: white;\n border-radius: 0;\n }\n\n .day_date.selected {\n background: #005EA6;\n color: white;\n border-radius: 4px;\n }\n\n .day_date.in-range:not(.range-start,.range-end, .selected-date) {\n background: #e5e9eb;\n /* color: white; */\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n /* Date CSS_END */\n\n .calender-input {\n box-sizing:border-box;\n padding: 0 16px;\n width:100%;\n justify-content: space-between;\n display: flex;\n gap:8px;\n flex-wrap: wrap;\n }\n\n .from {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n width: auto;\n }\n\n .manual-input-label {\n color: #7f7f7f;\n font-family: Colfax-regular;\n font-size: 12px;\n font-weight: 500;\n line-height: 12px;\n letter-spacing: 0.2px;\n }\n\n .button-container {\n width: 100%;\n text-align: right;\n padding: 12px 16px 16px 16px;\n box-sizing: border-box;\n }\n\n .calendar-config {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .calendar-switcher {\n width: 100%;\n margin: 0 12px;\n margin-top: 16px;\n }\n\n .calendar-switcher ::part(active-tab-indicator){\n bottom:-2px;\n }\n\n .units-wrapper{\n width:min-content;\n margin:auto;\n }\n\n .unit-container{\n display:grid;\n grid-template-columns: auto auto;\n row-gap:var(--nile-spacing-spacing-2xl);\n column-gap: var(--nile-spacing-spacing-sm);\n padding: 16px;\n padding-bottom: 0;\n }\n \n .duration-name{\n display:flex;\n align-items:center;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 20px; \n }\n \n .duration-units{\n display:flex;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n }\n\n .duration__value{\n display: grid;\n place-items:center;\n width: 34px;\n height: 34px;\n cursor: pointer;\n border-radius: 4px;\n }\n\n .duration__value:hover{\n background:#F9FAFB;\n }\n\n .duration__value--selected{\n background-color:#005EA6;\n color: white;\n }\n\n .duration__value--selected:hover{\n background:#005291;\n }\n\n .hidden {\n display: none !important;\n }\n\n .unit-input-container {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n padding: 0 16px;\n padding-top: 16px;\n }\n\n .duration-input,.time-input,.manual-input {\n width: 125px;\n }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"wXAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
|
|
1
|
+
{"version":3,"file":"nile-calendar.css.cjs.js","sources":["../../../src/nile-calendar/nile-calendar.css.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit-element';\n\n/**\n * DatePicker CSS\n */\nexport const styles = css`\n :host {\n }\n\n .base {\n background-color: white;\n border-radius: 8px;\n width: 300px;\n box-shadow: 0px 8px 8px -4px #10182808;\n box-shadow: 0px 20px 24px -4px #10182814;\n }\n\n .calendar-container {\n font-family: var(--nile-font-family-serif);\n width: 100%;\n height: auto;\n text-align: center;\n background: white;\n border-radius: 8px;\n }\n\n .calendar-wrapper {\n background: white;\n display: flex;\n justify-content: space-between;\n width: 100%;\n border-radius: 8px;\n }\n\n .calendar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n padding: 22px 20px;\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .calendar-header__month-navigation {\n cursor: pointer;\n }\n\n /* Date CSS_START */\n\n .days_container {\n\t\tdisplay: grid;\n padding: 0 12px 12px 12px;\n\t\tgrid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;\n\t\tgrid-row-gap: var(--nile-spacing-spacing-xs, 3px);\n }\n\n\n @media not all and (min-resolution: .001dpcm) {\n @supports (-webkit-appearance:none)\n { .day-names, .days_container {\n /* column-gap: 6px; */\n }\n }\n }\n\n .day_date ,.day_name{\n\t\tfont-family: var( --nile-font-family-serif);\n\t\tfont-style: normal;\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\ttext-align: center;\n\n\t\t/* width: 40px;\n\t\theight: 30px; */\n\t\tpadding: 5px 8px;\n\t\tdisplay:grid;\n\t\tplace-items:center;\n }\n\n .day_name{\n font-weight:500;\n }\n\n .day_date{\n font-weight:400;\n }\n\n\t.current__date__dot{\n\t\tbackground-color:white;\n\t\tposition:absolute;\n\t\tborder-radius:50%;\n\t\theight:5px;\n\t\twidth:5px;\n\t\tleft:25%;\n\t\ttop:90%;\n\t}\n\n .day_date:not(.range-start, .selected-date, .range-end) .current__date__dot{\n\t\tbackground-color:var(--nile-colors-primary-600,#005EA6);\n }\n\n\n .day_date:hover {\n background-color: #F9FAFB;\n }\n\n .filler {\n color: #7f7f7f;\n pointer-events: none;\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n .selected-date:hover {\n background: #005EA6;\n }\n\n .selected-date,\n .range-start,\n .range-end {\n border-radius: 4px;\n background: #005EA6;\n color: white;\n }\n\n .selected-date:hover,\n .range-start:hover,\n .range-end:hover,\n .day_date.in-range:hover {\n background: #005291;\n }\n\n .range-start.in-range {\n background: #005EA6;\n border-radius: 4px 0 0 4px;\n color: white;\n }\n\n .range-end {\n background: #005EA6;\n border-radius: 0 4px 4px 0;\n color: white;\n }\n\n .range-middle {\n background: #005EA6;\n color: white;\n border-radius: 0;\n }\n\n .day_date.selected {\n background: #005EA6;\n color: white;\n border-radius: 4px;\n }\n\n .day_date.in-range:not(.range-start,.range-end, .selected-date) {\n background: #e5e9eb;\n /* color: white; */\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n .not-allowed{\n color: #7f7f7f;\n pointer-events: none;\n }\n\n /* Date CSS_END */\n\n .calender-input {\n box-sizing:border-box;\n padding: 0 16px;\n width:100%;\n justify-content: space-between;\n display: flex;\n gap:8px;\n flex-wrap: wrap;\n }\n\n .from {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n width: auto;\n }\n\n .manual-input-label {\n color: #7f7f7f;\n font-family: Colfax-regular;\n font-size: 12px;\n font-weight: 500;\n line-height: 12px;\n letter-spacing: 0.2px;\n }\n\n .button-container {\n width: 100%;\n text-align: right;\n padding: 12px 16px 16px 16px;\n box-sizing: border-box;\n }\n\n .calendar-config {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .calendar-switcher {\n width: 100%;\n margin: 0 12px;\n margin-top: 16px;\n }\n\n .calendar-switcher ::part(active-tab-indicator){\n bottom:-2px;\n }\n\n .units-wrapper{\n width:min-content;\n margin:auto;\n }\n\n .unit-container{\n display:grid;\n grid-template-columns: auto auto;\n row-gap:var(--nile-spacing-spacing-2xl);\n column-gap: var(--nile-spacing-spacing-sm);\n padding: 16px;\n padding-bottom: 0;\n }\n \n .duration-name{\n display:flex;\n align-items:center;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 20px; \n }\n \n .duration-units{\n display:flex;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n }\n\n .duration__value{\n display: grid;\n place-items:center;\n width: 34px;\n height: 34px;\n cursor: pointer;\n border-radius: 4px;\n }\n\n .duration__value:hover{\n background:#F9FAFB;\n }\n\n .duration__value--selected{\n background-color:#005EA6;\n color: white;\n }\n\n .duration__value--selected:hover{\n background:#005291;\n }\n\n .hidden {\n display: none !important;\n }\n\n .unit-input-container {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n padding: 0 16px;\n padding-top: 16px;\n }\n\n .duration-input,.time-input,.manual-input {\n width: 125px;\n }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"wXAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-calendar.css.js","sourceRoot":"","sources":["../../../src/nile-calendar/nile-calendar.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"nile-calendar.css.js","sourceRoot":"","sources":["../../../src/nile-calendar/nile-calendar.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsSxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit-element';\n\n/**\n * DatePicker CSS\n */\nexport const styles = css`\n :host {\n }\n\n .base {\n background-color: white;\n border-radius: 8px;\n width: 300px;\n box-shadow: 0px 8px 8px -4px #10182808;\n box-shadow: 0px 20px 24px -4px #10182814;\n }\n\n .calendar-container {\n font-family: var(--nile-font-family-serif);\n width: 100%;\n height: auto;\n text-align: center;\n background: white;\n border-radius: 8px;\n }\n\n .calendar-wrapper {\n background: white;\n display: flex;\n justify-content: space-between;\n width: 100%;\n border-radius: 8px;\n }\n\n .calendar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n padding: 22px 20px;\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .calendar-header__month-navigation {\n cursor: pointer;\n }\n\n /* Date CSS_START */\n\n .days_container {\n\t\tdisplay: grid;\n padding: 0 12px 12px 12px;\n\t\tgrid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;\n\t\tgrid-row-gap: var(--nile-spacing-spacing-xs, 3px);\n }\n\n\n @media not all and (min-resolution: .001dpcm) {\n @supports (-webkit-appearance:none)\n { .day-names, .days_container {\n /* column-gap: 6px; */\n }\n }\n }\n\n .day_date ,.day_name{\n\t\tfont-family: var( --nile-font-family-serif);\n\t\tfont-style: normal;\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\ttext-align: center;\n\n\t\t/* width: 40px;\n\t\theight: 30px; */\n\t\tpadding: 5px 8px;\n\t\tdisplay:grid;\n\t\tplace-items:center;\n }\n\n .day_name{\n font-weight:500;\n }\n\n .day_date{\n font-weight:400;\n }\n\n\t.current__date__dot{\n\t\tbackground-color:white;\n\t\tposition:absolute;\n\t\tborder-radius:50%;\n\t\theight:5px;\n\t\twidth:5px;\n\t\tleft:25%;\n\t\ttop:90%;\n\t}\n\n .day_date:not(.range-start, .selected-date, .range-end) .current__date__dot{\n\t\tbackground-color:var(--nile-colors-primary-600,#005EA6);\n }\n\n\n .day_date:hover {\n background-color: #F9FAFB;\n }\n\n .filler {\n color: #7f7f7f;\n pointer-events: none;\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n .selected-date:hover {\n background: #005EA6;\n }\n\n .selected-date,\n .range-start,\n .range-end {\n border-radius: 4px;\n background: #005EA6;\n color: white;\n }\n\n .selected-date:hover,\n .range-start:hover,\n .range-end:hover,\n .day_date.in-range:hover {\n background: #005291;\n }\n\n .range-start.in-range {\n background: #005EA6;\n border-radius: 4px 0 0 4px;\n color: white;\n }\n\n .range-end {\n background: #005EA6;\n border-radius: 0 4px 4px 0;\n color: white;\n }\n\n .range-middle {\n background: #005EA6;\n color: white;\n border-radius: 0;\n }\n\n .day_date.selected {\n background: #005EA6;\n color: white;\n border-radius: 4px;\n }\n\n .day_date.in-range:not(.range-start,.range-end, .selected-date) {\n background: #e5e9eb;\n /* color: white; */\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n .not-allowed{\n color: #7f7f7f;\n pointer-events: none;\n }\n\n /* Date CSS_END */\n\n .calender-input {\n box-sizing:border-box;\n padding: 0 16px;\n width:100%;\n justify-content: space-between;\n display: flex;\n gap:8px;\n flex-wrap: wrap;\n }\n\n .from {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n width: auto;\n }\n\n .manual-input-label {\n color: #7f7f7f;\n font-family: Colfax-regular;\n font-size: 12px;\n font-weight: 500;\n line-height: 12px;\n letter-spacing: 0.2px;\n }\n\n .button-container {\n width: 100%;\n text-align: right;\n padding: 12px 16px 16px 16px;\n box-sizing: border-box;\n }\n\n .calendar-config {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .calendar-switcher {\n width: 100%;\n margin: 0 12px;\n margin-top: 16px;\n }\n\n .calendar-switcher ::part(active-tab-indicator){\n bottom:-2px;\n }\n\n .units-wrapper{\n width:min-content;\n margin:auto;\n }\n\n .unit-container{\n display:grid;\n grid-template-columns: auto auto;\n row-gap:var(--nile-spacing-spacing-2xl);\n column-gap: var(--nile-spacing-spacing-sm);\n padding: 16px;\n padding-bottom: 0;\n }\n \n .duration-name{\n display:flex;\n align-items:center;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 20px; \n }\n \n .duration-units{\n display:flex;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n }\n\n .duration__value{\n display: grid;\n place-items:center;\n width: 34px;\n height: 34px;\n cursor: pointer;\n border-radius: 4px;\n }\n\n .duration__value:hover{\n background:#F9FAFB;\n }\n\n .duration__value--selected{\n background-color:#005EA6;\n color: white;\n }\n\n .duration__value--selected:hover{\n background:#005291;\n }\n\n .hidden {\n display: none !important;\n }\n\n .unit-input-container {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n padding: 0 16px;\n padding-top: 16px;\n }\n\n .duration-input,.time-input,.manual-input {\n width: 125px;\n }\n`;\n\nexport default [styles];\n"]}
|