diff --git a/.github/workflows/prettier.yml b/.github/workflows/prettier.yml index 576783f04..330a57729 100644 --- a/.github/workflows/prettier.yml +++ b/.github/workflows/prettier.yml @@ -7,6 +7,6 @@ jobs: runs-on: ubuntu-latest steps: - uses: actions/checkout@v2 - - run: npx prettier@3.0.3 --check www + - run: npx prettier@3.1.0 --check www diff --git a/.gitignore b/.gitignore index bdf59df4f..7fcb2964d 100644 --- a/.gitignore +++ b/.gitignore @@ -4,6 +4,7 @@ node_modules/ platforms/ plugins/ +dist/ www/lib/ package-hooks/ .DS_Store diff --git a/.prettierignore b/.prettierignore index 988aead62..090654d94 100644 --- a/.prettierignore +++ b/.prettierignore @@ -1,6 +1,5 @@ -# Ignore www/dist, manual_lib, json +# Ignore www/dist, json www/dist -www/manual_lib www/json # Ignore all HTML files: diff --git a/jest.config.js b/jest.config.js index e00409ff1..6a1dcd42b 100644 --- a/jest.config.js +++ b/jest.config.js @@ -2,10 +2,10 @@ module.exports = { testEnvironment: 'jsdom', testPathIgnorePatterns: [ "/node_modules/", + "/dist/", "/platforms/", "/plugins/", "/lib/", - "/manual_lib/" ], preset: 'react-native', transform: { diff --git a/package.cordovabuild.json b/package.cordovabuild.json index 7175c347f..543c03d60 100644 --- a/package.cordovabuild.json +++ b/package.cordovabuild.json @@ -28,7 +28,6 @@ "@types/luxon": "^3.3.0", "@types/react": "^18.2.20", "babel-loader": "^9.1.2", - "babel-plugin-angularjs-annotate": "^0.10.0", "babel-plugin-optional-require": "^0.3.1", "concurrently": "^8.0.1", "cordova": "^11.1.0", @@ -106,15 +105,7 @@ "@react-navigation/native": "^6.1.7", "@react-navigation/stack": "^6.3.17", "@shopify/flash-list": "^1.3.1", - "@types/leaflet": "1.9.4", - "angular": "1.6.7", - "angular-animate": "1.6.7", - "angular-local-storage": "^0.7.1", - "angular-sanitize": "1.6.7", - "angular-simple-logger": "^0.1.7", - "angular-translate": "^2.18.1", - "angular-translate-loader-static-files": "^2.18.1", - "angular-ui-router": "0.2.13", + "@types/leaflet": "^1.9.4", "animate.css": "^3.5.2", "bottleneck": "^2.19.5", "chart.js": "^4.3.0", @@ -146,25 +137,19 @@ "enketo-transformer": "^4.0.0", "fast-xml-parser": "^4.2.2", "fs-extra": "^9.0.1", - "humanize-duration": "3.31.0", - "i18next": "^22.5.0", + "humanize-duration": "^3.31.0", + "i18next": "^23.7.6", "install": "^0.13.0", - "ionic-datepicker": "1.2.1", - "ionic-toast": "^0.4.1", - "jquery": "^3.1.0", "klaw-sync": "^6.0.0", "leaflet": "^1.9.4", "luxon": "^3.3.0", - "moment": "^2.29.4", - "moment-timezone": "^0.5.43", - "ng-i18next": "^1.0.7", "npm": "^9.6.3", "phonegap-plugin-barcodescanner": "git+https://github.com/phonegap/phonegap-plugin-barcodescanner#v8.1.0", "prop-types": "^15.8.1", "react": "^18.2.*", "react-chartjs-2": "^5.2.0", "react-dom": "^18.2.*", - "react-i18next": "^12.3.1", + "react-i18next": "^13.5.0", "react-native-paper": "^5.8.0", "react-native-paper-dates": "^0.18.12", "react-native-safe-area-context": "^4.6.3", diff --git a/package.serve.json b/package.serve.json index d35ab71de..64cc65ca2 100644 --- a/package.serve.json +++ b/package.serve.json @@ -29,7 +29,6 @@ "@types/react": "^18.2.20", "babel-jest": "^29.7.0", "babel-loader": "^9.1.2", - "babel-plugin-angularjs-annotate": "^0.10.0", "babel-plugin-optional-require": "^0.3.1", "concurrently": "^8.0.1", "cordova": "^11.1.0", @@ -50,7 +49,7 @@ "url-loader": "^4.1.1", "webpack": "^5.0.1", "webpack-cli": "^5.0.1", - "prettier": "3.0.3" + "prettier": "3.1.0" }, "dependencies": { "@messageformat/core": "^3.2.0", @@ -58,15 +57,7 @@ "@react-navigation/stack": "^6.3.17", "@shopify/flash-list": "^1.3.1", "@types/jest": "^29.5.5", - "@types/leaflet": "1.9.4", - "angular": "1.6.7", - "angular-animate": "1.6.7", - "angular-local-storage": "^0.7.1", - "angular-sanitize": "1.6.7", - "angular-simple-logger": "^0.1.7", - "angular-translate": "^2.18.1", - "angular-translate-loader-static-files": "^2.18.1", - "angular-ui-router": "0.2.13", + "@types/leaflet": "^1.9.4", "animate.css": "^3.5.2", "bottleneck": "^2.19.5", "chart.js": "^4.3.0", @@ -77,24 +68,18 @@ "enketo-transformer": "^4.0.0", "fast-xml-parser": "^4.2.2", "fs-extra": "^9.0.1", - "humanize-duration": "3.31.0", - "i18next": "^22.5.0", + "humanize-duration": "^3.31.0", + "i18next": "^23.7.6", "install": "^0.13.0", - "ionic-datepicker": "1.2.1", - "ionic-toast": "^0.4.1", - "jquery": "^3.1.0", "klaw-sync": "^6.0.0", "leaflet": "^1.9.4", "luxon": "^3.3.0", - "moment": "^2.29.4", - "moment-timezone": "^0.5.43", - "ng-i18next": "^1.0.7", "npm": "^9.6.3", "prop-types": "^15.8.1", "react": "^18.2.*", "react-chartjs-2": "^5.2.0", "react-dom": "^18.2.*", - "react-i18next": "^12.3.1", + "react-i18next": "^13.5.0", "react-native-paper": "^5.8.0", "react-native-paper-dates": "^0.18.12", "react-native-safe-area-context": "^4.6.3", diff --git a/tsconfig.json b/tsconfig.json index 29384751e..d7181b706 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -4,13 +4,15 @@ "sourceMap": true, "module": "es6", "target": "es5", + "strictNullChecks": true, "downlevelIteration": true, "esModuleInterop": true, "resolveJsonModule": true, "jsx": "react", "allowJs": true, - "moduleResolution": "node" + "moduleResolution": "node", + "typeRoots": ["node_modules/@types", "www/js/types"], }, "include": ["www/**/*"], - "exclude": ["**/www/manual_lib/*", "**/node_modules/*", "**/dist/*"], + "exclude": ["**/node_modules/*", "**/dist/*"], } diff --git a/webpack.config.js b/webpack.config.js index 3e7e6d368..c31184a01 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -13,7 +13,6 @@ module.exports = { { test: /\.(scss|css)$/, include: [path.resolve(__dirname, 'www/css'), - path.resolve(__dirname, 'www/manual_lib'), path.resolve(__dirname, 'node_modules/enketo-core'), path.resolve(__dirname, 'node_modules/leaflet')], use: ['style-loader', 'css-loader', 'sass-loader'], @@ -57,11 +56,8 @@ module.exports = { ], }, plugins: [ - // to load jQuery and moment globally + // to load Leaflet globally new webpack.ProvidePlugin({ - $: 'jquery', - jQuery: 'jquery', - moment: 'moment', L: 'leaflet', }), new webpack.DefinePlugin({ diff --git a/webpack.prod.js b/webpack.prod.js index c08fc140c..231209d36 100644 --- a/webpack.prod.js +++ b/webpack.prod.js @@ -7,23 +7,6 @@ module.exports = merge(common, { devtool: 'source-map', module: { rules: [ - /* In production, Webpack minifies JS files and randomizes variable names. - This causes problems with AngularJS unless you use explicit annotations, - which we don't. - https://docs.angularjs.org/error/$injector/strictdi - (The syntax we use is like the 'bad' example: implicit annotations) - So rather than change every file in our codebase, I'm adding this - babel plugin which basically preprocesses our 'bad' code into 'good' code. - Only needed on production because minification doesn't happen on dev. */ - { - test: /\.(js)$/, - include: path.resolve(__dirname, 'www'), - loader: 'babel-loader', - options: { - presets: ['@babel/preset-env'], - plugins: ["angularjs-annotate"], - }, - }, { test: /\.(js|jsx|ts|tsx)$/, loader: 'babel-loader', diff --git a/www/__mocks__/globalMocks.ts b/www/__mocks__/globalMocks.ts index a62c473b7..4d591f55f 100644 --- a/www/__mocks__/globalMocks.ts +++ b/www/__mocks__/globalMocks.ts @@ -8,7 +8,7 @@ export const mockLogger = () => { }; }; -let alerts = []; +let alerts: string[] = []; export const mockAlert = () => { window['alert'] = (message) => { diff --git a/www/__mocks__/timelineHelperMocks.ts b/www/__mocks__/timelineHelperMocks.ts index 014e892cb..66011c4dd 100644 --- a/www/__mocks__/timelineHelperMocks.ts +++ b/www/__mocks__/timelineHelperMocks.ts @@ -1,4 +1,4 @@ -import { MetaData, BEMData, ServerResponse } from '../js/types/serverData'; +import { LocalDt, MetaData, BEMData, ServerResponse } from '../js/types/serverData'; import { CompositeTrip, ConfirmedPlace, @@ -15,7 +15,7 @@ const mockMetaData: MetaData = { platform: 'test', time_zone: 'America/Los_Angeles', write_fmt_time: '1969-07-16T07:01:49.000Z', - write_local_dt: null, + write_local_dt: null as any, origin_key: '1', }; @@ -24,9 +24,9 @@ export const mockLabelOptions: LabelOptions = { PURPOSE: null, REPLACED_MODE: null, translations: null, -}; +} as unknown as LabelOptions; -const mockConfirmedPlaceData: ConfirmedPlace = { +const mockConfirmedPlaceData = { source: 'DwellSegmentationTimeFilter', key: null, origin_key: null, @@ -46,14 +46,15 @@ const mockConfirmedPlaceData: ConfirmedPlace = { raw_places: [null, null], enter_ts: 1437578093.881, exit_ts: 1437578093.881, -}; +} as unknown as ConfirmedPlace; + // using parse/stringify to deep copy & populate data let tempMetaData = JSON.parse(JSON.stringify(mockMetaData)); tempMetaData.write_ts = 2; tempMetaData.origin_key = '2'; export const mockMetaDataTwo = tempMetaData; -export const mockUnprocessedTrip: UnprocessedTrip = { +export const mockUnprocessedTrip = { _id: { $oid: 'mockUnprocessedTrip' }, additions: [], confidence_threshold: 0.0, @@ -61,19 +62,14 @@ export const mockUnprocessedTrip: UnprocessedTrip = { duration: 3.0, end_fmt_time: '', end_loc: { type: 'Point', coordinates: [] }, - end_local_dt: null, - expectation: null, inferred_labels: [], key: 'mockUnprocessedTrip', locations: [], origin_key: '', source: '', - start_local_dt: null, start_ts: 0.1, start_loc: { type: 'Point', coordinates: [] }, - starting_trip: null, - user_input: null, -}; +} as unknown as UnprocessedTrip; export const mockCompData: ServerResponse = { phone_data: [ @@ -152,7 +148,8 @@ export const mockCompData: ServerResponse = { metadata: mockMetaData, }, ], -}; +} as unknown as ServerResponse; + // Setup for second mockData let newPhoneData = JSON.parse(JSON.stringify(mockCompData.phone_data[0])); newPhoneData.data._id.$oid = 'mockDataTwo'; @@ -188,18 +185,10 @@ export const mockTransitions: Array> = [ const mockFilterLocation: FilteredLocation = { accuracy: 0.1, - altitude: 100, - elapsedRealtimeNanos: 10000, - filter: 'time', - fmt_time: '', - heading: 1.0, latitude: 1.0, - loc: null, - local_dt: null, longitude: -1.0, - sensed_speed: 0, ts: 100, -}; +} as FilteredLocation; let mockFilterLocationTwo = JSON.parse(JSON.stringify(mockFilterLocation)); mockFilterLocationTwo.ts = 900; mockFilterLocationTwo.longitude = 200; @@ -216,38 +205,31 @@ export const mockFilterLocations: Array> = [ }, ]; -export const mockConfigModeOfStudy: AppConfig = { - server: null, +export const mockConfigModeOfStudy = { survey_info: { 'trip-labels': 'MULTILABEL', - surveys: null, }, intro: { mode_studied: 'sample_study', }, -}; -export const mockConfigNoModeOfStudy: AppConfig = { - server: null, +} as AppConfig; +export const mockConfigNoModeOfStudy = { survey_info: { 'trip-labels': 'MULTILABEL', - surveys: null, }, intro: {}, -}; -export const mockConfigEnketo: AppConfig = { - server: null, +} as AppConfig; +export const mockConfigEnketo = { survey_info: { 'trip-labels': 'ENKETO', surveys: { TripConfirmSurvey: { compatibleWith: 1.2, - formPath: null, - labelTemplate: null, - version: null, }, }, }, -}; + intro: {}, +} as unknown as AppConfig; // Used by jest.mocks() to return a various mocked objects. export const fakeStartTsOne = -14576291; diff --git a/www/__tests__/confirmHelper.test.ts b/www/__tests__/confirmHelper.test.ts index 6dd94b808..52cb9c0e8 100644 --- a/www/__tests__/confirmHelper.test.ts +++ b/www/__tests__/confirmHelper.test.ts @@ -14,6 +14,8 @@ import { } from '../js/survey/multilabel/confirmHelper'; import initializedI18next from '../js/i18nextInit'; +import { CompositeTrip, UserInputEntry } from '../js/types/diaryTypes'; +import { UserInputMap } from '../js/diary/LabelTabContext'; window['i18next'] = initializedI18next; mockLogger(); @@ -44,9 +46,12 @@ const fakeDefaultLabelOptions = { }, }; -CommHelper.fetchUrlCached = jest - .fn() - .mockImplementation(() => JSON.stringify(fakeDefaultLabelOptions)); +jest.mock('../js/services/commHelper', () => ({ + ...jest.requireActual('../js/services/commHelper'), + fetchUrlCached: jest + .fn() + .mockReturnValue(Promise.resolve(JSON.stringify(fakeDefaultLabelOptions))), +})); describe('confirmHelper', () => { it('returns labelOptions given an appConfig', async () => { @@ -111,7 +116,7 @@ describe('confirmHelper', () => { e-mission-server -> emission/tests/storageTests/TestTripQueries.py -> testExpandFinalLabels() */ it('has no final label for a trip with no user labels or inferred labels', () => { - const fakeTrip = {}; + const fakeTrip = {} as CompositeTrip; const fakeUserInput = {}; expect(inferFinalLabels(fakeTrip, fakeUserInput)).toEqual({}); expect(verifiabilityForTrip(fakeTrip, fakeUserInput)).toEqual('cannot-verify'); @@ -120,19 +125,19 @@ describe('confirmHelper', () => { it('returns a final inference for a trip no user labels and all high-confidence inferred labels', () => { const fakeTrip = { inferred_labels: [{ labels: { mode_confirm: 'walk', purpose_confirm: 'exercise' }, p: 0.9 }], - }; + } as CompositeTrip; const fakeUserInput = {}; const final = inferFinalLabels(fakeTrip, fakeUserInput); - expect(final.MODE.value).toEqual('walk'); - expect(final.PURPOSE.value).toEqual('exercise'); + expect(final.MODE?.value).toEqual('walk'); + expect(final.PURPOSE?.value).toEqual('exercise'); expect(verifiabilityForTrip(fakeTrip, fakeUserInput)).toEqual('can-verify'); }); it('gives no final inference when there are user labels and no inferred labels', () => { - const fakeTrip = {}; - const fakeUserInput = { - MODE: labelOptionByValue('bike', 'MODE'), - PURPOSE: labelOptionByValue('shopping', 'PURPOSE'), + const fakeTrip = {} as CompositeTrip; + const fakeUserInput: UserInputMap = { + MODE: { data: { label: 'bike' } } as UserInputEntry, + PURPOSE: { data: { label: 'shopping' } } as UserInputEntry, }; const final = inferFinalLabels(fakeTrip, fakeUserInput); expect(final.MODE?.value).toBeUndefined(); @@ -143,10 +148,10 @@ describe('confirmHelper', () => { it('still gives no final inference when there are user labels and high-confidence inferred labels', () => { const fakeTrip = { inferred_labels: [{ labels: { mode_confirm: 'walk', purpose_confirm: 'exercise' }, p: 0.9 }], - }; + } as CompositeTrip; const fakeUserInput = { - MODE: labelOptionByValue('bike', 'MODE'), - PURPOSE: labelOptionByValue('shopping', 'PURPOSE'), + MODE: { data: { label: 'bike' } } as UserInputEntry, + PURPOSE: { data: { label: 'shopping' } } as UserInputEntry, }; const final = inferFinalLabels(fakeTrip, fakeUserInput); expect(final.MODE?.value).toBeUndefined(); @@ -160,11 +165,13 @@ describe('confirmHelper', () => { { labels: { mode_confirm: 'bike', purpose_confirm: 'shopping' }, p: 0.1 }, { labels: { mode_confirm: 'walk', purpose_confirm: 'exercise' }, p: 0.9 }, ], + } as CompositeTrip; + const fakeUserInput = { + MODE: { data: { label: 'bike' } } as UserInputEntry, }; - const fakeUserInput = { MODE: labelOptionByValue('bike', 'MODE') }; const final = inferFinalLabels(fakeTrip, fakeUserInput); - expect(final.MODE.value).toEqual('bike'); - expect(final.PURPOSE.value).toEqual('shopping'); + expect(final.MODE?.value).toEqual('bike'); + expect(final.PURPOSE?.value).toEqual('shopping'); expect(verifiabilityForTrip(fakeTrip, fakeUserInput)).toEqual('can-verify'); }); }); diff --git a/www/__tests__/enketoHelper.test.ts b/www/__tests__/enketoHelper.test.ts index 3f5fb29a6..aedd7deec 100644 --- a/www/__tests__/enketoHelper.test.ts +++ b/www/__tests__/enketoHelper.test.ts @@ -5,6 +5,7 @@ import { resolveLabel, loadPreviousResponseForSurvey, saveResponse, + EnketoUserInputEntry, } from '../js/survey/enketo/enketoHelper'; import { mockBEMUserCache } from '../__mocks__/cordovaMocks'; import { mockLogger } from '../__mocks__/globalMocks'; @@ -12,6 +13,8 @@ import { getConfig, _test_resetStoredConfig } from '../../www/js/config/dynamicC import fakeConfig from '../__mocks__/fakeConfig.json'; import initializedI18next from '../js/i18nextInit'; +import { CompositeTrip } from '../js/types/diaryTypes'; +import { AppConfig } from '../js/types/appConfigTypes'; window['i18next'] = initializedI18next; mockBEMUserCache(fakeConfig); @@ -63,7 +66,7 @@ it('gets the model response, if avaliable, or returns null', () => { }; //if no xmlModel, returns null - expect(getInstanceStr(null, opts)).toBe(null); + expect(getInstanceStr('', opts)).toBe(null); //if there is a prefilled survey, return it expect(getInstanceStr(xmlModel, opts)).toBe(filled); //if there is a model and fields, return prefilled @@ -79,23 +82,23 @@ it('resolves the timestamps', () => { end_local_dt: { timezone: 'America/Los_Angeles' }, start_ts: 1469492672.928242, end_ts: 1469493031, - }; + } as CompositeTrip; //missing data returns null const missingData = ' 2016-08-28 2016-07-25 17:30:31.000-06:00 '; const missDataDoc = xmlParser.parseFromString(missingData, 'text/html'); - expect(resolveTimestamps(missDataDoc, timelineEntry)).toBeNull(); + expect(resolveTimestamps(missDataDoc, timelineEntry, () => {})).toBeNull(); //bad time returns undefined const badTimes = ' 2016-08-28 2016-07-25 17:32:32.928-06:00 17:30:31.000-06:00 '; const badTimeDoc = xmlParser.parseFromString(badTimes, 'text/xml'); - expect(resolveTimestamps(badTimeDoc, timelineEntry)).toBeUndefined(); + expect(resolveTimestamps(badTimeDoc, timelineEntry, () => {})).toBeUndefined(); //if within a minute, timelineEntry timestamps const timeEntry = ' 2016-07-25 2016-07-25 17:24:32.928-06:00 17:30:31.000-06:00 '; const xmlDoc1 = xmlParser.parseFromString(timeEntry, 'text/xml'); - expect(resolveTimestamps(xmlDoc1, timelineEntry)).toMatchObject({ + expect(resolveTimestamps(xmlDoc1, timelineEntry, () => {})).toMatchObject({ start_ts: 1469492672.928242, end_ts: 1469493031, }); @@ -103,7 +106,7 @@ it('resolves the timestamps', () => { const timeSurvey = ' 2016-07-25 2016-07-25 17:22:33.928-06:00 17:33:33.000-06:00 '; const xmlDoc2 = xmlParser.parseFromString(timeSurvey, 'text/xml'); - expect(resolveTimestamps(xmlDoc2, timelineEntry)).toMatchObject({ + expect(resolveTimestamps(xmlDoc2, timelineEntry, () => {})).toMatchObject({ start_ts: 1469492553.928, end_ts: 1469493213, }); @@ -203,7 +206,7 @@ it('resolves the label, if no labelVars, returns template', async () => { * @returns Promise of the saved result, or an Error if there was a problem */ // export function saveResponse(surveyName: string, enketoForm: Form, appConfig, opts: SurveyOptions) { -it('gets the saved result or throws an error', () => { +it('gets the saved result or throws an error', async () => { const surveyName = 'TimeUseSurvey'; const form = { getDataStr: () => { @@ -235,13 +238,13 @@ it('gets the saved result or throws an error', () => { }, }, }, - }; + } as unknown as AppConfig; const opts = { timelineEntry: { end_local_dt: { timezone: 'America/Los_Angeles' }, start_ts: 1469492672.928242, end_ts: 1469493031, - }, + } as CompositeTrip, }; console.log(config); @@ -249,10 +252,9 @@ it('gets the saved result or throws an error', () => { label: '1 Personal Care', name: 'TimeUseSurvey', }); - expect(saveResponse(surveyName, badForm, config, opts)).resolves.toMatchObject({ - message: - 'The times you entered are invalid. Please ensure that the start time is before the end time.', - }); + expect(async () => await saveResponse(surveyName, badForm, config, opts)).rejects.toEqual( + 'The times you entered are invalid. Please ensure that the start time is before the end time.', + ); }); /* @@ -282,12 +284,12 @@ it('filters the survey responses by their name and version', () => { { data: { label: 'Activity', //display label (this value is use for displaying on the button) - ts: '100000000', //the timestamp at which the survey was filled out (in seconds) + ts: 100000000, //the timestamp at which the survey was filled out (in seconds) fmt_time: '12:36', //the formatted timestamp at which the survey was filled out name: 'TimeUseSurvey', //survey name - version: '1', //survey version + version: 1, //survey version xmlResponse: '', //survey response XML string - jsonDocResponse: 'this is my json object', //survey response JSON object + jsonDocResponse: { this: 'is my json object' }, //survey response JSON object }, metadata: {}, }, @@ -300,36 +302,36 @@ it('filters the survey responses by their name and version', () => { { data: { label: 'Activity', //display label (this value is use for displaying on the button) - ts: '100000000', //the timestamp at which the survey was filled out (in seconds) + ts: 100000000, //the timestamp at which the survey was filled out (in seconds) fmt_time: '12:36', //the formatted timestamp at which the survey was filled out name: 'TimeUseSurvey', //survey name - version: '1', //survey version + version: 1, //survey version xmlResponse: '', //survey response XML string - jsonDocResponse: 'this is my json object', //survey response JSON object + jsonDocResponse: { this: 'is my json object' }, //survey response JSON object }, - metadata: {}, + metadata: {} as any, }, { data: { label: 'Activity', //display label (this value is use for displaying on the button) - ts: '100000000', //the timestamp at which the survey was filled out (in seconds) + ts: 100000000, //the timestamp at which the survey was filled out (in seconds) fmt_time: '12:36', //the formatted timestamp at which the survey was filled out name: 'OtherSurvey', //survey name - version: '1', //survey version + version: 1, //survey version xmlResponse: '', //survey response XML string - jsonDocResponse: 'this is my json object', //survey response JSON object + jsonDocResponse: { this: 'is my json object' }, //survey response JSON object }, - metadata: {}, + metadata: {} as any, }, { data: { label: 'Activity', //display label (this value is use for displaying on the button) - ts: '100000000', //the timestamp at which the survey was filled out (in seconds) + ts: 100000000, //the timestamp at which the survey was filled out (in seconds) fmt_time: '12:39', //the formatted timestamp at which the survey was filled out name: 'TimeUseSurvey', //survey name - version: '0.5', //survey version + version: 0.5, //survey version xmlResponse: '', //survey response XML string - jsonDocResponse: 'this is my json object', //survey response JSON object + jsonDocResponse: { this: 'is my json object' }, //survey response JSON object }, metadata: {}, }, diff --git a/www/__tests__/inputMatcher.test.ts b/www/__tests__/inputMatcher.test.ts index e1d64aff5..7e3b8fb81 100644 --- a/www/__tests__/inputMatcher.test.ts +++ b/www/__tests__/inputMatcher.test.ts @@ -1,3 +1,4 @@ +import { EnketoUserInputEntry } from '../js/survey/enketo/enketoHelper'; import { fmtTs, printUserInput, @@ -38,7 +39,7 @@ describe('input-matcher', () => { key: 'manual/mode_confirm', }, key: 'manual/place', - }; + } as UserInputEntry; trip = { key: 'FOO', origin_key: 'FOO', @@ -47,7 +48,7 @@ describe('input-matcher', () => { enter_ts: 1437605000, exit_ts: 1437605000, duration: 100, - }; + } as unknown as CompositeTrip; nextTrip = { key: 'BAR', origin_key: 'BAR', @@ -56,7 +57,7 @@ describe('input-matcher', () => { enter_ts: 1437607000, exit_ts: 1437607000, duration: 100, - }; + } as unknown as CompositeTrip; // mock Logger window['Logger'] = { log: console.log }; }); @@ -128,7 +129,7 @@ describe('input-matcher', () => { enter_ts: 1, exit_ts: 1, duration: 1, - }; + } as unknown as TimelineEntry; const invalidTimelineEntry = validUserInputForTimelineEntry( invalidTlEntry, null, @@ -166,7 +167,7 @@ describe('input-matcher', () => { key: 'manual/mode_confirm', }, key: 'manual/place', - }; + } as UserInputEntry; const candidates = [activeTrip, deletedTrip]; const validCandidates = getNotDeletedCandidates(candidates); @@ -191,7 +192,7 @@ describe('input-matcher', () => { key: 'manual/mode_confirm', type: 'message', }, - }; + } as unknown as UserInputEntry; const userInputWriteSecond = { data: { end_ts: 1437598393, @@ -207,7 +208,7 @@ describe('input-matcher', () => { key: 'manual/mode_confirm', type: 'message', }, - }; + } as unknown as UserInputEntry; const userInputWriteThird = { data: { end_ts: 1437604764, @@ -223,7 +224,7 @@ describe('input-matcher', () => { key: 'manual/mode_confirm', type: 'message', }, - }; + } as unknown as UserInputEntry; // make the linst unsorted and then check if userInputWriteThird(latest one) is return output const userInputList = [userInputWriteSecond, userInputWriteThird, userInputWriteFirst]; @@ -232,7 +233,7 @@ describe('input-matcher', () => { }); it('tests getUserInputForTrip with invalid userInputList', () => { - const userInputList = undefined; + const userInputList = undefined as unknown as UserInputEntry[]; const mostRecentEntry = getUserInputForTimelineEntry(trip, nextTrip, userInputList); expect(mostRecentEntry).toBe(undefined); }); @@ -248,7 +249,7 @@ describe('input-matcher', () => { }); it('tests getAdditionsForTimelineEntry with invalid additionsList', () => { - const additionsList = undefined; + const additionsList = undefined as unknown as EnketoUserInputEntry[]; const matchingAdditions = getAdditionsForTimelineEntry(trip, nextTrip, additionsList); expect(matchingAdditions).toMatchObject([]); }); diff --git a/www/__tests__/notifScheduler.test.ts b/www/__tests__/notifScheduler.test.ts index a002171b4..ac6408204 100644 --- a/www/__tests__/notifScheduler.test.ts +++ b/www/__tests__/notifScheduler.test.ts @@ -242,7 +242,7 @@ describe('updateScheduledNotifs', () => { const setIsScheduling: Function = jest.fn((val: boolean) => (isScheduling = val)); const scheduledPromise: Promise = Promise.resolve(); // create an empty array of mock notifs from cordova plugin - let mockNotifs = []; + let mockNotifs: any[] = []; // create the expected result const expectedResultcheduleNotifs = [ { key: 'November 19, 2023', val: '9:00 PM' }, diff --git a/www/__tests__/timelineHelper.test.ts b/www/__tests__/timelineHelper.test.ts index 83b25be01..bd817f084 100644 --- a/www/__tests__/timelineHelper.test.ts +++ b/www/__tests__/timelineHelper.test.ts @@ -12,7 +12,7 @@ import { } from '../js/diary/timelineHelper'; import { mockBEMUserCache } from '../__mocks__/cordovaMocks'; import * as mockTLH from '../__mocks__/timelineHelperMocks'; -import { GeoJSONData, GeoJSONStyledFeature, UserInputEntry } from '../js/types/diaryTypes'; +import { GeoJSONData, GeoJSONStyledFeature } from '../js/types/diaryTypes'; mockLogger(); mockAlert(); @@ -28,7 +28,7 @@ afterAll(() => { describe('useGeojsonForTrip', () => { it('work with an empty input', () => { - const testVal = useGeojsonForTrip(null, null, null); + const testVal = useGeojsonForTrip({} as any, {} as any); expect(testVal).toBeFalsy; }); @@ -46,7 +46,8 @@ describe('useGeojsonForTrip', () => { const testValue = useGeojsonForTrip( mockTLH.mockCompDataTwo.phone_data[1].data, mockTLH.mockLabelOptions, - ); + ) as GeoJSONData; + expect(testValue).toBeTruthy; checkGeojson(testValue); expect(testValue.data.features.length).toBe(3); }); @@ -293,14 +294,14 @@ jest.mock('../js/services/unifiedDataLoader', () => ({ })); it('works when there are no unprocessed trips...', async () => { - expect(readUnprocessedTrips(-1, -1, null)).resolves.toEqual([]); + expect(readUnprocessedTrips(-1, -1, {} as any)).resolves.toEqual([]); }); it('works when there are one or more unprocessed trips...', async () => { const testValueOne = await readUnprocessedTrips( mockTLH.fakeStartTsOne, mockTLH.fakeEndTsOne, - null, + {} as any, ); expect(testValueOne.length).toEqual(1); expect(testValueOne[0]).toEqual( diff --git a/www/__tests__/unifiedDataLoader.test.ts b/www/__tests__/unifiedDataLoader.test.ts index b99f2a69e..7916cfde1 100644 --- a/www/__tests__/unifiedDataLoader.test.ts +++ b/www/__tests__/unifiedDataLoader.test.ts @@ -1,6 +1,6 @@ import { mockLogger } from '../__mocks__/globalMocks'; import { removeDup, combinedPromises } from '../js/services/unifiedDataLoader'; -import { BEMData } from '../js/types/serverData'; +import { LocalDt, BEMData } from '../js/types/serverData'; mockLogger(); @@ -12,7 +12,7 @@ const testOne: BEMData = { write_ts: 1, // the only value checked by removeDup time_zone: '', write_fmt_time: '', - write_local_dt: null, + write_local_dt: {} as LocalDt, }, }; diff --git a/www/build/app.css b/www/build/app.css deleted file mode 100644 index 97de0161f..000000000 --- a/www/build/app.css +++ /dev/null @@ -1,11393 +0,0 @@ -/* ======================================================================== - * bootstrap-tour - v0.10.1 - * http://bootstraptour.com - * ======================================================================== - * Copyright 2012-2013 Ulrich Sossou - * - * ======================================================================== - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ======================================================================== - */ - -.tour-backdrop { - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: 1100; - background-color: #000; - opacity: 0.8; - filter: alpha(opacity=80); -} -.tour-step-backdrop { - position: relative; - z-index: 1101; - background: inherit; -} -.tour-step-backdrop > td { - position: relative; - z-index: 1101; -} -.tour-step-background { - position: absolute !important; - z-index: 1100; - background: inherit; - border-radius: 6px; -} -.popover[class*='tour-'] { - z-index: 1100; -} -.popover[class*='tour-'] .popover-navigation { - padding: 9px 14px; -} -.popover[class*='tour-'] .popover-navigation [data-role='end'] { - float: right; -} -.popover[class*='tour-'] .popover-navigation [data-role='prev'], -.popover[class*='tour-'] .popover-navigation [data-role='next'], -.popover[class*='tour-'] .popover-navigation [data-role='end'] { - cursor: pointer; -} -.popover[class*='tour-'] .popover-navigation [data-role='prev'].disabled, -.popover[class*='tour-'] .popover-navigation [data-role='next'].disabled, -.popover[class*='tour-'] .popover-navigation [data-role='end'].disabled { - cursor: default; -} -.popover[class*='tour-'].orphan { - position: fixed; - margin-top: 0; -} -.popover[class*='tour-'].orphan .arrow { - display: none; -} -/*! - * angular-loading-bar v0.6.0 - * https://chieffancypants.github.io/angular-loading-bar - * Copyright (c) 2014 Wes Cruver - * License: MIT - */ - -/* Make clicks pass-through */ -#loading-bar, -#loading-bar-spinner { - pointer-events: none; - -webkit-pointer-events: none; - -webkit-transition: 350ms linear all; - -moz-transition: 350ms linear all; - -o-transition: 350ms linear all; - transition: 350ms linear all; -} - -#loading-bar.ng-enter, -#loading-bar.ng-leave.ng-leave-active, -#loading-bar-spinner.ng-enter, -#loading-bar-spinner.ng-leave.ng-leave-active { - opacity: 0; -} - -#loading-bar.ng-enter.ng-enter-active, -#loading-bar.ng-leave, -#loading-bar-spinner.ng-enter.ng-enter-active, -#loading-bar-spinner.ng-leave { - opacity: 1; -} - -#loading-bar .bar { - -webkit-transition: width 350ms; - -moz-transition: width 350ms; - -o-transition: width 350ms; - transition: width 350ms; - - background: #29d; - position: fixed; - z-index: 10002; - top: 0; - left: 0; - width: 100%; - height: 2px; - border-bottom-right-radius: 1px; - border-top-right-radius: 1px; -} - -/* Fancy blur effect */ -#loading-bar .peg { - position: absolute; - width: 70px; - right: 0; - top: 0; - height: 2px; - opacity: 0.45; - -moz-box-shadow: #29d 1px 0 6px 1px; - -ms-box-shadow: #29d 1px 0 6px 1px; - -webkit-box-shadow: #29d 1px 0 6px 1px; - box-shadow: #29d 1px 0 6px 1px; - -moz-border-radius: 100%; - -webkit-border-radius: 100%; - border-radius: 100%; -} - -#loading-bar-spinner { - display: block; - position: fixed; - z-index: 10002; - top: 10px; - left: 10px; -} - -#loading-bar-spinner .spinner-icon { - width: 14px; - height: 14px; - - border: solid 2px transparent; - border-top-color: #29d; - border-left-color: #29d; - border-radius: 10px; - - -webkit-animation: loading-bar-spinner 400ms linear infinite; - -moz-animation: loading-bar-spinner 400ms linear infinite; - -ms-animation: loading-bar-spinner 400ms linear infinite; - -o-animation: loading-bar-spinner 400ms linear infinite; - animation: loading-bar-spinner 400ms linear infinite; -} - -@-webkit-keyframes loading-bar-spinner { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} -@-moz-keyframes loading-bar-spinner { - 0% { - -moz-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -moz-transform: rotate(360deg); - transform: rotate(360deg); - } -} -@-o-keyframes loading-bar-spinner { - 0% { - -o-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -o-transform: rotate(360deg); - transform: rotate(360deg); - } -} -@-ms-keyframes loading-bar-spinner { - 0% { - -ms-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -ms-transform: rotate(360deg); - transform: rotate(360deg); - } -} -@keyframes loading-bar-spinner { - 0% { - transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); - transform: rotate(360deg); - } -} - -/* -Version: 3.4.8 Timestamp: Thu May 1 09:50:32 EDT 2014 -*/ -.select2-container { - margin: 0; - position: relative; - display: inline-block; - /* inline-block for ie7 */ - zoom: 1; - *display: inline; - vertical-align: middle; -} - -.select2-container, -.select2-drop, -.select2-search, -.select2-search input { - /* - Force border-box so that % widths fit the parent - container without overlap because of margin/padding. - More Info : http://www.quirksmode.org/css/box.html - */ - -webkit-box-sizing: border-box; /* webkit */ - -moz-box-sizing: border-box; /* firefox */ - box-sizing: border-box; /* css3 */ -} - -.select2-container .select2-choice { - display: block; - height: 26px; - padding: 0 0 0 8px; - overflow: hidden; - position: relative; - - border: 1px solid #aaa; - white-space: nowrap; - line-height: 26px; - color: #444; - text-decoration: none; - - border-radius: 4px; - - background-clip: padding-box; - - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - - background-color: #fff; - background-image: -webkit-gradient( - linear, - left bottom, - left top, - color-stop(0, #eee), - color-stop(0.5, #fff) - ); - background-image: -webkit-linear-gradient(center bottom, #eee 0%, #fff 50%); - background-image: -moz-linear-gradient(center bottom, #eee 0%, #fff 50%); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#eeeeee', GradientType = 0); - background-image: linear-gradient(to top, #eee 0%, #fff 50%); -} - -.select2-container.select2-drop-above .select2-choice { - border-bottom-color: #aaa; - - border-radius: 0 0 4px 4px; - - background-image: -webkit-gradient( - linear, - left bottom, - left top, - color-stop(0, #eee), - color-stop(0.9, #fff) - ); - background-image: -webkit-linear-gradient(center bottom, #eee 0%, #fff 90%); - background-image: -moz-linear-gradient(center bottom, #eee 0%, #fff 90%); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0); - background-image: linear-gradient(to bottom, #eee 0%, #fff 90%); -} - -.select2-container.select2-allowclear .select2-choice .select2-chosen { - margin-right: 42px; -} - -.select2-container .select2-choice > .select2-chosen { - margin-right: 26px; - display: block; - overflow: hidden; - - white-space: nowrap; - - text-overflow: ellipsis; - float: none; - width: auto; -} - -.select2-container .select2-choice abbr { - display: none; - width: 12px; - height: 12px; - position: absolute; - right: 24px; - top: 8px; - - font-size: 1px; - text-decoration: none; - - border: 0; - background: url('select2.png') right top no-repeat; - cursor: pointer; - outline: 0; -} - -.select2-container.select2-allowclear .select2-choice abbr { - display: inline-block; -} - -.select2-container .select2-choice abbr:hover { - background-position: right -11px; - cursor: pointer; -} - -.select2-drop-mask { - border: 0; - margin: 0; - padding: 0; - position: fixed; - left: 0; - top: 0; - min-height: 100%; - min-width: 100%; - height: auto; - width: auto; - opacity: 0; - z-index: 9998; - /* styles required for IE to work */ - background-color: #fff; - filter: alpha(opacity=0); -} - -.select2-drop { - width: 100%; - margin-top: -1px; - position: absolute; - z-index: 9999; - top: 100%; - - background: #fff; - color: #000; - border: 1px solid #aaa; - border-top: 0; - - border-radius: 0 0 4px 4px; - - -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15); - box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15); -} - -.select2-drop.select2-drop-above { - margin-top: 1px; - border-top: 1px solid #aaa; - border-bottom: 0; - - border-radius: 4px 4px 0 0; - - -webkit-box-shadow: 0 -4px 5px rgba(0, 0, 0, 0.15); - box-shadow: 0 -4px 5px rgba(0, 0, 0, 0.15); -} - -.select2-drop-active { - border: 1px solid #5897fb; - border-top: none; -} - -.select2-drop.select2-drop-above.select2-drop-active { - border-top: 1px solid #5897fb; -} - -.select2-drop-auto-width { - border-top: 1px solid #aaa; - width: auto; -} - -.select2-drop-auto-width .select2-search { - padding-top: 4px; -} - -.select2-container .select2-choice .select2-arrow { - display: inline-block; - width: 18px; - height: 100%; - position: absolute; - right: 0; - top: 0; - - border-left: 1px solid #aaa; - border-radius: 0 4px 4px 0; - - background-clip: padding-box; - - background: #ccc; - background-image: -webkit-gradient( - linear, - left bottom, - left top, - color-stop(0, #ccc), - color-stop(0.6, #eee) - ); - background-image: -webkit-linear-gradient(center bottom, #ccc 0%, #eee 60%); - background-image: -moz-linear-gradient(center bottom, #ccc 0%, #eee 60%); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#eeeeee', endColorstr = '#cccccc', GradientType = 0); - background-image: linear-gradient(to top, #ccc 0%, #eee 60%); -} - -.select2-container .select2-choice .select2-arrow b { - display: block; - width: 100%; - height: 100%; - background: url('select2.png') no-repeat 0 1px; -} - -.select2-search { - display: inline-block; - width: 100%; - min-height: 26px; - margin: 0; - padding-left: 4px; - padding-right: 4px; - - position: relative; - z-index: 10000; - - white-space: nowrap; -} - -.select2-search input { - width: 100%; - height: auto !important; - min-height: 26px; - padding: 4px 20px 4px 5px; - margin: 0; - - outline: 0; - font-family: sans-serif; - font-size: 1em; - - border: 1px solid #aaa; - border-radius: 0; - - -webkit-box-shadow: none; - box-shadow: none; - - background: #fff url('select2.png') no-repeat 100% -22px; - background: - url('select2.png') no-repeat 100% -22px, - -webkit-gradient(linear, left bottom, left top, color-stop(0.85, #fff), color-stop(0.99, #eee)); - background: - url('select2.png') no-repeat 100% -22px, - -webkit-linear-gradient(center bottom, #fff 85%, #eee 99%); - background: - url('select2.png') no-repeat 100% -22px, - -moz-linear-gradient(center bottom, #fff 85%, #eee 99%); - background: - url('select2.png') no-repeat 100% -22px, - linear-gradient(to bottom, #fff 85%, #eee 99%) 0 0; -} - -.select2-drop.select2-drop-above .select2-search input { - margin-top: 4px; -} - -.select2-search input.select2-active { - background: #fff url('select2-spinner.gif') no-repeat 100%; - background: - url('select2-spinner.gif') no-repeat 100%, - -webkit-gradient(linear, left bottom, left top, color-stop(0.85, #fff), color-stop(0.99, #eee)); - background: - url('select2-spinner.gif') no-repeat 100%, - -webkit-linear-gradient(center bottom, #fff 85%, #eee 99%); - background: - url('select2-spinner.gif') no-repeat 100%, - -moz-linear-gradient(center bottom, #fff 85%, #eee 99%); - background: - url('select2-spinner.gif') no-repeat 100%, - linear-gradient(to bottom, #fff 85%, #eee 99%) 0 0; -} - -.select2-container-active .select2-choice, -.select2-container-active .select2-choices { - border: 1px solid #5897fb; - outline: none; - - -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); - box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); -} - -.select2-dropdown-open .select2-choice { - border-bottom-color: transparent; - -webkit-box-shadow: 0 1px 0 #fff inset; - box-shadow: 0 1px 0 #fff inset; - - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; - - background-color: #eee; - background-image: -webkit-gradient( - linear, - left bottom, - left top, - color-stop(0, #fff), - color-stop(0.5, #eee) - ); - background-image: -webkit-linear-gradient(center bottom, #fff 0%, #eee 50%); - background-image: -moz-linear-gradient(center bottom, #fff 0%, #eee 50%); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0); - background-image: linear-gradient(to top, #fff 0%, #eee 50%); -} - -.select2-dropdown-open.select2-drop-above .select2-choice, -.select2-dropdown-open.select2-drop-above .select2-choices { - border: 1px solid #5897fb; - border-top-color: transparent; - - background-image: -webkit-gradient( - linear, - left top, - left bottom, - color-stop(0, #fff), - color-stop(0.5, #eee) - ); - background-image: -webkit-linear-gradient(center top, #fff 0%, #eee 50%); - background-image: -moz-linear-gradient(center top, #fff 0%, #eee 50%); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0); - background-image: linear-gradient(to bottom, #fff 0%, #eee 50%); -} - -.select2-dropdown-open .select2-choice .select2-arrow { - background: transparent; - border-left: none; - filter: none; -} -.select2-dropdown-open .select2-choice .select2-arrow b { - background-position: -18px 1px; -} - -.select2-hidden-accessible { - border: 0; - clip: rect(0 0 0 0); - height: 1px; - margin: -1px; - overflow: hidden; - padding: 0; - position: absolute; - width: 1px; -} - -/* results */ -.select2-results { - max-height: 200px; - padding: 0 0 0 4px; - margin: 4px 4px 4px 0; - position: relative; - overflow-x: hidden; - overflow-y: auto; - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -} - -.select2-results ul.select2-result-sub { - margin: 0; - padding-left: 0; -} - -.select2-results li { - list-style: none; - display: list-item; - background-image: none; -} - -.select2-results li.select2-result-with-children > .select2-result-label { - font-weight: bold; -} - -.select2-results .select2-result-label { - padding: 3px 7px 4px; - margin: 0; - cursor: pointer; - - min-height: 1em; - - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; -} - -.select2-results-dept-1 .select2-result-label { - padding-left: 20px; -} -.select2-results-dept-2 .select2-result-label { - padding-left: 40px; -} -.select2-results-dept-3 .select2-result-label { - padding-left: 60px; -} -.select2-results-dept-4 .select2-result-label { - padding-left: 80px; -} -.select2-results-dept-5 .select2-result-label { - padding-left: 100px; -} -.select2-results-dept-6 .select2-result-label { - padding-left: 110px; -} -.select2-results-dept-7 .select2-result-label { - padding-left: 120px; -} - -.select2-results .select2-highlighted { - background: #3875d7; - color: #fff; -} - -.select2-results li em { - background: #feffde; - font-style: normal; -} - -.select2-results .select2-highlighted em { - background: transparent; -} - -.select2-results .select2-highlighted ul { - background: #fff; - color: #000; -} - -.select2-results .select2-no-results, -.select2-results .select2-searching, -.select2-results .select2-selection-limit { - background: #f4f4f4; - display: list-item; - padding-left: 5px; -} - -/* -disabled look for disabled choices in the results dropdown -*/ -.select2-results .select2-disabled.select2-highlighted { - color: #666; - background: #f4f4f4; - display: list-item; - cursor: default; -} -.select2-results .select2-disabled { - background: #f4f4f4; - display: list-item; - cursor: default; -} - -.select2-results .select2-selected { - display: none; -} - -.select2-more-results.select2-active { - background: #f4f4f4 url('select2-spinner.gif') no-repeat 100%; -} - -.select2-more-results { - background: #f4f4f4; - display: list-item; -} - -/* disabled styles */ - -.select2-container.select2-container-disabled .select2-choice { - background-color: #f4f4f4; - background-image: none; - border: 1px solid #ddd; - cursor: default; -} - -.select2-container.select2-container-disabled .select2-choice .select2-arrow { - background-color: #f4f4f4; - background-image: none; - border-left: 0; -} - -.select2-container.select2-container-disabled .select2-choice abbr { - display: none; -} - -/* multiselect */ - -.select2-container-multi .select2-choices { - height: auto !important; - height: 1%; - margin: 0; - padding: 0; - position: relative; - - border: 1px solid #aaa; - cursor: text; - overflow: hidden; - - background-color: #fff; - background-image: -webkit-gradient( - linear, - 0% 0%, - 0% 100%, - color-stop(1%, #eee), - color-stop(15%, #fff) - ); - background-image: -webkit-linear-gradient(top, #eee 1%, #fff 15%); - background-image: -moz-linear-gradient(top, #eee 1%, #fff 15%); - background-image: linear-gradient(to bottom, #eee 1%, #fff 15%); -} - -.select2-locked { - padding: 3px 5px 3px 5px !important; -} - -.select2-container-multi .select2-choices { - min-height: 26px; -} - -.select2-container-multi.select2-container-active .select2-choices { - border: 1px solid #5897fb; - outline: none; - - -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); - box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); -} -.select2-container-multi .select2-choices li { - float: left; - list-style: none; -} -html[dir='rtl'] .select2-container-multi .select2-choices li { - float: right; -} -.select2-container-multi .select2-choices .select2-search-field { - margin: 0; - padding: 0; - white-space: nowrap; -} - -.select2-container-multi .select2-choices .select2-search-field input { - padding: 5px; - margin: 1px 0; - - font-family: sans-serif; - font-size: 100%; - color: #666; - outline: 0; - border: 0; - -webkit-box-shadow: none; - box-shadow: none; - background: transparent !important; -} - -.select2-container-multi .select2-choices .select2-search-field input.select2-active { - background: #fff url('select2-spinner.gif') no-repeat 100% !important; -} - -.select2-default { - color: #999 !important; -} - -.select2-container-multi .select2-choices .select2-search-choice { - padding: 3px 5px 3px 18px; - margin: 3px 0 3px 5px; - position: relative; - - line-height: 13px; - color: #333; - cursor: default; - border: 1px solid #aaaaaa; - - border-radius: 3px; - - -webkit-box-shadow: - 0 0 2px #fff inset, - 0 1px 0 rgba(0, 0, 0, 0.05); - box-shadow: - 0 0 2px #fff inset, - 0 1px 0 rgba(0, 0, 0, 0.05); - - background-clip: padding-box; - - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - - background-color: #e4e4e4; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#f4f4f4', GradientType=0); - background-image: -webkit-gradient( - linear, - 0% 0%, - 0% 100%, - color-stop(20%, #f4f4f4), - color-stop(50%, #f0f0f0), - color-stop(52%, #e8e8e8), - color-stop(100%, #eee) - ); - background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%); - background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%); - background-image: linear-gradient(to top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%); -} -html[dir='rtl'] .select2-container-multi .select2-choices .select2-search-choice { - margin-left: 0; - margin-right: 5px; -} -.select2-container-multi .select2-choices .select2-search-choice .select2-chosen { - cursor: default; -} -.select2-container-multi .select2-choices .select2-search-choice-focus { - background: #d4d4d4; -} - -.select2-search-choice-close { - display: block; - width: 12px; - height: 13px; - position: absolute; - right: 3px; - top: 4px; - - font-size: 1px; - outline: none; - background: url('select2.png') right top no-repeat; -} -html[dir='rtl'] .select2-search-choice-close { - right: auto; - left: 3px; -} - -.select2-container-multi .select2-search-choice-close { - left: 3px; -} - -.select2-container-multi - .select2-choices - .select2-search-choice - .select2-search-choice-close:hover { - background-position: right -11px; -} -.select2-container-multi - .select2-choices - .select2-search-choice-focus - .select2-search-choice-close { - background-position: right -11px; -} - -/* disabled styles */ -.select2-container-multi.select2-container-disabled .select2-choices { - background-color: #f4f4f4; - background-image: none; - border: 1px solid #ddd; - cursor: default; -} - -.select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice { - padding: 3px 5px 3px 5px; - border: 1px solid #ddd; - background-image: none; - background-color: #f4f4f4; -} - -.select2-container-multi.select2-container-disabled - .select2-choices - .select2-search-choice - .select2-search-choice-close { - display: none; - background: none; -} -/* end multiselect */ - -.select2-result-selectable .select2-match, -.select2-result-unselectable .select2-match { - text-decoration: underline; -} - -.select2-offscreen, -.select2-offscreen:focus { - clip: rect(0 0 0 0) !important; - width: 1px !important; - height: 1px !important; - border: 0 !important; - margin: 0 !important; - padding: 0 !important; - overflow: hidden !important; - position: absolute !important; - outline: 0 !important; - left: 0px !important; - top: 0px !important; -} - -.select2-display-none { - display: none; -} - -.select2-measure-scrollbar { - position: absolute; - top: -10000px; - left: -10000px; - width: 100px; - height: 100px; - overflow: scroll; -} - -/* Retina-ize icons */ - -@media only screen and (-webkit-min-device-pixel-ratio: 1.5), - only screen and (min-resolution: 2dppx) { - .select2-search input, - .select2-search-choice-close, - .select2-container .select2-choice abbr, - .select2-container .select2-choice .select2-arrow b { - background-image: url('select2x2.png') !important; - background-repeat: no-repeat !important; - background-size: 60px 40px !important; - } - - .select2-search input { - background-position: 100% -21px !important; - } -} - -.task-checklist-edit > .checklist-form li:after, -.task-filter:after, -.filters:after, -.filters .filters-controls:after { - content: ''; - display: table; - clear: both; -} -.task-add, -.plusminus .task-checker, -.task-options .priority-multiplier li, -.task-options .task-attributes li, -.task-options .repeat-days li, -.task-options .repeat-frequency li, -.task-options .save-close, -.task-checklist-edit > ul li, -.task-checklist-edit > .checklist-form li, -.task-filter li, -.filters .filters-controls li, -.filters .filters-tags, -.filters .hrpg-input-group, -.chat-buttons, -.toolbar-mobile, -.toolbar-nav .toolbar-button-dropdown, -.toolbar-nav .toolbar-button, -.toolbar-sync, -.toolbar-settings, -.toolbar-audio, -.toolbar-notifs, -.toolbar-controls .toolbar-controls-button, -.toolbar-subscribe-button, -.toolbar-controls .toolbar-subscribe-button, -.options-menu li, -.options-submenu li { - list-style: none; -} -.task-add > a, -.plusminus .task-checker > a, -.task-options .priority-multiplier li > a, -.task-options .task-attributes li > a, -.task-options .repeat-days li > a, -.task-options .repeat-frequency li > a, -.task-options .save-close > a, -.task-checklist-edit > ul li > a, -.task-checklist-edit > .checklist-form li > a, -.task-filter li > a, -.filters .filters-controls li > a, -.filters .filters-tags > a, -.filters .hrpg-input-group > a, -.chat-buttons > a, -.toolbar-mobile > a, -.toolbar-nav .toolbar-button-dropdown > a, -.toolbar-nav .toolbar-button > a, -.toolbar-sync > a, -.toolbar-settings > a, -.toolbar-audio > a, -.toolbar-notifs > a, -.toolbar-controls .toolbar-controls-button > a, -.toolbar-subscribe-button > a, -.toolbar-controls .toolbar-subscribe-button > a, -.options-menu li > a, -.options-submenu li > a, -.task-add > button, -.plusminus .task-checker > button, -.task-options .priority-multiplier li > button, -.task-options .task-attributes li > button, -.task-options .repeat-days li > button, -.task-options .repeat-frequency li > button, -.task-options .save-close > button, -.task-checklist-edit > ul li > button, -.task-checklist-edit > .checklist-form li > button, -.task-filter li > button, -.filters .filters-controls li > button, -.filters .filters-tags > button, -.filters .hrpg-input-group > button, -.chat-buttons > button, -.toolbar-mobile > button, -.toolbar-nav .toolbar-button-dropdown > button, -.toolbar-nav .toolbar-button > button, -.toolbar-sync > button, -.toolbar-settings > button, -.toolbar-audio > button, -.toolbar-notifs > button, -.toolbar-controls .toolbar-controls-button > button, -.toolbar-subscribe-button > button, -.toolbar-controls .toolbar-subscribe-button > button, -.options-menu li > button, -.options-submenu li > button, -.task-add > input, -.plusminus .task-checker > input, -.task-options .priority-multiplier li > input, -.task-options .task-attributes li > input, -.task-options .repeat-days li > input, -.task-options .repeat-frequency li > input, -.task-options .save-close > input, -.task-checklist-edit > ul li > input, -.task-checklist-edit > .checklist-form li > input, -.task-filter li > input, -.filters .filters-controls li > input, -.filters .filters-tags > input, -.filters .hrpg-input-group > input, -.chat-buttons > input, -.toolbar-mobile > input, -.toolbar-nav .toolbar-button-dropdown > input, -.toolbar-nav .toolbar-button > input, -.toolbar-sync > input, -.toolbar-settings > input, -.toolbar-audio > input, -.toolbar-notifs > input, -.toolbar-controls .toolbar-controls-button > input, -.toolbar-subscribe-button > input, -.toolbar-controls .toolbar-subscribe-button > input, -.options-menu li > input, -.options-submenu li > input, -.task-add label::after, -.plusminus .task-checker label::after, -.task-options .priority-multiplier li label::after, -.task-options .task-attributes li label::after, -.task-options .repeat-days li label::after, -.task-options .repeat-frequency li label::after, -.task-options .save-close label::after, -.task-checklist-edit > ul li label::after, -.task-checklist-edit > .checklist-form li label::after, -.task-filter li label::after, -.filters .filters-controls li label::after, -.filters .filters-tags label::after, -.filters .hrpg-input-group label::after, -.chat-buttons label::after, -.toolbar-mobile label::after, -.toolbar-nav .toolbar-button-dropdown label::after, -.toolbar-nav .toolbar-button label::after, -.toolbar-sync label::after, -.toolbar-settings label::after, -.toolbar-audio label::after, -.toolbar-notifs label::after, -.toolbar-controls .toolbar-controls-button label::after, -.toolbar-subscribe-button label::after, -.toolbar-controls .toolbar-subscribe-button label::after, -.options-menu li label::after, -.options-submenu li label::after { - display: inline-block !important; - padding: 0.25em 0.5em !important; - text-decoration: none; - font-size: 1em; - color: #222; - background-color: transparent; -} -.task-add > a .glyphicon, -.plusminus .task-checker > a .glyphicon, -.task-options .priority-multiplier li > a .glyphicon, -.task-options .task-attributes li > a .glyphicon, -.task-options .repeat-days li > a .glyphicon, -.task-options .repeat-frequency li > a .glyphicon, -.task-options .save-close > a .glyphicon, -.task-checklist-edit > ul li > a .glyphicon, -.task-checklist-edit > .checklist-form li > a .glyphicon, -.task-filter li > a .glyphicon, -.filters .filters-controls li > a .glyphicon, -.filters .filters-tags > a .glyphicon, -.filters .hrpg-input-group > a .glyphicon, -.chat-buttons > a .glyphicon, -.toolbar-mobile > a .glyphicon, -.toolbar-nav .toolbar-button-dropdown > a .glyphicon, -.toolbar-nav .toolbar-button > a .glyphicon, -.toolbar-sync > a .glyphicon, -.toolbar-settings > a .glyphicon, -.toolbar-audio > a .glyphicon, -.toolbar-notifs > a .glyphicon, -.toolbar-controls .toolbar-controls-button > a .glyphicon, -.toolbar-subscribe-button > a .glyphicon, -.toolbar-controls .toolbar-subscribe-button > a .glyphicon, -.options-menu li > a .glyphicon, -.options-submenu li > a .glyphicon, -.task-add > button .glyphicon, -.plusminus .task-checker > button .glyphicon, -.task-options .priority-multiplier li > button .glyphicon, -.task-options .task-attributes li > button .glyphicon, -.task-options .repeat-days li > button .glyphicon, -.task-options .repeat-frequency li > button .glyphicon, -.task-options .save-close > button .glyphicon, -.task-checklist-edit > ul li > button .glyphicon, -.task-checklist-edit > .checklist-form li > button .glyphicon, -.task-filter li > button .glyphicon, -.filters .filters-controls li > button .glyphicon, -.filters .filters-tags > button .glyphicon, -.filters .hrpg-input-group > button .glyphicon, -.chat-buttons > button .glyphicon, -.toolbar-mobile > button .glyphicon, -.toolbar-nav .toolbar-button-dropdown > button .glyphicon, -.toolbar-nav .toolbar-button > button .glyphicon, -.toolbar-sync > button .glyphicon, -.toolbar-settings > button .glyphicon, -.toolbar-audio > button .glyphicon, -.toolbar-notifs > button .glyphicon, -.toolbar-controls .toolbar-controls-button > button .glyphicon, -.toolbar-subscribe-button > button .glyphicon, -.toolbar-controls .toolbar-subscribe-button > button .glyphicon, -.options-menu li > button .glyphicon, -.options-submenu li > button .glyphicon, -.task-add > input .glyphicon, -.plusminus .task-checker > input .glyphicon, -.task-options .priority-multiplier li > input .glyphicon, -.task-options .task-attributes li > input .glyphicon, -.task-options .repeat-days li > input .glyphicon, -.task-options .repeat-frequency li > input .glyphicon, -.task-options .save-close > input .glyphicon, -.task-checklist-edit > ul li > input .glyphicon, -.task-checklist-edit > .checklist-form li > input .glyphicon, -.task-filter li > input .glyphicon, -.filters .filters-controls li > input .glyphicon, -.filters .filters-tags > input .glyphicon, -.filters .hrpg-input-group > input .glyphicon, -.chat-buttons > input .glyphicon, -.toolbar-mobile > input .glyphicon, -.toolbar-nav .toolbar-button-dropdown > input .glyphicon, -.toolbar-nav .toolbar-button > input .glyphicon, -.toolbar-sync > input .glyphicon, -.toolbar-settings > input .glyphicon, -.toolbar-audio > input .glyphicon, -.toolbar-notifs > input .glyphicon, -.toolbar-controls .toolbar-controls-button > input .glyphicon, -.toolbar-subscribe-button > input .glyphicon, -.toolbar-controls .toolbar-subscribe-button > input .glyphicon, -.options-menu li > input .glyphicon, -.options-submenu li > input .glyphicon, -.task-add label::after .glyphicon, -.plusminus .task-checker label::after .glyphicon, -.task-options .priority-multiplier li label::after .glyphicon, -.task-options .task-attributes li label::after .glyphicon, -.task-options .repeat-days li label::after .glyphicon, -.task-options .repeat-frequency li label::after .glyphicon, -.task-options .save-close label::after .glyphicon, -.task-checklist-edit > ul li label::after .glyphicon, -.task-checklist-edit > .checklist-form li label::after .glyphicon, -.task-filter li label::after .glyphicon, -.filters .filters-controls li label::after .glyphicon, -.filters .filters-tags label::after .glyphicon, -.filters .hrpg-input-group label::after .glyphicon, -.chat-buttons label::after .glyphicon, -.toolbar-mobile label::after .glyphicon, -.toolbar-nav .toolbar-button-dropdown label::after .glyphicon, -.toolbar-nav .toolbar-button label::after .glyphicon, -.toolbar-sync label::after .glyphicon, -.toolbar-settings label::after .glyphicon, -.toolbar-audio label::after .glyphicon, -.toolbar-notifs label::after .glyphicon, -.toolbar-controls .toolbar-controls-button label::after .glyphicon, -.toolbar-subscribe-button label::after .glyphicon, -.toolbar-controls .toolbar-subscribe-button label::after .glyphicon, -.options-menu li label::after .glyphicon, -.options-submenu li label::after .glyphicon { - position: relative; - top: 0.132em; -} -> a:active, -> button:active { - background-color: #aaa !important; -} -.plusminus .task-checker > a, -.task-options .priority-multiplier li > a, -.task-options .task-attributes li > a, -.task-options .repeat-days li > a, -.task-options .repeat-frequency li > a, -.task-options .save-close > a, -.task-checklist-edit > ul li > a, -.filters .filters-tags > a, -.chat-buttons > a, -.toolbar-mobile > a, -.toolbar-nav .toolbar-button > a, -.toolbar-sync > a, -.toolbar-settings > a, -.toolbar-audio > a, -.toolbar-notifs > a, -.toolbar-controls .toolbar-controls-button > a, -.toolbar-subscribe-button > a, -.toolbar-controls .toolbar-subscribe-button > a, -.options-menu li > a, -.options-submenu li > a, -.plusminus .task-checker > button, -.task-options .priority-multiplier li > button, -.task-options .task-attributes li > button, -.task-options .repeat-days li > button, -.task-options .repeat-frequency li > button, -.task-options .save-close > button, -.task-checklist-edit > ul li > button, -.filters .filters-tags > button, -.chat-buttons > button, -.toolbar-mobile > button, -.toolbar-nav .toolbar-button > button, -.toolbar-sync > button, -.toolbar-settings > button, -.toolbar-audio > button, -.toolbar-notifs > button, -.toolbar-controls .toolbar-controls-button > button, -.toolbar-subscribe-button > button, -.toolbar-controls .toolbar-subscribe-button > button, -.options-menu li > button, -.options-submenu li > button, -.plusminus .task-checker > input, -.task-options .priority-multiplier li > input, -.task-options .task-attributes li > input, -.task-options .repeat-days li > input, -.task-options .repeat-frequency li > input, -.task-options .save-close > input, -.task-checklist-edit > ul li > input, -.filters .filters-tags > input, -.chat-buttons > input, -.toolbar-mobile > input, -.toolbar-nav .toolbar-button > input, -.toolbar-sync > input, -.toolbar-settings > input, -.toolbar-audio > input, -.toolbar-notifs > input, -.toolbar-controls .toolbar-controls-button > input, -.toolbar-subscribe-button > input, -.toolbar-controls .toolbar-subscribe-button > input, -.options-menu li > input, -.options-submenu li > input, -.plusminus .task-checker label::after, -.task-options .priority-multiplier li label::after, -.task-options .task-attributes li label::after, -.task-options .repeat-days li label::after, -.task-options .repeat-frequency li label::after, -.task-options .save-close label::after, -.task-checklist-edit > ul li label::after, -.filters .filters-tags label::after, -.chat-buttons label::after, -.toolbar-mobile label::after, -.toolbar-nav .toolbar-button label::after, -.toolbar-sync label::after, -.toolbar-settings label::after, -.toolbar-audio label::after, -.toolbar-notifs label::after, -.toolbar-controls .toolbar-controls-button label::after, -.toolbar-subscribe-button label::after, -.toolbar-controls .toolbar-subscribe-button label::after, -.options-menu li label::after, -.options-submenu li label::after { - border: 1px solid #ccc !important; - -webkit-border-radius: 0.382em !important; - border-radius: 0.382em !important; -} -.plusminus .task-checker .highlight, -.task-options .priority-multiplier li .highlight, -.task-options .task-attributes li .highlight, -.task-options .repeat-days li .highlight, -.task-options .repeat-frequency li .highlight, -.task-options .save-close .highlight, -.task-checklist-edit > ul li .highlight, -.filters .filters-tags .highlight, -.chat-buttons .highlight, -.toolbar-mobile .highlight, -.toolbar-nav .toolbar-button .highlight, -.toolbar-sync .highlight, -.toolbar-settings .highlight, -.toolbar-audio .highlight, -.toolbar-notifs .highlight, -.toolbar-controls .toolbar-controls-button .highlight, -.toolbar-subscribe-button .highlight, -.toolbar-controls .toolbar-subscribe-button .highlight, -.options-menu li .highlight, -.options-submenu li .highlight { - border-color: #89aef0 !important; - background-color: #c9daf8 !important; - background-color: #c9daf8 !important; -} -.plusminus .task-checker .highlight, -.task-options .priority-multiplier li .highlight, -.task-options .task-attributes li .highlight, -.task-options .repeat-days li .highlight, -.task-options .repeat-frequency li .highlight, -.task-options .save-close .highlight, -.task-checklist-edit > ul li .highlight, -.filters .filters-tags .highlight, -.chat-buttons .highlight, -.toolbar-mobile .highlight, -.toolbar-nav .toolbar-button .highlight, -.toolbar-sync .highlight, -.toolbar-settings .highlight, -.toolbar-audio .highlight, -.toolbar-notifs .highlight, -.toolbar-controls .toolbar-controls-button .highlight, -.toolbar-subscribe-button .highlight, -.toolbar-controls .toolbar-subscribe-button .highlight, -.options-menu li .highlight, -.options-submenu li .highlight { - color: #3e5555 !important; -} -.plusminus .task-checker .highlight:active, -.task-options .priority-multiplier li .highlight:active, -.task-options .task-attributes li .highlight:active, -.task-options .repeat-days li .highlight:active, -.task-options .repeat-frequency li .highlight:active, -.task-options .save-close .highlight:active, -.task-checklist-edit > ul li .highlight:active, -.filters .filters-tags .highlight:active, -.chat-buttons .highlight:active, -.toolbar-mobile .highlight:active, -.toolbar-nav .toolbar-button .highlight:active, -.toolbar-sync .highlight:active, -.toolbar-settings .highlight:active, -.toolbar-audio .highlight:active, -.toolbar-notifs .highlight:active, -.toolbar-controls .toolbar-controls-button .highlight:active, -.toolbar-subscribe-button .highlight:active, -.toolbar-controls .toolbar-subscribe-button .highlight:active, -.options-menu li .highlight:active, -.options-submenu li .highlight:active { - background-color: #14459a !important; -} -@media screen and (min-width: 768px) { - .plusminus .task-checker .highlight:hover, - .task-options .priority-multiplier li .highlight:hover, - .task-options .task-attributes li .highlight:hover, - .task-options .repeat-days li .highlight:hover, - .task-options .repeat-frequency li .highlight:hover, - .task-options .save-close .highlight:hover, - .task-checklist-edit > ul li .highlight:hover, - .filters .filters-tags .highlight:hover, - .chat-buttons .highlight:hover, - .toolbar-mobile .highlight:hover, - .toolbar-nav .toolbar-button .highlight:hover, - .toolbar-sync .highlight:hover, - .toolbar-settings .highlight:hover, - .toolbar-audio .highlight:hover, - .toolbar-notifs .highlight:hover, - .toolbar-controls .toolbar-controls-button .highlight:hover, - .toolbar-subscribe-button .highlight:hover, - .toolbar-controls .toolbar-subscribe-button .highlight:hover, - .options-menu li .highlight:hover, - .options-submenu li .highlight:hover { - background-color: #c0d4f7 !important; - } -} -.plusminus .task-checker .highlight > a, -.task-options .priority-multiplier li .highlight > a, -.task-options .task-attributes li .highlight > a, -.task-options .repeat-days li .highlight > a, -.task-options .repeat-frequency li .highlight > a, -.task-options .save-close .highlight > a, -.task-checklist-edit > ul li .highlight > a, -.filters .filters-tags .highlight > a, -.chat-buttons .highlight > a, -.toolbar-mobile .highlight > a, -.toolbar-nav .toolbar-button .highlight > a, -.toolbar-sync .highlight > a, -.toolbar-settings .highlight > a, -.toolbar-audio .highlight > a, -.toolbar-notifs .highlight > a, -.toolbar-controls .toolbar-controls-button .highlight > a, -.toolbar-subscribe-button .highlight > a, -.toolbar-controls .toolbar-subscribe-button .highlight > a, -.options-menu li .highlight > a, -.options-submenu li .highlight > a, -.plusminus .task-checker .highlight > button, -.task-options .priority-multiplier li .highlight > button, -.task-options .task-attributes li .highlight > button, -.task-options .repeat-days li .highlight > button, -.task-options .repeat-frequency li .highlight > button, -.task-options .save-close .highlight > button, -.task-checklist-edit > ul li .highlight > button, -.filters .filters-tags .highlight > button, -.chat-buttons .highlight > button, -.toolbar-mobile .highlight > button, -.toolbar-nav .toolbar-button .highlight > button, -.toolbar-sync .highlight > button, -.toolbar-settings .highlight > button, -.toolbar-audio .highlight > button, -.toolbar-notifs .highlight > button, -.toolbar-controls .toolbar-controls-button .highlight > button, -.toolbar-subscribe-button .highlight > button, -.toolbar-controls .toolbar-subscribe-button .highlight > button, -.options-menu li .highlight > button, -.options-submenu li .highlight > button { - background-color: #c9daf8 !important; -} -.plusminus .task-checker .highlight > a:active, -.task-options .priority-multiplier li .highlight > a:active, -.task-options .task-attributes li .highlight > a:active, -.task-options .repeat-days li .highlight > a:active, -.task-options .repeat-frequency li .highlight > a:active, -.task-options .save-close .highlight > a:active, -.task-checklist-edit > ul li .highlight > a:active, -.filters .filters-tags .highlight > a:active, -.chat-buttons .highlight > a:active, -.toolbar-mobile .highlight > a:active, -.toolbar-nav .toolbar-button .highlight > a:active, -.toolbar-sync .highlight > a:active, -.toolbar-settings .highlight > a:active, -.toolbar-audio .highlight > a:active, -.toolbar-notifs .highlight > a:active, -.toolbar-controls .toolbar-controls-button .highlight > a:active, -.toolbar-subscribe-button .highlight > a:active, -.toolbar-controls .toolbar-subscribe-button .highlight > a:active, -.options-menu li .highlight > a:active, -.options-submenu li .highlight > a:active, -.plusminus .task-checker .highlight > button:active, -.task-options .priority-multiplier li .highlight > button:active, -.task-options .task-attributes li .highlight > button:active, -.task-options .repeat-days li .highlight > button:active, -.task-options .repeat-frequency li .highlight > button:active, -.task-options .save-close .highlight > button:active, -.task-checklist-edit > ul li .highlight > button:active, -.filters .filters-tags .highlight > button:active, -.chat-buttons .highlight > button:active, -.toolbar-mobile .highlight > button:active, -.toolbar-nav .toolbar-button .highlight > button:active, -.toolbar-sync .highlight > button:active, -.toolbar-settings .highlight > button:active, -.toolbar-audio .highlight > button:active, -.toolbar-notifs .highlight > button:active, -.toolbar-controls .toolbar-controls-button .highlight > button:active, -.toolbar-subscribe-button .highlight > button:active, -.toolbar-controls .toolbar-subscribe-button .highlight > button:active, -.options-menu li .highlight > button:active, -.options-submenu li .highlight > button:active { - background-color: #14459a !important; -} -@media screen and (min-width: 768px) { - .plusminus .task-checker .highlight > a:hover, - .task-options .priority-multiplier li .highlight > a:hover, - .task-options .task-attributes li .highlight > a:hover, - .task-options .repeat-days li .highlight > a:hover, - .task-options .repeat-frequency li .highlight > a:hover, - .task-options .save-close .highlight > a:hover, - .task-checklist-edit > ul li .highlight > a:hover, - .filters .filters-tags .highlight > a:hover, - .chat-buttons .highlight > a:hover, - .toolbar-mobile .highlight > a:hover, - .toolbar-nav .toolbar-button .highlight > a:hover, - .toolbar-sync .highlight > a:hover, - .toolbar-settings .highlight > a:hover, - .toolbar-audio .highlight > a:hover, - .toolbar-notifs .highlight > a:hover, - .toolbar-controls .toolbar-controls-button .highlight > a:hover, - .toolbar-subscribe-button .highlight > a:hover, - .toolbar-controls .toolbar-subscribe-button .highlight > a:hover, - .options-menu li .highlight > a:hover, - .options-submenu li .highlight > a:hover, - .plusminus .task-checker .highlight > button:hover, - .task-options .priority-multiplier li .highlight > button:hover, - .task-options .task-attributes li .highlight > button:hover, - .task-options .repeat-days li .highlight > button:hover, - .task-options .repeat-frequency li .highlight > button:hover, - .task-options .save-close .highlight > button:hover, - .task-checklist-edit > ul li .highlight > button:hover, - .filters .filters-tags .highlight > button:hover, - .chat-buttons .highlight > button:hover, - .toolbar-mobile .highlight > button:hover, - .toolbar-nav .toolbar-button .highlight > button:hover, - .toolbar-sync .highlight > button:hover, - .toolbar-settings .highlight > button:hover, - .toolbar-audio .highlight > button:hover, - .toolbar-notifs .highlight > button:hover, - .toolbar-controls .toolbar-controls-button .highlight > button:hover, - .toolbar-subscribe-button .highlight > button:hover, - .toolbar-controls .toolbar-subscribe-button .highlight > button:hover, - .options-menu li .highlight > button:hover, - .options-submenu li .highlight > button:hover { - background-color: #c0d4f7 !important; - } -} -.plusminus .task-checker .highlight > a, -.task-options .priority-multiplier li .highlight > a, -.task-options .task-attributes li .highlight > a, -.task-options .repeat-days li .highlight > a, -.task-options .repeat-frequency li .highlight > a, -.task-options .save-close .highlight > a, -.task-checklist-edit > ul li .highlight > a, -.filters .filters-tags .highlight > a, -.chat-buttons .highlight > a, -.toolbar-mobile .highlight > a, -.toolbar-nav .toolbar-button .highlight > a, -.toolbar-sync .highlight > a, -.toolbar-settings .highlight > a, -.toolbar-audio .highlight > a, -.toolbar-notifs .highlight > a, -.toolbar-controls .toolbar-controls-button .highlight > a, -.toolbar-subscribe-button .highlight > a, -.toolbar-controls .toolbar-subscribe-button .highlight > a, -.options-menu li .highlight > a, -.options-submenu li .highlight > a, -.plusminus .task-checker .highlight > button, -.task-options .priority-multiplier li .highlight > button, -.task-options .task-attributes li .highlight > button, -.task-options .repeat-days li .highlight > button, -.task-options .repeat-frequency li .highlight > button, -.task-options .save-close .highlight > button, -.task-checklist-edit > ul li .highlight > button, -.filters .filters-tags .highlight > button, -.chat-buttons .highlight > button, -.toolbar-mobile .highlight > button, -.toolbar-nav .toolbar-button .highlight > button, -.toolbar-sync .highlight > button, -.toolbar-settings .highlight > button, -.toolbar-audio .highlight > button, -.toolbar-notifs .highlight > button, -.toolbar-controls .toolbar-controls-button .highlight > button, -.toolbar-subscribe-button .highlight > button, -.toolbar-controls .toolbar-subscribe-button .highlight > button, -.options-menu li .highlight > button, -.options-submenu li .highlight > button, -.plusminus .task-checker .highlight > input, -.task-options .priority-multiplier li .highlight > input, -.task-options .task-attributes li .highlight > input, -.task-options .repeat-days li .highlight > input, -.task-options .repeat-frequency li .highlight > input, -.task-options .save-close .highlight > input, -.task-checklist-edit > ul li .highlight > input, -.filters .filters-tags .highlight > input, -.chat-buttons .highlight > input, -.toolbar-mobile .highlight > input, -.toolbar-nav .toolbar-button .highlight > input, -.toolbar-sync .highlight > input, -.toolbar-settings .highlight > input, -.toolbar-audio .highlight > input, -.toolbar-notifs .highlight > input, -.toolbar-controls .toolbar-controls-button .highlight > input, -.toolbar-subscribe-button .highlight > input, -.toolbar-controls .toolbar-subscribe-button .highlight > input, -.options-menu li .highlight > input, -.options-submenu li .highlight > input, -.plusminus .task-checker .highlight textarea, -.task-options .priority-multiplier li .highlight textarea, -.task-options .task-attributes li .highlight textarea, -.task-options .repeat-days li .highlight textarea, -.task-options .repeat-frequency li .highlight textarea, -.task-options .save-close .highlight textarea, -.task-checklist-edit > ul li .highlight textarea, -.filters .filters-tags .highlight textarea, -.chat-buttons .highlight textarea, -.toolbar-mobile .highlight textarea, -.toolbar-nav .toolbar-button .highlight textarea, -.toolbar-sync .highlight textarea, -.toolbar-settings .highlight textarea, -.toolbar-audio .highlight textarea, -.toolbar-notifs .highlight textarea, -.toolbar-controls .toolbar-controls-button .highlight textarea, -.toolbar-subscribe-button .highlight textarea, -.toolbar-controls .toolbar-subscribe-button .highlight textarea, -.options-menu li .highlight textarea, -.options-submenu li .highlight textarea { - color: #3e5555 !important; - border-color: #c6d6d6 !important; -} -.plusminus .task-checker .highlight > input:hover, -.task-options .priority-multiplier li .highlight > input:hover, -.task-options .task-attributes li .highlight > input:hover, -.task-options .repeat-days li .highlight > input:hover, -.task-options .repeat-frequency li .highlight > input:hover, -.task-options .save-close .highlight > input:hover, -.task-checklist-edit > ul li .highlight > input:hover, -.filters .filters-tags .highlight > input:hover, -.chat-buttons .highlight > input:hover, -.toolbar-mobile .highlight > input:hover, -.toolbar-nav .toolbar-button .highlight > input:hover, -.toolbar-sync .highlight > input:hover, -.toolbar-settings .highlight > input:hover, -.toolbar-audio .highlight > input:hover, -.toolbar-notifs .highlight > input:hover, -.toolbar-controls .toolbar-controls-button .highlight > input:hover, -.toolbar-subscribe-button .highlight > input:hover, -.toolbar-controls .toolbar-subscribe-button .highlight > input:hover, -.options-menu li .highlight > input:hover, -.options-submenu li .highlight > input:hover, -.plusminus .task-checker .highlight textarea:hover, -.task-options .priority-multiplier li .highlight textarea:hover, -.task-options .task-attributes li .highlight textarea:hover, -.task-options .repeat-days li .highlight textarea:hover, -.task-options .repeat-frequency li .highlight textarea:hover, -.task-options .save-close .highlight textarea:hover, -.task-checklist-edit > ul li .highlight textarea:hover, -.filters .filters-tags .highlight textarea:hover, -.chat-buttons .highlight textarea:hover, -.toolbar-mobile .highlight textarea:hover, -.toolbar-nav .toolbar-button .highlight textarea:hover, -.toolbar-sync .highlight textarea:hover, -.toolbar-settings .highlight textarea:hover, -.toolbar-audio .highlight textarea:hover, -.toolbar-notifs .highlight textarea:hover, -.toolbar-controls .toolbar-controls-button .highlight textarea:hover, -.toolbar-subscribe-button .highlight textarea:hover, -.toolbar-controls .toolbar-subscribe-button .highlight textarea:hover, -.options-menu li .highlight textarea:hover, -.options-submenu li .highlight textarea:hover { - border-color: #97b3b3 !important; -} -.plusminus .task-checker .highlight > input:focus, -.task-options .priority-multiplier li .highlight > input:focus, -.task-options .task-attributes li .highlight > input:focus, -.task-options .repeat-days li .highlight > input:focus, -.task-options .repeat-frequency li .highlight > input:focus, -.task-options .save-close .highlight > input:focus, -.task-checklist-edit > ul li .highlight > input:focus, -.filters .filters-tags .highlight > input:focus, -.chat-buttons .highlight > input:focus, -.toolbar-mobile .highlight > input:focus, -.toolbar-nav .toolbar-button .highlight > input:focus, -.toolbar-sync .highlight > input:focus, -.toolbar-settings .highlight > input:focus, -.toolbar-audio .highlight > input:focus, -.toolbar-notifs .highlight > input:focus, -.toolbar-controls .toolbar-controls-button .highlight > input:focus, -.toolbar-subscribe-button .highlight > input:focus, -.toolbar-controls .toolbar-subscribe-button .highlight > input:focus, -.options-menu li .highlight > input:focus, -.options-submenu li .highlight > input:focus, -.plusminus .task-checker .highlight textarea:focus, -.task-options .priority-multiplier li .highlight textarea:focus, -.task-options .task-attributes li .highlight textarea:focus, -.task-options .repeat-days li .highlight textarea:focus, -.task-options .repeat-frequency li .highlight textarea:focus, -.task-options .save-close .highlight textarea:focus, -.task-checklist-edit > ul li .highlight textarea:focus, -.filters .filters-tags .highlight textarea:focus, -.chat-buttons .highlight textarea:focus, -.toolbar-mobile .highlight textarea:focus, -.toolbar-nav .toolbar-button .highlight textarea:focus, -.toolbar-sync .highlight textarea:focus, -.toolbar-settings .highlight textarea:focus, -.toolbar-audio .highlight textarea:focus, -.toolbar-notifs .highlight textarea:focus, -.toolbar-controls .toolbar-controls-button .highlight textarea:focus, -.toolbar-subscribe-button .highlight textarea:focus, -.toolbar-controls .toolbar-subscribe-button .highlight textarea:focus, -.options-menu li .highlight textarea:focus, -.options-submenu li .highlight textarea:focus { - border-color: #4f6d6d !important; - outline: none; -} -.plusminus .task-checker .highlight > input + button:focus, -.task-options .priority-multiplier li .highlight > input + button:focus, -.task-options .task-attributes li .highlight > input + button:focus, -.task-options .repeat-days li .highlight > input + button:focus, -.task-options .repeat-frequency li .highlight > input + button:focus, -.task-options .save-close .highlight > input + button:focus, -.task-checklist-edit > ul li .highlight > input + button:focus, -.filters .filters-tags .highlight > input + button:focus, -.chat-buttons .highlight > input + button:focus, -.toolbar-mobile .highlight > input + button:focus, -.toolbar-nav .toolbar-button .highlight > input + button:focus, -.toolbar-sync .highlight > input + button:focus, -.toolbar-settings .highlight > input + button:focus, -.toolbar-audio .highlight > input + button:focus, -.toolbar-notifs .highlight > input + button:focus, -.toolbar-controls .toolbar-controls-button .highlight > input + button:focus, -.toolbar-subscribe-button .highlight > input + button:focus, -.toolbar-controls .toolbar-subscribe-button .highlight > input + button:focus, -.options-menu li .highlight > input + button:focus, -.options-submenu li .highlight > input + button:focus, -.plusminus .task-checker .highlight textarea + button:focus, -.task-options .priority-multiplier li .highlight textarea + button:focus, -.task-options .task-attributes li .highlight textarea + button:focus, -.task-options .repeat-days li .highlight textarea + button:focus, -.task-options .repeat-frequency li .highlight textarea + button:focus, -.task-options .save-close .highlight textarea + button:focus, -.task-checklist-edit > ul li .highlight textarea + button:focus, -.filters .filters-tags .highlight textarea + button:focus, -.chat-buttons .highlight textarea + button:focus, -.toolbar-mobile .highlight textarea + button:focus, -.toolbar-nav .toolbar-button .highlight textarea + button:focus, -.toolbar-sync .highlight textarea + button:focus, -.toolbar-settings .highlight textarea + button:focus, -.toolbar-audio .highlight textarea + button:focus, -.toolbar-notifs .highlight textarea + button:focus, -.toolbar-controls .toolbar-controls-button .highlight textarea + button:focus, -.toolbar-subscribe-button .highlight textarea + button:focus, -.toolbar-controls .toolbar-subscribe-button .highlight textarea + button:focus, -.options-menu li .highlight textarea + button:focus, -.options-submenu li .highlight textarea + button:focus { - border-color: #97b3b3 !important; - background-color: #e2eaea !important; - outline: none; -} -.plusminus .task-checker .highlight > input + button:active, -.task-options .priority-multiplier li .highlight > input + button:active, -.task-options .task-attributes li .highlight > input + button:active, -.task-options .repeat-days li .highlight > input + button:active, -.task-options .repeat-frequency li .highlight > input + button:active, -.task-options .save-close .highlight > input + button:active, -.task-checklist-edit > ul li .highlight > input + button:active, -.filters .filters-tags .highlight > input + button:active, -.chat-buttons .highlight > input + button:active, -.toolbar-mobile .highlight > input + button:active, -.toolbar-nav .toolbar-button .highlight > input + button:active, -.toolbar-sync .highlight > input + button:active, -.toolbar-settings .highlight > input + button:active, -.toolbar-audio .highlight > input + button:active, -.toolbar-notifs .highlight > input + button:active, -.toolbar-controls .toolbar-controls-button .highlight > input + button:active, -.toolbar-subscribe-button .highlight > input + button:active, -.toolbar-controls .toolbar-subscribe-button .highlight > input + button:active, -.options-menu li .highlight > input + button:active, -.options-submenu li .highlight > input + button:active, -.plusminus .task-checker .highlight textarea + button:active, -.task-options .priority-multiplier li .highlight textarea + button:active, -.task-options .task-attributes li .highlight textarea + button:active, -.task-options .repeat-days li .highlight textarea + button:active, -.task-options .repeat-frequency li .highlight textarea + button:active, -.task-options .save-close .highlight textarea + button:active, -.task-checklist-edit > ul li .highlight textarea + button:active, -.filters .filters-tags .highlight textarea + button:active, -.chat-buttons .highlight textarea + button:active, -.toolbar-mobile .highlight textarea + button:active, -.toolbar-nav .toolbar-button .highlight textarea + button:active, -.toolbar-sync .highlight textarea + button:active, -.toolbar-settings .highlight textarea + button:active, -.toolbar-audio .highlight textarea + button:active, -.toolbar-notifs .highlight textarea + button:active, -.toolbar-controls .toolbar-controls-button .highlight textarea + button:active, -.toolbar-subscribe-button .highlight textarea + button:active, -.toolbar-controls .toolbar-subscribe-button .highlight textarea + button:active, -.options-menu li .highlight textarea + button:active, -.options-submenu li .highlight textarea + button:active { - background-color: #c6d6d6 !important; -} -.plusminus .task-checker .highlight > a:nth-of-type(2), -.task-options .priority-multiplier li .highlight > a:nth-of-type(2), -.task-options .task-attributes li .highlight > a:nth-of-type(2), -.task-options .repeat-days li .highlight > a:nth-of-type(2), -.task-options .repeat-frequency li .highlight > a:nth-of-type(2), -.task-options .save-close .highlight > a:nth-of-type(2), -.task-checklist-edit > ul li .highlight > a:nth-of-type(2), -.filters .filters-tags .highlight > a:nth-of-type(2), -.chat-buttons .highlight > a:nth-of-type(2), -.toolbar-mobile .highlight > a:nth-of-type(2), -.toolbar-nav .toolbar-button .highlight > a:nth-of-type(2), -.toolbar-sync .highlight > a:nth-of-type(2), -.toolbar-settings .highlight > a:nth-of-type(2), -.toolbar-audio .highlight > a:nth-of-type(2), -.toolbar-notifs .highlight > a:nth-of-type(2), -.toolbar-controls .toolbar-controls-button .highlight > a:nth-of-type(2), -.toolbar-subscribe-button .highlight > a:nth-of-type(2), -.toolbar-controls .toolbar-subscribe-button .highlight > a:nth-of-type(2), -.options-menu li .highlight > a:nth-of-type(2), -.options-submenu li .highlight > a:nth-of-type(2) { - border-left: 1px solid #bad0f6 !important; -} -@media screen and (min-width: 768px) { - .plusminus .task-checker .highlight > div, - .task-options .priority-multiplier li .highlight > div, - .task-options .task-attributes li .highlight > div, - .task-options .repeat-days li .highlight > div, - .task-options .repeat-frequency li .highlight > div, - .task-options .save-close .highlight > div, - .task-checklist-edit > ul li .highlight > div, - .filters .filters-tags .highlight > div, - .chat-buttons .highlight > div, - .toolbar-mobile .highlight > div, - .toolbar-nav .toolbar-button .highlight > div, - .toolbar-sync .highlight > div, - .toolbar-settings .highlight > div, - .toolbar-audio .highlight > div, - .toolbar-notifs .highlight > div, - .toolbar-controls .toolbar-controls-button .highlight > div, - .toolbar-subscribe-button .highlight > div, - .toolbar-controls .toolbar-subscribe-button .highlight > div, - .options-menu li .highlight > div, - .options-submenu li .highlight > div { - border: 1px solid #c6d6d6; - } -} -.plusminus .task-checker .highlight > div h4, -.task-options .priority-multiplier li .highlight > div h4, -.task-options .task-attributes li .highlight > div h4, -.task-options .repeat-days li .highlight > div h4, -.task-options .repeat-frequency li .highlight > div h4, -.task-options .save-close .highlight > div h4, -.task-checklist-edit > ul li .highlight > div h4, -.filters .filters-tags .highlight > div h4, -.chat-buttons .highlight > div h4, -.toolbar-mobile .highlight > div h4, -.toolbar-nav .toolbar-button .highlight > div h4, -.toolbar-sync .highlight > div h4, -.toolbar-settings .highlight > div h4, -.toolbar-audio .highlight > div h4, -.toolbar-notifs .highlight > div h4, -.toolbar-controls .toolbar-controls-button .highlight > div h4, -.toolbar-subscribe-button .highlight > div h4, -.toolbar-controls .toolbar-subscribe-button .highlight > div h4, -.options-menu li .highlight > div h4, -.options-submenu li .highlight > div h4 { - color: #4f6d6d; - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.plusminus .task-checker .highlight > div > ul:first-child:before, -.task-options .priority-multiplier li .highlight > div > ul:first-child:before, -.task-options .task-attributes li .highlight > div > ul:first-child:before, -.task-options .repeat-days li .highlight > div > ul:first-child:before, -.task-options .repeat-frequency li .highlight > div > ul:first-child:before, -.task-options .save-close .highlight > div > ul:first-child:before, -.task-checklist-edit > ul li .highlight > div > ul:first-child:before, -.filters .filters-tags .highlight > div > ul:first-child:before, -.chat-buttons .highlight > div > ul:first-child:before, -.toolbar-mobile .highlight > div > ul:first-child:before, -.toolbar-nav .toolbar-button .highlight > div > ul:first-child:before, -.toolbar-sync .highlight > div > ul:first-child:before, -.toolbar-settings .highlight > div > ul:first-child:before, -.toolbar-audio .highlight > div > ul:first-child:before, -.toolbar-notifs .highlight > div > ul:first-child:before, -.toolbar-controls .toolbar-controls-button .highlight > div > ul:first-child:before, -.toolbar-subscribe-button .highlight > div > ul:first-child:before, -.toolbar-controls .toolbar-subscribe-button .highlight > div > ul:first-child:before, -.options-menu li .highlight > div > ul:first-child:before, -.options-submenu li .highlight > div > ul:first-child:before, -.plusminus .task-checker .highlight > div > div:first-child:before, -.task-options .priority-multiplier li .highlight > div > div:first-child:before, -.task-options .task-attributes li .highlight > div > div:first-child:before, -.task-options .repeat-days li .highlight > div > div:first-child:before, -.task-options .repeat-frequency li .highlight > div > div:first-child:before, -.task-options .save-close .highlight > div > div:first-child:before, -.task-checklist-edit > ul li .highlight > div > div:first-child:before, -.filters .filters-tags .highlight > div > div:first-child:before, -.chat-buttons .highlight > div > div:first-child:before, -.toolbar-mobile .highlight > div > div:first-child:before, -.toolbar-nav .toolbar-button .highlight > div > div:first-child:before, -.toolbar-sync .highlight > div > div:first-child:before, -.toolbar-settings .highlight > div > div:first-child:before, -.toolbar-audio .highlight > div > div:first-child:before, -.toolbar-notifs .highlight > div > div:first-child:before, -.toolbar-controls .toolbar-controls-button .highlight > div > div:first-child:before, -.toolbar-subscribe-button .highlight > div > div:first-child:before, -.toolbar-controls .toolbar-subscribe-button .highlight > div > div:first-child:before, -.options-menu li .highlight > div > div:first-child:before, -.options-submenu li .highlight > div > div:first-child:before { - background-color: #fff; - border-color: #c6d6d6; -} -.plusminus .task-checker .highlight > div h4:before, -.task-options .priority-multiplier li .highlight > div h4:before, -.task-options .task-attributes li .highlight > div h4:before, -.task-options .repeat-days li .highlight > div h4:before, -.task-options .repeat-frequency li .highlight > div h4:before, -.task-options .save-close .highlight > div h4:before, -.task-checklist-edit > ul li .highlight > div h4:before, -.filters .filters-tags .highlight > div h4:before, -.chat-buttons .highlight > div h4:before, -.toolbar-mobile .highlight > div h4:before, -.toolbar-nav .toolbar-button .highlight > div h4:before, -.toolbar-sync .highlight > div h4:before, -.toolbar-settings .highlight > div h4:before, -.toolbar-audio .highlight > div h4:before, -.toolbar-notifs .highlight > div h4:before, -.toolbar-controls .toolbar-controls-button .highlight > div h4:before, -.toolbar-subscribe-button .highlight > div h4:before, -.toolbar-controls .toolbar-subscribe-button .highlight > div h4:before, -.options-menu li .highlight > div h4:before, -.options-submenu li .highlight > div h4:before { - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.plusminus .task-checker .highlight > div ul, -.task-options .priority-multiplier li .highlight > div ul, -.task-options .task-attributes li .highlight > div ul, -.task-options .repeat-days li .highlight > div ul, -.task-options .repeat-frequency li .highlight > div ul, -.task-options .save-close .highlight > div ul, -.task-checklist-edit > ul li .highlight > div ul, -.filters .filters-tags .highlight > div ul, -.chat-buttons .highlight > div ul, -.toolbar-mobile .highlight > div ul, -.toolbar-nav .toolbar-button .highlight > div ul, -.toolbar-sync .highlight > div ul, -.toolbar-settings .highlight > div ul, -.toolbar-audio .highlight > div ul, -.toolbar-notifs .highlight > div ul, -.toolbar-controls .toolbar-controls-button .highlight > div ul, -.toolbar-subscribe-button .highlight > div ul, -.toolbar-controls .toolbar-subscribe-button .highlight > div ul, -.options-menu li .highlight > div ul, -.options-submenu li .highlight > div ul { - border-color: #f4f7f7; -} -.plusminus .task-checker .highlight > div a, -.task-options .priority-multiplier li .highlight > div a, -.task-options .task-attributes li .highlight > div a, -.task-options .repeat-days li .highlight > div a, -.task-options .repeat-frequency li .highlight > div a, -.task-options .save-close .highlight > div a, -.task-checklist-edit > ul li .highlight > div a, -.filters .filters-tags .highlight > div a, -.chat-buttons .highlight > div a, -.toolbar-mobile .highlight > div a, -.toolbar-nav .toolbar-button .highlight > div a, -.toolbar-sync .highlight > div a, -.toolbar-settings .highlight > div a, -.toolbar-audio .highlight > div a, -.toolbar-notifs .highlight > div a, -.toolbar-controls .toolbar-controls-button .highlight > div a, -.toolbar-subscribe-button .highlight > div a, -.toolbar-controls .toolbar-subscribe-button .highlight > div a, -.options-menu li .highlight > div a, -.options-submenu li .highlight > div a, -.plusminus .task-checker .highlight > div a:link, -.task-options .priority-multiplier li .highlight > div a:link, -.task-options .task-attributes li .highlight > div a:link, -.task-options .repeat-days li .highlight > div a:link, -.task-options .repeat-frequency li .highlight > div a:link, -.task-options .save-close .highlight > div a:link, -.task-checklist-edit > ul li .highlight > div a:link, -.filters .filters-tags .highlight > div a:link, -.chat-buttons .highlight > div a:link, -.toolbar-mobile .highlight > div a:link, -.toolbar-nav .toolbar-button .highlight > div a:link, -.toolbar-sync .highlight > div a:link, -.toolbar-settings .highlight > div a:link, -.toolbar-audio .highlight > div a:link, -.toolbar-notifs .highlight > div a:link, -.toolbar-controls .toolbar-controls-button .highlight > div a:link, -.toolbar-subscribe-button .highlight > div a:link, -.toolbar-controls .toolbar-subscribe-button .highlight > div a:link, -.options-menu li .highlight > div a:link, -.options-submenu li .highlight > div a:link, -.plusminus .task-checker .highlight > div a:visited, -.task-options .priority-multiplier li .highlight > div a:visited, -.task-options .task-attributes li .highlight > div a:visited, -.task-options .repeat-days li .highlight > div a:visited, -.task-options .repeat-frequency li .highlight > div a:visited, -.task-options .save-close .highlight > div a:visited, -.task-checklist-edit > ul li .highlight > div a:visited, -.filters .filters-tags .highlight > div a:visited, -.chat-buttons .highlight > div a:visited, -.toolbar-mobile .highlight > div a:visited, -.toolbar-nav .toolbar-button .highlight > div a:visited, -.toolbar-sync .highlight > div a:visited, -.toolbar-settings .highlight > div a:visited, -.toolbar-audio .highlight > div a:visited, -.toolbar-notifs .highlight > div a:visited, -.toolbar-controls .toolbar-controls-button .highlight > div a:visited, -.toolbar-subscribe-button .highlight > div a:visited, -.toolbar-controls .toolbar-subscribe-button .highlight > div a:visited, -.options-menu li .highlight > div a:visited, -.options-submenu li .highlight > div a:visited { - color: #3e5555 !important; -} -.plusminus .task-checker .highlight .glyphicon, -.task-options .priority-multiplier li .highlight .glyphicon, -.task-options .task-attributes li .highlight .glyphicon, -.task-options .repeat-days li .highlight .glyphicon, -.task-options .repeat-frequency li .highlight .glyphicon, -.task-options .save-close .highlight .glyphicon, -.task-checklist-edit > ul li .highlight .glyphicon, -.filters .filters-tags .highlight .glyphicon, -.chat-buttons .highlight .glyphicon, -.toolbar-mobile .highlight .glyphicon, -.toolbar-nav .toolbar-button .highlight .glyphicon, -.toolbar-sync .highlight .glyphicon, -.toolbar-settings .highlight .glyphicon, -.toolbar-audio .highlight .glyphicon, -.toolbar-notifs .highlight .glyphicon, -.toolbar-controls .toolbar-controls-button .highlight .glyphicon, -.toolbar-subscribe-button .highlight .glyphicon, -.toolbar-controls .toolbar-subscribe-button .highlight .glyphicon, -.options-menu li .highlight .glyphicon, -.options-submenu li .highlight .glyphicon { - color: #537272; -} -.plusminus .task-checker .highlight .tooltip, -.task-options .priority-multiplier li .highlight .tooltip, -.task-options .task-attributes li .highlight .tooltip, -.task-options .repeat-days li .highlight .tooltip, -.task-options .repeat-frequency li .highlight .tooltip, -.task-options .save-close .highlight .tooltip, -.task-checklist-edit > ul li .highlight .tooltip, -.filters .filters-tags .highlight .tooltip, -.chat-buttons .highlight .tooltip, -.toolbar-mobile .highlight .tooltip, -.toolbar-nav .toolbar-button .highlight .tooltip, -.toolbar-sync .highlight .tooltip, -.toolbar-settings .highlight .tooltip, -.toolbar-audio .highlight .tooltip, -.toolbar-notifs .highlight .tooltip, -.toolbar-controls .toolbar-controls-button .highlight .tooltip, -.toolbar-subscribe-button .highlight .tooltip, -.toolbar-controls .toolbar-subscribe-button .highlight .tooltip, -.options-menu li .highlight .tooltip, -.options-submenu li .highlight .tooltip { - border: 0; -} -.plusminus .task-checker .highlight.active a, -.task-options .priority-multiplier li .highlight.active a, -.task-options .task-attributes li .highlight.active a, -.task-options .repeat-days li .highlight.active a, -.task-options .repeat-frequency li .highlight.active a, -.task-options .save-close .highlight.active a, -.task-checklist-edit > ul li .highlight.active a, -.filters .filters-tags .highlight.active a, -.chat-buttons .highlight.active a, -.toolbar-mobile .highlight.active a, -.toolbar-nav .toolbar-button .highlight.active a, -.toolbar-sync .highlight.active a, -.toolbar-settings .highlight.active a, -.toolbar-audio .highlight.active a, -.toolbar-notifs .highlight.active a, -.toolbar-controls .toolbar-controls-button .highlight.active a, -.toolbar-subscribe-button .highlight.active a, -.toolbar-controls .toolbar-subscribe-button .highlight.active a, -.options-menu li .highlight.active a, -.options-submenu li .highlight.active a, -.plusminus .task-checker .highlight.active button, -.task-options .priority-multiplier li .highlight.active button, -.task-options .task-attributes li .highlight.active button, -.task-options .repeat-days li .highlight.active button, -.task-options .repeat-frequency li .highlight.active button, -.task-options .save-close .highlight.active button, -.task-checklist-edit > ul li .highlight.active button, -.filters .filters-tags .highlight.active button, -.chat-buttons .highlight.active button, -.toolbar-mobile .highlight.active button, -.toolbar-nav .toolbar-button .highlight.active button, -.toolbar-sync .highlight.active button, -.toolbar-settings .highlight.active button, -.toolbar-audio .highlight.active button, -.toolbar-notifs .highlight.active button, -.toolbar-controls .toolbar-controls-button .highlight.active button, -.toolbar-subscribe-button .highlight.active button, -.toolbar-controls .toolbar-subscribe-button .highlight.active button, -.options-menu li .highlight.active button, -.options-submenu li .highlight.active button { - background-color: #e9efef !important; - border-color: #678e8e !important; -} -.plusminus .task-checker .highlight.active.filters-tags a, -.task-options .priority-multiplier li .highlight.active.filters-tags a, -.task-options .task-attributes li .highlight.active.filters-tags a, -.task-options .repeat-days li .highlight.active.filters-tags a, -.task-options .repeat-frequency li .highlight.active.filters-tags a, -.task-options .save-close .highlight.active.filters-tags a, -.task-checklist-edit > ul li .highlight.active.filters-tags a, -.filters .filters-tags .highlight.active.filters-tags a, -.chat-buttons .highlight.active.filters-tags a, -.toolbar-mobile .highlight.active.filters-tags a, -.toolbar-nav .toolbar-button .highlight.active.filters-tags a, -.toolbar-sync .highlight.active.filters-tags a, -.toolbar-settings .highlight.active.filters-tags a, -.toolbar-audio .highlight.active.filters-tags a, -.toolbar-notifs .highlight.active.filters-tags a, -.toolbar-controls .toolbar-controls-button .highlight.active.filters-tags a, -.toolbar-subscribe-button .highlight.active.filters-tags a, -.toolbar-controls .toolbar-subscribe-button .highlight.active.filters-tags a, -.options-menu li .highlight.active.filters-tags a, -.options-submenu li .highlight.active.filters-tags a, -.plusminus .task-checker .highlight.active.filters-tags button, -.task-options .priority-multiplier li .highlight.active.filters-tags button, -.task-options .task-attributes li .highlight.active.filters-tags button, -.task-options .repeat-days li .highlight.active.filters-tags button, -.task-options .repeat-frequency li .highlight.active.filters-tags button, -.task-options .save-close .highlight.active.filters-tags button, -.task-checklist-edit > ul li .highlight.active.filters-tags button, -.filters .filters-tags .highlight.active.filters-tags button, -.chat-buttons .highlight.active.filters-tags button, -.toolbar-mobile .highlight.active.filters-tags button, -.toolbar-nav .toolbar-button .highlight.active.filters-tags button, -.toolbar-sync .highlight.active.filters-tags button, -.toolbar-settings .highlight.active.filters-tags button, -.toolbar-audio .highlight.active.filters-tags button, -.toolbar-notifs .highlight.active.filters-tags button, -.toolbar-controls .toolbar-controls-button .highlight.active.filters-tags button, -.toolbar-subscribe-button .highlight.active.filters-tags button, -.toolbar-controls .toolbar-subscribe-button .highlight.active.filters-tags button, -.options-menu li .highlight.active.filters-tags button, -.options-submenu li .highlight.active.filters-tags button { - background-color: #97b3b3 !important; - border-color: #f4f7f7 !important; - color: #fff !important; -} -.plusminus .task-checker .highlight.active.filters-tags a span, -.task-options .priority-multiplier li .highlight.active.filters-tags a span, -.task-options .task-attributes li .highlight.active.filters-tags a span, -.task-options .repeat-days li .highlight.active.filters-tags a span, -.task-options .repeat-frequency li .highlight.active.filters-tags a span, -.task-options .save-close .highlight.active.filters-tags a span, -.task-checklist-edit > ul li .highlight.active.filters-tags a span, -.filters .filters-tags .highlight.active.filters-tags a span, -.chat-buttons .highlight.active.filters-tags a span, -.toolbar-mobile .highlight.active.filters-tags a span, -.toolbar-nav .toolbar-button .highlight.active.filters-tags a span, -.toolbar-sync .highlight.active.filters-tags a span, -.toolbar-settings .highlight.active.filters-tags a span, -.toolbar-audio .highlight.active.filters-tags a span, -.toolbar-notifs .highlight.active.filters-tags a span, -.toolbar-controls .toolbar-controls-button .highlight.active.filters-tags a span, -.toolbar-subscribe-button .highlight.active.filters-tags a span, -.toolbar-controls .toolbar-subscribe-button .highlight.active.filters-tags a span, -.options-menu li .highlight.active.filters-tags a span, -.options-submenu li .highlight.active.filters-tags a span, -.plusminus .task-checker .highlight.active.filters-tags button span, -.task-options .priority-multiplier li .highlight.active.filters-tags button span, -.task-options .task-attributes li .highlight.active.filters-tags button span, -.task-options .repeat-days li .highlight.active.filters-tags button span, -.task-options .repeat-frequency li .highlight.active.filters-tags button span, -.task-options .save-close .highlight.active.filters-tags button span, -.task-checklist-edit > ul li .highlight.active.filters-tags button span, -.filters .filters-tags .highlight.active.filters-tags button span, -.chat-buttons .highlight.active.filters-tags button span, -.toolbar-mobile .highlight.active.filters-tags button span, -.toolbar-nav .toolbar-button .highlight.active.filters-tags button span, -.toolbar-sync .highlight.active.filters-tags button span, -.toolbar-settings .highlight.active.filters-tags button span, -.toolbar-audio .highlight.active.filters-tags button span, -.toolbar-notifs .highlight.active.filters-tags button span, -.toolbar-controls .toolbar-controls-button .highlight.active.filters-tags button span, -.toolbar-subscribe-button .highlight.active.filters-tags button span, -.toolbar-controls .toolbar-subscribe-button .highlight.active.filters-tags button span, -.options-menu li .highlight.active.filters-tags button span, -.options-submenu li .highlight.active.filters-tags button span { - color: #fff !important; -} -.toolbar-nav .toolbar-button-dropdown { - border: 1px solid #ccc !important; - -webkit-border-radius: 0.382em !important; - border-radius: 0.382em !important; -} -.toolbar-nav .toolbar-button-dropdown > a:first-of-type { - -webkit-border-radius: 0.382em 0em 0em 0.382em !important; - border-radius: 0.382em 0em 0em 0.382em !important; -} -.toolbar-nav .toolbar-button-dropdown > a:last-of-type { - -webkit-border-radius: 0em 0.382em 0.382em 0em !important; - border-radius: 0em 0.382em 0.382em 0em !important; -} -.toolbar-nav .toolbar-button-dropdown.highlight { - border-color: #89aef0 !important; - background-color: #c9daf8 !important; - background-color: #c9daf8 !important; -} -.toolbar-nav .toolbar-button-dropdown.highlight { - color: #3e5555 !important; -} -.toolbar-nav .toolbar-button-dropdown.highlight:active { - background-color: #14459a !important; -} -@media screen and (min-width: 768px) { - .toolbar-nav .toolbar-button-dropdown.highlight:hover { - background-color: #c0d4f7 !important; - } -} -.toolbar-nav .toolbar-button-dropdown.highlight > a, -.toolbar-nav .toolbar-button-dropdown.highlight > button { - background-color: #c9daf8 !important; -} -.toolbar-nav .toolbar-button-dropdown.highlight > a:active, -.toolbar-nav .toolbar-button-dropdown.highlight > button:active { - background-color: #14459a !important; -} -@media screen and (min-width: 768px) { - .toolbar-nav .toolbar-button-dropdown.highlight > a:hover, - .toolbar-nav .toolbar-button-dropdown.highlight > button:hover { - background-color: #c0d4f7 !important; - } -} -.toolbar-nav .toolbar-button-dropdown.highlight > a, -.toolbar-nav .toolbar-button-dropdown.highlight > button, -.toolbar-nav .toolbar-button-dropdown.highlight > input, -.toolbar-nav .toolbar-button-dropdown.highlight textarea { - color: #3e5555 !important; - border-color: #c6d6d6 !important; -} -.toolbar-nav .toolbar-button-dropdown.highlight > input:hover, -.toolbar-nav .toolbar-button-dropdown.highlight textarea:hover { - border-color: #97b3b3 !important; -} -.toolbar-nav .toolbar-button-dropdown.highlight > input:focus, -.toolbar-nav .toolbar-button-dropdown.highlight textarea:focus { - border-color: #4f6d6d !important; - outline: none; -} -.toolbar-nav .toolbar-button-dropdown.highlight > input + button:focus, -.toolbar-nav .toolbar-button-dropdown.highlight textarea + button:focus { - border-color: #97b3b3 !important; - background-color: #e2eaea !important; - outline: none; -} -.toolbar-nav .toolbar-button-dropdown.highlight > input + button:active, -.toolbar-nav .toolbar-button-dropdown.highlight textarea + button:active { - background-color: #c6d6d6 !important; -} -.toolbar-nav .toolbar-button-dropdown.highlight > a:nth-of-type(2) { - border-left: 1px solid #bad0f6 !important; -} -@media screen and (min-width: 768px) { - .toolbar-nav .toolbar-button-dropdown.highlight > div { - border: 1px solid #c6d6d6; - } -} -.toolbar-nav .toolbar-button-dropdown.highlight > div h4 { - color: #4f6d6d; - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-nav .toolbar-button-dropdown.highlight > div > ul:first-child:before, -.toolbar-nav .toolbar-button-dropdown.highlight > div > div:first-child:before { - background-color: #fff; - border-color: #c6d6d6; -} -.toolbar-nav .toolbar-button-dropdown.highlight > div h4:before { - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-nav .toolbar-button-dropdown.highlight > div ul { - border-color: #f4f7f7; -} -.toolbar-nav .toolbar-button-dropdown.highlight > div a, -.toolbar-nav .toolbar-button-dropdown.highlight > div a:link, -.toolbar-nav .toolbar-button-dropdown.highlight > div a:visited { - color: #3e5555 !important; -} -.toolbar-nav .toolbar-button-dropdown.highlight .glyphicon { - color: #537272; -} -.toolbar-nav .toolbar-button-dropdown.highlight .tooltip { - border: 0; -} -.toolbar-nav .toolbar-button-dropdown.highlight.active a, -.toolbar-nav .toolbar-button-dropdown.highlight.active button { - background-color: #e9efef !important; - border-color: #678e8e !important; -} -.toolbar-nav .toolbar-button-dropdown.highlight.active.filters-tags a, -.toolbar-nav .toolbar-button-dropdown.highlight.active.filters-tags button { - background-color: #97b3b3 !important; - border-color: #f4f7f7 !important; - color: #fff !important; -} -.toolbar-nav .toolbar-button-dropdown.highlight.active.filters-tags a span, -.toolbar-nav .toolbar-button-dropdown.highlight.active.filters-tags button span { - color: #fff !important; -} -.task-add, -.task-checklist-edit > .checklist-form li, -.filters .hrpg-input-group { - border: none; - -webkit-border-radius: 0.382em; - border-radius: 0.382em; -} -.task-add input, -.task-checklist-edit > .checklist-form li input, -.filters .hrpg-input-group input, -.task-add a, -.task-checklist-edit > .checklist-form li a, -.filters .hrpg-input-group a, -.task-add button, -.task-checklist-edit > .checklist-form li button, -.filters .hrpg-input-group button, -.task-add textarea, -.task-checklist-edit > .checklist-form li textarea, -.filters .hrpg-input-group textarea { - display: block; - float: left; - height: 2em; -} -.task-add textarea, -.task-checklist-edit > .checklist-form li textarea, -.filters .hrpg-input-group textarea { - height: auto; -} -.task-add input, -.task-checklist-edit > .checklist-form li input, -.filters .hrpg-input-group input, -.task-add textarea, -.task-checklist-edit > .checklist-form li textarea, -.filters .hrpg-input-group textarea { - border: 1px solid #ccc; - -webkit-border-radius: 0.382em 0em 0em 0.382em !important; - border-radius: 0.382em 0em 0em 0.382em !important; - padding-left: 0.618em; - background-color: #fff !important; - -webkit-appearance: none; - -moz-appearance: none; - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - -webkit-box-shadow: none; - box-shadow: none; -} -.task-add a, -.task-checklist-edit > .checklist-form li a, -.filters .hrpg-input-group a, -.task-add button, -.task-checklist-edit > .checklist-form li button, -.filters .hrpg-input-group button { - border-width: 1px; - border-color: #ccc; - border-top-style: solid; - border-right-style: solid; - border-bottom-style: solid; - border-left: none; - -webkit-border-radius: 0em 0.382em 0.382em 0em; - border-radius: 0em 0.382em 0.382em 0em; - outline: none; -} -.task-filter, -.filters .filters-controls { - list-style: none; - display: inline-block; - border: 1px solid #d6d6d6; - -webkit-border-radius: 0.382em; - border-radius: 0.382em; - margin-bottom: 0.618em; -} -.task-filter li, -.filters .filters-controls li { - border-right: 1px solid #f5f5f5; - float: left; - word-wrap: break-word; -} -.task-filter li button, -.filters .filters-controls li button { - border: none; -} -.task-filter li:nth-of-type(2), -.filters .filters-controls li:nth-of-type(2) { - -webkit-border-radius: 0.382em 0em 0em 0.382em; - border-radius: 0.382em 0em 0em 0.382em; -} -.task-filter li:first-of-type, -.filters .filters-controls li:first-of-type { - -webkit-border-radius: 0.382em 0em 0em 0.382em; - border-radius: 0.382em 0em 0em 0.382em; -} -.task-filter li:first-of-type a, -.filters .filters-controls li:first-of-type a, -.task-filter li:first-of-type button, -.filters .filters-controls li:first-of-type button { - -webkit-border-radius: 0.382em 0em 0em 0.382em; - border-radius: 0.382em 0em 0em 0.382em; -} -.task-filter li:last-of-type, -.filters .filters-controls li:last-of-type { - border-right: none; -} -.task-filter li:last-of-type a, -.filters .filters-controls li:last-of-type a, -.task-filter li:last-of-type button, -.filters .filters-controls li:last-of-type button { - -webkit-border-radius: 0em 0.382em 0.382em 0em; - border-radius: 0em 0.382em 0.382em 0em; -} -.filters .filters-controls li:first-of-type { - padding: 0.25em 0.618em; -} -.herobox .avatar-level, -.herobox .avatar-name, -.hero-stats .meter-label { - padding: 0.382em 0.618em; - border: 1px solid #fff; - outline: 1px solid #999; - background-color: #999; - font-size: 0.8em; - line-height: 1; - font-weight: bold; - letter-spacing: 0.0618em; - color: #fff; - text-shadow: - -1px -1px 1px #333, - 1px -1px 1px #333, - -1px 1px 1px #333, - 1px 1px 1px #333; -} -.herobox .avatar-level > a, -.herobox .avatar-name > a, -.hero-stats .meter-label > a { - color: #fff; -} -.toolbar-mobile, -.toolbar-nav .toolbar-button-dropdown, -.toolbar-notifs, -.toolbar-settings, -.toolbar-audio { - position: relative; -} -.toolbar-mobile > div, -.toolbar-nav .toolbar-button-dropdown > div, -.toolbar-notifs > div, -.toolbar-settings > div, -.toolbar-audio > div { - position: absolute; - top: 2.9em; - min-width: 110px; - -webkit-border-radius: 4px; - border-radius: 4px; - background-color: #fff; -} -@media screen and (max-width: 767px) { - .toolbar-mobile > div, - .toolbar-nav .toolbar-button-dropdown > div, - .toolbar-notifs > div, - .toolbar-settings > div, - .toolbar-audio > div { - position: fixed; - z-index: 1000; - top: 2%; - left: 2%; - width: 96%; - height: 96%; - -webkit-box-shadow: 0 0 0 30px rgba(0, 0, 0, 0.63); - box-shadow: 0 0 0 30px rgba(0, 0, 0, 0.63); - } - .toolbar-mobile > div h4:before, - .toolbar-nav .toolbar-button-dropdown > div h4:before, - .toolbar-notifs > div h4:before, - .toolbar-settings > div h4:before, - .toolbar-audio > div h4:before { - display: none; - } - .toolbar-mobile > div > div, - .toolbar-nav .toolbar-button-dropdown > div > div, - .toolbar-notifs > div > div, - .toolbar-settings > div > div, - .toolbar-audio > div > div { - height: 80%; - overflow: auto; - } - .toolbar-mobile > div > div ul:last-child, - .toolbar-nav .toolbar-button-dropdown > div > div ul:last-child, - .toolbar-notifs > div > div ul:last-child, - .toolbar-settings > div > div ul:last-child, - .toolbar-audio > div > div ul:last-child { - padding-bottom: 2.618em; - } -} -.toolbar-mobile > div h4, -.toolbar-nav .toolbar-button-dropdown > div h4, -.toolbar-notifs > div h4, -.toolbar-settings > div h4, -.toolbar-audio > div h4 { - font-size: 1.2em; - margin: 0px; - border-bottom-width: 1px; - border-bottom-style: solid; - -webkit-border-radius: 0.2em 0.2em 0em 0em; - border-radius: 0.2em 0.2em 0em 0em; - padding: 0.618em 0.8333em; -} -.toolbar-mobile > div ul, -.toolbar-nav .toolbar-button-dropdown > div ul, -.toolbar-notifs > div ul, -.toolbar-settings > div ul, -.toolbar-audio > div ul { - padding: 0.382em 0em; - list-style: none; - overflow: auto; - border-top-width: 1px; - border-top-style: solid; -} -@media screen and (min-width: 768px) { - .toolbar-mobile > div ul, - .toolbar-nav .toolbar-button-dropdown > div ul, - .toolbar-notifs > div ul, - .toolbar-settings > div ul, - .toolbar-audio > div ul { - max-height: 320px; - max-height: 62.8vh; - } -} -.toolbar-mobile > div ul li, -.toolbar-nav .toolbar-button-dropdown > div ul li, -.toolbar-notifs > div ul li, -.toolbar-settings > div ul li, -.toolbar-audio > div ul li { - width: 100%; -} -@media screen and (max-width: 767px) { - .toolbar-mobile > div ul li, - .toolbar-nav .toolbar-button-dropdown > div ul li, - .toolbar-notifs > div ul li, - .toolbar-settings > div ul li, - .toolbar-audio > div ul li { - width: auto; - } -} -.toolbar-mobile > div ul a, -.toolbar-nav .toolbar-button-dropdown > div ul a, -.toolbar-notifs > div ul a, -.toolbar-settings > div ul a, -.toolbar-audio > div ul a { - display: inline-block; - width: 100%; - height: 100%; - padding: 0.618em 1em; -} -.toolbar-mobile > div ul:first-of-type, -.toolbar-nav .toolbar-button-dropdown > div ul:first-of-type, -.toolbar-notifs > div ul:first-of-type, -.toolbar-settings > div ul:first-of-type, -.toolbar-audio > div ul:first-of-type { - border: none; -} -.toolbar-mobile > div > ul:first-child:before, -.toolbar-nav .toolbar-button-dropdown > div > ul:first-child:before, -.toolbar-notifs > div > ul:first-child:before, -.toolbar-settings > div > ul:first-child:before, -.toolbar-audio > div > ul:first-child:before, -.toolbar-mobile > div > div:first-child:before, -.toolbar-nav .toolbar-button-dropdown > div > div:first-child:before, -.toolbar-notifs > div > div:first-child:before, -.toolbar-settings > div > div:first-child:before, -.toolbar-audio > div > div:first-child:before, -.toolbar-mobile > div h4:before, -.toolbar-nav .toolbar-button-dropdown > div h4:before, -.toolbar-notifs > div h4:before, -.toolbar-settings > div h4:before, -.toolbar-audio > div h4:before { - content: ''; - position: absolute; - top: -9px; - z-index: 2; - width: 16px; - height: 16px; - border-top-width: 1px; - border-top-style: solid; - border-left-width: 1px; - border-left-style: solid; - -webkit-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -o-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); -} -@media screen and (min-width: 768px) { - .toolbar-notifs div, - .toolbar-settings div, - .toolbar-audio div { - right: 0px; - } - .toolbar-notifs div > ul:first-child:before, - .toolbar-settings div > ul:first-child:before, - .toolbar-audio div > ul:first-child:before, - .toolbar-notifs div > div:first-child:before, - .toolbar-settings div > div:first-child:before, - .toolbar-audio div > div:first-child:before, - .toolbar-notifs div h4:before, - .toolbar-settings div h4:before, - .toolbar-audio div h4:before { - right: 0.5em; - } -} -@media screen and (min-width: 768px) { - .toolbar-mobile div, - .toolbar-nav .toolbar-button-dropdown div { - left: 0px; - } - .toolbar-mobile div > ul:first-child:before, - .toolbar-nav .toolbar-button-dropdown div > ul:first-child:before, - .toolbar-mobile div > div:first-child:before, - .toolbar-nav .toolbar-button-dropdown div > div:first-child:before, - .toolbar-mobile div h4:before, - .toolbar-nav .toolbar-button-dropdown div h4:before { - left: 1em; - } -} -.toolbar-controls { - text-align: right; - -webkit-border-radius: 0px 0px 0.382em 0.382em; - border-radius: 0px 0px 0.382em 0.382em; - background-color: #fff; -} -.toolbar-controls li { - margin-right: 0.618em; - margin-bottom: 0.382em; - display: inline-block; -} -@media screen and (max-width: 767px) { - .toolbar-controls, - .toolbar-controls { - width: 96%; - position: fixed; - bottom: 2%; - right: 2%; - border: none; - } -} -@media screen and (min-width: 768px) { - .toolbar-controls, - .toolbar-controls { - display: none; - } -} -.options-menu, -.options-submenu { - margin-bottom: 1.618em; -} -@media screen and (min-width: 768px) { - .options-menu, - .options-submenu, - .options-menu, - .options-submenu { - padding: 1em 1em 0em 1em; - } -} -.options-menu li, -.options-submenu li { - display: inline-block; - margin-right: 1em; - margin-bottom: 1em; -} -.disabled-tooltip-wrapper { - display: inline-block; -} -.task-column:not(.rewards) .color-worst:not(.completed) { - background-color: #e6b8af; - border: 1px solid #cfa59d; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > button { - background-color: #e6b8af !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > a:active, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > a:active, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > a:active, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > a:active, -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > button:active, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > button:active, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > button:active, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > button:active { - background-color: #783325 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > a:hover, - .task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > a:hover, - .task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > a:hover, - .task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > a:hover, - .task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > button:hover, - .task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > button:hover, - .task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > button:hover, - .task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > button:hover { - background-color: #e4b2a8 !important; - } -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > button, -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > input, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > input, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > input, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > input, -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li textarea, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li textarea, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li textarea, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li textarea { - color: #5d271d !important; - border-color: #d68c7d !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > input:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > input:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > input:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > input:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li textarea:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li textarea:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li textarea:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li textarea:hover { - border-color: #c65e4a !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > input:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > input:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > input:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > input:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li textarea:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li textarea:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li textarea:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li textarea:focus { - border-color: #763225 !important; - outline: none; -} -.task-column:not(.rewards) - .color-worst:not(.completed) - .priority-multiplier - li - > input - + button:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > input + button:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > input + button:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > input + button:focus, -.task-column:not(.rewards) - .color-worst:not(.completed) - .priority-multiplier - li - textarea - + button:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li textarea + button:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li textarea + button:focus, -.task-column:not(.rewards) - .color-worst:not(.completed) - .repeat-frequency - li - textarea - + button:focus { - border-color: #c65e4a !important; - background-color: #e0a79c !important; - outline: none; -} -.task-column:not(.rewards) - .color-worst:not(.completed) - .priority-multiplier - li - > input - + button:active, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > input + button:active, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > input + button:active, -.task-column:not(.rewards) - .color-worst:not(.completed) - .repeat-frequency - li - > input - + button:active, -.task-column:not(.rewards) - .color-worst:not(.completed) - .priority-multiplier - li - textarea - + button:active, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-attributes - li - textarea - + button:active, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li textarea + button:active, -.task-column:not(.rewards) - .color-worst:not(.completed) - .repeat-frequency - li - textarea - + button:active { - background-color: #d68c7d !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > a:nth-of-type(2), -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > a:nth-of-type(2), -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > a:nth-of-type(2), -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > a:nth-of-type(2) { - border-left: 1px solid #e2aea3 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > div, - .task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > div, - .task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > div, - .task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > div { - border: 1px solid #d68c7d; - } -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > div h4, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > div h4, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > div h4, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > div h4 { - color: #763225; - background-color: #e6b8af; - border-color: #d68c7d; -} -.task-column:not(.rewards) - .color-worst:not(.completed) - .priority-multiplier - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-attributes - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-worst:not(.completed) - .repeat-days - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-worst:not(.completed) - .repeat-frequency - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-worst:not(.completed) - .priority-multiplier - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-attributes - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-worst:not(.completed) - .repeat-days - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-worst:not(.completed) - .repeat-frequency - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #d68c7d; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > div h4:before, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > div h4:before, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > div h4:before, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > div h4:before { - background-color: #e6b8af; - border-color: #d68c7d; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > div ul, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > div ul, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > div ul, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > div ul { - border-color: #e6b8af; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > div a, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > div a, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > div a, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > div a, -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > div a:link, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > div a:link, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > div a:link, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > div a:link, -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li > div a:visited, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li > div a:visited, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li > div a:visited, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li > div a:visited { - color: #5d271d !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li .glyphicon, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li .glyphicon, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li .glyphicon, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li .glyphicon { - color: #7b3427; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li .tooltip, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li .tooltip, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li .tooltip, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li.active a, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li.active a, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li.active a, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li.active a, -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li.active button, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li.active button, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li.active button, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li.active button { - background-color: #e2aea3 !important; - border-color: #9a4230 !important; -} -.task-column:not(.rewards) - .color-worst:not(.completed) - .priority-multiplier - li.active.filters-tags - a, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li.active.filters-tags a, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li.active.filters-tags a, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li.active.filters-tags a, -.task-column:not(.rewards) - .color-worst:not(.completed) - .priority-multiplier - li.active.filters-tags - button, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-attributes - li.active.filters-tags - button, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li.active.filters-tags button, -.task-column:not(.rewards) - .color-worst:not(.completed) - .repeat-frequency - li.active.filters-tags - button { - background-color: #c65e4a !important; - border-color: #e6b8af !important; - color: #fff !important; -} -.task-column:not(.rewards) - .color-worst:not(.completed) - .priority-multiplier - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-attributes - li.active.filters-tags - a - span, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li.active.filters-tags a span, -.task-column:not(.rewards) - .color-worst:not(.completed) - .repeat-frequency - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-worst:not(.completed) - .priority-multiplier - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-attributes - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-worst:not(.completed) - .repeat-days - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-worst:not(.completed) - .repeat-frequency - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li button.active, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li button.active, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li button.active, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li button.active { - -webkit-box-shadow: inset 0 0 0 1px #b94f3a !important; - box-shadow: inset 0 0 0 1px #b94f3a !important; - background-color: #e1aaa0 !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .priority-multiplier li button:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .task-attributes li button:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-days li button:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .repeat-frequency li button:focus { - border: 1px solid #c96652; - outline: 0; -} -.task-column:not(.rewards) .color-worst:not(.completed) .plusminus .task-checker label:after { - border: 1px solid #c96652 !important; -} -.task-column:not(.rewards) - .color-worst:not(.completed) - .plusminus - .task-checker - input[type='checkbox']:checked - + label:after { - -webkit-box-shadow: inset 0 0 0 1px #b94f3a !important; - box-shadow: inset 0 0 0 1px #b94f3a !important; - background-color: #e1aaa0 !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > button { - background-color: #e1aaa0 !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > a:active, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > a:active, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > button:active, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > button:active { - background-color: #723024 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-worst:not(.completed) .save-close > a:hover, - .task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > a:hover, - .task-column:not(.rewards) .color-worst:not(.completed) .save-close > button:hover, - .task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > button:hover { - background-color: #dfa499 !important; - } -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > button, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > input, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > input, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close textarea, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li textarea { - color: #58251c !important; - border-color: #d28071 !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > input:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > input:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close textarea:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li textarea:hover { - border-color: #c35440 !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > input:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > input:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close textarea:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li textarea:focus { - border-color: #702f23 !important; - outline: none; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > input + button:focus, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-checklist-edit - li - > input - + button:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close textarea + button:focus, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-checklist-edit - li - textarea - + button:focus { - border-color: #c35440 !important; - background-color: #db9a8e !important; - outline: none; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > input + button:active, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-checklist-edit - li - > input - + button:active, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close textarea + button:active, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-checklist-edit - li - textarea - + button:active { - background-color: #d28071 !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > a:nth-of-type(2), -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > a:nth-of-type(2) { - border-left: 1px solid #dda095 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-worst:not(.completed) .save-close > div, - .task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > div { - border: 1px solid #d28071; - } -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > div h4, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > div h4 { - color: #702f23; - background-color: #e1aaa0; - border-color: #d28071; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > div > ul:first-child:before, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-checklist-edit - li - > div - > ul:first-child:before, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > div > div:first-child:before, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-checklist-edit - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #d28071; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > div h4:before, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > div h4:before { - background-color: #e1aaa0; - border-color: #d28071; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > div ul, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > div ul { - border-color: #e1aaa0; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > div a, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > div a, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > div a:link, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > div a:link, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close > div a:visited, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li > div a:visited { - color: #58251c !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close .glyphicon, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li .glyphicon { - color: #753125; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close .tooltip, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close.active a, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li.active a, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close.active button, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li.active button { - background-color: #dda095 !important; - border-color: #923e2e !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close.active.filters-tags a, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-checklist-edit - li.active.filters-tags - a, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close.active.filters-tags button, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-checklist-edit - li.active.filters-tags - button { - background-color: #c35440 !important; - border-color: #e1aaa0 !important; - color: #fff !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close.active.filters-tags a span, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-checklist-edit - li.active.filters-tags - a - span, -.task-column:not(.rewards) .color-worst:not(.completed) .save-close.active.filters-tags button span, -.task-column:not(.rewards) - .color-worst:not(.completed) - .task-checklist-edit - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .save-close button:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .task-checklist-edit li button:focus { - border: 1px solid #c96652; - outline: 0; -} -.task-column:not(.rewards) .color-worst:not(.completed) .task-actions { - background-color: #c96652; -} -.task-column:not(.rewards) .color-worst:not(.completed) .action-yesno label, -.task-column:not(.rewards) .color-worst:not(.completed) .task-action-btn, -.task-column:not(.rewards) .color-worst:not(.completed) .task-actions a { - background-color: #c96652; -} -.task-column:not(.rewards) .color-worst:not(.completed) .action-yesno label:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .task-action-btn:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .task-actions a:hover, -.task-column:not(.rewards) .color-worst:not(.completed) .action-yesno label:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .task-action-btn:focus, -.task-column:not(.rewards) .color-worst:not(.completed) .task-actions a:focus { - background-color: #b94f3a; -} -.task-column:not(.rewards) - .color-worst:not(.completed) - input[type='checkbox'].task-input:focus - + label, -.task-column:not(.rewards) .color-worst:not(.completed) input.habit:focus + a { - background-color: #b94f3a; -} -.task-column:not(.rewards) .color-worst:not(.completed) .task-actions a:nth-of-type(2) { - border-top: 1px solid #9a4230; -} -.task-column:not(.rewards) .color-worst:not(.completed) .task-options { - background-color: #e6b8af; -} -.task-column:not(.rewards) .color-worst:not(.completed) .option-group:not(.task-checklist) { - border-bottom: 1px solid #d88f81; -} -.task-column:not(.rewards) .color-worst:not(.completed) .option-content { - border-color: #d68c7d !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .option-content:hover { - border-color: #c65e4a !important; -} -.task-column:not(.rewards) .color-worst:not(.completed) .option-content:focus { - border-color: #763225 !important; - outline: none; -} -.task-column:not(.rewards) .color-worse:not(.completed) { - background-color: #f4cccc; - border: 1px solid #dbb7b7; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > button { - background-color: #f4cccc !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > a:active, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > a:active, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > a:active, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > a:active, -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > button:active, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > button:active, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > button:active, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > button:active { - background-color: #8f1f1f !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > a:hover, - .task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > a:hover, - .task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > a:hover, - .task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > a:hover, - .task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > button:hover, - .task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > button:hover, - .task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > button:hover, - .task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > button:hover { - background-color: #f2c3c3 !important; - } -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > button, -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > input, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > input, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > input, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > input, -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li textarea, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li textarea, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li textarea, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li textarea { - color: #6f1818 !important; - border-color: #e79090 !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > input:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > input:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > input:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > input:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li textarea:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li textarea:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li textarea:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li textarea:hover { - border-color: #da5353 !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > input:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > input:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > input:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > input:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li textarea:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li textarea:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li textarea:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li textarea:focus { - border-color: #8d1e1e !important; - outline: none; -} -.task-column:not(.rewards) - .color-worse:not(.completed) - .priority-multiplier - li - > input - + button:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > input + button:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > input + button:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > input + button:focus, -.task-column:not(.rewards) - .color-worse:not(.completed) - .priority-multiplier - li - textarea - + button:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li textarea + button:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li textarea + button:focus, -.task-column:not(.rewards) - .color-worse:not(.completed) - .repeat-frequency - li - textarea - + button:focus { - border-color: #da5353 !important; - background-color: #efb5b5 !important; - outline: none; -} -.task-column:not(.rewards) - .color-worse:not(.completed) - .priority-multiplier - li - > input - + button:active, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > input + button:active, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > input + button:active, -.task-column:not(.rewards) - .color-worse:not(.completed) - .repeat-frequency - li - > input - + button:active, -.task-column:not(.rewards) - .color-worse:not(.completed) - .priority-multiplier - li - textarea - + button:active, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-attributes - li - textarea - + button:active, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li textarea + button:active, -.task-column:not(.rewards) - .color-worse:not(.completed) - .repeat-frequency - li - textarea - + button:active { - background-color: #e79090 !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > a:nth-of-type(2), -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > a:nth-of-type(2), -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > a:nth-of-type(2), -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > a:nth-of-type(2) { - border-left: 1px solid #f1bebe !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > div, - .task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > div, - .task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > div, - .task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > div { - border: 1px solid #e79090; - } -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > div h4, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > div h4, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > div h4, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > div h4 { - color: #8d1e1e; - background-color: #f4cccc; - border-color: #e79090; -} -.task-column:not(.rewards) - .color-worse:not(.completed) - .priority-multiplier - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-attributes - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-worse:not(.completed) - .repeat-days - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-worse:not(.completed) - .repeat-frequency - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-worse:not(.completed) - .priority-multiplier - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-attributes - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-worse:not(.completed) - .repeat-days - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-worse:not(.completed) - .repeat-frequency - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #e79090; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > div h4:before, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > div h4:before, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > div h4:before, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > div h4:before { - background-color: #f4cccc; - border-color: #e79090; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > div ul, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > div ul, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > div ul, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > div ul { - border-color: #f4cccc; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > div a, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > div a, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > div a, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > div a, -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > div a:link, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > div a:link, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > div a:link, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > div a:link, -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li > div a:visited, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li > div a:visited, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li > div a:visited, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li > div a:visited { - color: #6f1818 !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li .glyphicon, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li .glyphicon, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li .glyphicon, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li .glyphicon { - color: #932020; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li .tooltip, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li .tooltip, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li .tooltip, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li.active a, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li.active a, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li.active a, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li.active a, -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li.active button, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li.active button, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li.active button, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li.active button { - background-color: #f1bebe !important; - border-color: #b82828 !important; -} -.task-column:not(.rewards) - .color-worse:not(.completed) - .priority-multiplier - li.active.filters-tags - a, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li.active.filters-tags a, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li.active.filters-tags a, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li.active.filters-tags a, -.task-column:not(.rewards) - .color-worse:not(.completed) - .priority-multiplier - li.active.filters-tags - button, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-attributes - li.active.filters-tags - button, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li.active.filters-tags button, -.task-column:not(.rewards) - .color-worse:not(.completed) - .repeat-frequency - li.active.filters-tags - button { - background-color: #da5353 !important; - border-color: #f4cccc !important; - color: #fff !important; -} -.task-column:not(.rewards) - .color-worse:not(.completed) - .priority-multiplier - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-attributes - li.active.filters-tags - a - span, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li.active.filters-tags a span, -.task-column:not(.rewards) - .color-worse:not(.completed) - .repeat-frequency - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-worse:not(.completed) - .priority-multiplier - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-attributes - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-worse:not(.completed) - .repeat-days - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-worse:not(.completed) - .repeat-frequency - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li button.active, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li button.active, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li button.active, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li button.active { - -webkit-box-shadow: inset 0 0 0 1px #d43939 !important; - box-shadow: inset 0 0 0 1px #d43939 !important; - background-color: #f0baba !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .priority-multiplier li button:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .task-attributes li button:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-days li button:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .repeat-frequency li button:focus { - border: 1px solid #dc5d5d; - outline: 0; -} -.task-column:not(.rewards) .color-worse:not(.completed) .plusminus .task-checker label:after { - border: 1px solid #dc5d5d !important; -} -.task-column:not(.rewards) - .color-worse:not(.completed) - .plusminus - .task-checker - input[type='checkbox']:checked - + label:after { - -webkit-box-shadow: inset 0 0 0 1px #d43939 !important; - box-shadow: inset 0 0 0 1px #d43939 !important; - background-color: #f0baba !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > button { - background-color: #f0baba !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > a:active, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > a:active, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > button:active, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > button:active { - background-color: #881e1e !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-worse:not(.completed) .save-close > a:hover, - .task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > a:hover, - .task-column:not(.rewards) .color-worse:not(.completed) .save-close > button:hover, - .task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > button:hover { - background-color: #eeb2b2 !important; - } -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > button, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > input, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > input, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close textarea, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li textarea { - color: #691717 !important; - border-color: #e48181 !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > input:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > input:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close textarea:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li textarea:hover { - border-color: #d74747 !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > input:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > input:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close textarea:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li textarea:focus { - border-color: #861d1d !important; - outline: none; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > input + button:focus, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-checklist-edit - li - > input - + button:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close textarea + button:focus, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-checklist-edit - li - textarea - + button:focus { - border-color: #d74747 !important; - background-color: #eba4a4 !important; - outline: none; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > input + button:active, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-checklist-edit - li - > input - + button:active, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close textarea + button:active, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-checklist-edit - li - textarea - + button:active { - background-color: #e48181 !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > a:nth-of-type(2), -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > a:nth-of-type(2) { - border-left: 1px solid #edadad !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-worse:not(.completed) .save-close > div, - .task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > div { - border: 1px solid #e48181; - } -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > div h4, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > div h4 { - color: #861d1d; - background-color: #f0baba; - border-color: #e48181; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > div > ul:first-child:before, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-checklist-edit - li - > div - > ul:first-child:before, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > div > div:first-child:before, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-checklist-edit - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #e48181; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > div h4:before, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > div h4:before { - background-color: #f0baba; - border-color: #e48181; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > div ul, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > div ul { - border-color: #f0baba; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > div a, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > div a, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > div a:link, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > div a:link, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close > div a:visited, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li > div a:visited { - color: #691717 !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close .glyphicon, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li .glyphicon { - color: #8c1e1e; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close .tooltip, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close.active a, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li.active a, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close.active button, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li.active button { - background-color: #edadad !important; - border-color: #af2626 !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close.active.filters-tags a, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-checklist-edit - li.active.filters-tags - a, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close.active.filters-tags button, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-checklist-edit - li.active.filters-tags - button { - background-color: #d74747 !important; - border-color: #f0baba !important; - color: #fff !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close.active.filters-tags a span, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-checklist-edit - li.active.filters-tags - a - span, -.task-column:not(.rewards) .color-worse:not(.completed) .save-close.active.filters-tags button span, -.task-column:not(.rewards) - .color-worse:not(.completed) - .task-checklist-edit - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .save-close button:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .task-checklist-edit li button:focus { - border: 1px solid #dc5d5d; - outline: 0; -} -.task-column:not(.rewards) .color-worse:not(.completed) .task-actions { - background-color: #dc5d5d; -} -.task-column:not(.rewards) .color-worse:not(.completed) .action-yesno label, -.task-column:not(.rewards) .color-worse:not(.completed) .task-action-btn, -.task-column:not(.rewards) .color-worse:not(.completed) .task-actions a { - background-color: #dc5d5d; -} -.task-column:not(.rewards) .color-worse:not(.completed) .action-yesno label:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .task-action-btn:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .task-actions a:hover, -.task-column:not(.rewards) .color-worse:not(.completed) .action-yesno label:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .task-action-btn:focus, -.task-column:not(.rewards) .color-worse:not(.completed) .task-actions a:focus { - background-color: #d43939; -} -.task-column:not(.rewards) - .color-worse:not(.completed) - input[type='checkbox'].task-input:focus - + label, -.task-column:not(.rewards) .color-worse:not(.completed) input.habit:focus + a { - background-color: #d43939; -} -.task-column:not(.rewards) .color-worse:not(.completed) .task-actions a:nth-of-type(2) { - border-top: 1px solid #b82828; -} -.task-column:not(.rewards) .color-worse:not(.completed) .task-options { - background-color: #f4cccc; -} -.task-column:not(.rewards) .color-worse:not(.completed) .option-group:not(.task-checklist) { - border-bottom: 1px solid #e89595; -} -.task-column:not(.rewards) .color-worse:not(.completed) .option-content { - border-color: #e79090 !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .option-content:hover { - border-color: #da5353 !important; -} -.task-column:not(.rewards) .color-worse:not(.completed) .option-content:focus { - border-color: #8d1e1e !important; - outline: none; -} -.task-column:not(.rewards) .color-bad:not(.completed) { - background-color: #fce5cd; - border: 1px solid #e2ceb8; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > button { - background-color: #fce5cd !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > a:active, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > a:active, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > a:active, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > a:active, -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > button:active, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > button:active, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > button:active, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > button:active { - background-color: #a75a0a !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > a:hover, - .task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > a:hover, - .task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > a:hover, - .task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > a:hover, - .task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > button:hover, - .task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > button:hover, - .task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > button:hover, - .task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > button:hover { - background-color: #fbe0c3 !important; - } -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > button, -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > input, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > input, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > input, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > input, -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li textarea, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li textarea, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li textarea, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li textarea { - color: #814608 !important; - border-color: #f8c187 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > input:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > input:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > input:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > input:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li textarea:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li textarea:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li textarea:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li textarea:hover { - border-color: #f49b40 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > input:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > input:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > input:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > input:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li textarea:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li textarea:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li textarea:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li textarea:focus { - border-color: #a5590a !important; - outline: none; -} -.task-column:not(.rewards) - .color-bad:not(.completed) - .priority-multiplier - li - > input - + button:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > input + button:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > input + button:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > input + button:focus, -.task-column:not(.rewards) - .color-bad:not(.completed) - .priority-multiplier - li - textarea - + button:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li textarea + button:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li textarea + button:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li textarea + button:focus { - border-color: #f49b40 !important; - background-color: #fad7b2 !important; - outline: none; -} -.task-column:not(.rewards) - .color-bad:not(.completed) - .priority-multiplier - li - > input - + button:active, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > input + button:active, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > input + button:active, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > input + button:active, -.task-column:not(.rewards) - .color-bad:not(.completed) - .priority-multiplier - li - textarea - + button:active, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li textarea + button:active, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li textarea + button:active, -.task-column:not(.rewards) - .color-bad:not(.completed) - .repeat-frequency - li - textarea - + button:active { - background-color: #f8c187 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > a:nth-of-type(2), -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > a:nth-of-type(2), -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > a:nth-of-type(2), -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > a:nth-of-type(2) { - border-left: 1px solid #fbdcbd !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > div, - .task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > div, - .task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > div, - .task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > div { - border: 1px solid #f8c187; - } -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > div h4, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > div h4, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > div h4, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > div h4 { - color: #a5590a; - background-color: #fce5cd; - border-color: #f8c187; -} -.task-column:not(.rewards) - .color-bad:not(.completed) - .priority-multiplier - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-attributes - li - > div - > ul:first-child:before, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > div > ul:first-child:before, -.task-column:not(.rewards) - .color-bad:not(.completed) - .repeat-frequency - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-bad:not(.completed) - .priority-multiplier - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-attributes - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-bad:not(.completed) - .repeat-days - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-bad:not(.completed) - .repeat-frequency - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #f8c187; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > div h4:before, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > div h4:before, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > div h4:before, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > div h4:before { - background-color: #fce5cd; - border-color: #f8c187; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > div ul, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > div ul, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > div ul, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > div ul { - border-color: #fce5cd; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > div a, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > div a, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > div a, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > div a, -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > div a:link, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > div a:link, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > div a:link, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > div a:link, -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li > div a:visited, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li > div a:visited, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li > div a:visited, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li > div a:visited { - color: #814608 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li .glyphicon, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li .glyphicon, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li .glyphicon, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li .glyphicon { - color: #ac5d0a; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li .tooltip, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li .tooltip, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li .tooltip, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li.active a, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li.active a, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li.active a, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li.active a, -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li.active button, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li.active button, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li.active button, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li.active button { - background-color: #fbdcbd !important; - border-color: #d8740d !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li.active.filters-tags a, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li.active.filters-tags a, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li.active.filters-tags a, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li.active.filters-tags a, -.task-column:not(.rewards) - .color-bad:not(.completed) - .priority-multiplier - li.active.filters-tags - button, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-attributes - li.active.filters-tags - button, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li.active.filters-tags button, -.task-column:not(.rewards) - .color-bad:not(.completed) - .repeat-frequency - li.active.filters-tags - button { - background-color: #f49b40 !important; - border-color: #fce5cd !important; - color: #fff !important; -} -.task-column:not(.rewards) - .color-bad:not(.completed) - .priority-multiplier - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-attributes - li.active.filters-tags - a - span, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li.active.filters-tags a span, -.task-column:not(.rewards) - .color-bad:not(.completed) - .repeat-frequency - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-bad:not(.completed) - .priority-multiplier - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-attributes - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-bad:not(.completed) - .repeat-days - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-bad:not(.completed) - .repeat-frequency - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li button.active, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li button.active, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li button.active, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li button.active { - -webkit-box-shadow: inset 0 0 0 1px #f28b21 !important; - box-shadow: inset 0 0 0 1px #f28b21 !important; - background-color: #fbdab7 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .priority-multiplier li button:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .task-attributes li button:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-days li button:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .repeat-frequency li button:focus { - border: 1px solid #f4a24c; - outline: 0; -} -.task-column:not(.rewards) .color-bad:not(.completed) .plusminus .task-checker label:after { - border: 1px solid #f4a24c !important; -} -.task-column:not(.rewards) - .color-bad:not(.completed) - .plusminus - .task-checker - input[type='checkbox']:checked - + label:after { - -webkit-box-shadow: inset 0 0 0 1px #f28b21 !important; - box-shadow: inset 0 0 0 1px #f28b21 !important; - background-color: #fbdab7 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > button { - background-color: #fbdab7 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > a:active, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > a:active, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > button:active, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > button:active { - background-color: #a05609 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-bad:not(.completed) .save-close > a:hover, - .task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > a:hover, - .task-column:not(.rewards) .color-bad:not(.completed) .save-close > button:hover, - .task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > button:hover { - background-color: #fad5ad !important; - } -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > button, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > input, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > input, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close textarea, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li textarea { - color: #7b4307 !important; - border-color: #f7b874 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > input:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > input:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close textarea:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li textarea:hover { - border-color: #f49530 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > input:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > input:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close textarea:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li textarea:focus { - border-color: #9d5509 !important; - outline: none; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > input + button:focus, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-checklist-edit - li - > input - + button:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close textarea + button:focus, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-checklist-edit - li - textarea - + button:focus { - border-color: #f49530 !important; - background-color: #facd9e !important; - outline: none; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > input + button:active, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-checklist-edit - li - > input - + button:active, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close textarea + button:active, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-checklist-edit - li - textarea - + button:active { - background-color: #f7b874 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > a:nth-of-type(2), -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > a:nth-of-type(2) { - border-left: 1px solid #fad2a7 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-bad:not(.completed) .save-close > div, - .task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > div { - border: 1px solid #f7b874; - } -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > div h4, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > div h4 { - color: #9d5509; - background-color: #fbdab7; - border-color: #f7b874; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > div > ul:first-child:before, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-checklist-edit - li - > div - > ul:first-child:before, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > div > div:first-child:before, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-checklist-edit - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #f7b874; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > div h4:before, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > div h4:before { - background-color: #fbdab7; - border-color: #f7b874; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > div ul, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > div ul { - border-color: #fbdab7; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > div a, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > div a, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > div a:link, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > div a:link, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close > div a:visited, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li > div a:visited { - color: #7b4307 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close .glyphicon, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li .glyphicon { - color: #a45909; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close .tooltip, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close.active a, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li.active a, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close.active button, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li.active button { - background-color: #fad2a7 !important; - border-color: #ce6f0b !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close.active.filters-tags a, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li.active.filters-tags a, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close.active.filters-tags button, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-checklist-edit - li.active.filters-tags - button { - background-color: #f49530 !important; - border-color: #fbdab7 !important; - color: #fff !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close.active.filters-tags a span, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-checklist-edit - li.active.filters-tags - a - span, -.task-column:not(.rewards) .color-bad:not(.completed) .save-close.active.filters-tags button span, -.task-column:not(.rewards) - .color-bad:not(.completed) - .task-checklist-edit - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .save-close button:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .task-checklist-edit li button:focus { - border: 1px solid #f4a24c; - outline: 0; -} -.task-column:not(.rewards) .color-bad:not(.completed) .task-actions { - background-color: #f4a24c; -} -.task-column:not(.rewards) .color-bad:not(.completed) .action-yesno label, -.task-column:not(.rewards) .color-bad:not(.completed) .task-action-btn, -.task-column:not(.rewards) .color-bad:not(.completed) .task-actions a { - background-color: #f4a24c; -} -.task-column:not(.rewards) .color-bad:not(.completed) .action-yesno label:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .task-action-btn:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .task-actions a:hover, -.task-column:not(.rewards) .color-bad:not(.completed) .action-yesno label:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .task-action-btn:focus, -.task-column:not(.rewards) .color-bad:not(.completed) .task-actions a:focus { - background-color: #f28b21; -} -.task-column:not(.rewards) - .color-bad:not(.completed) - input[type='checkbox'].task-input:focus - + label, -.task-column:not(.rewards) .color-bad:not(.completed) input.habit:focus + a { - background-color: #f28b21; -} -.task-column:not(.rewards) .color-bad:not(.completed) .task-actions a:nth-of-type(2) { - border-top: 1px solid #d8740d; -} -.task-column:not(.rewards) .color-bad:not(.completed) .task-options { - background-color: #fce5cd; -} -.task-column:not(.rewards) .color-bad:not(.completed) .option-group:not(.task-checklist) { - border-bottom: 1px solid #f8c38c; -} -.task-column:not(.rewards) .color-bad:not(.completed) .option-content { - border-color: #f8c187 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .option-content:hover { - border-color: #f49b40 !important; -} -.task-column:not(.rewards) .color-bad:not(.completed) .option-content:focus { - border-color: #a5590a !important; - outline: none; -} -.task-column:not(.rewards) .color-neutral:not(.completed) { - background-color: #fff2cc; - border: 1px solid #e5d9b7; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > button { - background-color: #fff2cc !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > a:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > a:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > a:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > a:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > button:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > button:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > button:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > button:active { - background-color: #b28500 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > a:hover, - .task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > a:hover, - .task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > a:hover, - .task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > a:hover, - .task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > button:hover, - .task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > button:hover, - .task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > button:hover, - .task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > button:hover { - background-color: #ffefc1 !important; - } -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > button, -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > input, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > input, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > input, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > input, -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li textarea, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li textarea, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li textarea, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li textarea { - color: #8a6700 !important; - border-color: #ffdf82 !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > input:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > input:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > input:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > input:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li textarea:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li textarea:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li textarea:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li textarea:hover { - border-color: #ffcc35 !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > input:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > input:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > input:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > input:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li textarea:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li textarea:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li textarea:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li textarea:focus { - border-color: #af8300 !important; - outline: none; -} -.task-column:not(.rewards) - .color-neutral:not(.completed) - .priority-multiplier - li - > input - + button:focus, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-attributes - li - > input - + button:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > input + button:focus, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-frequency - li - > input - + button:focus, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .priority-multiplier - li - textarea - + button:focus, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-attributes - li - textarea - + button:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li textarea + button:focus, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-frequency - li - textarea - + button:focus { - border-color: #ffcc35 !important; - background-color: #ffebb0 !important; - outline: none; -} -.task-column:not(.rewards) - .color-neutral:not(.completed) - .priority-multiplier - li - > input - + button:active, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-attributes - li - > input - + button:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > input + button:active, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-frequency - li - > input - + button:active, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .priority-multiplier - li - textarea - + button:active, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-attributes - li - textarea - + button:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li textarea + button:active, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-frequency - li - textarea - + button:active { - background-color: #ffdf82 !important; -} -.task-column:not(.rewards) - .color-neutral:not(.completed) - .priority-multiplier - li - > a:nth-of-type(2), -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > a:nth-of-type(2), -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > a:nth-of-type(2), -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > a:nth-of-type(2) { - border-left: 1px solid #ffeeba !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > div, - .task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > div, - .task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > div, - .task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > div { - border: 1px solid #ffdf82; - } -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > div h4, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > div h4, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > div h4, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > div h4 { - color: #af8300; - background-color: #fff2cc; - border-color: #ffdf82; -} -.task-column:not(.rewards) - .color-neutral:not(.completed) - .priority-multiplier - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-attributes - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-days - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-frequency - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .priority-multiplier - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-attributes - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-days - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-frequency - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #ffdf82; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > div h4:before, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > div h4:before, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > div h4:before, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > div h4:before { - background-color: #fff2cc; - border-color: #ffdf82; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > div ul, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > div ul, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > div ul, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > div ul { - border-color: #fff2cc; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > div a, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > div a, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > div a, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > div a, -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > div a:link, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > div a:link, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > div a:link, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > div a:link, -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li > div a:visited, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li > div a:visited, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li > div a:visited, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li > div a:visited { - color: #8a6700 !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li .glyphicon, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li .glyphicon, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li .glyphicon, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li .glyphicon { - color: #b88900; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li .tooltip, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li .tooltip, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li .tooltip, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li.active a, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li.active a, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li.active a, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li.active a, -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li.active button, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li.active button, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li.active button, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li.active button { - background-color: #ffeeba !important; - border-color: #e6ab00 !important; -} -.task-column:not(.rewards) - .color-neutral:not(.completed) - .priority-multiplier - li.active.filters-tags - a, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li.active.filters-tags a, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li.active.filters-tags a, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-frequency - li.active.filters-tags - a, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .priority-multiplier - li.active.filters-tags - button, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-attributes - li.active.filters-tags - button, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-days - li.active.filters-tags - button, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-frequency - li.active.filters-tags - button { - background-color: #ffcc35 !important; - border-color: #fff2cc !important; - color: #fff !important; -} -.task-column:not(.rewards) - .color-neutral:not(.completed) - .priority-multiplier - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-attributes - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-days - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-frequency - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .priority-multiplier - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-attributes - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-days - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .repeat-frequency - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li button.active, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li button.active, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li button.active, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li button.active { - -webkit-box-shadow: inset 0 0 0 1px #ffc314 !important; - box-shadow: inset 0 0 0 1px #ffc314 !important; - background-color: #ffecb5 !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .priority-multiplier li button:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-attributes li button:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-days li button:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .repeat-frequency li button:focus { - border: 1px solid #ffcf42; - outline: 0; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .plusminus .task-checker label:after { - border: 1px solid #ffcf42 !important; -} -.task-column:not(.rewards) - .color-neutral:not(.completed) - .plusminus - .task-checker - input[type='checkbox']:checked - + label:after { - -webkit-box-shadow: inset 0 0 0 1px #ffc314 !important; - box-shadow: inset 0 0 0 1px #ffc314 !important; - background-color: #ffecb5 !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > button { - background-color: #ffecb5 !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > a:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > a:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > button:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > button:active { - background-color: #a97e00 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-neutral:not(.completed) .save-close > a:hover, - .task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > a:hover, - .task-column:not(.rewards) .color-neutral:not(.completed) .save-close > button:hover, - .task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > button:hover { - background-color: #ffe9ab !important; - } -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > button, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > input, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > input, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close textarea, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li textarea { - color: #836100 !important; - border-color: #ffda6e !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > input:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > input:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close textarea:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li textarea:hover { - border-color: #ffc726 !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > input:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > input:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close textarea:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li textarea:focus { - border-color: #a77c00 !important; - outline: none; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > input + button:focus, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-checklist-edit - li - > input - + button:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close textarea + button:focus, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-checklist-edit - li - textarea - + button:focus { - border-color: #ffc726 !important; - background-color: #ffe59a !important; - outline: none; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > input + button:active, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-checklist-edit - li - > input - + button:active, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close textarea + button:active, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-checklist-edit - li - textarea - + button:active { - background-color: #ffda6e !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > a:nth-of-type(2), -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-checklist-edit - li - > a:nth-of-type(2) { - border-left: 1px solid #ffe8a4 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-neutral:not(.completed) .save-close > div, - .task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > div { - border: 1px solid #ffda6e; - } -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > div h4, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > div h4 { - color: #a77c00; - background-color: #ffecb5; - border-color: #ffda6e; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > div > ul:first-child:before, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-checklist-edit - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .save-close - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-checklist-edit - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #ffda6e; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > div h4:before, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > div h4:before { - background-color: #ffecb5; - border-color: #ffda6e; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > div ul, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > div ul { - border-color: #ffecb5; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > div a, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > div a, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > div a:link, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > div a:link, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close > div a:visited, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li > div a:visited { - color: #836100 !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close .glyphicon, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li .glyphicon { - color: #ae8200; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close .tooltip, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close.active a, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li.active a, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close.active button, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li.active button { - background-color: #ffe8a4 !important; - border-color: #daa200 !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close.active.filters-tags a, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-checklist-edit - li.active.filters-tags - a, -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close.active.filters-tags button, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-checklist-edit - li.active.filters-tags - button { - background-color: #ffc726 !important; - border-color: #ffecb5 !important; - color: #fff !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close.active.filters-tags a span, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-checklist-edit - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .save-close.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-neutral:not(.completed) - .task-checklist-edit - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .save-close button:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-checklist-edit li button:focus { - border: 1px solid #ffcf42; - outline: 0; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .task-actions { - background-color: #ffcf42; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .action-yesno label, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-action-btn, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-actions a { - background-color: #ffcf42; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .action-yesno label:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-action-btn:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-actions a:hover, -.task-column:not(.rewards) .color-neutral:not(.completed) .action-yesno label:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-action-btn:focus, -.task-column:not(.rewards) .color-neutral:not(.completed) .task-actions a:focus { - background-color: #ffc314; -} -.task-column:not(.rewards) - .color-neutral:not(.completed) - input[type='checkbox'].task-input:focus - + label, -.task-column:not(.rewards) .color-neutral:not(.completed) input.habit:focus + a { - background-color: #ffc314; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .task-actions a:nth-of-type(2) { - border-top: 1px solid #e6ab00; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .task-options { - background-color: #fff2cc; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .option-group:not(.task-checklist) { - border-bottom: 1px solid #ffe087; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .option-content { - border-color: #ffdf82 !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .option-content:hover { - border-color: #ffcc35 !important; -} -.task-column:not(.rewards) .color-neutral:not(.completed) .option-content:focus { - border-color: #af8300 !important; - outline: none; -} -.task-column:not(.rewards) .color-good:not(.completed) { - background-color: #d9ead3; - border: 1px solid #c3d2bd; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > button { - background-color: #d9ead3 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > a:active, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > a:active, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > a:active, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > a:active, -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > button:active, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > button:active, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > button:active, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > button:active { - background-color: #487538 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > a:hover, - .task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > a:hover, - .task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > a:hover, - .task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > a:hover, - .task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > button:hover, - .task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > button:hover, - .task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > button:hover, - .task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > button:hover { - background-color: #d3e7cc !important; - } -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > button, -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > input, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > input, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > input, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > input, -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li textarea, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li textarea, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li textarea, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li textarea { - color: #375a2b !important; - border-color: #afd3a2 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > input:hover, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > input:hover, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > input:hover, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > input:hover, -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li textarea:hover, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li textarea:hover, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li textarea:hover, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li textarea:hover { - border-color: #84bb70 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > input:focus, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > input:focus, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > input:focus, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > input:focus, -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li textarea:focus, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li textarea:focus, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li textarea:focus, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li textarea:focus { - border-color: #477337 !important; - outline: none; -} -.task-column:not(.rewards) - .color-good:not(.completed) - .priority-multiplier - li - > input - + button:focus, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > input + button:focus, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > input + button:focus, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > input + button:focus, -.task-column:not(.rewards) - .color-good:not(.completed) - .priority-multiplier - li - textarea - + button:focus, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li textarea + button:focus, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li textarea + button:focus, -.task-column:not(.rewards) - .color-good:not(.completed) - .repeat-frequency - li - textarea - + button:focus { - border-color: #84bb70 !important; - background-color: #c9e1c0 !important; - outline: none; -} -.task-column:not(.rewards) - .color-good:not(.completed) - .priority-multiplier - li - > input - + button:active, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > input + button:active, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > input + button:active, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > input + button:active, -.task-column:not(.rewards) - .color-good:not(.completed) - .priority-multiplier - li - textarea - + button:active, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li textarea + button:active, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li textarea + button:active, -.task-column:not(.rewards) - .color-good:not(.completed) - .repeat-frequency - li - textarea - + button:active { - background-color: #afd3a2 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > a:nth-of-type(2), -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > a:nth-of-type(2), -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > a:nth-of-type(2), -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > a:nth-of-type(2) { - border-left: 1px solid #cfe5c7 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > div, - .task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > div, - .task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > div, - .task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > div { - border: 1px solid #afd3a2; - } -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > div h4, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > div h4, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > div h4, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > div h4 { - color: #477337; - background-color: #d9ead3; - border-color: #afd3a2; -} -.task-column:not(.rewards) - .color-good:not(.completed) - .priority-multiplier - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-attributes - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-good:not(.completed) - .repeat-days - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-good:not(.completed) - .repeat-frequency - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-good:not(.completed) - .priority-multiplier - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-attributes - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-good:not(.completed) - .repeat-days - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-good:not(.completed) - .repeat-frequency - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #afd3a2; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > div h4:before, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > div h4:before, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > div h4:before, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > div h4:before { - background-color: #d9ead3; - border-color: #afd3a2; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > div ul, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > div ul, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > div ul, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > div ul { - border-color: #d9ead3; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > div a, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > div a, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > div a, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > div a, -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > div a:link, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > div a:link, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > div a:link, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > div a:link, -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li > div a:visited, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li > div a:visited, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li > div a:visited, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li > div a:visited { - color: #375a2b !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li .glyphicon, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li .glyphicon, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li .glyphicon, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li .glyphicon { - color: #4a783a; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li .tooltip, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li .tooltip, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li .tooltip, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li.active a, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li.active a, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li.active a, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li.active a, -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li.active button, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li.active button, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li.active button, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li.active button { - background-color: #cfe5c7 !important; - border-color: #5c9748 !important; -} -.task-column:not(.rewards) - .color-good:not(.completed) - .priority-multiplier - li.active.filters-tags - a, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li.active.filters-tags a, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li.active.filters-tags a, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li.active.filters-tags a, -.task-column:not(.rewards) - .color-good:not(.completed) - .priority-multiplier - li.active.filters-tags - button, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-attributes - li.active.filters-tags - button, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li.active.filters-tags button, -.task-column:not(.rewards) - .color-good:not(.completed) - .repeat-frequency - li.active.filters-tags - button { - background-color: #84bb70 !important; - border-color: #d9ead3 !important; - color: #fff !important; -} -.task-column:not(.rewards) - .color-good:not(.completed) - .priority-multiplier - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-attributes - li.active.filters-tags - a - span, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li.active.filters-tags a span, -.task-column:not(.rewards) - .color-good:not(.completed) - .repeat-frequency - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-good:not(.completed) - .priority-multiplier - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-attributes - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-good:not(.completed) - .repeat-days - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-good:not(.completed) - .repeat-frequency - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li button.active, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li button.active, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li button.active, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li button.active { - -webkit-box-shadow: inset 0 0 0 1px #71b05b !important; - box-shadow: inset 0 0 0 1px #71b05b !important; - background-color: #cce3c4 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .priority-multiplier li button:focus, -.task-column:not(.rewards) .color-good:not(.completed) .task-attributes li button:focus, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-days li button:focus, -.task-column:not(.rewards) .color-good:not(.completed) .repeat-frequency li button:focus { - border: 1px solid #8bbf79; - outline: 0; -} -.task-column:not(.rewards) .color-good:not(.completed) .plusminus .task-checker label:after { - border: 1px solid #8bbf79 !important; -} -.task-column:not(.rewards) - .color-good:not(.completed) - .plusminus - .task-checker - input[type='checkbox']:checked - + label:after { - -webkit-box-shadow: inset 0 0 0 1px #71b05b !important; - box-shadow: inset 0 0 0 1px #71b05b !important; - background-color: #cce3c4 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-good:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > button { - background-color: #cce3c4 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > a:active, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > a:active, -.task-column:not(.rewards) .color-good:not(.completed) .save-close > button:active, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > button:active { - background-color: #446f35 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-good:not(.completed) .save-close > a:hover, - .task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > a:hover, - .task-column:not(.rewards) .color-good:not(.completed) .save-close > button:hover, - .task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > button:hover { - background-color: #c6e0bd !important; - } -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-good:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > button, -.task-column:not(.rewards) .color-good:not(.completed) .save-close > input, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > input, -.task-column:not(.rewards) .color-good:not(.completed) .save-close textarea, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li textarea { - color: #355629 !important; - border-color: #a4cd96 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > input:hover, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > input:hover, -.task-column:not(.rewards) .color-good:not(.completed) .save-close textarea:hover, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li textarea:hover { - border-color: #7bb666 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > input:focus, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > input:focus, -.task-column:not(.rewards) .color-good:not(.completed) .save-close textarea:focus, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li textarea:focus { - border-color: #436e34 !important; - outline: none; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > input + button:focus, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-checklist-edit - li - > input - + button:focus, -.task-column:not(.rewards) .color-good:not(.completed) .save-close textarea + button:focus, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-checklist-edit - li - textarea - + button:focus { - border-color: #7bb666 !important; - background-color: #bddbb2 !important; - outline: none; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > input + button:active, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-checklist-edit - li - > input - + button:active, -.task-column:not(.rewards) .color-good:not(.completed) .save-close textarea + button:active, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-checklist-edit - li - textarea - + button:active { - background-color: #a4cd96 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > a:nth-of-type(2), -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > a:nth-of-type(2) { - border-left: 1px solid #c3deb9 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-good:not(.completed) .save-close > div, - .task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > div { - border: 1px solid #a4cd96; - } -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > div h4, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > div h4 { - color: #436e34; - background-color: #cce3c4; - border-color: #a4cd96; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > div > ul:first-child:before, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-checklist-edit - li - > div - > ul:first-child:before, -.task-column:not(.rewards) .color-good:not(.completed) .save-close > div > div:first-child:before, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-checklist-edit - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #a4cd96; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > div h4:before, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > div h4:before { - background-color: #cce3c4; - border-color: #a4cd96; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > div ul, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > div ul { - border-color: #cce3c4; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close > div a, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > div a, -.task-column:not(.rewards) .color-good:not(.completed) .save-close > div a:link, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > div a:link, -.task-column:not(.rewards) .color-good:not(.completed) .save-close > div a:visited, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li > div a:visited { - color: #355629 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close .glyphicon, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li .glyphicon { - color: #467336; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close .tooltip, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close.active a, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li.active a, -.task-column:not(.rewards) .color-good:not(.completed) .save-close.active button, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li.active button { - background-color: #c3deb9 !important; - border-color: #588f44 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close.active.filters-tags a, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-checklist-edit - li.active.filters-tags - a, -.task-column:not(.rewards) .color-good:not(.completed) .save-close.active.filters-tags button, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-checklist-edit - li.active.filters-tags - button { - background-color: #7bb666 !important; - border-color: #cce3c4 !important; - color: #fff !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close.active.filters-tags a span, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-checklist-edit - li.active.filters-tags - a - span, -.task-column:not(.rewards) .color-good:not(.completed) .save-close.active.filters-tags button span, -.task-column:not(.rewards) - .color-good:not(.completed) - .task-checklist-edit - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .save-close button:focus, -.task-column:not(.rewards) .color-good:not(.completed) .task-checklist-edit li button:focus { - border: 1px solid #8bbf79; - outline: 0; -} -.task-column:not(.rewards) .color-good:not(.completed) .task-actions { - background-color: #8bbf79; -} -.task-column:not(.rewards) .color-good:not(.completed) .action-yesno label, -.task-column:not(.rewards) .color-good:not(.completed) .task-action-btn, -.task-column:not(.rewards) .color-good:not(.completed) .task-actions a { - background-color: #8bbf79; -} -.task-column:not(.rewards) .color-good:not(.completed) .action-yesno label:hover, -.task-column:not(.rewards) .color-good:not(.completed) .task-action-btn:hover, -.task-column:not(.rewards) .color-good:not(.completed) .task-actions a:hover, -.task-column:not(.rewards) .color-good:not(.completed) .action-yesno label:focus, -.task-column:not(.rewards) .color-good:not(.completed) .task-action-btn:focus, -.task-column:not(.rewards) .color-good:not(.completed) .task-actions a:focus { - background-color: #71b05b; -} -.task-column:not(.rewards) - .color-good:not(.completed) - input[type='checkbox'].task-input:focus - + label, -.task-column:not(.rewards) .color-good:not(.completed) input.habit:focus + a { - background-color: #71b05b; -} -.task-column:not(.rewards) .color-good:not(.completed) .task-actions a:nth-of-type(2) { - border-top: 1px solid #5c9748; -} -.task-column:not(.rewards) .color-good:not(.completed) .task-options { - background-color: #d9ead3; -} -.task-column:not(.rewards) .color-good:not(.completed) .option-group:not(.task-checklist) { - border-bottom: 1px solid #b2d4a6; -} -.task-column:not(.rewards) .color-good:not(.completed) .option-content { - border-color: #afd3a2 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .option-content:hover { - border-color: #84bb70 !important; -} -.task-column:not(.rewards) .color-good:not(.completed) .option-content:focus { - border-color: #477337 !important; - outline: none; -} -.task-column:not(.rewards) .color-better:not(.completed) { - background-color: #d0e0e3; - border: 1px solid #bbc9cc; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > button { - background-color: #d0e0e3 !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > a:active, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > a:active, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > a:active, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > a:active, -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > button:active, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > button:active, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > button:active, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > button:active { - background-color: #3f636a !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > a:hover, - .task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > a:hover, - .task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > a:hover, - .task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > a:hover, - .task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > button:hover, - .task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > button:hover, - .task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > button:hover, - .task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > button:hover { - background-color: #cadcdf !important; - } -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > button, -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > input, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > input, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > input, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > input, -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li textarea, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li textarea, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li textarea, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li textarea { - color: #314d52 !important; - border-color: #a4c3c9 !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > input:hover, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > input:hover, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > input:hover, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > input:hover, -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li textarea:hover, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li textarea:hover, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li textarea:hover, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li textarea:hover { - border-color: #77a5ae !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > input:focus, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > input:focus, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > input:focus, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > input:focus, -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li textarea:focus, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li textarea:focus, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li textarea:focus, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li textarea:focus { - border-color: #3e6168 !important; - outline: none; -} -.task-column:not(.rewards) - .color-better:not(.completed) - .priority-multiplier - li - > input - + button:focus, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > input + button:focus, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > input + button:focus, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-frequency - li - > input - + button:focus, -.task-column:not(.rewards) - .color-better:not(.completed) - .priority-multiplier - li - textarea - + button:focus, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-attributes - li - textarea - + button:focus, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li textarea + button:focus, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-frequency - li - textarea - + button:focus { - border-color: #77a5ae !important; - background-color: #bfd5d9 !important; - outline: none; -} -.task-column:not(.rewards) - .color-better:not(.completed) - .priority-multiplier - li - > input - + button:active, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-attributes - li - > input - + button:active, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > input + button:active, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-frequency - li - > input - + button:active, -.task-column:not(.rewards) - .color-better:not(.completed) - .priority-multiplier - li - textarea - + button:active, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-attributes - li - textarea - + button:active, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li textarea + button:active, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-frequency - li - textarea - + button:active { - background-color: #a4c3c9 !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > a:nth-of-type(2), -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > a:nth-of-type(2), -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > a:nth-of-type(2), -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > a:nth-of-type(2) { - border-left: 1px solid #c6d9dd !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > div, - .task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > div, - .task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > div, - .task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > div { - border: 1px solid #a4c3c9; - } -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > div h4, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > div h4, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > div h4, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > div h4 { - color: #3e6168; - background-color: #d0e0e3; - border-color: #a4c3c9; -} -.task-column:not(.rewards) - .color-better:not(.completed) - .priority-multiplier - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-attributes - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-days - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-frequency - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-better:not(.completed) - .priority-multiplier - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-attributes - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-days - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-frequency - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #a4c3c9; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > div h4:before, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > div h4:before, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > div h4:before, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > div h4:before { - background-color: #d0e0e3; - border-color: #a4c3c9; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > div ul, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > div ul, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > div ul, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > div ul { - border-color: #d0e0e3; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > div a, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > div a, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > div a, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > div a, -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > div a:link, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > div a:link, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > div a:link, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > div a:link, -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li > div a:visited, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li > div a:visited, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li > div a:visited, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li > div a:visited { - color: #314d52 !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li .glyphicon, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li .glyphicon, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li .glyphicon, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li .glyphicon { - color: #41666d; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li .tooltip, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li .tooltip, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li .tooltip, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li.active a, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li.active a, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li.active a, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li.active a, -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li.active button, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li.active button, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li.active button, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li.active button { - background-color: #c6d9dd !important; - border-color: #518088 !important; -} -.task-column:not(.rewards) - .color-better:not(.completed) - .priority-multiplier - li.active.filters-tags - a, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li.active.filters-tags a, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li.active.filters-tags a, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li.active.filters-tags a, -.task-column:not(.rewards) - .color-better:not(.completed) - .priority-multiplier - li.active.filters-tags - button, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-attributes - li.active.filters-tags - button, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li.active.filters-tags button, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-frequency - li.active.filters-tags - button { - background-color: #77a5ae !important; - border-color: #d0e0e3 !important; - color: #fff !important; -} -.task-column:not(.rewards) - .color-better:not(.completed) - .priority-multiplier - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-attributes - li.active.filters-tags - a - span, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li.active.filters-tags a span, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-frequency - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-better:not(.completed) - .priority-multiplier - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-attributes - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-days - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-better:not(.completed) - .repeat-frequency - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li button.active, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li button.active, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li button.active, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li button.active { - -webkit-box-shadow: inset 0 0 0 1px #6398a2 !important; - box-shadow: inset 0 0 0 1px #6398a2 !important; - background-color: #c2d7db !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .priority-multiplier li button:focus, -.task-column:not(.rewards) .color-better:not(.completed) .task-attributes li button:focus, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-days li button:focus, -.task-column:not(.rewards) .color-better:not(.completed) .repeat-frequency li button:focus { - border: 1px solid #7eaab2; - outline: 0; -} -.task-column:not(.rewards) .color-better:not(.completed) .plusminus .task-checker label:after { - border: 1px solid #7eaab2 !important; -} -.task-column:not(.rewards) - .color-better:not(.completed) - .plusminus - .task-checker - input[type='checkbox']:checked - + label:after { - -webkit-box-shadow: inset 0 0 0 1px #6398a2 !important; - box-shadow: inset 0 0 0 1px #6398a2 !important; - background-color: #c2d7db !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-better:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > button { - background-color: #c2d7db !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > a:active, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > a:active, -.task-column:not(.rewards) .color-better:not(.completed) .save-close > button:active, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > button:active { - background-color: #3c5e65 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-better:not(.completed) .save-close > a:hover, - .task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > a:hover, - .task-column:not(.rewards) .color-better:not(.completed) .save-close > button:hover, - .task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > button:hover { - background-color: #bcd3d7 !important; - } -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-better:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > button, -.task-column:not(.rewards) .color-better:not(.completed) .save-close > input, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > input, -.task-column:not(.rewards) .color-better:not(.completed) .save-close textarea, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li textarea { - color: #2e494e !important; - border-color: #98bbc2 !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > input:hover, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > input:hover, -.task-column:not(.rewards) .color-better:not(.completed) .save-close textarea:hover, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li textarea:hover { - border-color: #6d9fa9 !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > input:focus, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > input:focus, -.task-column:not(.rewards) .color-better:not(.completed) .save-close textarea:focus, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li textarea:focus { - border-color: #3b5d63 !important; - outline: none; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > input + button:focus, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-checklist-edit - li - > input - + button:focus, -.task-column:not(.rewards) .color-better:not(.completed) .save-close textarea + button:focus, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-checklist-edit - li - textarea - + button:focus { - border-color: #6d9fa9 !important; - background-color: #b2ccd2 !important; - outline: none; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > input + button:active, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-checklist-edit - li - > input - + button:active, -.task-column:not(.rewards) .color-better:not(.completed) .save-close textarea + button:active, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-checklist-edit - li - textarea - + button:active { - background-color: #98bbc2 !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > a:nth-of-type(2), -.task-column:not(.rewards) - .color-better:not(.completed) - .task-checklist-edit - li - > a:nth-of-type(2) { - border-left: 1px solid #b8d0d5 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-better:not(.completed) .save-close > div, - .task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > div { - border: 1px solid #98bbc2; - } -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > div h4, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > div h4 { - color: #3b5d63; - background-color: #c2d7db; - border-color: #98bbc2; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > div > ul:first-child:before, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-checklist-edit - li - > div - > ul:first-child:before, -.task-column:not(.rewards) .color-better:not(.completed) .save-close > div > div:first-child:before, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-checklist-edit - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #98bbc2; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > div h4:before, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > div h4:before { - background-color: #c2d7db; - border-color: #98bbc2; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > div ul, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > div ul { - border-color: #c2d7db; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close > div a, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > div a, -.task-column:not(.rewards) .color-better:not(.completed) .save-close > div a:link, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > div a:link, -.task-column:not(.rewards) .color-better:not(.completed) .save-close > div a:visited, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li > div a:visited { - color: #2e494e !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close .glyphicon, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li .glyphicon { - color: #3d6168; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close .tooltip, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close.active a, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li.active a, -.task-column:not(.rewards) .color-better:not(.completed) .save-close.active button, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li.active button { - background-color: #b8d0d5 !important; - border-color: #4d7982 !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close.active.filters-tags a, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-checklist-edit - li.active.filters-tags - a, -.task-column:not(.rewards) .color-better:not(.completed) .save-close.active.filters-tags button, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-checklist-edit - li.active.filters-tags - button { - background-color: #6d9fa9 !important; - border-color: #c2d7db !important; - color: #fff !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close.active.filters-tags a span, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-checklist-edit - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-better:not(.completed) - .save-close.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-better:not(.completed) - .task-checklist-edit - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .save-close button:focus, -.task-column:not(.rewards) .color-better:not(.completed) .task-checklist-edit li button:focus { - border: 1px solid #7eaab2; - outline: 0; -} -.task-column:not(.rewards) .color-better:not(.completed) .task-actions { - background-color: #7eaab2; -} -.task-column:not(.rewards) .color-better:not(.completed) .action-yesno label, -.task-column:not(.rewards) .color-better:not(.completed) .task-action-btn, -.task-column:not(.rewards) .color-better:not(.completed) .task-actions a { - background-color: #7eaab2; -} -.task-column:not(.rewards) .color-better:not(.completed) .action-yesno label:hover, -.task-column:not(.rewards) .color-better:not(.completed) .task-action-btn:hover, -.task-column:not(.rewards) .color-better:not(.completed) .task-actions a:hover, -.task-column:not(.rewards) .color-better:not(.completed) .action-yesno label:focus, -.task-column:not(.rewards) .color-better:not(.completed) .task-action-btn:focus, -.task-column:not(.rewards) .color-better:not(.completed) .task-actions a:focus { - background-color: #6398a2; -} -.task-column:not(.rewards) - .color-better:not(.completed) - input[type='checkbox'].task-input:focus - + label, -.task-column:not(.rewards) .color-better:not(.completed) input.habit:focus + a { - background-color: #6398a2; -} -.task-column:not(.rewards) .color-better:not(.completed) .task-actions a:nth-of-type(2) { - border-top: 1px solid #518088; -} -.task-column:not(.rewards) .color-better:not(.completed) .task-options { - background-color: #d0e0e3; -} -.task-column:not(.rewards) .color-better:not(.completed) .option-group:not(.task-checklist) { - border-bottom: 1px solid #a7c5cb; -} -.task-column:not(.rewards) .color-better:not(.completed) .option-content { - border-color: #a4c3c9 !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .option-content:hover { - border-color: #77a5ae !important; -} -.task-column:not(.rewards) .color-better:not(.completed) .option-content:focus { - border-color: #3e6168 !important; - outline: none; -} -.task-column:not(.rewards) .color-best:not(.completed) { - background-color: #c9daf8; - border: 1px solid #b4c4df; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > button { - background-color: #c9daf8 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > a:active, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > a:active, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > a:active, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > a:active, -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > button:active, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > button:active, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > button:active, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > button:active { - background-color: #14459a !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > a:hover, - .task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > a:hover, - .task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > a:hover, - .task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > a:hover, - .task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > button:hover, - .task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > button:hover, - .task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > button:hover, - .task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > button:hover { - background-color: #c0d4f7 !important; - } -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > a, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > a, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > a, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > a, -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > button, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > button, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > button, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > button, -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > input, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > input, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > input, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > input, -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li textarea, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li textarea, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li textarea, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li textarea { - color: #0f3577 !important; - border-color: #89aef0 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > input:hover, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > input:hover, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > input:hover, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > input:hover, -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li textarea:hover, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li textarea:hover, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li textarea:hover, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li textarea:hover { - border-color: #4781e7 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > input:focus, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > input:focus, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > input:focus, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > input:focus, -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li textarea:focus, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li textarea:focus, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li textarea:focus, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li textarea:focus { - border-color: #144398 !important; - outline: none; -} -.task-column:not(.rewards) - .color-best:not(.completed) - .priority-multiplier - li - > input - + button:focus, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > input + button:focus, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > input + button:focus, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > input + button:focus, -.task-column:not(.rewards) - .color-best:not(.completed) - .priority-multiplier - li - textarea - + button:focus, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li textarea + button:focus, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li textarea + button:focus, -.task-column:not(.rewards) - .color-best:not(.completed) - .repeat-frequency - li - textarea - + button:focus { - border-color: #4781e7 !important; - background-color: #b0c9f5 !important; - outline: none; -} -.task-column:not(.rewards) - .color-best:not(.completed) - .priority-multiplier - li - > input - + button:active, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > input + button:active, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > input + button:active, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > input + button:active, -.task-column:not(.rewards) - .color-best:not(.completed) - .priority-multiplier - li - textarea - + button:active, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li textarea + button:active, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li textarea + button:active, -.task-column:not(.rewards) - .color-best:not(.completed) - .repeat-frequency - li - textarea - + button:active { - background-color: #89aef0 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > a:nth-of-type(2), -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > a:nth-of-type(2), -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > a:nth-of-type(2), -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > a:nth-of-type(2) { - border-left: 1px solid #bad0f6 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > div, - .task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > div, - .task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > div, - .task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > div { - border: 1px solid #89aef0; - } -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > div h4, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > div h4, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > div h4, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > div h4 { - color: #144398; - background-color: #c9daf8; - border-color: #89aef0; -} -.task-column:not(.rewards) - .color-best:not(.completed) - .priority-multiplier - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-attributes - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-best:not(.completed) - .repeat-days - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-best:not(.completed) - .repeat-frequency - li - > div - > ul:first-child:before, -.task-column:not(.rewards) - .color-best:not(.completed) - .priority-multiplier - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-attributes - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-best:not(.completed) - .repeat-days - li - > div - > div:first-child:before, -.task-column:not(.rewards) - .color-best:not(.completed) - .repeat-frequency - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #89aef0; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > div h4:before, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > div h4:before, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > div h4:before, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > div h4:before { - background-color: #c9daf8; - border-color: #89aef0; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > div ul, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > div ul, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > div ul, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > div ul { - border-color: #c9daf8; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > div a, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > div a, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > div a, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > div a, -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > div a:link, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > div a:link, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > div a:link, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > div a:link, -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li > div a:visited, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li > div a:visited, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li > div a:visited, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li > div a:visited { - color: #0f3577 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li .glyphicon, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li .glyphicon, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li .glyphicon, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li .glyphicon { - color: #15479f; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li .tooltip, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li .tooltip, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li .tooltip, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li.active a, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li.active a, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li.active a, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li.active a, -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li.active button, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li.active button, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li.active button, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li.active button { - background-color: #bad0f6 !important; - border-color: #1a58c7 !important; -} -.task-column:not(.rewards) - .color-best:not(.completed) - .priority-multiplier - li.active.filters-tags - a, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li.active.filters-tags a, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li.active.filters-tags a, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li.active.filters-tags a, -.task-column:not(.rewards) - .color-best:not(.completed) - .priority-multiplier - li.active.filters-tags - button, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-attributes - li.active.filters-tags - button, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li.active.filters-tags button, -.task-column:not(.rewards) - .color-best:not(.completed) - .repeat-frequency - li.active.filters-tags - button { - background-color: #4781e7 !important; - border-color: #c9daf8 !important; - color: #fff !important; -} -.task-column:not(.rewards) - .color-best:not(.completed) - .priority-multiplier - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-attributes - li.active.filters-tags - a - span, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li.active.filters-tags a span, -.task-column:not(.rewards) - .color-best:not(.completed) - .repeat-frequency - li.active.filters-tags - a - span, -.task-column:not(.rewards) - .color-best:not(.completed) - .priority-multiplier - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-attributes - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-best:not(.completed) - .repeat-days - li.active.filters-tags - button - span, -.task-column:not(.rewards) - .color-best:not(.completed) - .repeat-frequency - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li button.active, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li button.active, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li button.active, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li button.active { - -webkit-box-shadow: inset 0 0 0 1px #2a6de3 !important; - box-shadow: inset 0 0 0 1px #2a6de3 !important; - background-color: #b5ccf5 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .priority-multiplier li button:focus, -.task-column:not(.rewards) .color-best:not(.completed) .task-attributes li button:focus, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-days li button:focus, -.task-column:not(.rewards) .color-best:not(.completed) .repeat-frequency li button:focus { - border: 1px solid #5288e9; - outline: 0; -} -.task-column:not(.rewards) .color-best:not(.completed) .plusminus .task-checker label:after { - border: 1px solid #5288e9 !important; -} -.task-column:not(.rewards) - .color-best:not(.completed) - .plusminus - .task-checker - input[type='checkbox']:checked - + label:after { - -webkit-box-shadow: inset 0 0 0 1px #2a6de3 !important; - box-shadow: inset 0 0 0 1px #2a6de3 !important; - background-color: #b5ccf5 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-best:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > button { - background-color: #b5ccf5 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > a:active, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > a:active, -.task-column:not(.rewards) .color-best:not(.completed) .save-close > button:active, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > button:active { - background-color: #144192 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-best:not(.completed) .save-close > a:hover, - .task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > a:hover, - .task-column:not(.rewards) .color-best:not(.completed) .save-close > button:hover, - .task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > button:hover { - background-color: #acc6f4 !important; - } -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > a, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > a, -.task-column:not(.rewards) .color-best:not(.completed) .save-close > button, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > button, -.task-column:not(.rewards) .color-best:not(.completed) .save-close > input, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > input, -.task-column:not(.rewards) .color-best:not(.completed) .save-close textarea, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li textarea { - color: #0f3271 !important; - border-color: #78a2ed !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > input:hover, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > input:hover, -.task-column:not(.rewards) .color-best:not(.completed) .save-close textarea:hover, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li textarea:hover { - border-color: #3a77e4 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > input:focus, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > input:focus, -.task-column:not(.rewards) .color-best:not(.completed) .save-close textarea:focus, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li textarea:focus { - border-color: #13408f !important; - outline: none; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > input + button:focus, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-checklist-edit - li - > input - + button:focus, -.task-column:not(.rewards) .color-best:not(.completed) .save-close textarea + button:focus, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-checklist-edit - li - textarea - + button:focus { - border-color: #3a77e4 !important; - background-color: #9ebcf2 !important; - outline: none; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > input + button:active, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-checklist-edit - li - > input - + button:active, -.task-column:not(.rewards) .color-best:not(.completed) .save-close textarea + button:active, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-checklist-edit - li - textarea - + button:active { - background-color: #78a2ed !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > a:nth-of-type(2), -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > a:nth-of-type(2) { - border-left: 1px solid #a7c2f3 !important; -} -@media screen and (min-width: 768px) { - .task-column:not(.rewards) .color-best:not(.completed) .save-close > div, - .task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > div { - border: 1px solid #78a2ed; - } -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > div h4, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > div h4 { - color: #13408f; - background-color: #b5ccf5; - border-color: #78a2ed; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > div > ul:first-child:before, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-checklist-edit - li - > div - > ul:first-child:before, -.task-column:not(.rewards) .color-best:not(.completed) .save-close > div > div:first-child:before, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-checklist-edit - li - > div - > div:first-child:before { - background-color: #fff; - border-color: #78a2ed; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > div h4:before, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > div h4:before { - background-color: #b5ccf5; - border-color: #78a2ed; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > div ul, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > div ul { - border-color: #b5ccf5; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close > div a, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > div a, -.task-column:not(.rewards) .color-best:not(.completed) .save-close > div a:link, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > div a:link, -.task-column:not(.rewards) .color-best:not(.completed) .save-close > div a:visited, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li > div a:visited { - color: #0f3271 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close .glyphicon, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li .glyphicon { - color: #144396; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close .tooltip, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li .tooltip { - border: 0; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close.active a, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li.active a, -.task-column:not(.rewards) .color-best:not(.completed) .save-close.active button, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li.active button { - background-color: #a7c2f3 !important; - border-color: #1954bc !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close.active.filters-tags a, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-checklist-edit - li.active.filters-tags - a, -.task-column:not(.rewards) .color-best:not(.completed) .save-close.active.filters-tags button, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-checklist-edit - li.active.filters-tags - button { - background-color: #3a77e4 !important; - border-color: #b5ccf5 !important; - color: #fff !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close.active.filters-tags a span, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-checklist-edit - li.active.filters-tags - a - span, -.task-column:not(.rewards) .color-best:not(.completed) .save-close.active.filters-tags button span, -.task-column:not(.rewards) - .color-best:not(.completed) - .task-checklist-edit - li.active.filters-tags - button - span { - color: #fff !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .save-close button:focus, -.task-column:not(.rewards) .color-best:not(.completed) .task-checklist-edit li button:focus { - border: 1px solid #5288e9; - outline: 0; -} -.task-column:not(.rewards) .color-best:not(.completed) .task-actions { - background-color: #5288e9; -} -.task-column:not(.rewards) .color-best:not(.completed) .action-yesno label, -.task-column:not(.rewards) .color-best:not(.completed) .task-action-btn, -.task-column:not(.rewards) .color-best:not(.completed) .task-actions a { - background-color: #5288e9; -} -.task-column:not(.rewards) .color-best:not(.completed) .action-yesno label:hover, -.task-column:not(.rewards) .color-best:not(.completed) .task-action-btn:hover, -.task-column:not(.rewards) .color-best:not(.completed) .task-actions a:hover, -.task-column:not(.rewards) .color-best:not(.completed) .action-yesno label:focus, -.task-column:not(.rewards) .color-best:not(.completed) .task-action-btn:focus, -.task-column:not(.rewards) .color-best:not(.completed) .task-actions a:focus { - background-color: #2a6de3; -} -.task-column:not(.rewards) - .color-best:not(.completed) - input[type='checkbox'].task-input:focus - + label, -.task-column:not(.rewards) .color-best:not(.completed) input.habit:focus + a { - background-color: #2a6de3; -} -.task-column:not(.rewards) .color-best:not(.completed) .task-actions a:nth-of-type(2) { - border-top: 1px solid #1a58c7; -} -.task-column:not(.rewards) .color-best:not(.completed) .task-options { - background-color: #c9daf8; -} -.task-column:not(.rewards) .color-best:not(.completed) .option-group:not(.task-checklist) { - border-bottom: 1px solid #8db1f0; -} -.task-column:not(.rewards) .color-best:not(.completed) .option-content { - border-color: #89aef0 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .option-content:hover { - border-color: #4781e7 !important; -} -.task-column:not(.rewards) .color-best:not(.completed) .option-content:focus { - border-color: #144398 !important; - outline: none; -} -.completed { - color: #989898; - background-color: #d9d9d9; - border: 1px solid #c3c3c3; -} -.completed .task-text .habitica-emoji { - opacity: 0.39; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=39)'; - filter: alpha(opacity=39); -} -.completed .priority-multiplier li > a, -.completed .task-attributes li > a, -.completed .repeat-days li > a, -.completed .repeat-frequency li > a, -.completed .priority-multiplier li > button, -.completed .task-attributes li > button, -.completed .repeat-days li > button, -.completed .repeat-frequency li > button { - background-color: #d9d9d9 !important; -} -.completed .priority-multiplier li > a:active, -.completed .task-attributes li > a:active, -.completed .repeat-days li > a:active, -.completed .repeat-frequency li > a:active, -.completed .priority-multiplier li > button:active, -.completed .task-attributes li > button:active, -.completed .repeat-days li > button:active, -.completed .repeat-frequency li > button:active { - background-color: #545454 !important; -} -@media screen and (min-width: 768px) { - .completed .priority-multiplier li > a:hover, - .completed .task-attributes li > a:hover, - .completed .repeat-days li > a:hover, - .completed .repeat-frequency li > a:hover, - .completed .priority-multiplier li > button:hover, - .completed .task-attributes li > button:hover, - .completed .repeat-days li > button:hover, - .completed .repeat-frequency li > button:hover { - background-color: #d4d4d4 !important; - } -} -.completed .priority-multiplier li > a, -.completed .task-attributes li > a, -.completed .repeat-days li > a, -.completed .repeat-frequency li > a, -.completed .priority-multiplier li > button, -.completed .task-attributes li > button, -.completed .repeat-days li > button, -.completed .repeat-frequency li > button, -.completed .priority-multiplier li > input, -.completed .task-attributes li > input, -.completed .repeat-days li > input, -.completed .repeat-frequency li > input, -.completed .priority-multiplier li textarea, -.completed .task-attributes li textarea, -.completed .repeat-days li textarea, -.completed .repeat-frequency li textarea { - color: #414141 !important; - border-color: #b6b6b6 !important; -} -.completed .priority-multiplier li > input:hover, -.completed .task-attributes li > input:hover, -.completed .repeat-days li > input:hover, -.completed .repeat-frequency li > input:hover, -.completed .priority-multiplier li textarea:hover, -.completed .task-attributes li textarea:hover, -.completed .repeat-days li textarea:hover, -.completed .repeat-frequency li textarea:hover { - border-color: #929292 !important; -} -.completed .priority-multiplier li > input:focus, -.completed .task-attributes li > input:focus, -.completed .repeat-days li > input:focus, -.completed .repeat-frequency li > input:focus, -.completed .priority-multiplier li textarea:focus, -.completed .task-attributes li textarea:focus, -.completed .repeat-days li textarea:focus, -.completed .repeat-frequency li textarea:focus { - border-color: #535353 !important; - outline: none; -} -.completed .priority-multiplier li > input + button:focus, -.completed .task-attributes li > input + button:focus, -.completed .repeat-days li > input + button:focus, -.completed .repeat-frequency li > input + button:focus, -.completed .priority-multiplier li textarea + button:focus, -.completed .task-attributes li textarea + button:focus, -.completed .repeat-days li textarea + button:focus, -.completed .repeat-frequency li textarea + button:focus { - border-color: #929292 !important; - background-color: #ccc !important; - outline: none; -} -.completed .priority-multiplier li > input + button:active, -.completed .task-attributes li > input + button:active, -.completed .repeat-days li > input + button:active, -.completed .repeat-frequency li > input + button:active, -.completed .priority-multiplier li textarea + button:active, -.completed .task-attributes li textarea + button:active, -.completed .repeat-days li textarea + button:active, -.completed .repeat-frequency li textarea + button:active { - background-color: #b6b6b6 !important; -} -.completed .priority-multiplier li > a:nth-of-type(2), -.completed .task-attributes li > a:nth-of-type(2), -.completed .repeat-days li > a:nth-of-type(2), -.completed .repeat-frequency li > a:nth-of-type(2) { - border-left: 1px solid #d1d1d1 !important; -} -@media screen and (min-width: 768px) { - .completed .priority-multiplier li > div, - .completed .task-attributes li > div, - .completed .repeat-days li > div, - .completed .repeat-frequency li > div { - border: 1px solid #b6b6b6; - } -} -.completed .priority-multiplier li > div h4, -.completed .task-attributes li > div h4, -.completed .repeat-days li > div h4, -.completed .repeat-frequency li > div h4 { - color: #535353; - background-color: #d9d9d9; - border-color: #b6b6b6; -} -.completed .priority-multiplier li > div > ul:first-child:before, -.completed .task-attributes li > div > ul:first-child:before, -.completed .repeat-days li > div > ul:first-child:before, -.completed .repeat-frequency li > div > ul:first-child:before, -.completed .priority-multiplier li > div > div:first-child:before, -.completed .task-attributes li > div > div:first-child:before, -.completed .repeat-days li > div > div:first-child:before, -.completed .repeat-frequency li > div > div:first-child:before { - background-color: #fff; - border-color: #b6b6b6; -} -.completed .priority-multiplier li > div h4:before, -.completed .task-attributes li > div h4:before, -.completed .repeat-days li > div h4:before, -.completed .repeat-frequency li > div h4:before { - background-color: #d9d9d9; - border-color: #b6b6b6; -} -.completed .priority-multiplier li > div ul, -.completed .task-attributes li > div ul, -.completed .repeat-days li > div ul, -.completed .repeat-frequency li > div ul { - border-color: #d9d9d9; -} -.completed .priority-multiplier li > div a, -.completed .task-attributes li > div a, -.completed .repeat-days li > div a, -.completed .repeat-frequency li > div a, -.completed .priority-multiplier li > div a:link, -.completed .task-attributes li > div a:link, -.completed .repeat-days li > div a:link, -.completed .repeat-frequency li > div a:link, -.completed .priority-multiplier li > div a:visited, -.completed .task-attributes li > div a:visited, -.completed .repeat-days li > div a:visited, -.completed .repeat-frequency li > div a:visited { - color: #414141 !important; -} -.completed .priority-multiplier li .glyphicon, -.completed .task-attributes li .glyphicon, -.completed .repeat-days li .glyphicon, -.completed .repeat-frequency li .glyphicon { - color: #575757; -} -.completed .priority-multiplier li .tooltip, -.completed .task-attributes li .tooltip, -.completed .repeat-days li .tooltip, -.completed .repeat-frequency li .tooltip { - border: 0; -} -.completed .priority-multiplier li.active a, -.completed .task-attributes li.active a, -.completed .repeat-days li.active a, -.completed .repeat-frequency li.active a, -.completed .priority-multiplier li.active button, -.completed .task-attributes li.active button, -.completed .repeat-days li.active button, -.completed .repeat-frequency li.active button { - background-color: #d1d1d1 !important; - border-color: #6d6d6d !important; -} -.completed .priority-multiplier li.active.filters-tags a, -.completed .task-attributes li.active.filters-tags a, -.completed .repeat-days li.active.filters-tags a, -.completed .repeat-frequency li.active.filters-tags a, -.completed .priority-multiplier li.active.filters-tags button, -.completed .task-attributes li.active.filters-tags button, -.completed .repeat-days li.active.filters-tags button, -.completed .repeat-frequency li.active.filters-tags button { - background-color: #929292 !important; - border-color: #d9d9d9 !important; - color: #fff !important; -} -.completed .priority-multiplier li.active.filters-tags a span, -.completed .task-attributes li.active.filters-tags a span, -.completed .repeat-days li.active.filters-tags a span, -.completed .repeat-frequency li.active.filters-tags a span, -.completed .priority-multiplier li.active.filters-tags button span, -.completed .task-attributes li.active.filters-tags button span, -.completed .repeat-days li.active.filters-tags button span, -.completed .repeat-frequency li.active.filters-tags button span { - color: #fff !important; -} -.completed .priority-multiplier li button.active, -.completed .task-attributes li button.active, -.completed .repeat-days li button.active, -.completed .repeat-frequency li button.active { - -webkit-box-shadow: inset 0 0 0 1px #828282 !important; - box-shadow: inset 0 0 0 1px #828282 !important; - background-color: #cecece !important; -} -.completed .priority-multiplier li button:focus, -.completed .task-attributes li button:focus, -.completed .repeat-days li button:focus, -.completed .repeat-frequency li button:focus { - border: 1px solid #989898; - outline: 0; -} -.completed .plusminus .task-checker label:after { - border: 1px solid #989898 !important; -} -.completed .plusminus .task-checker input[type='checkbox']:checked + label:after { - -webkit-box-shadow: inset 0 0 0 1px #828282 !important; - box-shadow: inset 0 0 0 1px #828282 !important; - background-color: #cecece !important; -} -.completed .save-close > a, -.completed .task-checklist-edit li > a, -.completed .save-close > button, -.completed .task-checklist-edit li > button { - background-color: #cecece !important; -} -.completed .save-close > a:active, -.completed .task-checklist-edit li > a:active, -.completed .save-close > button:active, -.completed .task-checklist-edit li > button:active { - background-color: #505050 !important; -} -@media screen and (min-width: 768px) { - .completed .save-close > a:hover, - .completed .task-checklist-edit li > a:hover, - .completed .save-close > button:hover, - .completed .task-checklist-edit li > button:hover { - background-color: #c9c9c9 !important; - } -} -.completed .save-close > a, -.completed .task-checklist-edit li > a, -.completed .save-close > button, -.completed .task-checklist-edit li > button, -.completed .save-close > input, -.completed .task-checklist-edit li > input, -.completed .save-close textarea, -.completed .task-checklist-edit li textarea { - color: #3e3e3e !important; - border-color: #adadad !important; -} -.completed .save-close > input:hover, -.completed .task-checklist-edit li > input:hover, -.completed .save-close textarea:hover, -.completed .task-checklist-edit li textarea:hover { - border-color: #8a8a8a !important; -} -.completed .save-close > input:focus, -.completed .task-checklist-edit li > input:focus, -.completed .save-close textarea:focus, -.completed .task-checklist-edit li textarea:focus { - border-color: #4f4f4f !important; - outline: none; -} -.completed .save-close > input + button:focus, -.completed .task-checklist-edit li > input + button:focus, -.completed .save-close textarea + button:focus, -.completed .task-checklist-edit li textarea + button:focus { - border-color: #8a8a8a !important; - background-color: #c1c1c1 !important; - outline: none; -} -.completed .save-close > input + button:active, -.completed .task-checklist-edit li > input + button:active, -.completed .save-close textarea + button:active, -.completed .task-checklist-edit li textarea + button:active { - background-color: #adadad !important; -} -.completed .save-close > a:nth-of-type(2), -.completed .task-checklist-edit li > a:nth-of-type(2) { - border-left: 1px solid #c6c6c6 !important; -} -@media screen and (min-width: 768px) { - .completed .save-close > div, - .completed .task-checklist-edit li > div { - border: 1px solid #adadad; - } -} -.completed .save-close > div h4, -.completed .task-checklist-edit li > div h4 { - color: #4f4f4f; - background-color: #cecece; - border-color: #adadad; -} -.completed .save-close > div > ul:first-child:before, -.completed .task-checklist-edit li > div > ul:first-child:before, -.completed .save-close > div > div:first-child:before, -.completed .task-checklist-edit li > div > div:first-child:before { - background-color: #fff; - border-color: #adadad; -} -.completed .save-close > div h4:before, -.completed .task-checklist-edit li > div h4:before { - background-color: #cecece; - border-color: #adadad; -} -.completed .save-close > div ul, -.completed .task-checklist-edit li > div ul { - border-color: #cecece; -} -.completed .save-close > div a, -.completed .task-checklist-edit li > div a, -.completed .save-close > div a:link, -.completed .task-checklist-edit li > div a:link, -.completed .save-close > div a:visited, -.completed .task-checklist-edit li > div a:visited { - color: #3e3e3e !important; -} -.completed .save-close .glyphicon, -.completed .task-checklist-edit li .glyphicon { - color: #525252; -} -.completed .save-close .tooltip, -.completed .task-checklist-edit li .tooltip { - border: 0; -} -.completed .save-close.active a, -.completed .task-checklist-edit li.active a, -.completed .save-close.active button, -.completed .task-checklist-edit li.active button { - background-color: #c6c6c6 !important; - border-color: #676767 !important; -} -.completed .save-close.active.filters-tags a, -.completed .task-checklist-edit li.active.filters-tags a, -.completed .save-close.active.filters-tags button, -.completed .task-checklist-edit li.active.filters-tags button { - background-color: #8a8a8a !important; - border-color: #cecece !important; - color: #fff !important; -} -.completed .save-close.active.filters-tags a span, -.completed .task-checklist-edit li.active.filters-tags a span, -.completed .save-close.active.filters-tags button span, -.completed .task-checklist-edit li.active.filters-tags button span { - color: #fff !important; -} -.completed .save-close button:focus, -.completed .task-checklist-edit li button:focus { - border: 1px solid #989898; - outline: 0; -} -.completed .action-yesno label, -.completed .task-action-btn { - background-color: #989898; -} -.completed .action-yesno label:hover, -.completed .task-action-btn:hover, -.completed .action-yesno label:focus, -.completed .task-action-btn:focus { - background-color: #828282; -} -.completed input[type='checkbox']:focus + label { - background-color: #828282; -} -.completed .task-options { - background-color: #d9d9d9; -} -.completed .option-group:not(.task-checklist) { - border-bottom: 1px solid #b8b8b8; -} -.completed .option-content { - border-color: #b6b6b6 !important; -} -.completed .option-content:hover { - border-color: #929292 !important; -} -.completed .option-content:focus { - border-color: #535353 !important; - outline: 0; -} -.reward, -.reward-item { - background-color: #fff; - border: 1px solid #d9d9d9 !important; -} -.tasks-lists .row { - margin-left: -5px; - margin-right: -5px; -} -.tasks-lists .row .col-md-3 { - padding-left: 10px; - padding-right: 10px; - margin-bottom: 15px; -} -.task-column { - padding: 1.5em; - background: #f2f5f6; - border: 1px solid #c3d1d6; -} -.task-column:after { - clear: both; - display: block; - content: ''; -} -.task-column h2 { - color: #4c666e; -} -.task-column .task-column_title { - margin: 0 0 0.5em; - padding: 0; - font-weight: 300; -} -.task-column .option-box .glyphicon { - font-size: 1.5em; - vertical-align: middle; -} -.task-column.preview { - padding: 0; - background: transparent; - border: 0; -} -.task-column.preview .task:hover { - cursor: auto; -} -.task-add { - position: relative; - margin-top: 1.5em; -} -.task-add > a, -.task-add > button { - background-color: #f6f8f9 !important; -} -.task-add > a:active, -.task-add > button:active { - background-color: #4d6673 !important; -} -@media screen and (min-width: 768px) { - .task-add > a:hover, - .task-add > button:hover { - background-color: #eff3f4 !important; - } -} -.task-add > a, -.task-add > button, -.task-add > input, -.task-add textarea { - color: #3b4f59 !important; - border-color: #c6d3d9 !important; -} -.task-add > input:hover, -.task-add textarea:hover { - border-color: #95acb8 !important; -} -.task-add > input:focus, -.task-add textarea:focus { - border-color: #4c6571 !important; - outline: none; -} -.task-add > input + button:focus, -.task-add textarea + button:focus { - border-color: #95acb8 !important; - background-color: #e4eaed !important; - outline: none; -} -.task-add > input + button:active, -.task-add textarea + button:active { - background-color: #c6d3d9 !important; -} -.task-add > a:nth-of-type(2) { - border-left: 1px solid #ebeff1 !important; -} -@media screen and (min-width: 768px) { - .task-add > div { - border: 1px solid #c6d3d9; - } -} -.task-add > div h4 { - color: #4c6571; - background-color: #f6f8f9; - border-color: #c6d3d9; -} -.task-add > div > ul:first-child:before, -.task-add > div > div:first-child:before { - background-color: #fff; - border-color: #c6d3d9; -} -.task-add > div h4:before { - background-color: #f6f8f9; - border-color: #c6d3d9; -} -.task-add > div ul { - border-color: #f6f8f9; -} -.task-add > div a, -.task-add > div a:link, -.task-add > div a:visited { - color: #3b4f59 !important; -} -.task-add .glyphicon { - color: #4f6a77; -} -.task-add .tooltip { - border: 0; -} -.task-add.active a, -.task-add.active button { - background-color: #ebeff1 !important; - border-color: #638494 !important; -} -.task-add.active.filters-tags a, -.task-add.active.filters-tags button { - background-color: #95acb8 !important; - border-color: #f6f8f9 !important; - color: #fff !important; -} -.task-add.active.filters-tags a span, -.task-add.active.filters-tags button span { - color: #fff !important; -} -.task-add input, -.task-add button { - height: 2.618em; -} -.task-add input, -.task-add textarea { - width: 80%; -} -.task-add textarea { - float: none; - resize: vertical; - -webkit-border-radius: 4px 0 0 4px; - border-radius: 4px 0 0 4px; -} -.task-add textarea + button { - position: absolute; - top: 0; - bottom: 0; - right: 0; - height: 100%; -} -.task-add button { - width: 20%; -} -.task-add button span { - font-size: 0.8em; -} -.task-add .help-block a { - border: 0; - float: right; - font-size: 0.85em; -} -.dailiesRestingInInn { - clear: both; -} -.dailiesRestingInInn button { - margin-top: 10px; -} -.task { - list-style: none; - clear: both; - padding: 0; - min-height: 3em; - margin-bottom: 0.75em; - position: relative; -} -.task:hover { - cursor: move; -} -.task :last-child { - margin-bottom: 0; -} -.task label { - font-weight: 400; -} -.task input[type='text'], -.task input[type='number'], -.task textarea.option-content { - border: 1px solid #aaa; - -webkit-border-radius: 0.382em; - border-radius: 0.382em; - padding-left: 0.618em; - -webkit-appearance: none; - -moz-appearance: none; - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - -webkit-box-shadow: none; - box-shadow: none; -} -.task-text { - display: block; - padding: 0.75em 0 0.75em 3.75em; - line-height: 1.4; - word-wrap: break-word; -} -.task-text markdown > ul > li { - margin-left: 20px; -} -.task.ui-sortable-helper { - -webkit-box-shadow: - 0 0 3px rgba(0, 0, 0, 0.15), - 0 0 5px rgba(0, 0, 0, 0.1); - box-shadow: - 0 0 3px rgba(0, 0, 0, 0.15), - 0 0 5px rgba(0, 0, 0, 0.1); - -webkit-transform: scale(1.05); - -moz-transform: scale(1.05); - -o-transform: scale(1.05); - -ms-transform: scale(1.05); - transform: scale(1.05); - outline: 1px solid rgba(0, 0, 0, 0.2); -} -.task-controls { - display: inline-block; - float: left; - margin-left: -0.5em; - margin-right: 0.5em; -} -.task-controls.task-primary { - position: absolute; - top: 0; - bottom: 0; - left: 0; - float: none; - margin: 0; -} -.task-action-btn { - display: inline-block; - width: 2.12765em; - height: 2.12765em; - padding: 0; - font-size: 1.41em; - line-height: 2.12765; - text-align: center; - color: #222; - vertical-align: top; - border-right: 1px solid rgba(0, 0, 0, 0.25); -} -.task-action-btn:last-child { - border: 0; -} -.task-action-btn:hover, -.task-action-btn:focus { - color: #222; - text-decoration: none; -} -.task-checker input[type='checkbox'], -.task-checker input[type='checkbox']:focus { - position: absolute; - margin: 0; - padding: 0; - height: 10px; - opacity: 0; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; - filter: alpha(opacity=0); - width: 10px; -} -.task-checker label { - display: inline-block; - width: 3em; - height: 100%; - margin: 0; - vertical-align: top; - cursor: pointer; -} -.plusminus { - text-align: center; -} -.plusminus .task-checker { - font-size: 1.5em; - margin-bottom: 0.5em; -} -.plusminus .task-checker:first-of-type { - margin-right: 0.5em; -} -.plusminus .task-checker label:after { - width: 2em; - line-height: 1.5; -} -.plusminus .task-checker label[for$='plus']:after { - content: '＋'; -} -.plusminus .task-checker label[for$='minus']:after { - content: '−'; -} -.action-yesno { - position: relative; -} -.action-yesno label:after, -.action-yesno label:before { - content: ''; - display: block; - height: 1.714285714em; - width: 1.714285714em; - font-size: 1.75em; - line-height: 1.714285714em; - text-align: center; - color: #000; - opacity: 0.2; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=20)'; - filter: alpha(opacity=20); -} -.action-yesno label:after { - height: 10px; - width: 10px; - margin: 15px auto; - border: 1px solid #222; -} -.action-yesno label:before { - position: absolute; - left: 0; -} -.action-yesno label:hover:before, -.action-yesno label:focus:before { - content: ''; -} -.action-yesno input[type='checkbox']:focus + label { - opacity: 1 !important; - -ms-filter: none; - filter: none; - border: none; -} -.action-yesno label:hover:after { - content: '\E013'; - font-family: 'Glyphicons Halflings'; - border: none; - margin: 0; - line-height: 1.714285714em; - height: 1.714285714em; - width: 1.714285714em; - text-align: center; - opacity: 0.5 !important; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=50)' !important; - filter: alpha(opacity=50) !important; -} -.action-yesno label:active:after { - opacity: 0.75 !important; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=75)' !important; - filter: alpha(opacity=75) !important; -} -.action-yesno input[type='checkbox']:checked + label:after { - content: '\E013'; - font-family: 'Glyphicons Halflings'; - border: none; - margin: 0; - line-height: 1.714285714em; - height: 1.714285714em; - width: 1.714285714em; - text-align: center; - opacity: 0.75; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=75)'; - filter: alpha(opacity=75); -} -.task-meta-controls { - float: right; - margin: 0.75em 0.5em 0 0.5em; - height: 1em; - opacity: 0.25; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=25)'; - filter: alpha(opacity=25); -} -.task-meta-controls a { - text-decoration: none; -} -.task-meta-controls .glyphicon-signal { - margin-left: 0.25em; -} -.task-meta-controls .glyphicon-remove, -.task-meta-controls .glyphicon-ok, -.task-meta-controls a.badge { - margin-right: 0.25em; -} -.task-meta-controls .glyphicon-tags { - margin-left: 0.1em; - margin-right: 0.4em; -} -.task-meta-controls a.badge { - position: relative; - top: -2px; -} -.task:hover .task-meta-controls { - opacity: 1; - -ms-filter: none; - filter: none; -} -.popover { - line-height: 1.5; - margin-bottom: 10px; - margin-right: 5px; -} -form { - margin-bottom: 0; -} -.task textarea.form-control { - position: relative; - z-index: 50; -} -/*[class$="-options"] { - padding: 1em 1em 0; - color: #333; - position: relative; -}*/ -[class$='-options'] .option-group { - padding: 0 0 1em; - margin-bottom: 1em; - margin-top: 1em; -} -[class$='-options'] button.advanced-options-toggle { - display: block; - width: 100%; - background: none; -} -[class$='-options'] .option-title { - font-size: 1em; - margin: 0.5em 0 0.5em; - line-height: 1; - border: 0; - padding: 0; - font-weight: bold; - text-align: center; -} -[class$='-options'] .option-title.mega { - cursor: pointer; -} -[class$='-options'] .option-title.mega:after { - font-family: 'Glyphicons Halflings'; - font-size: 0.75em; - content: '\E114'; - padding-left: 0.75em; -} -[class$='-options'] .option-title.mega.active:after { - content: '\E113'; -} -.option-content { - height: 2.5em; - width: 100%; - margin: 0 0 1em; - padding: 0 0 0 0.5em; -} -textarea.option-content { - height: 5em; - padding-top: 0.25em; - resize: none; - margin-bottom: 0; -} -.option-short .option-content { - width: 4em; - display: inline-block; -} -.option-short .input-suffix { - vertical-align: 20%; - padding-left: 0.25em; -} -.option-medium .option-content { - width: 6em; - display: inline-block; -} -.option-medium .input-suffix { - vertical-align: 20%; - padding-left: 0.25em; -} -.task-controls.tile-group { - display: block; - text-align: center; - margin: 0; -} -.task-controls.tile-group.task-attributes { - text-align: left; -} -.task-action-btn.tile { - border: 0; - font-size: 1.15em; - font-weight: 300; - outline: 1px solid rgba(0, 0, 0, 0.2); - outline-offset: -1px; - margin: 0 0 0 3px; - text-align: inherit; - opacity: 0.5; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=50)'; - filter: alpha(opacity=50); - width: auto; - padding: 0 0.5em; -} -.task-action-btn.tile.active { - opacity: 1; - -ms-filter: none; - filter: none; -} -.tile.solid { - opacity: 1; - -ms-filter: none; - filter: none; -} -.tile.spacious { - margin: 0.75em 0; - font-size: 1.25em; - opacity: 1; - -ms-filter: none; - filter: none; -} -.tile.bright { - background-color: #d4e1f9; -} -.tile.bright:hover, -.tile.bright:focus { - background-color: #dfe9fb; -} -.tile.flush { - margin-left: 0; - border: 1px solid rgba(0, 0, 0, 0.2); - outline: 0; - line-height: 2em; -} -.tile.flush:first-child { - border-right: 0; -} -.task-options .task-action-btn.tile { - margin: 3px; -} -.task-options form { - padding-bottom: 1em; -} -.task-options .priority-multiplier, -.task-options .task-attributes, -.task-options .repeat-days, -.task-options .repeat-frequency { - text-align: center; -} -.task-options .priority-multiplier li, -.task-options .task-attributes li, -.task-options .repeat-days li, -.task-options .repeat-frequency li { - margin-bottom: 1em; - margin-right: 0.75em; - display: inline-block; -} -.task-options .priority-multiplier li:last-of-type, -.task-options .task-attributes li:last-of-type, -.task-options .repeat-days li:last-of-type, -.task-options .repeat-frequency li:last-of-type { - margin-right: 0; -} -.task-options .repeat-days { - padding-bottom: 1em; -} -.task-options .repeat-days li button { - min-width: 2.5em; -} -.task-options .save-close { - text-align: center; -} -.dailies .repeat-weekly { - padding-bottom: 1em; -} -.habits .task-actions { - width: 3em; - height: 100%; -} -.habits .task-actions a { - display: block; - width: 100%; - height: 100%; - position: relative; - font-size: 0.8em; -} -.habits .task-actions a span { - position: absolute; - margin: auto; - display: block; - height: 1em; - width: 1em; - top: 0; - left: 0; - bottom: 0; - right: 0; -} -.habits .task-actions a:hover, -.habits .task-actions a:focus { - color: #222; - text-decoration: none; -} -.habits .habit-wide { - min-height: 4.5em; -} -.habits .habit-wide .task-actions a { - height: 50%; -} -.habits .habit-narrow .task-actions { - display: none; -} -.habits .habit-narrow .task-text { - padding-left: 1em; -} -.task-checklist-edit > ul { - text-align: center; -} -.task-checklist-edit > ul li button { - margin-top: 0.5em; -} -.task-checklist-edit > ul li button span { - margin-right: 0.5em; -} -.task-checklist-edit > .checklist-form input { - width: 70%; - /* Add interaction cues on hover and focus */ -} -.task-checklist-edit > .checklist-form input:hover, -.task-checklist-edit > .checklist-form input:focus { - background-color: #ffd; - -webkit-transition: background-color 0.5s; - -moz-transition: background-color 0.5s; - -o-transition: background-color 0.5s; - -ms-transition: background-color 0.5s; - transition: background-color 0.5s; -} -.task-checklist-edit > .checklist-form .checklist-icon { - opacity: 0.25; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=25)'; - filter: alpha(opacity=25); - text-align: center; - line-height: 1.5; - float: left; - padding: 0.25em 0.5em; -} -.task-checklist-edit > .checklist-form li { - margin-bottom: 1em; -} -.task-checklist-edit > .checklist-form li:hover .checklist-icon { - opacity: 1; - -ms-filter: none; - filter: none; -} -.task-filter { - margin: 1.5em 0 1em 0; - border-color: #c3d1d6; - width: 100%; -} -.task-filter li { - border-right-color: #e0e7ea; -} -.task-filter li.active a { - -webkit-box-shadow: 0 0 0 1px #adc0c6 !important; - box-shadow: 0 0 0 1px #adc0c6 !important; -} -.task-filter li:first-of-type { - color: #648590; -} -.task-filter li { - width: 33.333%; - text-align: center; -} -.task-filter li > a, -.task-filter li > button { - background-color: #f2f5f6 !important; -} -.task-filter li > a:active, -.task-filter li > button:active { - background-color: #4d6770 !important; -} -@media screen and (min-width: 768px) { - .task-filter li > a:hover, - .task-filter li > button:hover { - background-color: #ebf0f1 !important; - } -} -.task-filter li > a, -.task-filter li > button, -.task-filter li > input, -.task-filter li textarea { - color: #3c5057 !important; - border-color: #c3d1d6 !important; -} -.task-filter li > input:hover, -.task-filter li textarea:hover { - border-color: #93acb5 !important; -} -.task-filter li > input:focus, -.task-filter li textarea:focus { - border-color: #4c666e !important; - outline: none; -} -.task-filter li > input + button:focus, -.task-filter li textarea + button:focus { - border-color: #93acb5 !important; - background-color: #e0e7ea !important; - outline: none; -} -.task-filter li > input + button:active, -.task-filter li textarea + button:active { - background-color: #c3d1d6 !important; -} -.task-filter li > a:nth-of-type(2) { - border-left: 1px solid #e7edee !important; -} -@media screen and (min-width: 768px) { - .task-filter li > div { - border: 1px solid #c3d1d6; - } -} -.task-filter li > div h4 { - color: #4c666e; - background-color: #f2f5f6; - border-color: #c3d1d6; -} -.task-filter li > div > ul:first-child:before, -.task-filter li > div > div:first-child:before { - background-color: #fff; - border-color: #c3d1d6; -} -.task-filter li > div h4:before { - background-color: #f2f5f6; - border-color: #c3d1d6; -} -.task-filter li > div ul { - border-color: #f2f5f6; -} -.task-filter li > div a, -.task-filter li > div a:link, -.task-filter li > div a:visited { - color: #3c5057 !important; -} -.task-filter li .glyphicon { - color: #506a73; -} -.task-filter li .tooltip { - border: 0; -} -.task-filter li.active a, -.task-filter li.active button { - background-color: #e7edee !important; - border-color: #648590 !important; -} -.task-filter li.active.filters-tags a, -.task-filter li.active.filters-tags button { - background-color: #93acb5 !important; - border-color: #f2f5f6 !important; - color: #fff !important; -} -.task-filter li.active.filters-tags a span, -.task-filter li.active.filters-tags button span { - color: #fff !important; -} -.task-filter li:nth-child(3n + 1):nth-last-child(2), -.task-filter li:nth-child(3n + 1):nth-last-child(2) + li { - width: 50%; -} -.task-filter li a { - width: 100%; - height: 100%; -} -.rewards .task { - min-height: 3.07em; -} -.rewards .task-filter li:nth-child(3n + 1):nth-last-child(2) { - width: 33.333%; -} -.rewards .task-filter li:nth-child(3n + 1):nth-last-child(2) + li { - width: 66.666%; -} -.rewards .btn-buy { - word-wrap: break-word; - padding-left: 0.2em; - text-align: left; - border: none; -} -.rewards .btn-buy.disabled { - pointer-events: none; - cursor: not-allowed; - -webkit-box-shadow: none; - -webkit-box-shadow: none; - box-shadow: none; - opacity: 0.65; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=65)'; - filter: alpha(opacity=65); -} -.rewards .btn-buy span { - position: relative; - left: -2px; -} -.rewards .btn-buy span:only-child { - position: static; - padding-left: 0.75em; -} -.rewards .btn-buy.highValue { - padding: 0.3em; - text-align: center; -} -.rewards .btn-buy.highValue span { - display: block; - margin: auto; -} -.rewards .btn-buy .shop_gold + .reward-cost { - line-height: 1; - top: -0.1em; -} -.locked-task .action-yesno label:hover:after { - height: 10px; - width: 10px; - margin: 15px auto; - border: 1px solid #222; - opacity: 0.2 !important; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=20)' !important; - filter: alpha(opacity=20) !important; -} -.locked-task .action-yesno label:focus, -.locked-task .action-yesno label:hover { - background-color: #ffcf42 !important; -} -.locked-task .task-actions a, -.locked-task .task-checker label, -.locked-task .task-text { - cursor: initial; -} -.locked-task .task-actions a:hover { - background-color: inherit !important; -} -.locked-task .task-checker label:hover:after { - content: ''; -} -.profile-modal .modal-dialog { - height: 100%; - width: auto; - max-width: 920px; - margin: 0 auto; - padding: 10px; -} -@media screen and (min-width: 768px) { - .profile-modal .modal-dialog { - padding: 30px 10px; - } -} -.profile-modal .modal-content { - height: 100%; -} -.profile-modal .modal-body { - max-height: calc(100% - 137px); - overflow-y: scroll; -} -.profile-modal .modal-footer { - margin: 0; - padding: 16px 20px; -} -.herobox { - height: 10.5em; - width: 10em; - max-width: 10em; - margin: 0; - position: relative; - cursor: pointer; - padding-top: 2em; -} -.herobox .avatar-level, -.herobox .avatar-name { - position: absolute; - z-index: 2; -} -.herobox .avatar-level { - bottom: 4px; - right: 4px; -} -.herobox .avatar-level .glyphicon-circle-arrow-up { - padding-right: 4px; -} -.herobox .avatar-level .glyphicon-plus-sign { - padding-left: 4px; -} -.herobox .avatar-name { - max-width: 132px; - top: 4px; - left: 4px; - opacity: 0; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; - filter: alpha(opacity=0); - -webkit-transition: opacity 0.2s ease-out; - -moz-transition: opacity 0.2s ease-out; - -o-transition: opacity 0.2s ease-out; - -ms-transition: opacity 0.2s ease-out; - transition: opacity 0.2s ease-out; -} -.herobox.isUser.noBackgroundImage:not(.hasMount) .avatar-name { - opacity: 1; - -ms-filter: none; - filter: none; -} -.herobox:hover .avatar-name, -.herobox:focus .avatar-name { - opacity: 1; - -ms-filter: none; - filter: none; -} -.herobox .character-sprites { - width: 6.428571429em; - height: 6.428571429em; - margin: 0 auto; -} -.herobox .character-sprites span { - position: absolute; -} -.herobox.hasPet { - padding-top: 1.75em; -} -.herobox.hasMount { - padding-top: 0em; -} -.herobox.noBackgroundImage { - background: #fff; -} -.herobox.noBackgroundImage:hover, -.herobox.noBackgroundImage:focus { - background: #fff; -} -.herobox.noBackgroundImage.isUser { - background: #fff; -} -.herobox.noBackgroundImage.isUser:hover, -.herobox.noBackgroundImage.isUser:focus { - background: #fff; -} -.herobox .addthis_pill_style { - width: 50px !important; -} -.herobox .addthis_native_toolbox { - position: absolute; - bottom: 4px; - left: 4px; - z-index: 2; - opacity: 0; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; - filter: alpha(opacity=0); -} -.herobox:hover .addthis_native_toolbox { - opacity: 1; - -ms-filter: none; - filter: none; -} -.avatar-window { - float: right; - margin: 0 1em 0 0; -} -menu { - padding: 0; - margin: 0; -} -.customize-menu { - padding: 0; - width: 100%; - list-style: none; - padding-bottom: 10px; -} -.customize-menu menu:before { - content: attr(label); - display: block; - font-size: 14px; - font-weight: bold; - line-height: 2; -} -.customize-menu .cost { - display: block; - margin-bottom: 5px; -} -.customize-menu .cost .btn { - margin-left: 5px; - vertical-align: baseline; -} -.customize-option { - border: 0px solid #808080; - background-color: #ededed; - margin-bottom: 10px; - -webkit-transition: background-color 0.5s ease-out; - -moz-transition: background-color 0.5s ease-out; - -webkit-transition: background-color 0.5s ease-out; - -moz-transition: background-color 0.5s ease-out; - -o-transition: background-color 0.5s ease-out; - -ms-transition: background-color 0.5s ease-out; - transition: background-color 0.5s ease-out; -} -.customize-option:active { - background-color: #fff2cc; - -webkit-transition: none; - -moz-transition: none; - -webkit-transition: none; - -moz-transition: none; - -o-transition: none; - -ms-transition: none; - transition: none; -} -.customize-option:not(:last-of-type) { - margin-right: 10px; -} -@media (max-width: 480px) { - .avatar-window { - float: none; - margin-bottom: 1em; - } - .customize-menu { - width: 100%; - } -} -.well.limited-edition { - padding: 5px; - margin: 25px 0 0; -} -.background-unlocked { - border: 15px solid #fff; - width: 170px !important; - height: 177px !important; -} -.background-locked { - border: 15px solid #808080; - width: 170px !important; - height: 177px !important; - position: relative; -} -.background-locked i { - position: absolute; - right: -13px; - bottom: -13px; - color: #fff; - top: auto; -} -.money { - display: inline-block; - line-height: 1.5em; - padding-left: 0.75em; -} -.shop_gold, -.shop_silver, -.shop_copper { - vertical-align: top; - display: inline-block; -} -.shop_spell { - vertical-align: top; - display: inline-block; - top: -5px; -} -.btn-buy { - width: 4.5em; - min-height: 3em; - height: 100%; - padding: 0.75em 0 0 0.5em; - text-align: center; - vertical-align: top; - background-color: #d0e0e3; - color: #555; -} -.btn-buy:hover, -.btn-buy:focus, -.btn-buy.active { - background-color: #fce5cd; - text-decoration: none; -} -.btn-buy input:focus { - opacity: 0; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; - filter: alpha(opacity=0); -} -input:focus + a.btn-buy { - background-color: #fce5cd; - text-decoration: none; -} -.locked-task .btn-buy:hover { - background-color: #d0e0e3; - cursor: initial; -} -.rewards { - margin-bottom: 1.5em; - padding-bottom: 1.5em; - border-bottom: 1px solid rgba(0, 0, 0, 0.1); -} -.reward-item { - background: #fff; -} -.reward-item:hover { - cursor: inherit; -} -.reward-cost { - display: inline; -} -.rewards .task-text { - padding-left: 5em; -} -.rewards .reward-img { - margin-left: 5em; -} -.rewards .task-options { - background: #fff; -} -.btn-reroll { - width: 2.5em; - padding-left: 0.25em; - background-color: #d0e0e3; - cursor: pointer; - -webkit-box-shadow: inset -1px -1px 0 rgba(0, 0, 0, 0.1); - box-shadow: inset -1px -1px 0 rgba(0, 0, 0, 0.1); -} -.btn-reroll:hover, -.btn-reroll:focus { - background-color: #fce5cd; -} -.item-img { - float: left; - display: inline-block; - vertical-align: top; - height: 3em; - margin-left: -0.5em; - margin-right: 0.5em; - border-top: 0; - border-bottom: 0; -} -.gem-wallet { - cursor: pointer; - padding-top: 10px; -} -.gem-wallet .tile { - background-color: #ffe69e; -} -.gem-wallet .add-gems-btn { - opacity: 0; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; - filter: alpha(opacity=0); -} -.gem-wallet:hover .add-gems-btn, -.gem-wallet:focus .add-gems-btn { - opacity: 1; - -ms-filter: none; - filter: none; - background-color: #d9ead3; -} -.gem-wallet:hover .tile, -.gem-wallet:focus .tile { - opacity: 1; - -ms-filter: none; - filter: none; -} -.modal-header .gem-wallet { - padding-top: 0px; -} -.equipment-title { - display: inline-block; - vertical-align: bottom; - margin-right: 20px; -} -.well.use-costume-info { - margin-top: 10px; -} -.well.use-costume-info p:first-child { - margin-bottom: 20px; -} -.stable .static-popover { - max-width: 550px; -} -menu.pets div { - display: inline-block; - vertical-align: top; -} -.current-pet { - left: 0px; - bottom: 0px; -} -.item-drop-icon { - float: left; - padding-right: 20px; - padding-bottom: 20px; -} -.food-tray { - position: fixed; - right: 15px; - bottom: 0px; - width: 30%; - max-width: 17em; - height: 50%; - overflow-y: auto; - z-index: 1; - padding-bottom: 0; -} -.inventory-list li { - clear: both; -} -.inventory-list button.customize-option { - position: relative; -} -.inventory-list .stack-count { - position: absolute; - bottom: -6px; - right: -9px; -} -.pets-menu > div { - display: inline-block; - vertical-align: top; - padding: 0.3em; - width: 6em; - margin-top: 1em; - text-align: center; -} -.pets-menu > div p { - margin-top: -0.3em; -} -.hatchingPotion-menu > div { - display: inline-block; - vertical-align: top; - padding: 0.3em; - width: 6em; - margin-top: 1em; -} -.hatchingPotion-menu > div p { - text-align: center; - width: 6em; - margin-top: -0.5em; -} -menu.pets .customize-menu button { - position: relative; -} -menu.pets .customize-menu .progress { - width: 60%; - position: absolute; - bottom: -25px; - left: 20%; - height: 5px; -} -.pet-button { - border: none; - background: none #fff; -} -.pet-not-owned, -.mount-not-owned { - width: 81px; - height: 99px; - /* Would use css3 filters and just display the original pet image with a black hue, - but doesn't seem to work in Firefox or Opera */ - /*filter: brightness(0%) - -webkit-filter: brightness(0%) - -moz-filter: brightness(0%) - -o-filter: brightness(0%) - -ms-filter: brightness(0%)*/ -} -.pet-not-owned .PixelPaw, -.mount-not-owned .PixelPaw { - margin-top: 36px; -} -.pet-evolved { - opacity: 0.1; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=10)'; - filter: alpha(opacity=10); -} -.selectableInventory { - background-color: #90ee90 !important; - -webkit-border-radius: 50%; - border-radius: 50%; -} -.sell-inventory { - width: 162px; - height: 138px; -} -.new-stuff { - position: fixed; - text-align: center; - top: 0; - left: 0; - width: 100%; - height: 0; - z-index: 1010; -} -.new-stuff > .alert { - border-top: 0; - -webkit-border-radius: 0 0 4px 4px; - border-radius: 0 0 4px 4px; - padding-right: 14px; - display: inline-block; -} -.wide-popover { - max-width: max-content; -} -.alert-sm { - padding-top: 8px; - padding-bottom: 8px; -} -#notification-area { - position: fixed; - top: 0; - right: 0px; - z-index: 1061; -} -#notification-area .alert { - padding-top: 8px; - padding-bottom: 8px; -} -#notification-area .alert .notification-icon { - -webkit-transform: scale(0.8); - -moz-transform: scale(0.8); - -o-transform: scale(0.8); - -ms-transform: scale(0.8); - transform: scale(0.8); -} -.alert-gp { - background-color: #fbefc0; - border-color: #f6da6d; - color: #786938; -} -.alert-hp { - background-color: #f2dede; - border-color: #d89b9b; - color: #b94a48; -} -.alert-lvl { - background-color: #d9edf7; - border-color: #8cc9e7; - color: #3a87ad; -} -.alert-xp { - background-color: #dcc0fb; - border-color: #ae6df6; - color: #635673; -} -.alert-death { - background-color: #4e4e4e; - border-color: #4e4e4e; - color: #ababab; -} -.alert-mp { - background-color: #c7d3e9; - border-color: #89a2d1; - color: #003aa1; -} -.alert-crit { - background-color: #fce5cd; - border-color: #f7b877; - color: #dc5000; -} -.alert-drop { - background-color: #d9ead3; - border-color: #a5cd97; - color: #415838; -} -.alert-streak { - background-color: #f5deb3; - border-color: #ebbd68; - color: #a0522d; -} -.undo-button { - z-index: 3000; - position: absolute; - left: 5px; - top: 5px; -} -.hidden { - display: none !important; - visibility: hidden; -} -.visuallyhidden { - border: 0; - clip: rect(0 0 0 0); - height: 1px; - margin: -1px; - overflow: hidden; - padding: 0; - position: absolute; - width: 1px; -} -.visuallyhidden.focusable:focus { - clip: auto; - height: auto; - margin: 0; - overflow: visible; - position: static; - width: auto; -} -.invisible { - visibility: hidden; -} -.transparent { - opacity: 0.5; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=50)'; - filter: alpha(opacity=50); -} -.col-centered { - margin-left: auto; - margin-right: auto; -} -@media (min-width: 768px) { - .pull-left-sm { - float: left; - } - .pull-right-sm { - float: right; - } -} -@media (min-width: 992px) { - .pull-left-md { - float: left; - } - .pull-right-md { - float: right; - } -} -@media (min-width: 1200px) { - .pull-left-lg { - float: left; - } - .pull-right-lg { - float: right; - } -} -@media (min-width: 768px) and (max-width: 991px) { - .new-row-md { - clear: left; - } -} -.header-wrap { - width: 100%; - z-index: 100; - padding: 46px 0 0 0; - background-color: #c5d3d6; - border-bottom: 1px solid rgba(0, 0, 0, 0.2); - overflow-y: hidden; - overflow-x: auto; -} -@media screen and (max-width: 767px) { - .header-wrap { - padding: 0; - } -} -.toolbar.active ~ .header-wrap { - padding: 0; -} -.sticky-wrapper { - height: 215px; -} -.user-menu { - position: absolute; - top: 0.5em; - right: 0.5em; - font-size: 0.85em; - z-index: 1011; -} -.user-menu .site-nav { - margin-bottom: 0px; -} -.user-menu .tile { - cursor: pointer; - font-weight: 400; - color: #494949; - color: rgba(38, 38, 38, 0.8); - background-color: #c2d7db; -} -.user-menu .tile:hover, -.user-menu .tile:focus { - background-color: #b2d4a6; -} -.user-menu .tile:active { - background-color: #98c688; -} -.user-reporter:after { - content: '▾'; - float: right; -} -.stacked > li { - display: list-item; -} -.stacked > li > a { - display: block; -} -.flyout, -.flyout-alt { - position: relative; -} -.flyout-content { - position: absolute; - top: 100%; - right: -99999px; - height: 0; - overflow: hidden; -} -.flyout:hover > .flyout-content { - right: 0; -} -.flyout-alt:hover > .flyout-content { - top: 0; - right: 100%; -} -.flyout:hover > .flyout-content, -.flyout-alt:hover > .flyout-content { - height: auto; - overflow: visible; -} -.flyout .tile { - min-width: 6.5em; -} -.stacked .tile { - outline: 0; - border: 1px solid rgba(0, 0, 0, 0.2); - border-top: 0; -} -.site-header { - display: table; - height: 10.5em; - width: 100%; -} -.herobox-wrap { - display: table-cell; - vertical-align: middle; - width: 10em; - height: 10.5em; -} -.hero-stats { - padding: 1.1em 1em 0; - margin: 0; - display: table-cell; - vertical-align: middle; - min-width: 175px; - width: 75%; -} -@media screen and (max-width: 767px) { - .hero-stats { - padding: 1.1em 0.618em 0; - } -} -.hero-stats .meter-label { - float: left; - background-color: #b0c3c7 !important; - text-shadow: - -1px -1px 1px #2f3f42, - 1px -1px 1px #2f3f42, - -1px 1px 1px #2f3f42, - 1px 1px 1px #2f3f42; - width: 2.618em; - text-align: center; - margin-right: 0.618em; -} -.hero-stats .meter { - position: relative; - overflow: hidden; - border: 1px solid #fff; - height: 1.618em; - margin: 0 0 1em; - outline: 1px solid #999; -} -.hero-stats .meter .bar { - height: 100%; - -webkit-transition: width 0.25s ease-out; - -moz-transition: width 0.25s ease-out; - -o-transition: width 0.25s ease-out; - -ms-transition: width 0.25s ease-out; - transition: width 0.25s ease-out; -} -.hero-stats .health { - background: #fcf0f0; - color: #250808; -} -.hero-stats .health .bar { - background: #da5353; - border-color: #6f1818; -} -.hero-stats .experience { - background: #fffbf0; - color: #2e2200; -} -.hero-stats .experience .bar { - background: #ffcc35; - border-color: #8a6700; -} -.hero-stats .experience .meter-text span { - margin-right: 0.236em; -} -.hero-stats .experience .meter-text span a { - color: #5c4400; -} -.hero-stats .mana { - background: #eff4fd; - color: #051228; -} -.hero-stats .mana .bar { - background: #4781e7; - border-color: #0f3577; -} -.hero-stats .meter-text { - position: absolute; - top: 0; - z-index: 4; - line-height: 1.618; - white-space: nowrap; -} -.hero-stats .meter-text.value { - right: 0.382em; -} -[class^='quest_'] + .hero-stats { - min-width: 220px; - padding: 1.618em 0 1em; -} -header .hero-stats { - background-color: #cfdbde; - border-right: 1px solid #bacbcf; -} -.party { - display: table-cell; - width: 100%; -} -button.party-invite { - display: block; - margin: 57px auto; -} -.filters { - padding: 1em 15px 0.382em; - margin-left: 0.382em; - margin-right: 0em; -} -.filters ul { - float: left; - list-style: none; - margin-right: 1em; -} -.filters .filters-controls { - border-color: #c8dbdb; -} -.filters .filters-controls li { - border-right-color: #e6efef; -} -.filters .filters-controls li.active a { - -webkit-box-shadow: 0 0 0 1px #b2cbcb !important; - box-shadow: 0 0 0 1px #b2cbcb !important; -} -.filters .filters-controls li:first-of-type { - color: #649696; -} -.filters .filters-controls li > a, -.filters .filters-controls li > button { - background-color: #f9fbfb !important; -} -.filters .filters-controls li > a:active, -.filters .filters-controls li > button:active { - background-color: #4e7474 !important; -} -@media screen and (min-width: 768px) { - .filters .filters-controls li > a:hover, - .filters .filters-controls li > button:hover { - background-color: #f2f6f6 !important; - } -} -.filters .filters-controls li > a, -.filters .filters-controls li > button, -.filters .filters-controls li > input, -.filters .filters-controls li textarea { - color: #3c5a5a !important; - border-color: #c8dbdb !important; -} -.filters .filters-controls li > input:hover, -.filters .filters-controls li textarea:hover { - border-color: #97b9b9 !important; -} -.filters .filters-controls li > input:focus, -.filters .filters-controls li textarea:focus { - border-color: #4c7373 !important; - outline: none; -} -.filters .filters-controls li > input + button:focus, -.filters .filters-controls li textarea + button:focus { - border-color: #97b9b9 !important; - background-color: #e6efef !important; - outline: none; -} -.filters .filters-controls li > input + button:active, -.filters .filters-controls li textarea + button:active { - background-color: #c8dbdb !important; -} -.filters .filters-controls li > a:nth-of-type(2) { - border-left: 1px solid #eef3f3 !important; -} -@media screen and (min-width: 768px) { - .filters .filters-controls li > div { - border: 1px solid #c8dbdb; - } -} -.filters .filters-controls li > div h4 { - color: #4c7373; - background-color: #f9fbfb; - border-color: #c8dbdb; -} -.filters .filters-controls li > div > ul:first-child:before, -.filters .filters-controls li > div > div:first-child:before { - background-color: #fff; - border-color: #c8dbdb; -} -.filters .filters-controls li > div h4:before { - background-color: #f9fbfb; - border-color: #c8dbdb; -} -.filters .filters-controls li > div ul { - border-color: #f9fbfb; -} -.filters .filters-controls li > div a, -.filters .filters-controls li > div a:link, -.filters .filters-controls li > div a:visited { - color: #3c5a5a !important; -} -.filters .filters-controls li .glyphicon { - color: #507878; -} -.filters .filters-controls li .tooltip { - border: 0; -} -.filters .filters-controls li.active a, -.filters .filters-controls li.active button { - background-color: #eef3f3 !important; - border-color: #649696 !important; -} -.filters .filters-controls li.active.filters-tags a, -.filters .filters-controls li.active.filters-tags button { - background-color: #97b9b9 !important; - border-color: #f9fbfb !important; - color: #fff !important; -} -.filters .filters-controls li.active.filters-tags a span, -.filters .filters-controls li.active.filters-tags button span { - color: #fff !important; -} -.filters .filters-tags, -.filters .filters-edit { - float: left; -} -.filters .filters-edit { - margin-bottom: 0.382em; -} -.filters .filters-tags { - margin-bottom: 0.618em; - margin-right: 0.618em; -} -.filters .filters-tags > a, -.filters .filters-tags > button { - background-color: #f0f7ed !important; -} -.filters .filters-tags > a:active, -.filters .filters-tags > button:active { - background-color: #4f823a !important; -} -@media screen and (min-width: 768px) { - .filters .filters-tags > a:hover, - .filters .filters-tags > button:hover { - background-color: #e9f3e5 !important; - } -} -.filters .filters-tags > a, -.filters .filters-tags > button, -.filters .filters-tags > input, -.filters .filters-tags textarea { - color: #3d652d !important; - border-color: #c3dfb7 !important; -} -.filters .filters-tags > input:hover, -.filters .filters-tags textarea:hover { - border-color: #94c67f !important; -} -.filters .filters-tags > input:focus, -.filters .filters-tags textarea:focus { - border-color: #4e8039 !important; - outline: none; -} -.filters .filters-tags > input + button:focus, -.filters .filters-tags textarea + button:focus { - border-color: #94c67f !important; - background-color: #dfeed8 !important; - outline: none; -} -.filters .filters-tags > input + button:active, -.filters .filters-tags textarea + button:active { - background-color: #c3dfb7 !important; -} -.filters .filters-tags > a:nth-of-type(2) { - border-left: 1px solid #e5f1e0 !important; -} -@media screen and (min-width: 768px) { - .filters .filters-tags > div { - border: 1px solid #c3dfb7; - } -} -.filters .filters-tags > div h4 { - color: #4e8039; - background-color: #f0f7ed; - border-color: #c3dfb7; -} -.filters .filters-tags > div > ul:first-child:before, -.filters .filters-tags > div > div:first-child:before { - background-color: #fff; - border-color: #c3dfb7; -} -.filters .filters-tags > div h4:before { - background-color: #f0f7ed; - border-color: #c3dfb7; -} -.filters .filters-tags > div ul { - border-color: #f0f7ed; -} -.filters .filters-tags > div a, -.filters .filters-tags > div a:link, -.filters .filters-tags > div a:visited { - color: #3d652d !important; -} -.filters .filters-tags .glyphicon { - color: #52863c; -} -.filters .filters-tags .tooltip { - border: 0; -} -.filters .filters-tags.active a, -.filters .filters-tags.active button { - background-color: #e5f1e0 !important; - border-color: #66a84a !important; -} -.filters .filters-tags.active.filters-tags a, -.filters .filters-tags.active.filters-tags button { - background-color: #94c67f !important; - border-color: #f0f7ed !important; - color: #fff !important; -} -.filters .filters-tags.active.filters-tags a span, -.filters .filters-tags.active.filters-tags button span { - color: #fff !important; -} -.filters .filters-tags.challenge > a, -.filters .filters-tags.challenge > button { - background-color: #ead9ea !important; -} -.filters .filters-tags.challenge > a:active, -.filters .filters-tags.challenge > button:active { - background-color: #713e71 !important; -} -@media screen and (min-width: 768px) { - .filters .filters-tags.challenge > a:hover, - .filters .filters-tags.challenge > button:hover { - background-color: #e6d2e6 !important; - } -} -.filters .filters-tags.challenge > a, -.filters .filters-tags.challenge > button, -.filters .filters-tags.challenge > input, -.filters .filters-tags.challenge textarea { - color: #573057 !important; - border-color: #d0aad0 !important; -} -.filters .filters-tags.challenge > input:hover, -.filters .filters-tags.challenge textarea:hover { - border-color: #b57ab5 !important; -} -.filters .filters-tags.challenge > input:focus, -.filters .filters-tags.challenge textarea:focus { - border-color: #6f3d6f !important; - outline: none; -} -.filters .filters-tags.challenge > input + button:focus, -.filters .filters-tags.challenge textarea + button:focus { - border-color: #b57ab5 !important; - background-color: #e0c7e0 !important; - outline: none; -} -.filters .filters-tags.challenge > input + button:active, -.filters .filters-tags.challenge textarea + button:active { - background-color: #d0aad0 !important; -} -.filters .filters-tags.challenge > a:nth-of-type(2) { - border-left: 1px solid #e4cee4 !important; -} -@media screen and (min-width: 768px) { - .filters .filters-tags.challenge > div { - border: 1px solid #d0aad0; - } -} -.filters .filters-tags.challenge > div h4 { - color: #6f3d6f; - background-color: #ead9ea; - border-color: #d0aad0; -} -.filters .filters-tags.challenge > div > ul:first-child:before, -.filters .filters-tags.challenge > div > div:first-child:before { - background-color: #fff; - border-color: #d0aad0; -} -.filters .filters-tags.challenge > div h4:before { - background-color: #ead9ea; - border-color: #d0aad0; -} -.filters .filters-tags.challenge > div ul { - border-color: #ead9ea; -} -.filters .filters-tags.challenge > div a, -.filters .filters-tags.challenge > div a:link, -.filters .filters-tags.challenge > div a:visited { - color: #573057 !important; -} -.filters .filters-tags.challenge .glyphicon { - color: #744074; -} -.filters .filters-tags.challenge .tooltip { - border: 0; -} -.filters .filters-tags.challenge.active a, -.filters .filters-tags.challenge.active button { - background-color: #e4cee4 !important; - border-color: #915091 !important; -} -.filters .filters-tags.challenge.active.filters-tags a, -.filters .filters-tags.challenge.active.filters-tags button { - background-color: #b57ab5 !important; - border-color: #ead9ea !important; - color: #fff !important; -} -.filters .filters-tags.challenge.active.filters-tags a span, -.filters .filters-tags.challenge.active.filters-tags button span { - color: #fff !important; -} -.filters .filters-tags.challenge span { - margin-right: 0.382em; -} -.filters .filters-tags.challenge form { - display: none; -} -.filters .filters-tags .habitica-emoji { - margin-top: -0.5em; -} -.filters markdown { - display: inline-block; -} -.filters .hrpg-input-group { - display: inline-block; - margin-right: 0.618em; -} -.filters .hrpg-input-group > a, -.filters .hrpg-input-group > button { - background-color: #f6f8f9 !important; -} -.filters .hrpg-input-group > a:active, -.filters .hrpg-input-group > button:active { - background-color: #4d6673 !important; -} -@media screen and (min-width: 768px) { - .filters .hrpg-input-group > a:hover, - .filters .hrpg-input-group > button:hover { - background-color: #eff3f4 !important; - } -} -.filters .hrpg-input-group > a, -.filters .hrpg-input-group > button, -.filters .hrpg-input-group > input, -.filters .hrpg-input-group textarea { - color: #3b4f59 !important; - border-color: #c6d3d9 !important; -} -.filters .hrpg-input-group > input:hover, -.filters .hrpg-input-group textarea:hover { - border-color: #95acb8 !important; -} -.filters .hrpg-input-group > input:focus, -.filters .hrpg-input-group textarea:focus { - border-color: #4c6571 !important; - outline: none; -} -.filters .hrpg-input-group > input + button:focus, -.filters .hrpg-input-group textarea + button:focus { - border-color: #95acb8 !important; - background-color: #e4eaed !important; - outline: none; -} -.filters .hrpg-input-group > input + button:active, -.filters .hrpg-input-group textarea + button:active { - background-color: #c6d3d9 !important; -} -.filters .hrpg-input-group > a:nth-of-type(2) { - border-left: 1px solid #ebeff1 !important; -} -@media screen and (min-width: 768px) { - .filters .hrpg-input-group > div { - border: 1px solid #c6d3d9; - } -} -.filters .hrpg-input-group > div h4 { - color: #4c6571; - background-color: #f6f8f9; - border-color: #c6d3d9; -} -.filters .hrpg-input-group > div > ul:first-child:before, -.filters .hrpg-input-group > div > div:first-child:before { - background-color: #fff; - border-color: #c6d3d9; -} -.filters .hrpg-input-group > div h4:before { - background-color: #f6f8f9; - border-color: #c6d3d9; -} -.filters .hrpg-input-group > div ul { - border-color: #f6f8f9; -} -.filters .hrpg-input-group > div a, -.filters .hrpg-input-group > div a:link, -.filters .hrpg-input-group > div a:visited { - color: #3b4f59 !important; -} -.filters .hrpg-input-group .glyphicon { - color: #4f6a77; -} -.filters .hrpg-input-group .tooltip { - border: 0; -} -.filters .hrpg-input-group.active a, -.filters .hrpg-input-group.active button { - background-color: #ebeff1 !important; - border-color: #638494 !important; -} -.filters .hrpg-input-group.active.filters-tags a, -.filters .hrpg-input-group.active.filters-tags button { - background-color: #95acb8 !important; - border-color: #f6f8f9 !important; - color: #fff !important; -} -.filters .hrpg-input-group.active.filters-tags a span, -.filters .hrpg-input-group.active.filters-tags button span { - color: #fff !important; -} -.filters .filters-search { - margin-bottom: 0.618em; - max-width: 180px; -} -.task-column::-webkit-scrollbar { - width: 12px; -} -.task-column::-webkit-scrollbar-thumb { - border-width: 1px 1px 1px 2px; -} -.task-column::-webkit-scrollbar-track { - border-width: 0; -} -.task-column::-webkit-scrollbar { - height: 16px; - overflow: visible; - width: 16px; -} -.task-column::-webkit-scrollbar-button { - height: 0; - width: 0; -} -.task-column::-webkit-scrollbar-track { - -webkit-background-clip: padding; - -moz-background-clip: padding; - background-clip: padding-box; - border: solid transparent; - border-width: 0 0 0 4px; -} -.task-column::-webkit-scrollbar-track:horizontal { - border-width: 4px 0 0; -} -.task-column::-webkit-scrollbar-track:hover { - background-color: rgba(150, 150, 150, 0.05); - -webkit-box-shadow: inset 1px 0 0 rgba(150, 150, 150, 0.1); - box-shadow: inset 1px 0 0 rgba(150, 150, 150, 0.1); -} -.task-column::-webkit-scrollbar-track:horizontal:hover { - -webkit-box-shadow: inset 0 1px 0 rgba(150, 150, 150, 0.1); - box-shadow: inset 0 1px 0 rgba(150, 150, 150, 0.1); -} -.task-column::-webkit-scrollbar-track:active { - background-color: rgba(150, 150, 150, 0.05); - -webkit-box-shadow: - inset 1px 0 0 rgba(150, 150, 150, 0.14), - inset -1px 0 0 rgba(150, 150, 150, 0.07); - box-shadow: - inset 1px 0 0 rgba(150, 150, 150, 0.14), - inset -1px 0 0 rgba(150, 150, 150, 0.07); -} -.task-column::-webkit-scrollbar-track:horizontal:active { - -webkit-box-shadow: - inset 0 1px 0 rgba(150, 150, 150, 0.14), - inset 0 -1px 0 rgba(150, 150, 150, 0.07); - box-shadow: - inset 0 1px 0 rgba(150, 150, 150, 0.14), - inset 0 -1px 0 rgba(150, 150, 150, 0.07); -} -.task-column::-webkit-scrollbar-thumb { - background-color: rgba(150, 150, 150, 0.2); - -webkit-background-clip: padding; - -moz-background-clip: padding; - background-clip: padding-box; - border: solid transparent; - border-width: 1px 1px 1px 6px; - min-height: 28px; - padding: 100px 0 0; - -webkit-box-shadow: - inset 1px 1px 0 rgba(150, 150, 150, 0.1), - inset 0 -1px 0 rgba(150, 150, 150, 0.07); - box-shadow: - inset 1px 1px 0 rgba(150, 150, 150, 0.1), - inset 0 -1px 0 rgba(150, 150, 150, 0.07); -} -.task-column::-webkit-scrollbar-thumb:horizontal { - border-width: 6px 1px 1px; - padding: 0 0 0 100px; - -webkit-box-shadow: - inset 1px 1px 0 rgba(150, 150, 150, 0.1), - inset -1px 0 0 rgba(150, 150, 150, 0.07); - box-shadow: - inset 1px 1px 0 rgba(150, 150, 150, 0.1), - inset -1px 0 0 rgba(150, 150, 150, 0.07); -} -.task-column::-webkit-scrollbar-thumb:hover { - background-color: rgba(150, 150, 150, 0.4); - -webkit-box-shadow: inset 1px 1px 1px rgba(150, 150, 150, 0.25); - box-shadow: inset 1px 1px 1px rgba(150, 150, 150, 0.25); -} -.task-column::-webkit-scrollbar-thumb:active { - background-color: rgba(150, 150, 150, 0.5); - -webkit-box-shadow: inset 1px 1px 3px rgba(150, 150, 150, 0.35); - box-shadow: inset 1px 1px 3px rgba(150, 150, 150, 0.35); -} -.task-column::-webkit-scrollbar-track { - border-width: 0 1px 0 6px; -} -.task-column::-webkit-scrollbar-track:horizontal { - border-width: 6px 0 1px; -} -.task-column::-webkit-scrollbar-track:hover { - background-color: rgba(150, 150, 150, 0.035); - -webkit-box-shadow: - inset 1px 1px 0 rgba(150, 150, 150, 0.14), - inset -1px -1px 0 rgba(150, 150, 150, 0.07); - box-shadow: - inset 1px 1px 0 rgba(150, 150, 150, 0.14), - inset -1px -1px 0 rgba(150, 150, 150, 0.07); -} -.task-column::-webkit-scrollbar-thumb { - border-width: 0 1px 0 6px; -} -.task-column::-webkit-scrollbar-thumb:horizontal { - border-width: 6px 0 1px; -} -.task-column::-webkit-scrollbar-corner { - background: transparent; -} -.border-right { - border-right: 1px solid #ddd; -} -.border-left { - border-left: 1px solid #ddd; -} -.tab-notification { - color: #fff; - background-color: #51a351; -} -.chat-form { - margin-bottom: 10px; - position: relative; -} -.chat-form textarea { - margin-bottom: 0.618em; - line-height: 1.618em; -} -.guidelines-not-accepted p { - border: 1px solid #ccc; - padding: 1em; - margin-bottom: 0.5em; -} -.slight-vertical-padding { - clear: both; - padding-top: 0.618em; -} -.chat-buttons { - float: right; -} -.chat-buttons input { - margin-right: 0.618em; -} -.chat-message markdown, -.chat-message span.time { - padding: 0 3px; - line-height: 1.618em; -} -.chat-message .long-title .tooltip { - white-space: normal; -} -.chat-message span.time { - white-space: nowrap; -} -.chat-message .chat-plus-one { - opacity: 0; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; - filter: alpha(opacity=0); - background-color: #eee; - padding: 3px 3px 0px 3px; -} -.chat-message:hover .chat-plus-one { - opacity: 1; - -ms-filter: none; - filter: none; - color: #999; -} -.tavern-chat li, -.party-chat li { - padding-top: 15px; - padding-bottom: 15px; - border-bottom: 1px solid #ddd; - word-wrap: break-word; - position: relative; -} -.tavern-chat li.highlight, -.party-chat li.highlight { - background: #eee; -} -.tavern-chat li label, -.party-chat li label { - margin-right: 5px; -} -.tavern-chat li .float-label, -.party-chat li .float-label { - float: left; - position: absolute; - top: 17px; -} -.tavern-chat li .hidden-label, -.party-chat li .hidden-label { - visibility: hidden; -} -.tavern-chat li .scrollable-message, -.party-chat li .scrollable-message { - max-height: 6.472em; - overflow-y: auto; -} -.tavern-chat li .scrollable-message h1, -.party-chat li .scrollable-message h1, -.tavern-chat li .scrollable-message h2, -.party-chat li .scrollable-message h2, -.tavern-chat li .scrollable-message h3, -.party-chat li .scrollable-message h3, -.tavern-chat li .scrollable-message h4, -.party-chat li .scrollable-message h4, -.tavern-chat li .scrollable-message h5, -.party-chat li .scrollable-message h5 { - margin-top: 5px; - margin-bottom: 5px; -} -.tavern-chat li .expander, -.party-chat li .expander { - float: right; - position: absolute; - bottom: 18px; - right: 20px; - background: #fff; - max-width: 20px; - max-height: 20px; - width: 100%; - height: 100%; - text-align: center; -} -.tavern-chat .own-message, -.party-chat .own-message { - border-left: 4px solid #333; - padding-left: 2px; -} -.tavern-chat markdown p:first-child, -.party-chat markdown p:first-child { - display: inline; -} -.tavern-chat markdown img, -.party-chat markdown img { - max-height: 50px; - vertical-align: top; -} -.tavern-chat markdown li, -.party-chat markdown li { - border: 0; - padding-top: 0px; - padding-bottom: 0px; -} -.tavern-chat markdown blockquote, -.party-chat markdown blockquote { - padding: 0 15px; - color: #777; - border-left: 4px solid #ddd; - margin: 5px 0px 5px 0px; - font-size: 14px; -} -.tavern-chat markdown blockquote p, -.party-chat markdown blockquote p { - line-height: 1.3em; - margin-bottom: 0.7em; -} -.tavern-chat markdown blockquote p:first-child, -.party-chat markdown blockquote p:first-child { - display: block; -} -.tavern-chat markdown blockquote > :last-child, -.party-chat markdown blockquote > :last-child { - margin-bottom: 0; -} -.panel-tiers div { - display: none; - margin-top: 10px; -} -.label-contributor-1 { - background-color: #f57a9d !important; - text-shadow: - -1px -1px 1px #660823, - 1px -1px 1px #660823, - -1px 1px 1px #660823, - 1px 1px 1px #660823; -} -.label-contributor-2 { - background-color: #b93030 !important; - text-shadow: - -1px -1px 1px #380e0e, - 1px -1px 1px #380e0e, - -1px 1px 1px #380e0e, - 1px 1px 1px #380e0e; -} -.label-contributor-3 { - background-color: #f30 !important; - text-shadow: - -1px -1px 1px #4d0f00, - 1px -1px 1px #4d0f00, - -1px 1px 1px #4d0f00, - 1px 1px 1px #4d0f00; -} -.label-contributor-4 { - background-color: #ff9500 !important; - text-shadow: - -1px -1px 1px #4d2d00, - 1px -1px 1px #4d2d00, - -1px 1px 1px #4d2d00, - 1px 1px 1px #4d2d00; -} -.label-contributor-5 { - background-color: #fff700 !important; - text-shadow: - -1px -1px 1px #4d4a00, - 1px -1px 1px #4d4a00, - -1px 1px 1px #4d4a00, - 1px 1px 1px #4d4a00; -} -.label-contributor-6 { - background-color: #5eff00 !important; - text-shadow: - -1px -1px 1px #1c4d00, - 1px -1px 1px #1c4d00, - -1px 1px 1px #1c4d00, - 1px 1px 1px #1c4d00; -} -.label-contributor-7 { - background-color: #0af !important; - text-shadow: - -1px -1px 1px #00334d, - 1px -1px 1px #00334d, - -1px 1px 1px #00334d, - 1px 1px 1px #00334d; -} -.label-contributor-8 { - background-color: #130ead !important; - text-shadow: - -1px -1px 1px #060434, - 1px -1px 1px #060434, - -1px 1px 1px #060434, - 1px 1px 1px #060434; -} -.label-contributor-9 { - background-color: #88108f !important; - text-shadow: - -1px -1px 1px #29052b, - 1px -1px 1px #29052b, - -1px 1px 1px #29052b, - 1px 1px 1px #29052b; -} -.label-npc { - background-color: #000 !important; - text-shadow: - -1px -1px 1px #000, - 1px -1px 1px #000, - -1px 1px 1px #000, - 1px 1px 1px #000; - color: #0f0 !important; -} -#market-tab { - position: relative; - height: 500px; -} -.buttonList li { - margin: 5px; -} -.option-group .option-time { - padding: 0px 5px; -} -.list-at-user { - width: 100%; - max-width: 120px; - position: absolute; - background: #fff; - border: 1px solid #a4a4a4; - z-index: 10; -} -.list-at-user li { - line-height: 14px; - border-bottom: 1px solid #a4a4a4; - list-style-type: none; -} -.list-at-user li:hover { - cursor: pointer; - background: #b9dff4; -} -.list-at-user li span { - margin: 2px; - font-size: 11.844px; - margin-left: 5px; - display: inline-block; -} -.list-cur { - background: #b9dff4; -} -.npc_alex_container { - margin-bottom: 20px; -} -.npc_matt { - margin-bottom: 20px; -} -.toolbar-bailey-container { - width: 55px; - margin-right: 0.618em; - position: relative; -} -@media screen and (max-width: 767px) { - .toolbar-bailey-container { - margin-right: 0px; - } -} -.npc_bailey { - float: left; -} -.npc_bailey_broken { - float: left; -} -.npc_bailey_head { - position: absolute; - top: -17px; - height: 39px !important; - cursor: pointer; -} -.npc_justin.float-left { - float: left; - margin-right: 5px; - margin-bottom: 5px; -} -.npc_justin_broken.float-left { - float: left; - margin-right: 5px; - margin-bottom: 5px; -} -.static-popover { - z-index: 0; - display: block; - position: relative; -} -.popover-navigation { - clear: both; -} -ul.challenge-accordion-header-specs { - list-style: none; -} -ul.challenge-accordion-header-specs li { - background-color: #ffe69e; - margin: 2px 5px; - float: left; -} -ul.challenge-accordion-header-specs li.bg-transparent { - background-color: transparent; -} -ul.challenge-accordion-header-specs li.bg-transparent .glyphicon { - color: #fff; - margin-right: 5px; -} -#back-to-challenges, -#create-challenge-btn { - margin-bottom: 10px; -} -#challenges-filters h3 { - margin-top: 0px; -} -.select-class .herobox { - width: 115px; -} -.select-class .character-sprites { - width: 0px; - height: 0px; - margin: 0px; - margin-left: 5px; -} -html.applying-action, -html.applying-action * { - cursor: copy !important; -} -.cast-target:hover { - border: 5px solid #008000 !important; -} -.selected-class { - background-color: #008000; -} -.quest_collected_true { - color: #ccc; - text-decoration: line-through; -} -quest-rewards hr { - clear: both; -} -.quest-icon { - margin: 0.6em; -} -.quest-participants .accepted { - color: #2db200; -} -.quest-participants .rejected { - color: #b30409; -} -.subscription-features tr td { - vertical-align: middle; - text-align: center; -} -.subscription-features tr th { - max-width: 150px; - font-weight: normal; -} -.subscription-features tr th.feature-name { - text-align: center; - font-weight: bold; -} -.dashed-underline { - border-bottom: 1px dashed #000; - text-decoration: none; - cursor: pointer; -} -.buy-gems .form-inline .form-control { - padding: 6px; -} -p.resubscribe { - margin-top: 20px; -} -.buy-gems a.purchase { - height: 25px; - line-height: 12px; - font-size: 12px; - margin: 5px; -} -p.resubscribe a.purchase { - display: block; -} -.buy-gems button.customize-option { - position: relative; -} -.buy-gems .stack-count { - position: absolute; - bottom: -6px; - right: -9px; -} -.buy-gems .gem-count-popover { - display: block; -} -.buy-gems h3 { - margin-top: 0px; -} -.buy-gems .well { - margin-top: 15px; -} -.noninteractive-button { - padding: 0.5em; - margin-right: 0.5em; -} -.nav, -.pagination, -.carousel, -.panel-title a { - cursor: pointer; -} -.nav-tabs { - margin-bottom: 15px; -} -img { - max-width: 100%; -} -.hint { - border-bottom: 1px dotted #099; - text-decoration: none; - cursor: help; -} -a.hint { - border-bottom: 1px dotted #099; - text-decoration: none; - cursor: pointer; -} -a.hint:hover { - text-decoration: none; -} -.vertical-20 { - vertical-align: 20%; -} -.popover hr { - margin: 10px 0; -} -ul { - list-style-position: inside; -} -li.spaced { - margin: auto auto 0.5em 3em; -} -.group-leave-join .glyphicon-ban-circle { - color: #fff; - margin-right: 5px; -} -@media (max-width: 767px) { - .container-fluid { - padding-right: 5px; - padding-left: 5px; - } - .container-fluid > .row { - margin-left: -5px; - margin-right: -5px; - } - .tasks-lists .row .col-md-3 { - padding-right: 0; - padding-left: 0; - } -} -.flex-column { - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex; - -webkit-box-orient: vertical; - -moz-box-orient: vertical; - -o-box-orient: vertical; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; -} -.row-margin { - margin: auto auto 1em auto; -} -.reduce-top-margin { - margin-top: -10px; -} -.slight-right-margin { - margin-right: 1em; -} -.footer { - padding-top: 20px; - margin-top: 40px; - padding-bottom: 20px; - border-top: 1px solid #e5e5e5; - background-color: #f5f5f5; -} -.toolbar { - top: 0; - right: 0; - width: 100%; - z-index: 998; - background-color: #f4f7f7; - border-bottom: 1px solid #bacbcf; -} -.toolbar.active { - width: auto; -} -@media screen and (min-width: 768px) { - .toolbar { - position: fixed; - } -} -.toolbar-toggle { - float: right; - padding: 0.9em 0.3em; - overflow: hidden; - width: 1.6em; - z-index: 4000; - border: none; - border-left: 1px solid #c6d6d6; - background: none; - background-color: #e9efef; -} -.toolbar-toggle span { - display: inline-block; - color: #87a8a8; -} -.toolbar-toggle .glyphicon { - -webkit-animation: toggle-open 0.382s linear both; - -moz-animation: toggle-open 0.382s linear both; - -o-animation: toggle-open 0.382s linear both; - -ms-animation: toggle-open 0.382s linear both; - animation: toggle-open 0.382s linear both; -} -.toolbar-toggle .toggle-text { - display: none; - padding-left: 0.382em; -} -.toolbar-toggle:focus, -.toolbar-toggle:active { - outline: none; -} -.toolbar-toggle:hover, -.toolbar-toggle.active, -.toolbar-toggle:focus { - width: auto; - padding-left: 0.618em; - padding-right: 0.618em; -} -.toolbar-toggle:hover .toggle-text, -.toolbar-toggle.active .toggle-text, -.toolbar-toggle:focus .toggle-text { - display: inline-block; - padding-left: 0.382em; -} -.toolbar-toggle:hover .toggle-open, -.toolbar-toggle.active .toggle-open, -.toolbar-toggle:focus .toggle-open { - display: none; -} -.toolbar-toggle.active span { - color: #3e5555; -} -.toolbar-toggle.active .toggle-close { - display: none; -} -.toolbar-toggle.active .toggle-open { - display: inline-block; -} -.toolbar-toggle:hover, -.toolbar-toggle:focus { - background-color: #e9efef; - border-left: 1px solid #c6d6d6; -} -.toolbar-toggle.active, -.toolbar-toggle:focus.active { - background-color: #c5d3d6; -} -.toolbar-toggle.active .glyphicon, -.toolbar-toggle:focus.active .glyphicon { - -webkit-animation: toggle-close 0.382s linear both; - -moz-animation: toggle-close 0.382s linear both; - -o-animation: toggle-close 0.382s linear both; - -ms-animation: toggle-close 0.382s linear both; - animation: toggle-close 0.382s linear both; -} -.toolbar-toggle:focus.active { - border-left: 1px solid #87a8a8; - border-bottom: 1px solid #87a8a8; -} -.toolbar-container > ul > li { - display: inline-block; -} -.toolbar-mobile-nav { - display: inline-block; - padding-left: 0.618em; - padding-right: 0.618em; -} -@media screen and (min-width: 768px) { - .toolbar-mobile-nav { - display: none; - } -} -.toolbar-mobile > a, -.toolbar-mobile > button { - background-color: #f4f7f7 !important; -} -.toolbar-mobile > a:active, -.toolbar-mobile > button:active { - background-color: #506e6e !important; -} -@media screen and (min-width: 768px) { - .toolbar-mobile > a:hover, - .toolbar-mobile > button:hover { - background-color: #edf2f2 !important; - } -} -.toolbar-mobile > a, -.toolbar-mobile > button, -.toolbar-mobile > input, -.toolbar-mobile textarea { - color: #3e5555 !important; - border-color: #c6d6d6 !important; -} -.toolbar-mobile > input:hover, -.toolbar-mobile textarea:hover { - border-color: #97b3b3 !important; -} -.toolbar-mobile > input:focus, -.toolbar-mobile textarea:focus { - border-color: #4f6d6d !important; - outline: none; -} -.toolbar-mobile > input + button:focus, -.toolbar-mobile textarea + button:focus { - border-color: #97b3b3 !important; - background-color: #e2eaea !important; - outline: none; -} -.toolbar-mobile > input + button:active, -.toolbar-mobile textarea + button:active { - background-color: #c6d6d6 !important; -} -.toolbar-mobile > a:nth-of-type(2) { - border-left: 1px solid #e9efef !important; -} -@media screen and (min-width: 768px) { - .toolbar-mobile > div { - border: 1px solid #c6d6d6; - } -} -.toolbar-mobile > div h4 { - color: #4f6d6d; - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-mobile > div > ul:first-child:before, -.toolbar-mobile > div > div:first-child:before { - background-color: #fff; - border-color: #c6d6d6; -} -.toolbar-mobile > div h4:before { - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-mobile > div ul { - border-color: #f4f7f7; -} -.toolbar-mobile > div a, -.toolbar-mobile > div a:link, -.toolbar-mobile > div a:visited { - color: #3e5555 !important; -} -.toolbar-mobile .glyphicon { - color: #537272; -} -.toolbar-mobile .tooltip { - border: 0; -} -.toolbar-mobile.active a, -.toolbar-mobile.active button { - background-color: #e9efef !important; - border-color: #678e8e !important; -} -.toolbar-mobile.active.filters-tags a, -.toolbar-mobile.active.filters-tags button { - background-color: #97b3b3 !important; - border-color: #f4f7f7 !important; - color: #fff !important; -} -.toolbar-mobile.active.filters-tags a span, -.toolbar-mobile.active.filters-tags button span { - color: #fff !important; -} -.toolbar-nav { - white-space: nowrap; - float: left; - padding: 0.618em; -} -@media screen and (max-width: 767px) { - .toolbar-nav { - display: none; - } -} -.toolbar-nav > li { - margin-right: 0.618em; -} -.toolbar-nav .toolbar-button-dropdown > a, -.toolbar-nav .toolbar-button-dropdown > button { - background-color: #f4f7f7 !important; -} -.toolbar-nav .toolbar-button-dropdown > a:active, -.toolbar-nav .toolbar-button-dropdown > button:active { - background-color: #506e6e !important; -} -@media screen and (min-width: 768px) { - .toolbar-nav .toolbar-button-dropdown > a:hover, - .toolbar-nav .toolbar-button-dropdown > button:hover { - background-color: #edf2f2 !important; - } -} -.toolbar-nav .toolbar-button-dropdown > a, -.toolbar-nav .toolbar-button-dropdown > button, -.toolbar-nav .toolbar-button-dropdown > input, -.toolbar-nav .toolbar-button-dropdown textarea { - color: #3e5555 !important; - border-color: #c6d6d6 !important; -} -.toolbar-nav .toolbar-button-dropdown > input:hover, -.toolbar-nav .toolbar-button-dropdown textarea:hover { - border-color: #97b3b3 !important; -} -.toolbar-nav .toolbar-button-dropdown > input:focus, -.toolbar-nav .toolbar-button-dropdown textarea:focus { - border-color: #4f6d6d !important; - outline: none; -} -.toolbar-nav .toolbar-button-dropdown > input + button:focus, -.toolbar-nav .toolbar-button-dropdown textarea + button:focus { - border-color: #97b3b3 !important; - background-color: #e2eaea !important; - outline: none; -} -.toolbar-nav .toolbar-button-dropdown > input + button:active, -.toolbar-nav .toolbar-button-dropdown textarea + button:active { - background-color: #c6d6d6 !important; -} -.toolbar-nav .toolbar-button-dropdown > a:nth-of-type(2) { - border-left: 1px solid #e9efef !important; -} -@media screen and (min-width: 768px) { - .toolbar-nav .toolbar-button-dropdown > div { - border: 1px solid #c6d6d6; - } -} -.toolbar-nav .toolbar-button-dropdown > div h4 { - color: #4f6d6d; - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-nav .toolbar-button-dropdown > div > ul:first-child:before, -.toolbar-nav .toolbar-button-dropdown > div > div:first-child:before { - background-color: #fff; - border-color: #c6d6d6; -} -.toolbar-nav .toolbar-button-dropdown > div h4:before { - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-nav .toolbar-button-dropdown > div ul { - border-color: #f4f7f7; -} -.toolbar-nav .toolbar-button-dropdown > div a, -.toolbar-nav .toolbar-button-dropdown > div a:link, -.toolbar-nav .toolbar-button-dropdown > div a:visited { - color: #3e5555 !important; -} -.toolbar-nav .toolbar-button-dropdown .glyphicon { - color: #537272; -} -.toolbar-nav .toolbar-button-dropdown .tooltip { - border: 0; -} -.toolbar-nav .toolbar-button-dropdown.active a, -.toolbar-nav .toolbar-button-dropdown.active button { - background-color: #e9efef !important; - border-color: #678e8e !important; -} -.toolbar-nav .toolbar-button-dropdown.active.filters-tags a, -.toolbar-nav .toolbar-button-dropdown.active.filters-tags button { - background-color: #97b3b3 !important; - border-color: #f4f7f7 !important; - color: #fff !important; -} -.toolbar-nav .toolbar-button-dropdown.active.filters-tags a span, -.toolbar-nav .toolbar-button-dropdown.active.filters-tags button span { - color: #fff !important; -} -.toolbar-nav .toolbar-button-dropdown.highlight > a span.glyphicon { - margin-right: 0.382em !important; -} -.toolbar-nav .toolbar-button > a, -.toolbar-nav .toolbar-button > button { - background-color: #f4f7f7 !important; -} -.toolbar-nav .toolbar-button > a:active, -.toolbar-nav .toolbar-button > button:active { - background-color: #506e6e !important; -} -@media screen and (min-width: 768px) { - .toolbar-nav .toolbar-button > a:hover, - .toolbar-nav .toolbar-button > button:hover { - background-color: #edf2f2 !important; - } -} -.toolbar-nav .toolbar-button > a, -.toolbar-nav .toolbar-button > button, -.toolbar-nav .toolbar-button > input, -.toolbar-nav .toolbar-button textarea { - color: #3e5555 !important; - border-color: #c6d6d6 !important; -} -.toolbar-nav .toolbar-button > input:hover, -.toolbar-nav .toolbar-button textarea:hover { - border-color: #97b3b3 !important; -} -.toolbar-nav .toolbar-button > input:focus, -.toolbar-nav .toolbar-button textarea:focus { - border-color: #4f6d6d !important; - outline: none; -} -.toolbar-nav .toolbar-button > input + button:focus, -.toolbar-nav .toolbar-button textarea + button:focus { - border-color: #97b3b3 !important; - background-color: #e2eaea !important; - outline: none; -} -.toolbar-nav .toolbar-button > input + button:active, -.toolbar-nav .toolbar-button textarea + button:active { - background-color: #c6d6d6 !important; -} -.toolbar-nav .toolbar-button > a:nth-of-type(2) { - border-left: 1px solid #e9efef !important; -} -@media screen and (min-width: 768px) { - .toolbar-nav .toolbar-button > div { - border: 1px solid #c6d6d6; - } -} -.toolbar-nav .toolbar-button > div h4 { - color: #4f6d6d; - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-nav .toolbar-button > div > ul:first-child:before, -.toolbar-nav .toolbar-button > div > div:first-child:before { - background-color: #fff; - border-color: #c6d6d6; -} -.toolbar-nav .toolbar-button > div h4:before { - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-nav .toolbar-button > div ul { - border-color: #f4f7f7; -} -.toolbar-nav .toolbar-button > div a, -.toolbar-nav .toolbar-button > div a:link, -.toolbar-nav .toolbar-button > div a:visited { - color: #3e5555 !important; -} -.toolbar-nav .toolbar-button .glyphicon { - color: #537272; -} -.toolbar-nav .toolbar-button .tooltip { - border: 0; -} -.toolbar-nav .toolbar-button.active a, -.toolbar-nav .toolbar-button.active button { - background-color: #e9efef !important; - border-color: #678e8e !important; -} -.toolbar-nav .toolbar-button.active.filters-tags a, -.toolbar-nav .toolbar-button.active.filters-tags button { - background-color: #97b3b3 !important; - border-color: #f4f7f7 !important; - color: #fff !important; -} -.toolbar-nav .toolbar-button.active.filters-tags a span, -.toolbar-nav .toolbar-button.active.filters-tags button span { - color: #fff !important; -} -.toolbar-nav .toolbar-button > a { - display: inline-block; - height: 100%; -} -.toolbar-bailey, -.toolbar-wallet, -.toolbar-options, -.toolbar-subscribe { - float: right; - padding: 0.618em 0.618em 0.618em 0; -} -@media screen and (max-width: 767px) { - .toolbar-bailey, - .toolbar-wallet, - .toolbar-options, - .toolbar-subscribe { - float: none; - display: inline-block; - padding: 0.618em 0.382em 0.618em 0; - } -} -.toolbar-wallet .gem-wallet .Gems { - margin-top: 0em; -} -.toolbar-wallet .gem-wallet span { - display: inline-block; - vertical-align: top; - padding-top: 0.236em; -} -.toolbar-currency { - margin-top: 0.236em; - margin-bottom: 0.236em; - vertical-align: top; -} -.toolbar-currency.gold { - color: #946e00; -} -.toolbar-currency.silver { - color: #999; -} -.toolbar-options > li, -.toolbar-wallet > li { - margin-left: 0.618em; -} -@media screen and (max-width: 767px) { - .toolbar-options > li { - padding-left: 0em; - margin-left: 0em; - margin-right: 0.618em; - } -} -.toolbar-sync > a, -.toolbar-settings > a, -.toolbar-audio > a, -.toolbar-sync > button, -.toolbar-settings > button, -.toolbar-audio > button { - background-color: #f4f7f7 !important; -} -.toolbar-sync > a:active, -.toolbar-settings > a:active, -.toolbar-audio > a:active, -.toolbar-sync > button:active, -.toolbar-settings > button:active, -.toolbar-audio > button:active { - background-color: #506e6e !important; -} -@media screen and (min-width: 768px) { - .toolbar-sync > a:hover, - .toolbar-settings > a:hover, - .toolbar-audio > a:hover, - .toolbar-sync > button:hover, - .toolbar-settings > button:hover, - .toolbar-audio > button:hover { - background-color: #edf2f2 !important; - } -} -.toolbar-sync > a, -.toolbar-settings > a, -.toolbar-audio > a, -.toolbar-sync > button, -.toolbar-settings > button, -.toolbar-audio > button, -.toolbar-sync > input, -.toolbar-settings > input, -.toolbar-audio > input, -.toolbar-sync textarea, -.toolbar-settings textarea, -.toolbar-audio textarea { - color: #3e5555 !important; - border-color: #c6d6d6 !important; -} -.toolbar-sync > input:hover, -.toolbar-settings > input:hover, -.toolbar-audio > input:hover, -.toolbar-sync textarea:hover, -.toolbar-settings textarea:hover, -.toolbar-audio textarea:hover { - border-color: #97b3b3 !important; -} -.toolbar-sync > input:focus, -.toolbar-settings > input:focus, -.toolbar-audio > input:focus, -.toolbar-sync textarea:focus, -.toolbar-settings textarea:focus, -.toolbar-audio textarea:focus { - border-color: #4f6d6d !important; - outline: none; -} -.toolbar-sync > input + button:focus, -.toolbar-settings > input + button:focus, -.toolbar-audio > input + button:focus, -.toolbar-sync textarea + button:focus, -.toolbar-settings textarea + button:focus, -.toolbar-audio textarea + button:focus { - border-color: #97b3b3 !important; - background-color: #e2eaea !important; - outline: none; -} -.toolbar-sync > input + button:active, -.toolbar-settings > input + button:active, -.toolbar-audio > input + button:active, -.toolbar-sync textarea + button:active, -.toolbar-settings textarea + button:active, -.toolbar-audio textarea + button:active { - background-color: #c6d6d6 !important; -} -.toolbar-sync > a:nth-of-type(2), -.toolbar-settings > a:nth-of-type(2), -.toolbar-audio > a:nth-of-type(2) { - border-left: 1px solid #e9efef !important; -} -@media screen and (min-width: 768px) { - .toolbar-sync > div, - .toolbar-settings > div, - .toolbar-audio > div { - border: 1px solid #c6d6d6; - } -} -.toolbar-sync > div h4, -.toolbar-settings > div h4, -.toolbar-audio > div h4 { - color: #4f6d6d; - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-sync > div > ul:first-child:before, -.toolbar-settings > div > ul:first-child:before, -.toolbar-audio > div > ul:first-child:before, -.toolbar-sync > div > div:first-child:before, -.toolbar-settings > div > div:first-child:before, -.toolbar-audio > div > div:first-child:before { - background-color: #fff; - border-color: #c6d6d6; -} -.toolbar-sync > div h4:before, -.toolbar-settings > div h4:before, -.toolbar-audio > div h4:before { - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-sync > div ul, -.toolbar-settings > div ul, -.toolbar-audio > div ul { - border-color: #f4f7f7; -} -.toolbar-sync > div a, -.toolbar-settings > div a, -.toolbar-audio > div a, -.toolbar-sync > div a:link, -.toolbar-settings > div a:link, -.toolbar-audio > div a:link, -.toolbar-sync > div a:visited, -.toolbar-settings > div a:visited, -.toolbar-audio > div a:visited { - color: #3e5555 !important; -} -.toolbar-sync .glyphicon, -.toolbar-settings .glyphicon, -.toolbar-audio .glyphicon { - color: #537272; -} -.toolbar-sync .tooltip, -.toolbar-settings .tooltip, -.toolbar-audio .tooltip { - border: 0; -} -.toolbar-sync.active a, -.toolbar-settings.active a, -.toolbar-audio.active a, -.toolbar-sync.active button, -.toolbar-settings.active button, -.toolbar-audio.active button { - background-color: #e9efef !important; - border-color: #678e8e !important; -} -.toolbar-sync.active.filters-tags a, -.toolbar-settings.active.filters-tags a, -.toolbar-audio.active.filters-tags a, -.toolbar-sync.active.filters-tags button, -.toolbar-settings.active.filters-tags button, -.toolbar-audio.active.filters-tags button { - background-color: #97b3b3 !important; - border-color: #f4f7f7 !important; - color: #fff !important; -} -.toolbar-sync.active.filters-tags a span, -.toolbar-settings.active.filters-tags a span, -.toolbar-audio.active.filters-tags a span, -.toolbar-sync.active.filters-tags button span, -.toolbar-settings.active.filters-tags button span, -.toolbar-audio.active.filters-tags button span { - color: #fff !important; -} -.toolbar-notifs > a, -.toolbar-notifs > button { - background-color: #f4f7f7 !important; -} -.toolbar-notifs > a:active, -.toolbar-notifs > button:active { - background-color: #506e6e !important; -} -@media screen and (min-width: 768px) { - .toolbar-notifs > a:hover, - .toolbar-notifs > button:hover { - background-color: #edf2f2 !important; - } -} -.toolbar-notifs > a, -.toolbar-notifs > button, -.toolbar-notifs > input, -.toolbar-notifs textarea { - color: #3e5555 !important; - border-color: #c6d6d6 !important; -} -.toolbar-notifs > input:hover, -.toolbar-notifs textarea:hover { - border-color: #97b3b3 !important; -} -.toolbar-notifs > input:focus, -.toolbar-notifs textarea:focus { - border-color: #4f6d6d !important; - outline: none; -} -.toolbar-notifs > input + button:focus, -.toolbar-notifs textarea + button:focus { - border-color: #97b3b3 !important; - background-color: #e2eaea !important; - outline: none; -} -.toolbar-notifs > input + button:active, -.toolbar-notifs textarea + button:active { - background-color: #c6d6d6 !important; -} -.toolbar-notifs > a:nth-of-type(2) { - border-left: 1px solid #e9efef !important; -} -@media screen and (min-width: 768px) { - .toolbar-notifs > div { - border: 1px solid #c6d6d6; - } -} -.toolbar-notifs > div h4 { - color: #4f6d6d; - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-notifs > div > ul:first-child:before, -.toolbar-notifs > div > div:first-child:before { - background-color: #fff; - border-color: #c6d6d6; -} -.toolbar-notifs > div h4:before { - background-color: #f4f7f7; - border-color: #c6d6d6; -} -.toolbar-notifs > div ul { - border-color: #f4f7f7; -} -.toolbar-notifs > div a, -.toolbar-notifs > div a:link, -.toolbar-notifs > div a:visited { - color: #3e5555 !important; -} -.toolbar-notifs .glyphicon { - color: #537272; -} -.toolbar-notifs .tooltip { - border: 0; -} -.toolbar-notifs.active a, -.toolbar-notifs.active button { - background-color: #e9efef !important; - border-color: #678e8e !important; -} -.toolbar-notifs.active.filters-tags a, -.toolbar-notifs.active.filters-tags button { - background-color: #97b3b3 !important; - border-color: #f4f7f7 !important; - color: #fff !important; -} -.toolbar-notifs.active.filters-tags a span, -.toolbar-notifs.active.filters-tags button span { - color: #fff !important; -} -.toolbar-notifs > a span.inactive { - opacity: 0.236 !important; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=24)' !important; - filter: alpha(opacity=24) !important; -} -.toolbar-notifs div { - padding-bottom: 1em; - width: 300px; -} -@media screen and (max-width: 767px) { - .toolbar-notifs div { - width: 96%; - } -} -.toolbar-notifs div .toolbar-notifs-notifs { - padding-bottom: 1em; -} -.toolbar-notifs div .toolbar-notifs-notifs li .glyphicon { - margin-right: 0.618em; - height: 100%; -} -.toolbar-notifs div .toolbar-notifs-notifs a:nth-of-type(1) { - width: 84%; -} -.toolbar-notifs div .toolbar-notifs-notifs a:nth-of-type(2) { - width: 16%; - text-align: center; -} -.toolbar-notifs div .toolbar-notifs-notifs a:nth-of-type(2) .glyphicon-remove-circle { - margin: 0px; -} -.toolbar-notifs-no-messages { - padding: 0.382em 1em; -} -.toolbar-controls .toolbar-controls-button > a, -.toolbar-controls .toolbar-controls-button > button { - background-color: #f8fafa !important; -} -.toolbar-controls .toolbar-controls-button > a:active, -.toolbar-controls .toolbar-controls-button > button:active { - background-color: #517171 !important; -} -@media screen and (min-width: 768px) { - .toolbar-controls .toolbar-controls-button > a:hover, - .toolbar-controls .toolbar-controls-button > button:hover { - background-color: #f1f5f5 !important; - } -} -.toolbar-controls .toolbar-controls-button > a, -.toolbar-controls .toolbar-controls-button > button, -.toolbar-controls .toolbar-controls-button > input, -.toolbar-controls .toolbar-controls-button textarea { - color: #3e5757 !important; - border-color: #c9d8d8 !important; -} -.toolbar-controls .toolbar-controls-button > input:hover, -.toolbar-controls .toolbar-controls-button textarea:hover { - border-color: #99b6b6 !important; -} -.toolbar-controls .toolbar-controls-button > input:focus, -.toolbar-controls .toolbar-controls-button textarea:focus { - border-color: #4f6f6f !important; - outline: none; -} -.toolbar-controls .toolbar-controls-button > input + button:focus, -.toolbar-controls .toolbar-controls-button textarea + button:focus { - border-color: #99b6b6 !important; - background-color: #e6eded !important; - outline: none; -} -.toolbar-controls .toolbar-controls-button > input + button:active, -.toolbar-controls .toolbar-controls-button textarea + button:active { - background-color: #c9d8d8 !important; -} -.toolbar-controls .toolbar-controls-button > a:nth-of-type(2) { - border-left: 1px solid #edf2f2 !important; -} -@media screen and (min-width: 768px) { - .toolbar-controls .toolbar-controls-button > div { - border: 1px solid #c9d8d8; - } -} -.toolbar-controls .toolbar-controls-button > div h4 { - color: #4f6f6f; - background-color: #f8fafa; - border-color: #c9d8d8; -} -.toolbar-controls .toolbar-controls-button > div > ul:first-child:before, -.toolbar-controls .toolbar-controls-button > div > div:first-child:before { - background-color: #fff; - border-color: #c9d8d8; -} -.toolbar-controls .toolbar-controls-button > div h4:before { - background-color: #f8fafa; - border-color: #c9d8d8; -} -.toolbar-controls .toolbar-controls-button > div ul { - border-color: #f8fafa; -} -.toolbar-controls .toolbar-controls-button > div a, -.toolbar-controls .toolbar-controls-button > div a:link, -.toolbar-controls .toolbar-controls-button > div a:visited { - color: #3e5757 !important; -} -.toolbar-controls .toolbar-controls-button .glyphicon { - color: #537474; -} -.toolbar-controls .toolbar-controls-button .tooltip { - border: 0; -} -.toolbar-controls .toolbar-controls-button.active a, -.toolbar-controls .toolbar-controls-button.active button { - background-color: #edf2f2 !important; - border-color: #689191 !important; -} -.toolbar-controls .toolbar-controls-button.active.filters-tags a, -.toolbar-controls .toolbar-controls-button.active.filters-tags button { - background-color: #99b6b6 !important; - border-color: #f8fafa !important; - color: #fff !important; -} -.toolbar-controls .toolbar-controls-button.active.filters-tags a span, -.toolbar-controls .toolbar-controls-button.active.filters-tags button span { - color: #fff !important; -} -@media screen and (max-width: 767px) { - .toolbar-toggle { - display: none; - } - .toolbar-mobile .toolbar-submenu, - .toolbar-settings .toolbar-submenu, - .toolbar-audio .toolbar-submenu { - padding-left: 1em; - display: block; - } - .toolbar-mobile .toolbar-submenu li, - .toolbar-settings .toolbar-submenu li, - .toolbar-audio .toolbar-submenu li { - display: inline-block; - } - .toolbar-mobile .toolbar-submenu li a, - .toolbar-settings .toolbar-submenu li a, - .toolbar-audio .toolbar-submenu li a { - padding-left: 0em; - } - .toolbar-subscribe { - display: none; - } -} -@-moz-keyframes toggle-close { - 0% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -o-transform: rotate(0deg); - -ms-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -o-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); - } -} -@-webkit-keyframes toggle-close { - 0% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -o-transform: rotate(0deg); - -ms-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -o-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); - } -} -@-o-keyframes toggle-close { - 0% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -o-transform: rotate(0deg); - -ms-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -o-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); - } -} -@keyframes toggle-close { - 0% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -o-transform: rotate(0deg); - -ms-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -o-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); - } -} -@-moz-keyframes toggle-open { - 0% { - -webkit-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -o-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); - } - 100% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -o-transform: rotate(0deg); - -ms-transform: rotate(0deg); - transform: rotate(0deg); - } -} -@-webkit-keyframes toggle-open { - 0% { - -webkit-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -o-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); - } - 100% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -o-transform: rotate(0deg); - -ms-transform: rotate(0deg); - transform: rotate(0deg); - } -} -@-o-keyframes toggle-open { - 0% { - -webkit-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -o-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); - } - 100% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -o-transform: rotate(0deg); - -ms-transform: rotate(0deg); - transform: rotate(0deg); - } -} -@keyframes toggle-open { - 0% { - -webkit-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -o-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); - } - 100% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -o-transform: rotate(0deg); - -ms-transform: rotate(0deg); - transform: rotate(0deg); - } -} -#main > div > div > div > .tab-content { - margin: 1.618em 0em; -} -@media screen and (min-width: 768px) { - #main > div > div > div > .tab-content { - border: 1px solid #d5e3e3; - padding-bottom: 1.618em; - } -} -.options-menu, -.options-submenu { - border-bottom: 1px solid #d5e3e3; -} -@media screen and (min-width: 768px) { - .options-menu { - background-color: #f9fbfb; - } -} -.options-menu li > a, -.options-menu li > button { - background-color: #f9fbfb !important; -} -.options-menu li > a:active, -.options-menu li > button:active { - background-color: #4e7474 !important; -} -@media screen and (min-width: 768px) { - .options-menu li > a:hover, - .options-menu li > button:hover { - background-color: #f2f6f6 !important; - } -} -.options-menu li > a, -.options-menu li > button, -.options-menu li > input, -.options-menu li textarea { - color: #3c5a5a !important; - border-color: #c8dbdb !important; -} -.options-menu li > input:hover, -.options-menu li textarea:hover { - border-color: #97b9b9 !important; -} -.options-menu li > input:focus, -.options-menu li textarea:focus { - border-color: #4c7373 !important; - outline: none; -} -.options-menu li > input + button:focus, -.options-menu li textarea + button:focus { - border-color: #97b9b9 !important; - background-color: #e6efef !important; - outline: none; -} -.options-menu li > input + button:active, -.options-menu li textarea + button:active { - background-color: #c8dbdb !important; -} -.options-menu li > a:nth-of-type(2) { - border-left: 1px solid #eef3f3 !important; -} -@media screen and (min-width: 768px) { - .options-menu li > div { - border: 1px solid #c8dbdb; - } -} -.options-menu li > div h4 { - color: #4c7373; - background-color: #f9fbfb; - border-color: #c8dbdb; -} -.options-menu li > div > ul:first-child:before, -.options-menu li > div > div:first-child:before { - background-color: #fff; - border-color: #c8dbdb; -} -.options-menu li > div h4:before { - background-color: #f9fbfb; - border-color: #c8dbdb; -} -.options-menu li > div ul { - border-color: #f9fbfb; -} -.options-menu li > div a, -.options-menu li > div a:link, -.options-menu li > div a:visited { - color: #3c5a5a !important; -} -.options-menu li .glyphicon { - color: #507878; -} -.options-menu li .tooltip { - border: 0; -} -.options-menu li.active a, -.options-menu li.active button { - background-color: #eef3f3 !important; - border-color: #649696 !important; -} -.options-menu li.active.filters-tags a, -.options-menu li.active.filters-tags button { - background-color: #97b9b9 !important; - border-color: #f9fbfb !important; - color: #fff !important; -} -.options-menu li.active.filters-tags a span, -.options-menu li.active.filters-tags button span { - color: #fff !important; -} -.options-submenu { - margin-top: -1.618em; - background-color: #f6f8f9; -} -.options-submenu li > a, -.options-submenu li > button { - background-color: #f6f8f9 !important; -} -.options-submenu li > a:active, -.options-submenu li > button:active { - background-color: #4d6673 !important; -} -@media screen and (min-width: 768px) { - .options-submenu li > a:hover, - .options-submenu li > button:hover { - background-color: #eff3f4 !important; - } -} -.options-submenu li > a, -.options-submenu li > button, -.options-submenu li > input, -.options-submenu li textarea { - color: #3b4f59 !important; - border-color: #c6d3d9 !important; -} -.options-submenu li > input:hover, -.options-submenu li textarea:hover { - border-color: #95acb8 !important; -} -.options-submenu li > input:focus, -.options-submenu li textarea:focus { - border-color: #4c6571 !important; - outline: none; -} -.options-submenu li > input + button:focus, -.options-submenu li textarea + button:focus { - border-color: #95acb8 !important; - background-color: #e4eaed !important; - outline: none; -} -.options-submenu li > input + button:active, -.options-submenu li textarea + button:active { - background-color: #c6d3d9 !important; -} -.options-submenu li > a:nth-of-type(2) { - border-left: 1px solid #ebeff1 !important; -} -@media screen and (min-width: 768px) { - .options-submenu li > div { - border: 1px solid #c6d3d9; - } -} -.options-submenu li > div h4 { - color: #4c6571; - background-color: #f6f8f9; - border-color: #c6d3d9; -} -.options-submenu li > div > ul:first-child:before, -.options-submenu li > div > div:first-child:before { - background-color: #fff; - border-color: #c6d3d9; -} -.options-submenu li > div h4:before { - background-color: #f6f8f9; - border-color: #c6d3d9; -} -.options-submenu li > div ul { - border-color: #f6f8f9; -} -.options-submenu li > div a, -.options-submenu li > div a:link, -.options-submenu li > div a:visited { - color: #3b4f59 !important; -} -.options-submenu li .glyphicon { - color: #4f6a77; -} -.options-submenu li .tooltip { - border: 0; -} -.options-submenu li.active a, -.options-submenu li.active button { - background-color: #ebeff1 !important; - border-color: #638494 !important; -} -.options-submenu li.active.filters-tags a, -.options-submenu li.active.filters-tags button { - background-color: #95acb8 !important; - border-color: #f6f8f9 !important; - color: #fff !important; -} -.options-submenu li.active.filters-tags a span, -.options-submenu li.active.filters-tags button span { - color: #fff !important; -} -.options-blurbmenu { - margin: -1.618em 0 1.618em; - border-bottom: 1px solid #d5e3e3; - padding: 0.5em; -} -@media screen and (max-width: 767px) { - .options-blurbmenu { - padding: 1em 0.618em 0 0.618em; - border: 1px solid #d5e3e3; - border-top: none; - } -} -noscript { - display: block; - padding: 20px; - text-align: center; -} -noscript p { - margin-top: 5px; -} -noscript p a { - display: block; - margin-top: 5px; -} -noscript.banner { - background-color: #fff9ca; - border: 1px solid #dfd8c2; -} -#loadingScreen { - z-index: 9999; - width: 100%; - height: 100%; - padding-top: 150px; - text-align: center; -} -#loadingScreen h2 { - margin-top: 60px; -} -#loadingScreen h3 { - margin-top: 20px; -} -@media (max-device-width: 768px) and (orientation: landscape) { - #loadingScreen { - padding-top: 75px; - } -} -@media (max-device-width: 768px) { - #loadingScreen h3 { - padding-left: 10px; - padding-right: 10px; - } - #loadingScreen h2 { - margin-top: 30px; - } -} -#loadingScreen img { - display: block; - margin: 0 auto; - width: 90%; -} -#loadingScreen .loading-logo-icon { - max-width: 87.5px; - margin-bottom: 15px; -} -#loadingScreen .loading-logo-text { - max-width: 282.5px; -} -.loading-spinner { - margin: 100px auto 0; - width: 105px; - padding-left: 5px; - text-align: center; - margin-top: 20px; -} -.loading-spinner > div { - width: 16px; - height: 16px; - background-color: #432476; - -webkit-border-radius: 100%; - border-radius: 100%; - display: inline-block; - -webkit-animation: sk-bouncedelay 1.7s infinite ease-in-out both; - -moz-animation: sk-bouncedelay 1.7s infinite ease-in-out both; - -o-animation: sk-bouncedelay 1.7s infinite ease-in-out both; - -ms-animation: sk-bouncedelay 1.7s infinite ease-in-out both; - animation: sk-bouncedelay 1.7s infinite ease-in-out both; - margin-right: 5px; -} -.loading-spinner .spinner__item1 { - -webkit-animation-delay: -0.6s; - -moz-animation-delay: -0.6s; - -o-animation-delay: -0.6s; - -ms-animation-delay: -0.6s; - animation-delay: -0.6s; -} -.loading-spinner .spinner__item2 { - -webkit-animation-delay: -0.4s; - -moz-animation-delay: -0.4s; - -o-animation-delay: -0.4s; - -ms-animation-delay: -0.4s; - animation-delay: -0.4s; -} -.loading-spinner .spinner__item3 { - -webkit-animation-delay: -0.2s; - -moz-animation-delay: -0.2s; - -o-animation-delay: -0.2s; - -ms-animation-delay: -0.2s; - animation-delay: -0.2s; -} -@-moz-keyframes sk-bouncedelay { - 0%, - 80%, - 100% { - -webkit-transform: scale(0); - -moz-transform: scale(0); - -o-transform: scale(0); - -ms-transform: scale(0); - transform: scale(0); - opacity: 0; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; - filter: alpha(opacity=0); - } - 40% { - -webkit-transform: scale(1); - -moz-transform: scale(1); - -o-transform: scale(1); - -ms-transform: scale(1); - transform: scale(1); - opacity: 1; - -ms-filter: none; - filter: none; - } -} -@-webkit-keyframes sk-bouncedelay { - 0%, - 80%, - 100% { - -webkit-transform: scale(0); - -moz-transform: scale(0); - -o-transform: scale(0); - -ms-transform: scale(0); - transform: scale(0); - opacity: 0; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; - filter: alpha(opacity=0); - } - 40% { - -webkit-transform: scale(1); - -moz-transform: scale(1); - -o-transform: scale(1); - -ms-transform: scale(1); - transform: scale(1); - opacity: 1; - -ms-filter: none; - filter: none; - } -} -@-o-keyframes sk-bouncedelay { - 0%, - 80%, - 100% { - -webkit-transform: scale(0); - -moz-transform: scale(0); - -o-transform: scale(0); - -ms-transform: scale(0); - transform: scale(0); - opacity: 0; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; - filter: alpha(opacity=0); - } - 40% { - -webkit-transform: scale(1); - -moz-transform: scale(1); - -o-transform: scale(1); - -ms-transform: scale(1); - transform: scale(1); - opacity: 1; - -ms-filter: none; - filter: none; - } -} -@keyframes sk-bouncedelay { - 0%, - 80%, - 100% { - -webkit-transform: scale(0); - -moz-transform: scale(0); - -o-transform: scale(0); - -ms-transform: scale(0); - transform: scale(0); - opacity: 0; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; - filter: alpha(opacity=0); - } - 40% { - -webkit-transform: scale(1); - -moz-transform: scale(1); - -o-transform: scale(1); - -ms-transform: scale(1); - transform: scale(1); - opacity: 1; - -ms-filter: none; - filter: none; - } -} -html, -body, -p, -h1, -ul, -li, -table, -tr, -th, -td { - margin: 0; - padding: 0; -} -* { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - font-family: 'Lato', sans-serif; -} -hr { - border-top: 0; - border-bottom: 1px solid #ddd; - border-color: rgba(0, 0, 0, 0.1); -} -/* Customizations to make footer sticky */ -html, -body { - height: 100%; -} -#wrap { - z-index: -1; - padding: 0 15px; - min-height: 100%; - height: auto !important; -} -@media (max-width: 600px) { - #wrap { - margin-top: 0; - padding: 0 4px; - overflow-x: hidden; - } -} -/* Gems --------------------------------------------------- */ -/* Adaptation of GH's social-count for Gems */ -.gem-cost { - border: 1px solid #d4d4d4; - font-size: 11px; - font-weight: bold; - padding: 6px 7px 5px; - line-height: 20px; - margin-left: 8px; - -webkit-border-radius: 3px; - border-radius: 3px; - color: #333; - background-color: #fafafa; - position: relative; -} -.gem-cost::before { - content: ''; - display: block; - width: 0; - height: 0; - border: 6px solid #d4d4d4; - border-color: transparent #d4d4d4 transparent transparent; - position: absolute; - right: 100%; - margin-right: 0; - top: 50%; - margin-top: -6px; -} -.gem-cost::after { - content: ''; - display: block; - width: 0; - height: 0; - border: 6px solid #fafafa; - border-color: transparent #fafafa transparent transparent; - position: absolute; - right: 100%; - margin-right: -1px; - top: 50%; - margin-top: -6px; -} -/* Misc --------------------------------------------------- */ -.new-stuff-modal h2, -.new-stuff-modal h3 { - font-weight: 700; - font-size: 14px; - margin-top: 10px; -} -.modal-fixed-height { - overflow-y: auto; - max-height: 400px; -} -.modal-body figure { - float: left; - padding: 15px; -} -.modal-body figure.herobox { - padding-right: 0px; - padding-left: 0px; -} -.death-modal { - margin: 10px; -} -a { - cursor: pointer; -} -a span.glyphicon { - color: #333; -} -a span.glyphicon.text-danger { - color: #a94442; -} -a.label { - color: #fff; -} -.label .glyphicon { - color: #fff; -} -.muted { - color: #999; -} -.btn { - margin-right: 5px; -} -.panel-heading .btn { - margin-top: -8px; -} -.vertical-align { - vertical-align: middle; -} -.inline-block { - display: inline-block; -} -.btn-group .btn { - margin-right: 0px; -} -.btn-wrap { - white-space: normal; -} -.modal-indented-list { - margin-left: 10px; - padding-left: 10px; -} -.buy-gems .nav-tabs { - margin-top: 0.5em; -} -.buy-gems .gem-wallet { - padding: 0; - cursor: default; -} -.buy-gems .gem-wallet .task-action-btn { - -webkit-border-radius: 0 4px 0 0; - border-radius: 0 4px 0 0; - border: 1px solid rgba(0, 0, 0, 0.2); -} -.badge-info { - background-color: #428bca; -} -.badge-success { - background-color: #47a447; -} -.white, -.white a { - color: #fff !important; -} -.line-through { - text-decoration: line-through; -} -.markdown-preview markdown code { - white-space: inherit; -} -* { - image-rendering: pixelated; -} -.img-rendering-auto, -.img-rendering-auto *, -.habitica-emoji { - image-rendering: auto; -} diff --git a/www/build/static.css b/www/build/static.css deleted file mode 100644 index 51f435fe8..000000000 --- a/www/build/static.css +++ /dev/null @@ -1,377 +0,0 @@ -/*! - * angular-loading-bar v0.6.0 - * https://chieffancypants.github.io/angular-loading-bar - * Copyright (c) 2014 Wes Cruver - * License: MIT - */ - -/* Make clicks pass-through */ -#loading-bar, -#loading-bar-spinner { - pointer-events: none; - -webkit-pointer-events: none; - -webkit-transition: 350ms linear all; - -moz-transition: 350ms linear all; - -o-transition: 350ms linear all; - transition: 350ms linear all; -} - -#loading-bar.ng-enter, -#loading-bar.ng-leave.ng-leave-active, -#loading-bar-spinner.ng-enter, -#loading-bar-spinner.ng-leave.ng-leave-active { - opacity: 0; -} - -#loading-bar.ng-enter.ng-enter-active, -#loading-bar.ng-leave, -#loading-bar-spinner.ng-enter.ng-enter-active, -#loading-bar-spinner.ng-leave { - opacity: 1; -} - -#loading-bar .bar { - -webkit-transition: width 350ms; - -moz-transition: width 350ms; - -o-transition: width 350ms; - transition: width 350ms; - - background: #29d; - position: fixed; - z-index: 10002; - top: 0; - left: 0; - width: 100%; - height: 2px; - border-bottom-right-radius: 1px; - border-top-right-radius: 1px; -} - -/* Fancy blur effect */ -#loading-bar .peg { - position: absolute; - width: 70px; - right: 0; - top: 0; - height: 2px; - opacity: 0.45; - -moz-box-shadow: #29d 1px 0 6px 1px; - -ms-box-shadow: #29d 1px 0 6px 1px; - -webkit-box-shadow: #29d 1px 0 6px 1px; - box-shadow: #29d 1px 0 6px 1px; - -moz-border-radius: 100%; - -webkit-border-radius: 100%; - border-radius: 100%; -} - -#loading-bar-spinner { - display: block; - position: fixed; - z-index: 10002; - top: 10px; - left: 10px; -} - -#loading-bar-spinner .spinner-icon { - width: 14px; - height: 14px; - - border: solid 2px transparent; - border-top-color: #29d; - border-left-color: #29d; - border-radius: 10px; - - -webkit-animation: loading-bar-spinner 400ms linear infinite; - -moz-animation: loading-bar-spinner 400ms linear infinite; - -ms-animation: loading-bar-spinner 400ms linear infinite; - -o-animation: loading-bar-spinner 400ms linear infinite; - animation: loading-bar-spinner 400ms linear infinite; -} - -@-webkit-keyframes loading-bar-spinner { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} -@-moz-keyframes loading-bar-spinner { - 0% { - -moz-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -moz-transform: rotate(360deg); - transform: rotate(360deg); - } -} -@-o-keyframes loading-bar-spinner { - 0% { - -o-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -o-transform: rotate(360deg); - transform: rotate(360deg); - } -} -@-ms-keyframes loading-bar-spinner { - 0% { - -ms-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -ms-transform: rotate(360deg); - transform: rotate(360deg); - } -} -@keyframes loading-bar-spinner { - 0% { - transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); - transform: rotate(360deg); - } -} - -.subscription-features tr td { - vertical-align: middle; - text-align: center; -} -.subscription-features tr th { - max-width: 150px; - font-weight: normal; -} -.subscription-features tr th.feature-name { - text-align: center; - font-weight: bold; -} -.dashed-underline { - border-bottom: 1px dashed #000; - text-decoration: none; - cursor: pointer; -} -.buy-gems .form-inline .form-control { - padding: 6px; -} -p.resubscribe { - margin-top: 20px; -} -.buy-gems a.purchase { - height: 25px; - line-height: 12px; - font-size: 12px; - margin: 5px; -} -p.resubscribe a.purchase { - display: block; -} -.buy-gems button.customize-option { - position: relative; -} -.buy-gems .stack-count { - position: absolute; - bottom: -6px; - right: -9px; -} -.buy-gems .gem-count-popover { - display: block; -} -.buy-gems h3 { - margin-top: 0px; -} -.buy-gems .well { - margin-top: 15px; -} -.noninteractive-button { - padding: 0.5em; - margin-right: 0.5em; -} -.nav, -.pagination, -.carousel, -.panel-title a { - cursor: pointer; -} -.nav-tabs { - margin-bottom: 15px; -} -img { - max-width: 100%; -} -.hint { - border-bottom: 1px dotted #099; - text-decoration: none; - cursor: help; -} -a.hint { - border-bottom: 1px dotted #099; - text-decoration: none; - cursor: pointer; -} -a.hint:hover { - text-decoration: none; -} -.vertical-20 { - vertical-align: 20%; -} -.popover hr { - margin: 10px 0; -} -ul { - list-style-position: inside; -} -li.spaced { - margin: auto auto 0.5em 3em; -} -.group-leave-join .glyphicon-ban-circle { - color: #fff; - margin-right: 5px; -} -@media (max-width: 767px) { - .container-fluid { - padding-right: 5px; - padding-left: 5px; - } - .container-fluid > .row { - margin-left: -5px; - margin-right: -5px; - } - .tasks-lists .row .col-md-3 { - padding-right: 0; - padding-left: 0; - } -} -.flex-column { - display: -webkit-box; - display: -moz-box; - display: -webkit-flex; - display: -ms-flexbox; - display: box; - display: flex; - -webkit-box-orient: vertical; - -moz-box-orient: vertical; - -o-box-orient: vertical; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; -} -.row-margin { - margin: auto auto 1em auto; -} -.reduce-top-margin { - margin-top: -10px; -} -.slight-right-margin { - margin-right: 1em; -} -.footer { - padding-top: 20px; - margin-top: 40px; - padding-bottom: 20px; - border-top: 1px solid #e5e5e5; - background-color: #f5f5f5; -} -body { - margin-top: 60px; -} -#aboutPage iframe { - margin-bottom: 20px; -} -.muted i, -i.muted { - opacity: 0.5; - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=50)'; - filter: alpha(opacity=50); -} -#header-play-button { - margin-right: 15px; -} -#tagline { - margin: 10px 0 20px 0; - font-size: 40px; -} -.marketing { - text-align: center; -} -.static-old-news h2 { - font-weight: 700; - font-size: 16px; - margin-top: 30px; - text-transform: uppercase; -} -.static-old-news h3 { - font-weight: 700; - font-size: 14px; - margin-top: 20px; -} -.static-old-news .pull-right { - margin-left: 5px; -} -#frontpage-play-button { - display: inline; - font-size: 20px; - min-width: 100px; - height: 50px; -} -#about-page img { - -webkit-box-shadow: 0px 0px 10px 5px #888; - box-shadow: 0px 0px 10px 5px #888; - margin: 10px; - max-width: 500px; -} -a.h2.accordion { - display: block; - text-decoration: none; -} -a.h2.accordion:before { - font-family: 'Glyphicons Halflings'; - color: #808080; - content: '\e114'; - margin-right: 0.5em; -} -a.h2.accordion.collapsed:before { - font-family: 'Glyphicons Halflings'; - color: #808080; - content: '\e080'; - margin-right: 0.5em; -} -.merch-block { - border: 1px dotted #553889; - -webkit-border-radius: 6px; - border-radius: 6px; - padding: 15px; - margin-bottom: 20px; -} -.merch-block:hover { - background: #f5f5f5; -} -.merch-block div { - width: 100%; - text-align: center; - padding: 30px 0; -} -.merch-block div a img { - display: inline; - max-width: 350px; -} -.merch-block img { - display: block; - max-width: 200px; -} -.merch-block .btn { - width: 100%; - background-color: #553889; - margin-top: 20px; - color: #fff; -} -.merch-block .btn:hover { - color: #fff; - background-color: #452d6e; - border-color: #342253; -} diff --git a/www/css/main.diary.css b/www/css/main.diary.css deleted file mode 100644 index 4fad2e975..000000000 --- a/www/css/main.diary.css +++ /dev/null @@ -1,525 +0,0 @@ -.no-margin { - margin: 0px !important; - padding: 0px !important; -} - -.item { - border: 0px !important; - border-color: #fff; - padding: 0 10px; /* Changed from 16px. This change was to ensure the correct alignment of the diary card */ -} - -.main { - padding-top: 50px; - min-height: 100%; -} - -.row { - padding: 0px; -} - -.col { - padding: 0px !important; -} - -.small { - font-size: 7px; -} -.bg-color { - background: #71bc98 !important; - color: whitesmoke !important; -} -.summary-color { - background: #1b9e77 !important; - color: whitesmoke !important; -} -.place-color { - background: #7570b3 !important; - color: whitesmoke !important; -} - -/* leaflet */ -/* ----------- iPhone 5 and 5S ----------- */ - -/* Portrait and Landscape */ -@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) { - .angular-leaflet-map { - width: 100%; - } -} - -/* ----------- iPhone 6 ----------- */ - -/* Portrait and Landscape */ -@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) { - .angular-leaflet-map { - width: 100%; - } -} - -/* ----------- iPhone 6+ ----------- */ - -/* Portrait and Landscape */ -@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) { - .angular-leaflet-map { - width: 100%; - } -} - -.list .item.item-accordion { - transition: 0.09s all linear; -} -.list .item.item-accordion.ng-hide { - line-height: 0px; -} -.list .item.item-accordion.ng-hide-add, -.list .item.item-accordion.ng-hide-remove { - display: block !important; -} -a.item-content { - padding: 0 !important; - background-color: transparent !important; -} -.inner-icon { - background-color: white; - width: 6px; - height: 6px; - border-radius: 3px; - margin-left: 3px; - margin-top: 3px; -} -.button { - min-height: 10px; /* Changed from 47px. This allows for the correct height for the label buttons to fit nicely in the diary card. */ - line-height: normal; -} - -.diary-btn { - width: 100%; - padding-inline: 14px; - min-height: 28px; - max-height: 32px; - margin: 2px; - box-sizing: border-box; - border-radius: 50px; - font-size: 13px; - line-height: 1; - font-weight: 500; - box-shadow: - 0 1px 2px rgb(0 0 0 / 0.1), - 0 2px 3px rgb(0 0 0 / 0.12); - background-color: white; - color: var(--accent-dark); - border: 0.12em solid var(--accent); -} - -.diary-btn-yellow, -.diary-btn-yellow:hover, -.diary-btn-yellow:active { - background-color: #ffc108; /* tentatively orange for now */ - color: white; - border: 2px solid rgba(0, 136, 206, 0.2); -} -.diary-btn-blue, -.diary-btn-blue:hover, -.diary-btn-blue:active { - background-color: var(--accent); - color: white; - border: 2px solid rgba(0, 136, 206, 0.2); -} - -/* icon */ -.diary-btn:before { - font-weight: bold; - scale: 1.7; - margin-right: 0.6em; - line-height: 100%; -} - -.input-confirm-label { - text-align: center; - font-size: 14px; - font-weight: bold; - color: var(--accent); -} - -.input-confirm-container { - margin-top: 5px; -} - -.popover { - height: 297px; - width: 230px; -} - -.popover .scroll-content { - height: auto; - margin: 0 !important; - border-radius: 0 0 10px 10px !important; -} - -.big-popover { - height: 40%; - width: 75%; -} - -#diary-item { - padding: 0; - border-width: 0; -} - -.unified-diary-item { - overflow: visible; - padding: 15px 6px; - margin: 0 10px; - border-width: 0; - background-color: transparent; - height: min-content; - /* height: 250px; */ -} - -.diary-card { - background: white; - width: 100%; - height: min-content; - font-size: 13px; - line-height: 1.2; - margin: 0; - border: 1px solid rgb(0 0 0 / 0.2); - box-sizing: border-box; - border-radius: 30px; - position: relative; - box-shadow: - 0 3px 4px rgb(0 0 0 / 5%), - 0 4px 4px rgb(0 0 0 / 8%); - display: flex; - flex-wrap: wrap; - background: linear-gradient(40deg, hsla(200, 30%, 97%, 1) 40%, hsla(0, 0%, 100%, 1)); -} - -.diary-card.place, -.diary-card.untracked { - color: #222; - background: hsl(200 100% 85%); - border: 1px solid hsl(200 100% 10% / 0.2); - margin: 6px auto; - text-align: center; -} - -.diary-card.untracked { - color: #333; - /* untracked time will have a reddish color */ - --accent: hsl(350, 25%, 50%); - --accent-light: hsl(350, 65%, 85%); - --accent-dark: hsl(350, 65%, 30%); - - --grid: hsla(350, 25%, 80%, 0.2); - /* subtle x-grid lines in the background, fading to white */ - background: linear-gradient(15deg, hsla(350, 10%, 92%, 1) 40%, hsla(350, 10%, 100%, 0.5)), - repeating-linear-gradient( - 45deg, - var(--grid), - var(--grid) 0px, - transparent 2px, - transparent 20px - ), - repeating-linear-gradient(-45deg, var(--grid), var(--grid) 0px, #fff 2px, #fff 21px); -} - -.diary-card.untracked .card-title b { - font-size: 13px; - color: #222; - padding: 0 4px; - background-color: var(--accent-light); - border-radius: 5px; -} - -.diary-card.draft, -.diary-details.draft { - /* draft trips will have a muted, greenish color */ - --accent: hsl(150, 15%, 40%); - --accent-light: hsl(150, 25%, 72%); - --accent-dark: hsl(150, 35%, 30%); - - --grid: hsla(150, 25%, 70%, 0.3); - /* subtle grid lines in the background, fading to white */ - background: linear-gradient(30deg, hsla(150, 4%, 94%, 0.9) 50%, hsla(0, 0%, 100%, 0.5)), - repeating-linear-gradient( - 90deg, - var(--grid), - var(--grid) 0px, - transparent 2px, - transparent 20px - ), - repeating-linear-gradient(0deg, var(--grid), var(--grid) 0px, #fff 2px, #fff 21px); -} - -.card-title { - display: flex; - justify-content: center; - font-size: 15px; - padding-inline: 10px; -} - -.card-title b { - margin-left: 10px; - text-overflow: ellipsis; - overflow: hidden; -} - -.card-date { - display: block; - white-space: break-spaces; - text-decoration: underline; -} - -.diary-button { - width: 100%; - height: 30px; - margin: 2px; - border: 2px solid var(--accent); - box-sizing: border-box; - border-radius: 50px; - background-color: #ffffff; - font-style: normal; - font-weight: normal; - font-size: 13px; -} - -.hr-lines { - position: relative; - justify-content: center; - font-weight: bold; - display: flex; - color: #212121; - font-size: 19px; - margin-left: 10px; - margin-right: 10px; - margin-bottom: 5px; - margin-top: 5px; - margin: 10px auto; - text-align: center; -} - -@media screen and (orientation: portrait) { - .hr-lines:before { - content: ' '; - display: block; - height: 2px; - width: 30%; - position: absolute; - top: 50%; - left: 0; - background: var(--accent-light); - } - - .hr-lines:after { - content: ' '; - display: block; - height: 2px; - width: 30%; - position: absolute; - top: 50%; - right: 0; - background: var(--accent-light); - } -} -@media screen and (orientation: landscape) { - .hr-lines:before { - content: ' '; - display: block; - height: 2px; - width: 41%; - position: absolute; - top: 50%; - left: 0; - background: var(--accent-light); - } - - .hr-lines:after { - content: ' '; - display: block; - height: 2px; - width: 41%; - position: absolute; - top: 50%; - right: 0; - background: var(--accent-light); - } -} - -.diary-route { - margin: 5px 0; - height: 85px; -} - -.diary-street { - font-style: normal; - font-weight: normal; - font-size: 13px; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; -} -.diary-street .icon { - color: var(--accent-light); -} -.diary-street + .diary-street .icon { - color: var(--accent); -} -.two-lines { - -webkit-line-clamp: 2; - display: -webkit-box; - -webkit-box-orient: vertical; - white-space: normal; - overflow: hidden; -} -.btn-input-wrap { - white-space: normal; - overflow: hidden; - text-overflow: ellipsis; -} - -.diary-map > div { - overflow: hidden; - border-radius: 30px 0px 0px 30px; - z-index: 0; -} - -.diary-map, -.diary-map * { - pointer-events: none !important; -} - -/* when trip notes are enabled, the map has rounded right corners */ -.enhanced-trip-item .diary-map > div { - border-radius: 30px 0px 30px 0px; -} - -.diary-map-shell { - width: 50%; - max-height: 100%; - display: grid; - grid-template-rows: 1fr; -} - -.enhanced-trip-item .diary-map-shell { - grid-template-rows: 4fr 1fr; -} - -.diary-infos { - float: right; - width: 50%; - padding: 2% 2%; - display: flex; - flex-direction: column; - justify-content: space-between; - height: 50%; -} - -/* to center the enketo/multilabel button */ -.diary-infos:nth-child(2) { - justify-content: center; -} - -.diary-distance-time { - font-style: normal; - font-weight: bold; - font-size: 16px; - white-space: normal; - text-align: center; - margin-left: auto; - margin-right: auto; - height: 40px; -} - -.diary-modes-percents { - position: absolute; - z-index: 1; - left: 50%; - translate: -50%; - background: rgba(255, 255, 255, 0.8); - border-radius: 50px; - display: flex; - gap: 8px; - font-size: 12px; - margin: 5px 0; - padding: 1px 5px; -} - -.diary-modes-percents-text { - color: var(--accent); -} - -/* Purpose selection Override */ -.two-lines .item-content { - overflow: hidden; - text-overflow: ellipsis; - -webkit-line-clamp: 2; - display: -webkit-box; - -webkit-box-orient: vertical; - white-space: normal; - max-height: 65px; -} - -/* Date Picker Override */ -.ionic_datepicker_popup .today { - border: 1px solid var(--accent) !important; -} - -.ionic_datepicker_popup .selected_date { - background-color: var(--accent) !important; -} - -.ionic_datepicker_popup .popup-head { - background-color: var(--accent) !important; -} - -.ionic_datepicker_popup .popup-body .selected_date_full { - background-color: var(--accent) !important; -} - -.ionic_datepicker_popup .popup-body .month_select, -.ionic_datepicker_popup .popup-body .year_select { - border-bottom: 1px solid var(--accent) !important; -} - -.ionic_datepicker_popup .popup-body .month_select:after, -.ionic_datepicker_popup .popup-body .year_select:after { - color: var(--accent) !important; -} - -.ionic_datepicker_popup .popup-body .button-clear { - color: var(--accent) !important; -} - -.ionic_datepicker_popup .popup-buttons button { - background-color: var(--accent) !important; -} -div.labelfilterlist { - margin: 0 !important; -} - -.button.labelfilter { - color: var(--accent); - border-radius: 0px; - border-width: 0; - box-shadow: - 0 1px 2px rgba(0, 0, 0, 0.16), - 0 2px 2px rgba(0, 0, 0, 0.23); - padding: 0 0.1em !important; -} - -.button.labelfilter.on { - background-color: var(--accent); - color: white; -} - -.labelfilter:first-of-type { - border-top-left-radius: 5px; - border-bottom-left-radius: 5px; -} - -.labelfilter:last-of-type { - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; -} diff --git a/www/css/style.css b/www/css/style.css index 2bc7c6fee..7d7707fdc 100644 --- a/www/css/style.css +++ b/www/css/style.css @@ -1,3 +1,9 @@ +@import 'leaflet/dist/leaflet.css'; + +html { + font-family: 'OpenSans', Arial, sans-serif; +} + /* Scoped styles for Enketo */ /* if we don't contain them here, they will leak into the rest of the app */ .enketo-plugin { @@ -19,1549 +25,3 @@ .enketo-plugin .form-header { max-height: 50px; } - -.fill-container { - display: block; - position: relative; -} - -.fill-container > div[class*='css-'] { - height: 100%; - width: 100%; - position: absolute; -} - -/* Without this, the LabelTab does not fill the entire height of the screen. - It has something to do with React Navigation's NavigationContainer. - This should not be necessary once the entire app's routing has been - converted to use React Navigation */ -label-tab > div { - height: 100%; -} - -/* default color pallete (may be overridden by child elements) */ -:root { - --accent: hsl(200, 100%, 40%); - --accent-light: hsl(200, 100%, 75%); - --accent-dark: hsl(200 100% 30%); -} - -.view-container.tab-content { - height: auto !important; - bottom: 50px !important; - top: 0px !important; -} - -.has-tabs { - bottom: 0 !important; -} - -.platform-ios .view-container { - height: calc(100% - (env(safe-area-inset-top) / 2)); -} - -.join-inline-info { - padding-bottom: 5%; - padding-right: 0%; - padding-left: 0%; - font-size: 13px; - width: 100%; - text-align: center; -} - -[ng\:cloak], -[ng-cloak], -.ng-cloak { - display: none !important; -} - -.popup-title { - color: #6e6e6e; -} - -.pull-right { - float: right; -} -.pull-left { - float: left; -} - -.button.button-icon.ion-help:before { - font-size: 25px; -} - -.popup-buttons.row { - height: 40px !important; -} -.popup-buttons.button { - height: 40px !important; -} -.button.ng-binding.button-stable { - height: 40px; -} -.button.ng-binding.button-positive { - background-color: var(--accent); - height: 40px; -} -.button.ng-binding.button-assertive { - background-color: var(--accent); - height: 40px; -} -.button.ng-binding.button-cancel { - background-color: #d02001; - height: 40px; - color: #ffffff; -} -.selected_date_full.ng-binding { - color: var(--accent); -} -.icon.ion-chevron-left { - color: var(--accent); -} -.icon.ion-chevron-right { - color: var(--accent); -} -.date_col.date_selected { - background-color: var(--accent) !important; -} -.date_col:active { - background-color: var(--accent) !important; -} -.customButtomIconSize:before { - font-size: 25px !important; -} - -#dashboard-footprint.card { - background: #fff; - color: var(--accent); - border-radius: 5px; - display: block; - margin: 10px; - margin-top: 55px; - position: relative; - box-shadow: - 0 2px 3px rgba(0, 0, 0, 0.03), - 0 2px 3px rgba(0, 0, 0, 0.05); - /*background: rgba(40,218,183,1); - background: -moz-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(40,218,183,1)), color-stop(30%, rgba(99,230,199,1)), color-stop(51%, rgba(94,235,212,1)), color-stop(69%, rgba(87,235,223,1)), color-stop(85%, rgba(99,237,226,1)), color-stop(100%, rgba(127,250,250,1))); - background: -webkit-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: -o-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: -ms-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: linear-gradient(135deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28dab7', endColorstr='#7ffafa', GradientType=1 );*/ - text-align: center; - transition: height 0.3s ease-out; - overflow: hidden; -} - -.small-footprint-card { - height: 140px !important; -} - -.expanded-footprint-card { - height: 460px !important; -} - -#dashboard-calorie.card { - background: #fff; - color: var(--accent-light); - border-radius: 5px; - display: block; - margin: 10px; - position: relative; - box-shadow: - 0 2px 3px rgba(0, 0, 0, 0.03), - 0 2px 3px rgba(0, 0, 0, 0.05); - /*background: rgba(40,218,183,1); - background: -moz-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(40,218,183,1)), color-stop(30%, rgba(99,230,199,1)), color-stop(51%, rgba(94,235,212,1)), color-stop(69%, rgba(87,235,223,1)), color-stop(85%, rgba(99,237,226,1)), color-stop(100%, rgba(127,250,250,1))); - background: -webkit-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: -o-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: -ms-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: linear-gradient(135deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28dab7', endColorstr='#7ffafa', GradientType=1 );*/ - text-align: center; - transition: height 0.3s ease-out; - overflow: hidden; -} - -.small-calorie-card { - height: 140px !important; -} - -.expanded-calorie-card { - height: 370px !important; -} - -/*#dashboard.card.inactive:after{ - content: ""; - position: absolute; - bottom:0px; - left:0; - height: 200px; - display: block; -} - -#dashboard.card.active{ - max-height: 500px; - transition: max-height 0.3s ease-out; -}*/ - -#dashboard-bottom.card { - background-color: #fff; - color: var(--accent); - border-radius: 5px; - display: block; - /* height: 140px; */ - margin: 10px; - margin-top: 0px; - position: relative; - margin-bottom: 5px !important; - box-shadow: - 0 2px 3px rgba(0, 0, 0, 0.03), - 0 2px 3px rgba(0, 0, 0, 0.05); - /*background: rgba(40,218,183,1); - background: -moz-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(40,218,183,1)), color-stop(30%, rgba(99,230,199,1)), color-stop(51%, rgba(94,235,212,1)), color-stop(69%, rgba(87,235,223,1)), color-stop(85%, rgba(99,237,226,1)), color-stop(100%, rgba(127,250,250,1))); - background: -webkit-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: -o-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: -ms-linear-gradient(-45deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - background: linear-gradient(135deg, rgba(40,218,183,1) 0%, rgba(99,230,199,1) 30%, rgba(94,235,212,1) 51%, rgba(87,235,223,1) 69%, rgba(99,237,226,1) 85%, rgba(127,250,250,1) 100%); - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28dab7', endColorstr='#7ffafa', GradientType=1 );*/ - text-align: center; -} - -#arrow-color { - color: var(--accent); - font-size: 25px !important; -} - -h4.dashboard-headers { - color: #fff; - background: var(--accent); - padding-top: 5px; - padding-bottom: 5px; - margin-top: -1px; - font-weight: 700; - font-size: 20px; - margin-bottom: 0px !important; -} - -.user-carbon-no-percentage { - padding-top: 30px; - position: absolute; - width: 100%; -} - -.user-carbon-percentage { - padding-top: 10px; - position: absolute; - width: 100%; -} - -.user-carbon { - font-weight: 700; - color: var(--accent); - font-size: 16px; -} - -.user-calorie-no-percentage { - padding-top: 30px; - position: absolute; - width: 100%; -} - -.user-calorie-percentage { - padding-top: 10px; - position: absolute; - width: 100%; -} - -.user-calorie { - font-weight: 700; - color: var(--accent); - font-size: 18px; -} - -.percentage-change { - font-weight: 700; - color: var(--accent); - margin-bottom: 20px; -} - -.calorie-change { - padding-top: 5px; - font-weight: 700; - color: var(--accent); -} - -.dashboard-list { - padding-top: 10px; - font-weight: 700; - color: #fff; - border-radius: 5px !important; - height: 40px !important; - margin-bottom: 3px !important; - margin-top: 3px !important; - width: 90%; - background-color: var(--accent) !important; - box-shadow: 0 0px 0px rgba(0, 0, 0, 0.3) !important; -} - -.circle { - width: 60px; - height: 60px; - background: #fff; - box-shadow: - 0 2px 3px rgba(0, 0, 0, 0.03), - 0 2px 3px rgba(0, 0, 0, 0.05); - -moz-border-radius: 50px; - -webkit-border-radius: 50px; - border-radius: 50px; - float: left; - position: absolute; - margin-left: 15px; - margin-top: 10px; -} - -#circle-food.circle { - position: relative !important; - box-shadow: - 0 2px 6px rgba(0, 0, 0, 0.1), - 0 2px 3px rgba(0, 0, 0, 0.05) !important; - margin: auto; - float: none; - display: inline-block; - margin-right: 20px; - margin-top: 20px; -} - -#circle-food.circle:active { - background-color: #eeeeee; - box-shadow: - 0 0px 0px rgba(0, 0, 0, 0.1), - 0 0px 0px rgba(0, 0, 0, 0.05) !important; -} - -#green-leaf { - color: var(--accent-light); - font-size: 45px; - padding-top: 5px; -} - -#food { - width: 45px; - padding-top: 7px; -} - -#foodB { - width: 45px; - padding-top: 7px; - padding-right: 4px; -} - -.arrow-position { - position: absolute; - bottom: 5px; - right: 10px; - color: #b2b2b2; - font-size: 20px; -} - -/* #modes.slider{ - height:245px !important; -} */ - -#modes.slider-slide { - padding-top: 0 !important; - background-color: transparent; -} - -/*.ion-view-background-dashboard{ - background: rgba(135,245,245,1); - background: -moz-linear-gradient(top, rgba(135,245,245,1) 0%, rgba(120,245,235,1) 15%, rgba(108,245,234,1) 31%, rgba(140,250,232,1) 49%, rgba(118,247,219,1) 70%, rgba(95,250,216,1) 100%); - background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(135,245,245,1)), color-stop(15%, rgba(120,245,235,1)), color-stop(31%, rgba(108,245,234,1)), color-stop(49%, rgba(140,250,232,1)), color-stop(70%, rgba(118,247,219,1)), color-stop(100%, rgba(95,250,216,1))); - background: -webkit-linear-gradient(top, rgba(135,245,245,1) 0%, rgba(120,245,235,1) 15%, rgba(108,245,234,1) 31%, rgba(140,250,232,1) 49%, rgba(118,247,219,1) 70%, rgba(95,250,216,1) 100%); - background: -o-linear-gradient(top, rgba(135,245,245,1) 0%, rgba(120,245,235,1) 15%, rgba(108,245,234,1) 31%, rgba(140,250,232,1) 49%, rgba(118,247,219,1) 70%, rgba(95,250,216,1) 100%); - background: -ms-linear-gradient(top, rgba(135,245,245,1) 0%, rgba(120,245,235,1) 15%, rgba(108,245,234,1) 31%, rgba(140,250,232,1) 49%, rgba(118,247,219,1) 70%, rgba(95,250,216,1) 100%); - background: linear-gradient(to bottom, rgba(135,245,245,1) 0%, rgba(120,245,235,1) 15%, rgba(108,245,234,1) 31%, rgba(140,250,232,1) 49%, rgba(118,247,219,1) 70%, rgba(95,250,216,1) 100%); - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#87f5f5', endColorstr='#5ffad8', GradientType=0 ); -}*/ - -.bar.bar-header.no-bgColor, -.bar.bar-footer.no-bgColor { - border: 0px !important; - border-color: transparent !important; - border-top: transparent !important; - border-bottom: transparent !important; - background-image: none !important; -} - -.list .item.item-accordion { - line-height: 38px; - padding-top: 0; - padding-bottom: 0; - transition: 0.09s all linear; -} -.list .item.item-accordion.ng-hide { - line-height: 0px; -} -.list .item.item-accordion.ng-hide-add, -.list .item.item-accordion.ng-hide-remove { - display: block !important; -} -.input-label { - font-size: 16px; -} -.list { - padding-top: 0.5px !important; -} -.card { - background: #fff; - border-radius: 2px; - display: inline-block; - margin: 1rem; - position: relative; -} - -.load-more-btn { - background: white; - border-radius: 50px; - color: #222; - border: 1px solid rgb(0 0 0 / 0.2); - padding: 3px 20px; - margin: auto; - display: block; -} - -/* Light theme */ -.control-icon-button { - text-align: center; - max-height: 56px; - background-color: #6c757d; - color: #fff; - padding-top: 16px; - width: 64px; - font-size: 20px; -} - -.diary-button { - text-align: center; - float: right; - height: 48px; - background-color: #a0a0a0; - /* background-color: #D6C780; */ - color: #fff; - padding-top: 16px; - width: 48px; /* Changed to fit the diary card in full view */ -} - -.control-version-number { - text-align: center; - float: right; - height: 100%; - color: rgb(114, 114, 114); - padding-top: 16px; - width: 64px; - - font-size: 20px; -} - -#switch-user.control-icon-button { - background-color: #dc3545 !important; -} - -.gray-icon.control-icon-button { - background-color: #cccccc !important; -} - -.toggle-on-ourcolor-bg { - border-color: var(--accent) !important; - background-color: var(--accent) !important; -} - -.control-info { - padding: 2px 4px !important; -} - -.tab-nav { - background-color: #f5f5f5 !important; - background-size: 0 !important; - box-shadow: - 0 1px 2px rgba(0, 0, 0, 0.16), - 0 3px 6px rgba(0, 0, 0, 0.23); -} -.tab-item.tab-item-active, -.tab-item.active, -.tab-item.activated { - color: var(--accent); -} -.platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) > * { - margin-top: 15px; -} -.platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) { - height: 58px; -} -ion-header-bar { - background-color: #f5f5f5 !important; - box-shadow: - 0 1px 2px rgb(0 0 0 / 8%), - 0 3px 6px rgb(0 0 0 / 12%); -} -ion-nav-view { - z-index: 10; -} -/* this controls bacground color of dashboard and profile - label screen now styled in react*/ -.pane { - background-color: #edf1f6 !important; -} -.tabs-custom > .tabs, -.tabs.tabs-custom { - border-color: #5d3a23; - background-color: #5d3a23; - background-image: linear-gradient(0deg, #0c60ee, #0c60ee 70%, transparent 70%); - color: #999; -} -.tabs-custom > .tabs .tab-item .badge, -.tabs.tabs-custom .tab-item .badge { - background-color: #999; - color: #387ef5; -} - -.tabs-striped.tabs-custom .tabs { - background-color: #5d3a23; -} - -.tabs-striped.tabs-custom .tab-item { - color: rgba(255, 255, 255, 0.7); - opacity: 1; -} -.tabs-striped.tabs-custom .tab-item .badge { - opacity: 0.7; -} -.tabs-striped.tabs-custom .tab-item.tab-item-active, -.tabs-striped.tabs-custom .tab-item.active, -.tabs-striped.tabs-positive .tab-item.activated { - margin-top: -2px; - color: #fff; - border-style: solid; - border-width: 2px 0 0 0; - border-color: #fff; -} -.title.title-center.header-item { - color: #303030; -} -.title.title-center.header-item:empty { - display: none; -} -.date-picker-button { - color: var(--accent) !important; - padding: 0 15px; - border-color: transparent; - margin-top: 4px; - /* box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); */ - border-style: solid; - border-color: white; - border-width: 0px; - border-radius: 5px; -} - -.button.date-picker-button { - font-size: 15px; -} - -.date-picker-arrow { - color: #303030 !important; - margin-top: 4px; - background-color: transparent !important; -} -/* Light theme ends */ - -.earlier-later-expand { - color: #303030; - margin: 16px 16px 0 6px; - font-size: 0.8em; - opacity: 0.7; -} -.list-location { - color: #303030; - background-color: transparent; - font-size: 0.8em; - padding-top: 5px; - padding-bottom: 5px; - padding-left: 30px; - margin-top: 0 !important; - margin-bottom: 0 !important; -} -p.list-text { - color: #303030; -} -a.list-text { - color: #303030; -} -.tab-item .icon { - margin: 3px auto 1px auto; - font-size: 25px; - height: 25px; -} - -.card-1 { - box-shadow: - 0 1px 3px rgba(0, 0, 0, 0.12), - 0 1px 2px rgba(0, 0, 0, 0.24); - transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); -} - -.card-1:hover { - box-shadow: - 0 14px 28px rgba(0, 0, 0, 0.25), - 0 10px 10px rgba(0, 0, 0, 0.22); -} - -.card-2 { - box-shadow: - 0 3px 6px rgba(0, 0, 0, 0.16), - 0 3px 6px rgba(0, 0, 0, 0.23); -} - -.card-3 { - box-shadow: - 0 10px 20px rgba(0, 0, 0, 0.19), - 0 6px 6px rgba(0, 0, 0, 0.23); -} - -.card-4 { - box-shadow: - 0 14px 28px rgba(0, 0, 0, 0.25), - 0 10px 10px rgba(0, 0, 0, 0.22); -} - -.card-5 { - box-shadow: - 0 19px 38px rgba(0, 0, 0, 0.3), - 0 15px 12px rgba(0, 0, 0, 0.22); -} - -button.button.ng-binding i.icon.ion-edit { - font-size: 12px; -} -button.button.back-button.buttons.button-clear.header-item { - color: #303030; - opacity: 0.7; -} -.nav-bar-title { - color: #303030; - opacity: 0.7; -} -/* Profile tab */ -.control-list-item { - background: #fff; - display: flex; - min-height: 50px; - margin-top: 0.5px; - justify-content: space-between; -} -.control-list-text { - padding-inline: 15px; - margin-block: auto; - max-width: calc(100% - 64px); - overflow: hidden; - display: -webkit-box; - line-height: 1.1; - -webkit-line-clamp: 5; /* number of lines to show */ - line-clamp: 5; - -webkit-box-orient: vertical; - text-overflow: ellipsis; -} -.control-list-toggle { - float: right; - margin-top: 5px; - margin-right: 2px; -} -/* Diary list tab */ - -.lightrail { - color: blue; -} -.dev-zone-input { - padding: 7px 0; - font-size: 16px; - line-height: 22px; - height: 36px; -} -.dev-zone-title { - padding: 18px 16px; -} -.dev-zone-button { - position: absolute; - right: 16px; - top: 16px; -} -.list-card { - margin: 16px 0; - box-shadow: - 0 3px 6px rgba(0, 0, 0, 0.16), - 0 3px 6px rgba(0, 0, 0, 0.23); - border: 1px solid #ccc; -} -.bg-light { - background-color: #ffffff; -} -.bg-unprocessed { - background-color: #9eb2aa; -} -.list-card-sm { - width: 95%; -} -.list-card-md { - width: 95%; -} -.list-card-lg { - width: 95%; -} -.list-card .row { - padding-left: 5px; - padding-right: 5px; -} -.list-col-left-margin { - text-align: center; - padding: 0.7em 0.8em 0.4em 0.8em; - border-right-width: 0.5px; - border-right-color: #ccc; - border-right-style: solid; - border-bottom-color: #ccc; - border-bottom-width: 0.5px; - border-bottom-style: solid; -} -.list-col-left { - text-align: center; - padding: 1.1em 0.8em 0.6em 0.8em; - border-right-width: 0.5px; - border-right-color: #ccc; - border-right-style: solid; - border-bottom-color: #ccc; - border-bottom-width: 0.5px; - border-bottom-style: solid; -} -.list-col-right { - text-align: center; - padding: 0.25em 0.8em; - border-bottom-color: #ccc; - border-bottom-width: 0.5px; - border-bottom-style: solid; -} - -timestamp-badge { - position: absolute; - bottom: 0; - left: 50%; - transform: translate(-50%, 50%); - z-index: 999; -} - -timestamp-badge[light-bg] { - top: 0; - bottom: unset; - transform: translate(-50%, -50%); -} - -.start-end-addresses-container { - display: inline-block; - width: calc(100% - 25px); -} -.diary-more-container i { - font-size: 32px; -} -.diary-checkmark-container i { - font-size: 24px; - padding: 3px; -} - -.diary-checkmark-container i.can-verify { - color: #30a64a; - background-color: #ddd; - border-radius: 5px; -} -.diary-checkmark-container i.cannot-verify { - color: #e6b8b8; -} -.diary-checkmark-container i.already-verified { - color: #b8e6c2; -} -/* .diary-checkmark-container i.already-verified, .diary-checkmark-container i.cannot-verify { - color: #BFBFBF; -} */ - -.center-vert { - display: flex; - align-items: center; -} - -.center-horiz { - display: flex; - justify-content: center; -} - -.side-menu-item { - padding: 5% 10%; -} -.menu-item:active { - background-color: #dddfe2; -} - -.side-menu-item { - padding: 5% 10%; -} - -.metric-datepicker { - /*height: 33px;*/ - display: flex; /* establish flex container */ - /*flex-direction: column; make main axis vertical */ - justify-content: center; /* center items vertically, in this case */ - align-items: center; /* center items horizontally, in this case */ - border-radius: 5px; - background-color: white; - box-shadow: - 0 1px 1px rgba(0, 0, 0, 0.03), - 0 1px 1px rgba(0, 0, 0, 0.05); - color: var(--accent); - height: 35px; -} -.metric-title { - height: 35px; - display: flex; /* establish flex container */ - flex-direction: column; /* make main axis vertical */ - justify-content: center; /* center items vertically, in this case */ - align-items: left; /* center items horizontally, in this case */ - padding-left: 10px; -} - -.metric-datepicker-container-upper { - width: 100%; - float: left; -} -.metric-weekday-container-upper { - width: 28%; - float: right; - border-radius: 5px; - background-color: white; - box-shadow: - 0 1px 1px rgba(0, 0, 0, 0.03), - 0 1px 1px rgba(0, 0, 0, 0.05); - color: var(--accent); - height: 35px; -} -.metric-weekday-container-lower { - width: 28%; - float: right; - top: 40px; - border-radius: 5px; - background-color: white; - box-shadow: - 0 1px 1px rgba(0, 0, 0, 0.03), - 0 1px 1px rgba(0, 0, 0, 0.05); - color: var(--accent); - height: 35px; -} -.metric-datepicker-container-lower { - top: 40px; - width: 100%; - float: left; -} -.metric-left { - width: 25%; - float: left; -} -.metric-right { - text-align: center; - width: 75%; - float: right; -} -.metric-change-data-button { - margin: auto; - width: 120px; - border-radius: 20px; - background-color: white; - box-shadow: - 0 2px 3px rgba(0, 0, 0, 0.03), - 0 2px 3px rgba(0, 0, 0, 0.05); - color: var(--accent); - font-weight: 700; - height: 30px; -} -.metric-change-data-button:active { - background-color: var(--accent); - color: white; - box-shadow: none; -} -.metric-metric-button { - float: left; - width: 49%; - border-radius: 5px; - background-color: white; - box-shadow: - 0 1px 2px rgba(0, 0, 0, 0.03), - 0 1px 2px rgba(0, 0, 0, 0.05); - color: var(--accent); - height: 35px; -} -.heatmap-mode-button { - float: left; - width: 33%; - border-radius: 5px; - background-color: white; - box-shadow: - 0 1px 2px rgba(0, 0, 0, 0.03), - 0 1px 2px rgba(0, 0, 0, 0.05); - color: var(--accent); - height: 35px; -} - -.current-mode-button { - border: none; - background-color: #2d9cdb; - display: inline-block; - cursor: pointer; - color: #ffffff; - opacity: 0.4; - font-size: 28px; - width: 100%; - text-decoration: none; - height: 80px; - z-index: 1; - position: relative; - top: 65px; -} - -#current-start-time { - z-index: 1; - position: absolute; - top: 5%; - display: block; - width: 40%; - height: 25px; - background-color: #f5f5f5; - border-radius: 10px; - color: #6a6a6a; - left: 30%; - box-shadow: - 0 1px 2px rgba(0, 0, 0, 0.05), - 0 1px 2px rgba(0, 0, 0, 0.05); -} - -#current-start-time-text { - font-size: 15px; - text-align: center; - margin-top: 2px; -} - -#speed-and-direction { - z-index: 1; - position: absolute; - top: 2%; - right: 2%; - text-align: center; -} - -#current-speed { - background-color: #8f8f8f; - box-shadow: - 0 2px 4px rgba(0, 0, 0, 0.2), - 0 2px 4px rgba(0, 0, 0, 0.05); - opacity: 0.9; - color: white; - width: 60px; - text-align: center; - height: 60px; - border-style: solid; - border-radius: 50%; - border-color: #6a6a6a; - border-width: 4px; -} - -#speed-value { - font-size: 25px; - font-weight: 600; - margin-top: 10px; -} - -#speed-unit { - font-size: 12px; - margin-top: -3px; -} - -#current-direction-text { - color: #6a6a6a; - font-size: 20px; - font-weight: 600; - margin-top: 5px; - opacity: 0.9; -} - -#slider_background { - z-index: 2; - position: absolute; - left: -4px; -} - -.report-button { - border-radius: 10px; - border: none; - background-color: #e34949; - color: #ffffff; - font-size: 20px; - width: 60%; - height: 35px; - z-index: 1; - box-shadow: - 0 4px 8px rgba(0, 0, 0, 0.3), - 0 2px 4px rgba(0, 0, 0, 0.05); - position: absolute; - display: block; - bottom: 40px; - left: 20%; -} - -.report-button:active { - box-shadow: - 0 1px 1px rgba(0, 0, 0, 0.1), - 0 1px 1px rgba(0, 0, 0, 0.05) !important; -} - -.metric-freq-button { - float: right; - width: 100%; - border-radius: 5px; - background-color: white; - box-shadow: - 0 1px 2px rgba(0, 0, 0, 0.03), - 0 1px 2px rgba(0, 0, 0, 0.05); - color: var(--accent); - height: 35px; -} -.metric-get-button { - width: 60px; - border-radius: 5px; - color: white; - background-color: var(--accent); - height: 35px; -} -.metric-get-button-inactive { - width: 60px; - border-radius: 5px; - color: white; - background-color: var(--accent); - opacity: 0.7; - height: 35px; -} -.hvcenter { - display: flex; /* establish flex container */ - flex-direction: column; /* make main axis vertical */ - justify-content: center; /* center items vertically, in this case */ - align-items: center; /* center items horizontally, in this case */ -} -.metric-basic { - width: 100%; - border-radius: 5px; - background-color: white; - box-shadow: - 0 1px 2px rgba(0, 0, 0, 0.03), - 0 1px 2px rgba(0, 0, 0, 0.05); - color: var(--accent); - height: 35px; -} -.metric-half { - float: left; - width: 100%; - border-radius: 5px; - background-color: white; - box-shadow: - 0 2px 3px rgba(0, 0, 0, 0.03), - 0 2px 3px rgba(0, 0, 0, 0.05); - color: #01d0a7; - height: 30px; - overflow: hidden; - position: relative; -} - -/*Change later*/ -.metric-second-half { - width: 90%; - margin: auto; -} -.metric-current-title { - color: #333; - position: absolute; - width: 28%; - height: 35px; -} -.metric-current-title-nofilter { - position: absolute; - color: white; - background-color: var(--accent); - text-align: center; - width: 100%; - height: 35px; -} -.metric-range-button { - border-left-color: #ccc; - border-left-style: solid; - border-left-width: 1px; - position: absolute; - border-right-color: #ccc; - border-right-style: solid; - border-right-width: 1px; - width: 25%; - left: 50%; - height: 35px; -} -.metric-range-button-active { - border-left-color: #ccc; - border-left-style: solid; - border-left-width: 1px; - position: absolute; - border-right-color: #ccc; - border-right-style: solid; - border-right-width: 1px; - width: 25%; - left: 50%; - height: 35px; - background-color: var(--accent); - color: white; -} -.metric-filter-button { - position: absolute; - width: 25%; - left: 75%; - height: 35px; - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; -} -.metric-filter-button-active { - position: absolute; - width: 25%; - left: 75%; - height: 35px; - background-color: var(--accent); - color: white; - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; -} -.metric-chart-button { - width: 50%; - position: absolute; - left: 50%; - height: 30px; - font-weight: 700; - overflow: hidden; - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; - color: var(--accent); -} -.metric-chart-button-active { - width: 50%; - position: absolute; - left: 50%; - height: 30px; - background-color: var(--accent); - color: white; - font-weight: 700; - overflow: hidden; - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; -} -.metric-summary-button { - width: 50%; - position: absolute; - border-right-color: #ccc; - border-right-style: solid; - border-right-width: 1px; - height: 30px; - font-weight: 700; - overflow: hidden; - border-top-left-radius: 5px; - border-bottom-left-radius: 5px; -} -.metric-summary-button-active { - width: 50%; - position: absolute; - border-right-color: #ccc; - border-right-style: solid; - border-right-width: 1px; - height: 30px; - background-color: var(--accent); - color: white; - font-weight: 700; - overflow: hidden; - border-top-left-radius: 5px; - border-bottom-left-radius: 5px; -} -.distance-button { - width: 25%; - font-size: 12px; - font-weight: 700; - overflow: hidden; - border-top-left-radius: 5px; - border-bottom-left-radius: 5px; - float: left; - height: 30px; -} -.speed-button { - width: 25%; - font-size: 12px; - font-weight: 700; - overflow: hidden; - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; - float: left; - height: 30px; -} -.trips-button { - width: 25%; - font-size: 12px; - font-weight: 700; - overflow: hidden; - float: left; - height: 30px; -} -.duration-button { - width: 25%; - font-size: 12px; - font-weight: 700; - overflow: hidden; - float: left; - height: 30px; -} -.distance-button-active { - width: 25%; - font-size: 12px; - font-weight: 700; - background-color: var(--accent); - color: white; - overflow: hidden; - border-top-left-radius: 5px; - border-bottom-left-radius: 5px; - float: left; - height: 30px; -} -.speed-button-active { - width: 25%; - font-size: 12px; - font-weight: 700; - overflow: hidden; - background-color: var(--accent); - color: white; - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; - float: left; - height: 30px; -} -.trips-button-active { - width: 25%; - font-size: 12px; - font-weight: 700; - background-color: var(--accent); - color: white; - overflow: hidden; - float: left; - height: 30px; -} -.duration-button-active { - width: 25%; - font-size: 12px; - font-weight: 700; - background-color: var(--accent); - color: white; - overflow: hidden; - float: left; - height: 30px; -} -.metric-toggle-button { - width: 33%; - position: absolute; - left: 66%; - height: 33px; -} -.metric-me-toggle { -} -.metric-icon { - color: #ccc; - font-size: 30px; -} -.metric-filter-title { - position: absolute; - width: 15%; - height: 35px; - display: flex; /* establish flex container */ - flex-direction: column; /* make main axis vertical */ - justify-content: center; /* center items vertically, in this case */ - align-items: left; /* center items horizontally, in this case */ - padding-left: 10px; -} -.metric-filter-year { - position: absolute; - width: 19%; - left: 21%; - height: 35px; - border-width: 0; - box-shadow: - 0 1px 1px rgba(0, 0, 0, 0.03), - 0 1px 1px rgba(0, 0, 0, 0.05) !important; -} -.metric-filter-month { - position: absolute; - width: 13%; - left: 42%; - height: 35px; - border-width: 0; - box-shadow: - 0 1px 1px rgba(0, 0, 0, 0.03), - 0 1px 1px rgba(0, 0, 0, 0.05) !important; -} -.metric-filter-day { - position: absolute; - width: 13%; - left: 57%; - height: 35px; - border-width: 0; - box-shadow: - 0 1px 1px rgba(0, 0, 0, 0.03), - 0 1px 1px rgba(0, 0, 0, 0.05) !important; -} -.metric-summary-title { - padding: 2px; - color: var(--accent); - font-weight: 700; -} -.metric-summary-content { - color: var(--accent); - font-size: 12px; - font-weight: 600; -} -.metric-summary-left { - float: left; - margin-top: 10px; - width: 40px !important; - margin-left: 10px; -} -.metric-summary-right { - margin-left: 40px; -} -.metric-summary-separator { - border-bottom-color: #ccc; - border-bottom-style: solid; - border-bottom-width: 1px; - color: #ccc; - margin-bottom: 10px; -} - -.metric-summary-option-button { - float: right; - color: var(--accent); - background-color: white; - height: 20px; - border-radius: 5px; - width: 80px; - margin-right: 5px; - margin-top: -28px; - box-shadow: - 0 1px 2px rgba(0, 0, 0, 0.1), - 0 1px 1px rgba(0, 0, 0, 0.05); -} -.full-toggle-container { - height: 35px; -} -.full-toggle-left { - width: 50%; - float: left; - height: 35px; - - border-top-left-radius: 5px; - border-bottom-left-radius: 5px; - - background-color: white; - color: var(--accent); - border-right-style: solid; - border-right-width: 1px; - border-right-color: #ccc; -} -.full-toggle-left-active { - width: 50%; - float: left; - height: 35px; - - border-top-left-radius: 5px; - border-bottom-left-radius: 5px; - - background-color: var(--accent); - color: white; - border-right-style: solid; - border-right-width: 1px; - border-right-color: #ccc; -} -.full-toggle-right { - width: 50%; - float: right; - height: 35px; - - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; - - background-color: white; - color: var(--accent); -} -.full-toggle-right-active { - width: 50%; - float: right; - height: 35px; - - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; - - background-color: var(--accent); - color: white; -} -.unit-toggle-container { - height: 35px; -} -.unit-toggle-left { - width: 50%; - float: left; - height: 35px; - border-top-left-radius: 5px; - border-bottom-left-radius: 5px; - background-color: white; - color: var(--accent); - border-right-style: solid; - border-right-width: 1px; - border-right-color: #ccc; -} -.unit-toggle-left-active { - width: 50%; - float: left; - height: 35px; - border-top-left-radius: 5px; - border-bottom-left-radius: 5px; - background-color: var(--accent); - color: white; - border-right-style: solid; - border-right-width: 1px; - border-right-color: #ccc; -} -.unit-toggle-right { - width: 50%; - float: right; - height: 35px; - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; - background-color: white; - color: var(--accent); -} -.unit-toggle-right-active { - width: 50%; - float: right; - height: 35px; - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; - background-color: var(--accent); - color: white; -} -.userdata-title { - color: #ccc; -} -.carbon-goal-chart { - height: 5px; - background-color: var(--accent); - opacity: 0.6; - border-radius: 2px; - width: 100%; -} -#no-border.item { - border-width: 0 !important; -} -#goal-signup-field { - width: 50%; - margin-left: auto; - margin-right: auto; - margin-bottom: 10px; -} -.item.item-input.item-select { - border-width: 1px !important; -} -.control-icon-button:active { - opacity: 0.7; -} -.full-toggle-left:active { - opacity: 0.7; -} -.full-toggle-right:active { - opacity: 0.7; -} -#iframe { - /*width: 375px !important;*/ - height: 100%; - -webkit-overflow-scrolling: touch !important; - overflow: scroll !important; -} - -.buttons { - margin-left: 10px; -} - -.filter-select-wrapper, -.date-input-wrapper { - display: flex; - margin: 0 2px; - position: relative; - pointer-events: none; -} - -.buttons input, -.buttons select { - text-align: center; - border: 1px solid rgb(20 20 20 / 0.2); - border-radius: 10px; - font-size: 13px; - color: #222; - pointer-events: all; - min-width: 11ch; -} - -.buttons input[type='date'] { - color: transparent; -} - -.date-input-wrapper:before { - content: attr(data-text) !important; - position: absolute; - top: 50%; - translate: 0 -50%; - left: 8px; - font-size: 12px; - line-height: 1.3; -} - -.date-input-wrapper:first-line { - text-decoration: underline; -} - -.date-input-wrapper:after { - content: ''; - position: absolute; - top: 50%; - translate: 0 -50%; - right: 8px; - font-size: 14px; - font-family: 'Ionicons'; -} - -.date-input-divider { - position: absolute; - color: black; - border-top: 1px solid #444; - top: 50%; - margin: 0; - width: 3ch; - left: calc(8px + 2.5ch); -} diff --git a/www/index.html b/www/index.html index 44fcb5bbf..696343b7a 100644 --- a/www/index.html +++ b/www/index.html @@ -3,16 +3,13 @@ - + - - - - -
+ +
- \ No newline at end of file + diff --git a/www/index.js b/www/index.js index 14ed7fd23..f81e710fc 100644 --- a/www/index.js +++ b/www/index.js @@ -1,14 +1,50 @@ -import './manual_lib/ionic/css/ionic.css'; +import React from 'react'; +import { createRoot } from 'react-dom/client'; +import { Provider as PaperProvider } from 'react-native-paper'; + import './css/style.css'; -import './css/main.diary.css'; -import 'leaflet/dist/leaflet.css'; - -import './js/ngApp.js'; -import './js/splash/referral.js'; -import './js/splash/localnotify.js'; -import './js/controllers.js'; -import './js/services.js'; -import './js/i18n-utils.js'; -import './js/main.js'; -import './js/diary.js'; -import './js/plugin/logger.ts'; +import 'chartjs-adapter-luxon'; + +import initializedI18next from './js/i18nextInit'; +window.i18next = initializedI18next; + +import App from './js/App'; +import { getTheme } from './js/appTheme'; +import { SafeAreaView } from 'react-native-safe-area-context'; +import { logDebug } from './js/plugin/logger'; + +export const deviceReady = new Promise((resolve) => { + document.addEventListener('deviceready', resolve); +}); + +/* ensure that plugin events are not delivered before Cordova is ready: + https://github.com/katzer/cordova-plugin-local-notifications#launch-details */ +window.skipLocalNotificationReady = true; + +deviceReady.then(() => { + logDebug('deviceReady'); + /* give status bar dark text because we have a light background + https://cordova.apache.org/docs/en/10.x/reference/cordova-plugin-statusbar/#statusbarstyledefault */ + if (window['StatusBar']) window['StatusBar'].styleDefault(); + cordova.plugin.http.setDataSerializer('json'); + const rootEl = document.getElementById('appRoot'); + const reactRoot = createRoot(rootEl); + + const theme = getTheme(); + + reactRoot.render( + + + + + + , + ); +}); diff --git a/www/js/App.tsx b/www/js/App.tsx index 2eece7f55..f43f006d9 100644 --- a/www/js/App.tsx +++ b/www/js/App.tsx @@ -1,5 +1,4 @@ import React, { useEffect, useState, createContext, useMemo } from 'react'; -import { getAngularService } from './angular-react-helper'; import { ActivityIndicator, BottomNavigation, useTheme } from 'react-native-paper'; import { useTranslation } from 'react-i18next'; import LabelTab from './diary/LabelTab'; @@ -44,6 +43,12 @@ const defaultRoutes = (t) => [ export const AppContext = createContext({}); +const scenes = { + label: withErrorBoundary(LabelTab), + metrics: withErrorBoundary(MetricsTab), + control: withErrorBoundary(ProfileSettings), +}; + const App = () => { const [index, setIndex] = useState(0); // will remain null while the onboarding state is still being determined @@ -59,11 +64,7 @@ const App = () => { return showMetrics ? defaultRoutes(t) : defaultRoutes(t).filter((r) => r.key != 'metrics'); }, [appConfig, t]); - const renderScene = BottomNavigation.SceneMap({ - label: withErrorBoundary(LabelTab), - metrics: withErrorBoundary(MetricsTab), - control: withErrorBoundary(ProfileSettings), - }); + const renderScene = BottomNavigation.SceneMap(scenes); const refreshOnboardingState = () => getPendingOnboardingState().then(setOnboardingState); useEffect(() => { diff --git a/www/js/angular-react-helper.tsx b/www/js/angular-react-helper.tsx deleted file mode 100644 index 3cf891666..000000000 --- a/www/js/angular-react-helper.tsx +++ /dev/null @@ -1,25 +0,0 @@ -// ---- angular-react-helper.jsx ---- -// Adapted from https://dev.to/kaplona/angularjs-to-react-migration-184g -// Modified to use React 18 and wrap elements with the React Native Paper Provider - -import angular from 'angular'; - -export function getAngularService(name: string) { - const injector = angular.element(document.body).injector(); - if (!injector || !injector.get) { - throw new Error(`Couldn't find angular injector to get "${name}" service`); - } - - const service = injector.get(name); - if (!service) { - throw new Error(`Couldn't find "${name}" angular service`); - } - - return service as any; // casting to 'any' because not all Angular services are typed -} - -export function createScopeWithVars(vars) { - const scope = getAngularService('$rootScope').$new(); - Object.assign(scope, vars); - return scope; -} diff --git a/www/js/appTheme.ts b/www/js/appTheme.ts index 641d1f680..615a48c7e 100644 --- a/www/js/appTheme.ts +++ b/www/js/appTheme.ts @@ -1,4 +1,4 @@ -import { MD3LightTheme as DefaultTheme, MD3Theme } from 'react-native-paper'; +import { MD3LightTheme as DefaultTheme, MD3Theme, useTheme } from 'react-native-paper'; /* This is the base theme we will use throughout the app It's based on the default theme from React Native Paper, with some modifications */ @@ -33,6 +33,8 @@ const AppTheme = { roundness: 5, }; +export const useAppTheme = () => useTheme(); + /* Next, we'll set up 'flavors' of the theme, which are variations on the theme with any number of properties overridden. This is used to automatically style the different types of diary cards @@ -84,7 +86,7 @@ const flavorOverrides = { /* This function is used to retrieve the theme for a given flavor. If no valid flavor is specified, it returns the default theme. */ export const getTheme = (flavor?: keyof typeof flavorOverrides) => { - if (!flavorOverrides[flavor]) return AppTheme; + if (!flavor || !flavorOverrides[flavor]) return AppTheme; const typeStyle = flavorOverrides[flavor]; const scopedElevation = { ...AppTheme.colors.elevation, ...typeStyle?.colors?.elevation }; const scopedColors = { diff --git a/www/js/components/Chart.tsx b/www/js/components/Chart.tsx index 257eb3cf6..2e5e3bd62 100644 --- a/www/js/components/Chart.tsx +++ b/www/js/components/Chart.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useRef, useState, useMemo } from 'react'; import { View } from 'react-native'; import { useTheme } from 'react-native-paper'; -import { Chart as ChartJS, registerables } from 'chart.js'; +import { ChartData, Chart as ChartJS, ScriptableContext, registerables } from 'chart.js'; import { Chart as ChartJSChart } from 'react-chartjs-2'; import Annotation, { AnnotationOptions, LabelPosition } from 'chartjs-plugin-annotation'; import { dedupColors, getChartHeight, darkenOrLighten } from './charting'; @@ -61,10 +61,11 @@ const Chart = ({ datasets: chartDatasets.map((e, i) => ({ ...e, backgroundColor: (barCtx) => - labelColorMap?.[e.label] || getColorForChartEl(chartRef.current, e, barCtx, 'background'), + labelColorMap?.[e.label] || + getColorForChartEl?.(chartRef.current, e, barCtx, 'background'), borderColor: (barCtx) => darkenOrLighten(labelColorMap?.[e.label], -0.5) || - getColorForChartEl(chartRef.current, e, barCtx, 'border'), + getColorForChartEl?.(chartRef.current, e, barCtx, 'border'), borderWidth: borderWidth || 2, borderRadius: 3, })), @@ -194,7 +195,7 @@ const Chart = ({ }), }, plugins: { - ...(lineAnnotations?.length > 0 && { + ...(lineAnnotations?.length && { annotation: { clip: false, annotations: lineAnnotations.map( @@ -204,12 +205,15 @@ const Chart = ({ label: { display: true, padding: { x: 3, y: 1 }, + // @ts-ignore borderRadius: 0, backgroundColor: 'rgba(0,0,0,.7)', color: 'rgba(255,255,255,1)', font: { size: 10 }, position: a.position || 'start', - content: a.label, + ...(a.label && { + content: a.label, + }), yAdjust: annotationsAtTop ? -12 : 0, }, ...(isHorizontal @@ -228,18 +232,20 @@ const Chart = ({ // so we need to increase the spacing between the legend and the chart // https://stackoverflow.com/a/73498454 plugins={ - annotationsAtTop && [ - { - id: 'increase-legend-spacing', - beforeInit(chart) { - const originalFit = (chart.legend as any).fit; - (chart.legend as any).fit = function fit() { - originalFit.bind(chart.legend)(); - this.height += 12; - }; - }, - }, - ] + annotationsAtTop + ? [ + { + id: 'increase-legend-spacing', + beforeInit(chart) { + const originalFit = (chart.legend as any).fit; + (chart.legend as any).fit = function fit() { + originalFit.bind(chart.legend)(); + this.height += 12; + }; + }, + }, + ] + : [] } /> diff --git a/www/js/components/Icon.tsx b/www/js/components/Icon.tsx index 3d13d0996..c680dacef 100644 --- a/www/js/components/Icon.tsx +++ b/www/js/components/Icon.tsx @@ -16,7 +16,7 @@ export const Icon = ({ style, ...rest }: IconButtonProps) => { {...rest} role="none" focusable={false} - accessibilityHidden={true} + aria-hidden={true} /> ); }; diff --git a/www/js/components/LeafletView.tsx b/www/js/components/LeafletView.tsx index b0b60912b..822719654 100644 --- a/www/js/components/LeafletView.tsx +++ b/www/js/components/LeafletView.tsx @@ -1,7 +1,8 @@ import React, { useEffect, useRef, useState } from 'react'; import { View } from 'react-native'; import { useTheme } from 'react-native-paper'; -import L from 'leaflet'; +import L, { Map } from 'leaflet'; +import { GeoJSONStyledFeature } from '../types/diaryTypes'; const mapSet = new Set(); export function invalidateMaps() { @@ -9,12 +10,12 @@ export function invalidateMaps() { } const LeafletView = ({ geojson, opts, ...otherProps }) => { - const mapElRef = useRef(null); - const leafletMapRef = useRef(null); + const mapElRef = useRef(null); + const leafletMapRef = useRef(null); const geoJsonIdRef = useRef(null); const { colors } = useTheme(); - function initMap(map) { + function initMap(map: Map) { L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '© OpenStreetMap', opacity: 1, @@ -22,7 +23,7 @@ const LeafletView = ({ geojson, opts, ...otherProps }) => { }).addTo(map); const gj = L.geoJson(geojson.data, { pointToLayer: pointToLayer, - style: (feature) => feature.style, + style: (feature) => (feature as GeoJSONStyledFeature)?.style || {}, }).addTo(map); const gjBounds = gj.getBounds().pad(0.2); map.fitBounds(gjBounds); @@ -37,6 +38,7 @@ const LeafletView = ({ geojson, opts, ...otherProps }) => { leafletMapRef.current.remove(); mapSet.delete(leafletMapRef.current); } + if (!mapElRef.current) return; const map = L.map(mapElRef.current, opts || {}); initMap(map); }, [geojson]); @@ -44,8 +46,8 @@ const LeafletView = ({ geojson, opts, ...otherProps }) => { /* If the geojson is different between renders, we need to recreate the map (happens because of FlashList's view recycling on the trip cards: https://shopify.github.io/flash-list/docs/recycling) */ - if (geoJsonIdRef.current && geoJsonIdRef.current !== geojson.data.id) { - leafletMapRef.current.eachLayer((layer) => leafletMapRef.current.removeLayer(layer)); + if (geoJsonIdRef.current && geoJsonIdRef.current !== geojson.data.id && leafletMapRef.current) { + leafletMapRef.current.eachLayer((layer) => leafletMapRef.current?.removeLayer(layer)); initMap(leafletMapRef.current); } @@ -67,6 +69,7 @@ const LeafletView = ({ geojson, opts, ...otherProps }) => { z-index: 9; } #${mapElId} .leaflet-div-icon-start, #${mapElId} .leaflet-div-icon-stop { + box-sizing: border-box; border: 2px solid ${colors.primary}; border-radius: 100%; display: flex; diff --git a/www/js/components/NavBarButton.tsx b/www/js/components/NavBarButton.tsx index 294015152..a86d305b8 100644 --- a/www/js/components/NavBarButton.tsx +++ b/www/js/components/NavBarButton.tsx @@ -25,7 +25,7 @@ const NavBarButton = ({ children, icon, onPressAction, ...otherProps }) => { diff --git a/www/js/components/QrCode.tsx b/www/js/components/QrCode.tsx index 83498f5da..7e16ac28e 100644 --- a/www/js/components/QrCode.tsx +++ b/www/js/components/QrCode.tsx @@ -4,16 +4,18 @@ we can remove this wrapper and just use the QRCode component directly */ import React from 'react'; import QRCode from 'react-qr-code'; +import { logWarn } from '../plugin/logger'; export function shareQR(message) { /*code adapted from demo of react-qr-code*/ const svg = document.querySelector('.qr-code'); + if (!svg) return logWarn('No QR code found to share'); const svgData = new XMLSerializer().serializeToString(svg); const img = new Image(); img.onload = () => { const canvas = document.createElement('canvas'); - const ctx = canvas.getContext('2d'); + const ctx = canvas.getContext('2d') as CanvasRenderingContext2D; canvas.width = img.width; canvas.height = img.height; ctx.drawImage(img, 0, 0); diff --git a/www/js/components/ToggleSwitch.tsx b/www/js/components/ToggleSwitch.tsx index 7f753a9a0..1b5134d97 100644 --- a/www/js/components/ToggleSwitch.tsx +++ b/www/js/components/ToggleSwitch.tsx @@ -7,9 +7,7 @@ const ToggleSwitch = ({ value, buttons, ...rest }: SegmentedButtonsProps) => { return ( rest.onValueChange(v as any)} buttons={buttons.map((o) => ({ - value: o.value, icon: o.icon, uncheckedColor: colors.onSurfaceDisabled, showSelectedCheck: true, diff --git a/www/js/components/charting.ts b/www/js/components/charting.ts index 77490f7ff..6d0f75ed5 100644 --- a/www/js/components/charting.ts +++ b/www/js/components/charting.ts @@ -26,7 +26,7 @@ export function getChartHeight( so they don't look squished */ if (isHorizontal) { // 'ideal' chart height is based on the number of datasets and number of unique index values - const uniqueIndexVals = []; + const uniqueIndexVals: string[] = []; chartDatasets.forEach((e) => e.data.forEach((r) => { if (!uniqueIndexVals.includes(r[indexAxis])) uniqueIndexVals.push(r[indexAxis]); @@ -65,7 +65,7 @@ function createDiagonalPattern(color = 'black') { let shape = document.createElement('canvas'); shape.width = 10; shape.height = 10; - let c = shape.getContext('2d'); + let c = shape.getContext('2d') as CanvasRenderingContext2D; c.strokeStyle = color; c.lineWidth = 2; c.beginPath(); @@ -112,7 +112,14 @@ const meterColors = { above: '#440000', // dark red }; -export function getGradient(chart, meter, currDataset, barCtx, alpha = null, darken = 0) { +export function getGradient( + chart, + meter, + currDataset, + barCtx, + alpha: number | null = null, + darken = 0, +) { const { ctx, chartArea, scales } = chart; if (!chartArea) return null; let gradient: CanvasGradient; diff --git a/www/js/config/dynamicConfig.ts b/www/js/config/dynamicConfig.ts index f684f577d..1b7176674 100644 --- a/www/js/config/dynamicConfig.ts +++ b/www/js/config/dynamicConfig.ts @@ -7,7 +7,7 @@ import { AppConfig } from '../types/appConfigTypes'; export const CONFIG_PHONE_UI = 'config/app_ui_config'; export const CONFIG_PHONE_UI_KVSTORE = 'CONFIG_PHONE_UI'; -export let storedConfig = null; +export let storedConfig: AppConfig | null = null; export let configChanged = false; export const setConfigChanged = (b) => (configChanged = b); @@ -178,7 +178,7 @@ function extractStudyName(token: string): string { return tokenParts[1]; } -function extractSubgroup(token: string, config: AppConfig): string { +function extractSubgroup(token: string, config: AppConfig): string | undefined { if (config.opcode) { // new style study, expects token with sub-group const tokenParts = token.split('_'); diff --git a/www/js/config/useImperialConfig.ts b/www/js/config/useImperialConfig.ts index 1b7e2c346..d55fdffb0 100644 --- a/www/js/config/useImperialConfig.ts +++ b/www/js/config/useImperialConfig.ts @@ -2,6 +2,13 @@ import React, { useEffect, useState } from 'react'; import useAppConfig from '../useAppConfig'; import i18next from 'i18next'; +export type ImperialConfig = { + distanceSuffix: string; + speedSuffix: string; + getFormattedDistance: (d: number) => string; + getFormattedSpeed: (s: number) => string; +}; + const KM_TO_MILES = 0.621371; const MPS_TO_KMPH = 3.6; @@ -31,7 +38,7 @@ export const convertSpeed = (speedMetersPerSec: number, imperial: boolean): numb return speedMetersPerSec * MPS_TO_KMPH; }; -export function useImperialConfig() { +export function useImperialConfig(): ImperialConfig { const appConfig = useAppConfig(); const [useImperial, setUseImperial] = useState(false); diff --git a/www/js/control/AlertBar.jsx b/www/js/control/AlertBar.tsx similarity index 88% rename from www/js/control/AlertBar.jsx rename to www/js/control/AlertBar.tsx index c86401b03..c132f4104 100644 --- a/www/js/control/AlertBar.jsx +++ b/www/js/control/AlertBar.tsx @@ -4,7 +4,13 @@ import { Snackbar } from 'react-native-paper'; import { useTranslation } from 'react-i18next'; import { SafeAreaView } from 'react-native-safe-area-context'; -const AlertBar = ({ visible, setVisible, messageKey, messageAddition = undefined }) => { +type Props = { + visible: boolean; + setVisible: any; + messageKey: any; + messageAddition?: string; +}; +const AlertBar = ({ visible, setVisible, messageKey, messageAddition }: Props) => { const { t } = useTranslation(); const onDismissSnackBar = () => setVisible(false); diff --git a/www/js/control/ControlCollectionHelper.tsx b/www/js/control/ControlCollectionHelper.tsx index cc3efa8c1..4c6a21eaa 100644 --- a/www/js/control/ControlCollectionHelper.tsx +++ b/www/js/control/ControlCollectionHelper.tsx @@ -4,7 +4,7 @@ import { Dialog, Button, Switch, Text, useTheme, TextInput } from 'react-native- import { useTranslation } from 'react-i18next'; import ActionMenu from '../components/ActionMenu'; import { settingStyles } from './ProfileSettings'; -import { getAngularService } from '../angular-react-helper'; +import { displayError } from '../plugin/logger'; type collectionConfig = { is_duty_cycling: boolean; @@ -19,6 +19,8 @@ type collectionConfig = { android_geofence_responsiveness: number; }; +type AccuracyAction = { text: string; value: number }; + export async function forceTransition(transition) { try { let result = await forceTransitionWrapper(transition); @@ -62,7 +64,6 @@ export async function isMediumAccuracy() { } export async function helperToggleLowAccuracy() { - const Logger = getAngularService('Logger'); let tempConfig = await getConfig(); let accuracyOptions = await getAccuracyOptions(); let medium = await isMediumAccuracy(); @@ -83,7 +84,7 @@ export async function helperToggleLowAccuracy() { let set = await setConfig(tempConfig); console.log('setConfig Sucess'); } catch (err) { - Logger.displayError('Error while setting collection config', err); + displayError(err, 'Error while setting collection config'); } } @@ -96,7 +97,7 @@ export const getState = function () { }; export async function getHelperCollectionSettings() { - let promiseList = []; + let promiseList: Promise[] = []; promiseList.push(getConfig()); promiseList.push(getAccuracyOptions()); let resultList = await Promise.all(promiseList); @@ -121,10 +122,10 @@ export const forceTransitionWrapper = function (transition) { }; const formatConfigForDisplay = function (config, accuracyOptions) { - var retVal = []; - for (var prop in config) { + const retVal: { key: string; val: string }[] = []; + for (let prop in config) { if (prop == 'accuracy') { - for (var name in accuracyOptions) { + for (let name in accuracyOptions) { if (accuracyOptions[name] == config[prop]) { retVal.push({ key: prop, val: name }); } @@ -138,20 +139,17 @@ const formatConfigForDisplay = function (config, accuracyOptions) { const ControlCollectionHelper = ({ editVis, setEditVis }) => { const { colors } = useTheme(); - const Logger = getAngularService('Logger'); const [localConfig, setLocalConfig] = useState(); - const [accuracyActions, setAccuracyActions] = useState([]); + const [accuracyActions, setAccuracyActions] = useState([]); const [accuracyVis, setAccuracyVis] = useState(false); async function getCollectionSettings() { - let promiseList = []; + let promiseList: Promise[] = []; promiseList.push(getConfig()); promiseList.push(getAccuracyOptions()); - let resultList = await Promise.all(promiseList); - let tempConfig = resultList[0]; + const [tempConfig, tempAccuracyOptions] = await Promise.all(promiseList); setLocalConfig(tempConfig); - let tempAccuracyOptions = resultList[1]; setAccuracyActions(formatAccuracyForActions(tempAccuracyOptions)); return formatConfigForDisplay(tempConfig, tempAccuracyOptions); } @@ -161,7 +159,7 @@ const ControlCollectionHelper = ({ editVis, setEditVis }) => { }, [editVis]); const formatAccuracyForActions = function (accuracyOptions) { - let tempAccuracyActions = []; + let tempAccuracyActions: AccuracyAction[] = []; for (var name in accuracyOptions) { tempAccuracyActions.push({ text: name, value: accuracyOptions[name] }); } @@ -178,24 +176,24 @@ const ControlCollectionHelper = ({ editVis, setEditVis }) => { let set = await setConfig(localConfig); setEditVis(false); } catch (err) { - Logger.displayError('Error while setting collection config', err); + displayError(err, 'Error while setting collection config'); } } const onToggle = function (config_key) { - let tempConfig = { ...localConfig }; - tempConfig[config_key] = !localConfig[config_key]; + let tempConfig = { ...localConfig } as collectionConfig; + tempConfig[config_key] = !(localConfig as collectionConfig)[config_key]; setLocalConfig(tempConfig); }; const onChooseAccuracy = function (accuracyOption) { - let tempConfig = { ...localConfig }; + let tempConfig = { ...localConfig } as collectionConfig; tempConfig.accuracy = accuracyOption.value; setLocalConfig(tempConfig); }; const onChangeText = function (newText, config_key) { - let tempConfig = { ...localConfig }; + let tempConfig = { ...localConfig } as collectionConfig; tempConfig[config_key] = parseInt(newText); setLocalConfig(tempConfig); }; diff --git a/www/js/control/ControlDataTable.jsx b/www/js/control/ControlDataTable.tsx similarity index 100% rename from www/js/control/ControlDataTable.jsx rename to www/js/control/ControlDataTable.tsx diff --git a/www/js/control/ControlSyncHelper.tsx b/www/js/control/ControlSyncHelper.tsx index 5225cf6c6..e46c38af6 100644 --- a/www/js/control/ControlSyncHelper.tsx +++ b/www/js/control/ControlSyncHelper.tsx @@ -3,13 +3,13 @@ import { Modal, View } from 'react-native'; import { Dialog, Button, Switch, Text, useTheme } from 'react-native-paper'; import { useTranslation } from 'react-i18next'; import { settingStyles } from './ProfileSettings'; -import { getAngularService } from '../angular-react-helper'; import ActionMenu from '../components/ActionMenu'; import SettingRow from './SettingRow'; import AlertBar from './AlertBar'; -import moment from 'moment'; import { addStatEvent, statKeys } from '../plugin/clientStats'; import { updateUser } from '../services/commHelper'; +import { displayError, logDebug, logWarn } from '../plugin/logger'; +import { DateTime } from 'luxon'; /* * BEGIN: Simple read/write wrappers @@ -19,7 +19,7 @@ export function forcePluginSync() { } const formatConfigForDisplay = (configToFormat) => { - var formatted = []; + const formatted: any[] = []; for (let prop in configToFormat) { formatted.push({ key: prop, val: configToFormat[prop] }); } @@ -45,7 +45,6 @@ type syncConfig = { sync_interval: number; ios_use_remote_push: boolean }; export const ForceSyncRow = ({ getState }) => { const { t } = useTranslation(); const { colors } = useTheme(); - const Logger = getAngularService('Logger'); const [dataPendingVis, setDataPendingVis] = useState(false); const [dataPushedVis, setDataPushedVis] = useState(false); @@ -74,24 +73,18 @@ export const ForceSyncRow = ({ getState }) => { }; let syncLaunchedCalls = sensorDataList.filter(isTripEnd); let syncPending = syncLaunchedCalls.length > 0; - Logger.log( - 'sensorDataList.length = ' + - sensorDataList.length + - ', syncLaunchedCalls.length = ' + - syncLaunchedCalls.length + - ', syncPending? = ' + - syncPending, - ); - Logger.log('sync launched = ' + syncPending); + logDebug(`sensorDataList.length = ${sensorDataList.length}, + syncLaunchedCalls.length = ${syncLaunchedCalls.length}, + syncPending? = ${syncPending}`); if (syncPending) { - Logger.log(Logger.log('data is pending, showing confirm dialog')); + logDebug('data is pending, showing confirm dialog'); setDataPendingVis(true); //consent handling in modal } else { setDataPushedVis(true); } } catch (error) { - Logger.displayError('Error while forcing sync', error); + displayError(error, 'Error while forcing sync'); } } @@ -127,7 +120,7 @@ export const ForceSyncRow = ({ getState }) => { entry_data['curr_state'] = getOngoingTransitionState(); } entry_data['transition'] = transKey; - entry_data['ts'] = moment().unix(); + entry_data['ts'] = DateTime.now().toSeconds(); return entry_data; } @@ -161,7 +154,7 @@ export const ForceSyncRow = ({ getState }) => { @@ -188,7 +181,6 @@ export const ForceSyncRow = ({ getState }) => { const ControlSyncHelper = ({ editVis, setEditVis }) => { const { t } = useTranslation(); const { colors } = useTheme(); - const Logger = getAngularService('Logger'); const [localConfig, setLocalConfig] = useState(); const [intervalVis, setIntervalVis] = useState(false); @@ -227,22 +219,22 @@ const ControlSyncHelper = ({ editVis, setEditVis }) => { // or continue to store from native // this is easier for people to see, but means that calls to // native, even through the javascript interface are not complete - curr_sync_interval: localConfig.sync_interval, + curr_sync_interval: (localConfig as syncConfig).sync_interval, }); } catch (err) { console.log('error with setting sync config', err); - Logger.displayError('Error while setting sync config', err); + displayError(err, 'Error while setting sync config'); } } const onChooseInterval = function (interval) { - let tempConfig = { ...localConfig }; + let tempConfig = { ...localConfig } as syncConfig; tempConfig.sync_interval = interval.value; setLocalConfig(tempConfig); }; const onTogglePush = function () { - let tempConfig = { ...localConfig }; - tempConfig.ios_use_remote_push = !localConfig.ios_use_remote_push; + let tempConfig = { ...localConfig } as syncConfig; + tempConfig.ios_use_remote_push = !(localConfig as syncConfig).ios_use_remote_push; setLocalConfig(tempConfig); }; diff --git a/www/js/control/DataDatePicker.tsx b/www/js/control/DataDatePicker.tsx index 53fcff0a1..c2a149fc5 100644 --- a/www/js/control/DataDatePicker.tsx +++ b/www/js/control/DataDatePicker.tsx @@ -1,5 +1,5 @@ -// this date picker element is set up to handle the "download data from day" in ProfileSettings -// it relies on an angular service (Control Helper) but when we migrate that we might want to download a range instead of single +/* This date picker element is set up to handle the "download data from day" in ProfileSettings. + Later, we may consider changing this to a date range instead of a single day */ import React from 'react'; import { DatePickerModal } from 'react-native-paper-dates'; diff --git a/www/js/control/DemographicsSettingRow.jsx b/www/js/control/DemographicsSettingRow.tsx similarity index 84% rename from www/js/control/DemographicsSettingRow.jsx rename to www/js/control/DemographicsSettingRow.tsx index c8a0a7297..d3aa24d1c 100644 --- a/www/js/control/DemographicsSettingRow.jsx +++ b/www/js/control/DemographicsSettingRow.tsx @@ -8,7 +8,7 @@ export const DEMOGRAPHIC_SURVEY_DATAKEY = 'manual/demographic_survey'; const DemographicsSettingRow = ({}) => { const [surveyModalVisible, setSurveyModalVisible] = useState(false); - const [prevSurveyResponse, setPrevSurveyResponse] = useState(null); + const [prevSurveyResponse, setPrevSurveyResponse] = useState(undefined); function openPopover() { return loadPreviousResponseForSurvey(DEMOGRAPHIC_SURVEY_DATAKEY).then((lastSurvey) => { @@ -21,12 +21,7 @@ const DemographicsSettingRow = ({}) => { return ( <> - + setSurveyModalVisible(false)} diff --git a/www/js/control/ExpandMenu.jsx b/www/js/control/ExpandMenu.tsx similarity index 100% rename from www/js/control/ExpandMenu.jsx rename to www/js/control/ExpandMenu.tsx diff --git a/www/js/control/LogPage.tsx b/www/js/control/LogPage.tsx index 6d603f19e..ff29685a4 100644 --- a/www/js/control/LogPage.tsx +++ b/www/js/control/LogPage.tsx @@ -1,10 +1,9 @@ import React, { useState, useMemo, useEffect } from 'react'; import { View, StyleSheet, SafeAreaView, Modal } from 'react-native'; import { useTheme, Text, Appbar, IconButton } from 'react-native-paper'; -import { getAngularService } from '../angular-react-helper'; import { useTranslation } from 'react-i18next'; import { FlashList } from '@shopify/flash-list'; -import moment from 'moment'; +import { DateTime } from 'luxon'; import AlertBar from './AlertBar'; import { sendEmail } from './emailService'; @@ -15,7 +14,7 @@ const LogPage = ({ pageVis, setPageVis }) => { const { colors } = useTheme(); const [loadStats, setLoadStats] = useState(); - const [entries, setEntries] = useState([]); + const [entries, setEntries] = useState([]); const [maxErrorVis, setMaxErrorVis] = useState(false); const [logErrorVis, setLogErrorVis] = useState(false); const [maxMessage, setMaxMessage] = useState(''); @@ -31,7 +30,7 @@ const LogPage = ({ pageVis, setPageVis }) => { async function refreshEntries() { try { - let maxIndex = await window.Logger.getMaxIndex(); + let maxIndex = await window['Logger'].getMaxIndex(); console.log('maxIndex = ' + maxIndex); let tempStats = {} as loadStats; tempStats.currentStart = maxIndex; @@ -54,17 +53,20 @@ const LogPage = ({ pageVis, setPageVis }) => { }, [loadStats]); const clear = function () { - window?.Logger.clearAll(); - window?.Logger.log(window.Logger.LEVEL_INFO, 'Finished clearing entries from unified log'); + window?.['Logger'].clearAll(); + window?.['Logger'].log( + window['Logger'].LEVEL_INFO, + 'Finished clearing entries from unified log', + ); refreshEntries(); }; async function addEntries() { console.log('calling addEntries'); setIsFetching(true); - let start = loadStats.currentStart ? loadStats.currentStart : 0; //set a default start to prevent initial fetch error + let start = loadStats?.currentStart ? loadStats.currentStart : 0; //set a default start to prevent initial fetch error try { - let entryList = await window.Logger.getMessagesFromIndex(start, RETRIEVE_COUNT); + let entryList = await window['Logger'].getMessagesFromIndex(start, RETRIEVE_COUNT); processEntries(entryList); console.log('entry list size = ' + entries.length); setIsFetching(false); @@ -78,10 +80,10 @@ const LogPage = ({ pageVis, setPageVis }) => { } const processEntries = function (entryList) { - let tempEntries = []; - let tempLoadStats = { ...loadStats }; + let tempEntries: any[] = []; + let tempLoadStats: loadStats = { ...loadStats } as loadStats; entryList.forEach((e) => { - e.fmt_time = moment.unix(e.ts).format('llll'); + e.fmt_time = DateTime.fromSeconds(e.ts).toLocaleString(DateTime.DATETIME_MED); tempEntries.push(e); }); if (entryList.length == 0) { @@ -89,7 +91,7 @@ const LogPage = ({ pageVis, setPageVis }) => { tempLoadStats.reachedEnd = true; } else { tempLoadStats.currentStart = entryList[entryList.length - 1].ID; - console.log('new start index = ' + loadStats.currentStart); + console.log('new start index = ' + loadStats?.currentStart); } setEntries([...entries].concat(tempEntries)); //push the new entries onto the list setLoadStats(tempLoadStats); @@ -117,7 +119,7 @@ const LogPage = ({ pageVis, setPageVis }) => { + style={{ height: 46, backgroundColor: colors.surface }}> { setPageVis(false); diff --git a/www/js/control/PopOpCode.jsx b/www/js/control/PopOpCode.tsx similarity index 97% rename from www/js/control/PopOpCode.jsx rename to www/js/control/PopOpCode.tsx index 510ee84fd..451294867 100644 --- a/www/js/control/PopOpCode.jsx +++ b/www/js/control/PopOpCode.tsx @@ -17,12 +17,12 @@ const PopOpCode = ({ visibilityValue, tokenURL, action, setVis }) => { const copyText = function (textToCopy) { navigator.clipboard.writeText(textToCopy).then(() => { - setCopyAlertvis(true); + setCopyAlertVis(true); }); }; let copyButton; - if (window.cordova.platformId == 'ios') { + if (window['cordova'].platformId == 'ios') { copyButton = ( { @@ -50,7 +50,6 @@ const ProfileSettings = () => { const { colors } = useTheme(); const { setPermissionsPopupVis } = useContext(AppContext); - //functions that come directly from an Angular service const editCollectionConfig = () => setEditCollectionVis(true); const editSyncConfig = () => setEditSync(true); @@ -72,14 +71,14 @@ const ProfileSettings = () => { const [editCollectionVis, setEditCollectionVis] = useState(false); // const [collectConfig, setCollectConfig] = useState({}); - const [collectSettings, setCollectSettings] = useState({}); - const [notificationSettings, setNotificationSettings] = useState({}); - const [authSettings, setAuthSettings] = useState({}); - const [syncSettings, setSyncSettings] = useState({}); + const [collectSettings, setCollectSettings] = useState({}); + const [notificationSettings, setNotificationSettings] = useState({}); + const [authSettings, setAuthSettings] = useState({}); + const [syncSettings, setSyncSettings] = useState({}); const [cacheResult, setCacheResult] = useState(''); const [connectSettings, setConnectSettings] = useState({}); - const [uiConfig, setUiConfig] = useState({}); - const [consentDoc, setConsentDoc] = useState({}); + const [uiConfig, setUiConfig] = useState(undefined); + const [consentDoc, setConsentDoc] = useState({}); const [dumpDate, setDumpDate] = useState(new Date()); const [uploadReason, setUploadReason] = useState(''); const appVersion = useRef(); @@ -94,7 +93,7 @@ const ProfileSettings = () => { ]; // used for scheduling notifs - let scheduledPromise = new Promise((rs) => rs()); + let scheduledPromise = new Promise((rs) => rs()); const [isScheduling, setIsScheduling] = useState(false); useEffect(() => { @@ -104,7 +103,7 @@ const ProfileSettings = () => { } }, [appConfig]); - const refreshScreen = function () { + function refreshScreen() { refreshCollectSettings(); refreshNotificationSettings(); getOPCode(); @@ -113,15 +112,15 @@ const ProfileSettings = () => { getAppVersion().then((version) => { appVersion.current = version; }); - }; + } //previously not loaded on regular refresh, this ensures it stays caught up useEffect(() => { refreshNotificationSettings(); }, [uiConfig]); - const whenReady = function (newAppConfig) { - var tempUiConfig = newAppConfig; + function whenReady(newAppConfig: AppConfig) { + const tempUiConfig = newAppConfig; // backwards compat hack to fill in the raw_data_use for programs that don't have it const default_raw_data_use = { @@ -163,11 +162,11 @@ const ProfileSettings = () => { // console.log("translated text is??", templateText); setUiConfig(tempUiConfig); refreshScreen(); - }; + } async function refreshCollectSettings() { console.debug('about to refreshCollectSettings, collectSettings = ', collectSettings); - const newCollectSettings = {}; + const newCollectSettings: any = {}; // // refresh collect plugin configuration const collectionPluginConfig = await getHelperCollectionSettings(); @@ -202,10 +201,10 @@ const ProfileSettings = () => { 'about to refreshNotificationSettings, notificationSettings = ' + JSON.stringify(notificationSettings), ); - const newNotificationSettings = {}; + const newNotificationSettings: any = {}; if (uiConfig?.reminderSchemes) { - let promiseList = []; + let promiseList: Promise[] = []; promiseList.push( getReminderPrefs(uiConfig.reminderSchemes, isScheduling, setIsScheduling, scheduledPromise), ); @@ -225,8 +224,6 @@ const ProfileSettings = () => { newNotificationSettings.prefReminderTime = m.toFormat('t'); newNotificationSettings.prefReminderTimeOnLoad = prefs.reminder_time_of_day; newNotificationSettings.scheduledNotifs = scheduledNotifs; - - updatePrefReminderTime(false); } logDebug( @@ -240,7 +237,7 @@ const ProfileSettings = () => { async function getSyncSettings() { console.log('getting sync settings'); - var newSyncSettings = {}; + const newSyncSettings: any = {}; getHelperSyncSettings().then(function (showConfig) { newSyncSettings.show_config = showConfig; setSyncSettings(newSyncSettings); @@ -256,19 +253,19 @@ const ProfileSettings = () => { async function getConnectURL() { getSettings().then( function (response) { - var newConnectSettings = {}; + const newConnectSettings: any = {}; newConnectSettings.url = response.connectUrl; console.log(response); setConnectSettings(newConnectSettings); }, function (error) { - Logger.displayError('While getting connect url', error); + displayError(error, 'While getting connect url'); }, ); } async function getOPCode() { - const newAuthSettings = {}; + const newAuthSettings: any = {}; const opcode = await fetchOPCode(); if (opcode == null) { newAuthSettings.opcode = 'Not logged in'; @@ -279,21 +276,17 @@ const ProfileSettings = () => { } //methods that control the settings - const uploadLog = function () { + function uploadLog() { if (uploadReason != '') { let reason = uploadReason; uploadFile('loggerDB', reason); setUploadVis(false); } - }; - - const emailLog = function () { - // Passing true, we want to send logs - sendEmail('loggerDB'); - }; + } async function updatePrefReminderTime(storeNewVal = true, newTime) { - console.log(newTime); + if (!uiConfig?.reminderSchemes) + return logWarn('In updatePrefReminderTime, no reminderSchemes yet, skipping'); if (storeNewVal) { const m = DateTime.fromISO(newTime); // store in HH:mm @@ -310,11 +303,11 @@ const ProfileSettings = () => { } function dummyNotification() { - cordova.plugins.notification.local.addActions('dummy-actions', [ + window['cordova'].plugins.notification.local.addActions('dummy-actions', [ { id: 'action', title: 'Yes' }, { id: 'cancel', title: 'No' }, ]); - cordova.plugins.notification.local.schedule({ + window['cordova'].plugins.notification.local.schedule({ id: new Date().getTime(), title: 'Dummy Title', text: 'Dummy text', @@ -336,40 +329,32 @@ const ProfileSettings = () => { }, 1500); } - const viewQRCode = function (e) { - setOpCodeVis(true); - }; - - const clearNotifications = function () { - window.cordova.plugins.notification.local.clearAll(); - }; - //Platform.OS returns "web" now, but could be used once it's fully a Native app //for now, use window.cordova.platformId - const parseState = function (state) { + function parseState(state) { console.log('state in parse state is', state); if (state) { - console.log('state in parse state exists', window.cordova.platformId); - if (window.cordova.platformId == 'android') { + console.log('state in parse state exists', window['cordova'].platformId); + if (window['cordova'].platformId == 'android') { console.log('ANDROID state in parse state is', state.substring(12)); return state.substring(12); - } else if (window.cordova.platformId == 'ios') { + } else if (window['cordova'].platformId == 'ios') { console.log('IOS state in parse state is', state.substring(6)); return state.substring(6); } } - }; + } async function invalidateCache() { - window.cordova.plugins.BEMUserCache.invalidateAllCache().then( + window['cordova'].plugins.BEMUserCache.invalidateAllCache().then( function (result) { console.log('invalidate result', result); setCacheResult(result); setInvalidateSuccessVis(true); }, function (error) { - Logger.displayError('while invalidating cache, error->', error); + displayError(error, 'while invalidating cache, error->'); }, ); } @@ -379,7 +364,7 @@ const ProfileSettings = () => { getConsentDocument().then( function (resultDoc) { setConsentDoc(resultDoc); - logDebug('In profile settings, consent doc found', resultDoc); + logDebug(`In profile settings, consent doc found = ${JSON.stringify(resultDoc)}`); if (resultDoc == null) { setNoConsentVis(true); } else { @@ -387,12 +372,12 @@ const ProfileSettings = () => { } }, function (error) { - Logger.displayError('Error reading consent document from cache', error); + displayError(error, 'Error reading consent document from cache'); }, ); } - const onSelectState = function (stateObject) { + const onSelectState = (stateObject) => { forceTransition(stateObject.transition); }; @@ -435,7 +420,7 @@ const ProfileSettings = () => { + style={{ height: 46, backgroundColor: colors.surface }}> {t('control.log-out')} setLogoutVis(true)}> @@ -445,7 +430,7 @@ const ProfileSettings = () => { setOpCodeVis(true)} desc={authSettings.opcode} descStyle={settingStyles.monoDesc}> @@ -471,7 +456,10 @@ const ProfileSettings = () => { iconName="calendar" action={() => setDateDumpVis(true)}> {logUploadSection} - + sendEmail('loggerDB')}> { style={settingStyles.dialog(colors.elevation.level3)}> {t('general-settings.are-you-sure')} - {t('general-settings.log-out-warning')} + {t('general-settings.log-out-warning')} @@ -631,7 +619,7 @@ const ProfileSettings = () => { style={settingStyles.dialog(colors.elevation.level3)}> {t('general-settings.consent-not-found')} - {t('general-settings.no-consent-logout')} + {t('general-settings.no-consent-logout')} diff --git a/www/js/survey/enketo/EnketoModal.tsx b/www/js/survey/enketo/EnketoModal.tsx index 1d169ee9b..d1f11a83a 100644 --- a/www/js/survey/enketo/EnketoModal.tsx +++ b/www/js/survey/enketo/EnketoModal.tsx @@ -15,26 +15,26 @@ type Props = Omit & { const EnketoModal = ({ surveyName, onResponseSaved, opts, ...rest }: Props) => { const { t, i18n } = useTranslation(); - const headerEl = useRef(null); - const surveyJson = useRef(null); + const headerEl = useRef(null); + const surveyJson = useRef(null); const enketoForm = useRef
(null); const appConfig = useAppConfig(); async function validateAndSave() { const valid = await enketoForm.current.validate(); if (!valid) return false; - const result = await saveResponse(surveyName, enketoForm.current, appConfig, opts); - if (!result) { - // validation failed - displayErrorMsg(t('survey.enketo-form-errors')); - } else if (result instanceof Error) { - // error thrown in saveResponse - displayError(result); - } else { - // success - rest.onDismiss(); - onResponseSaved(result); - return; + try { + const result = await saveResponse(surveyName, enketoForm.current, appConfig, opts); + if (result) { + // success + rest.onDismiss?.(); + onResponseSaved(result); + } else { + // validation failed + displayErrorMsg(t('survey.enketo-form-errors')); + } + } catch (err) { + displayError(err); } } @@ -46,7 +46,7 @@ const EnketoModal = ({ surveyName, onResponseSaved, opts, ...rest }: Props) => { fetchSurvey(formPath).then(({ form, model }) => { surveyJson.current = { form, model }; - headerEl?.current.insertAdjacentHTML('afterend', form); // inject form into DOM + headerEl?.current?.insertAdjacentHTML('afterend', form); // inject form into DOM const formEl = document.querySelector('form.or'); const data = { modelStr: model, // the XML model for this form @@ -69,14 +69,14 @@ const EnketoModal = ({ surveyName, onResponseSaved, opts, ...rest }: Props) => { /* adapted from the template given by enketo-core: https://github.com/enketo/enketo-core/blob/master/src/index.html */ const enketoContent = ( -
+
{/* This form header (markup/css) can be changed in the application. Just make sure to keep a .form-language-selector element into which the form language selector (', - * title: 'Enter Wi-Fi Password', - * subTitle: 'Please use normal things', - * scope: $scope, - * buttons: [ - * { text: 'Cancel' }, - * { - * text: 'Save', - * type: 'button-positive', - * onTap: function(e) { - * if (!$scope.data.wifi) { - * //don't allow the user to close unless he enters wifi password - * e.preventDefault(); - * } else { - * return $scope.data.wifi; - * } - * } - * } - * ] - * }); - * - * myPopup.then(function(res) { - * console.log('Tapped!', res); - * }); - * - * $timeout(function() { - * myPopup.close(); //close the popup after 3 seconds for some reason - * }, 3000); - * }; - * - * // A confirm dialog - * $scope.showConfirm = function() { - * var confirmPopup = $ionicPopup.confirm({ - * title: 'Consume Ice Cream', - * template: 'Are you sure you want to eat this ice cream?' - * }); - * - * confirmPopup.then(function(res) { - * if(res) { - * console.log('You are sure'); - * } else { - * console.log('You are not sure'); - * } - * }); - * }; - * - * // An alert dialog - * $scope.showAlert = function() { - * var alertPopup = $ionicPopup.alert({ - * title: 'Don\'t eat that!', - * template: 'It might taste good' - * }); - * - * alertPopup.then(function(res) { - * console.log('Thank you for not eating my delicious ice cream cone'); - * }); - * }; - *}); - *``` - */ - -IonicModule -.factory('$ionicPopup', [ - '$ionicTemplateLoader', - '$ionicBackdrop', - '$q', - '$timeout', - '$rootScope', - '$ionicBody', - '$compile', - '$ionicPlatform', - '$ionicModal', - 'IONIC_BACK_PRIORITY', -function($ionicTemplateLoader, $ionicBackdrop, $q, $timeout, $rootScope, $ionicBody, $compile, $ionicPlatform, $ionicModal, IONIC_BACK_PRIORITY) { - //TODO allow this to be configured - var config = { - stackPushDelay: 75 - }; - var popupStack = []; - - var $ionicPopup = { - /** - * @ngdoc method - * @description - * Show a complex popup. This is the master show function for all popups. - * - * A complex popup has a `buttons` array, with each button having a `text` and `type` - * field, in addition to an `onTap` function. The `onTap` function, called when - * the corresponding button on the popup is tapped, will by default close the popup - * and resolve the popup promise with its return value. If you wish to prevent the - * default and keep the popup open on button tap, call `event.preventDefault()` on the - * passed in tap event. Details below. - * - * @name $ionicPopup#show - * @param {object} options The options for the new popup, of the form: - * - * ``` - * { - * title: '', // String. The title of the popup. - * cssClass: '', // String, The custom CSS class name - * subTitle: '', // String (optional). The sub-title of the popup. - * template: '', // String (optional). The html template to place in the popup body. - * templateUrl: '', // String (optional). The URL of an html template to place in the popup body. - * scope: null, // Scope (optional). A scope to link to the popup content. - * buttons: [{ // Array[Object] (optional). Buttons to place in the popup footer. - * text: 'Cancel', - * type: 'button-default', - * onTap: function(e) { - * // e.preventDefault() will stop the popup from closing when tapped. - * e.preventDefault(); - * } - * }, { - * text: 'OK', - * type: 'button-positive', - * onTap: function(e) { - * // Returning a value will cause the promise to resolve with the given value. - * return scope.data.response; - * } - * }] - * } - * ``` - * - * @returns {object} A promise which is resolved when the popup is closed. Has an additional - * `close` function, which can be used to programmatically close the popup. - */ - show: showPopup, - - /** - * @ngdoc method - * @name $ionicPopup#alert - * @description Show a simple alert popup with a message and one button that the user can - * tap to close the popup. - * - * @param {object} options The options for showing the alert, of the form: - * - * ``` - * { - * title: '', // String. The title of the popup. - * cssClass: '', // String, The custom CSS class name - * subTitle: '', // String (optional). The sub-title of the popup. - * template: '', // String (optional). The html template to place in the popup body. - * templateUrl: '', // String (optional). The URL of an html template to place in the popup body. - * okText: '', // String (default: 'OK'). The text of the OK button. - * okType: '', // String (default: 'button-positive'). The type of the OK button. - * } - * ``` - * - * @returns {object} A promise which is resolved when the popup is closed. Has one additional - * function `close`, which can be called with any value to programmatically close the popup - * with the given value. - */ - alert: showAlert, - - /** - * @ngdoc method - * @name $ionicPopup#confirm - * @description - * Show a simple confirm popup with a Cancel and OK button. - * - * Resolves the promise with true if the user presses the OK button, and false if the - * user presses the Cancel button. - * - * @param {object} options The options for showing the confirm popup, of the form: - * - * ``` - * { - * title: '', // String. The title of the popup. - * cssClass: '', // String, The custom CSS class name - * subTitle: '', // String (optional). The sub-title of the popup. - * template: '', // String (optional). The html template to place in the popup body. - * templateUrl: '', // String (optional). The URL of an html template to place in the popup body. - * cancelText: '', // String (default: 'Cancel'). The text of the Cancel button. - * cancelType: '', // String (default: 'button-default'). The type of the Cancel button. - * okText: '', // String (default: 'OK'). The text of the OK button. - * okType: '', // String (default: 'button-positive'). The type of the OK button. - * } - * ``` - * - * @returns {object} A promise which is resolved when the popup is closed. Has one additional - * function `close`, which can be called with any value to programmatically close the popup - * with the given value. - */ - confirm: showConfirm, - - /** - * @ngdoc method - * @name $ionicPopup#prompt - * @description Show a simple prompt popup, which has an input, OK button, and Cancel button. - * Resolves the promise with the value of the input if the user presses OK, and with undefined - * if the user presses Cancel. - * - * ```javascript - * $ionicPopup.prompt({ - * title: 'Password Check', - * template: 'Enter your secret password', - * inputType: 'password', - * inputPlaceholder: 'Your password' - * }).then(function(res) { - * console.log('Your password is', res); - * }); - * ``` - * @param {object} options The options for showing the prompt popup, of the form: - * - * ``` - * { - * title: '', // String. The title of the popup. - * cssClass: '', // String, The custom CSS class name - * subTitle: '', // String (optional). The sub-title of the popup. - * template: '', // String (optional). The html template to place in the popup body. - * templateUrl: '', // String (optional). The URL of an html template to place in the popup body. - * inputType: // String (default: 'text'). The type of input to use - * defaultText: // String (default: ''). The initial value placed into the input. - * maxLength: // Integer (default: null). Specify a maxlength attribute for the input. - * inputPlaceholder: // String (default: ''). A placeholder to use for the input. - * cancelText: // String (default: 'Cancel'. The text of the Cancel button. - * cancelType: // String (default: 'button-default'). The type of the Cancel button. - * okText: // String (default: 'OK'). The text of the OK button. - * okType: // String (default: 'button-positive'). The type of the OK button. - * } - * ``` - * - * @returns {object} A promise which is resolved when the popup is closed. Has one additional - * function `close`, which can be called with any value to programmatically close the popup - * with the given value. - */ - prompt: showPrompt, - /** - * @private for testing - */ - _createPopup: createPopup, - _popupStack: popupStack - }; - - return $ionicPopup; - - function createPopup(options) { - options = extend({ - scope: null, - title: '', - buttons: [] - }, options || {}); - - var self = {}; - self.scope = (options.scope || $rootScope).$new(); - self.element = jqLite(POPUP_TPL); - self.responseDeferred = $q.defer(); - - $ionicBody.get().appendChild(self.element[0]); - $compile(self.element)(self.scope); - - extend(self.scope, { - title: options.title, - buttons: options.buttons, - subTitle: options.subTitle, - cssClass: options.cssClass, - $buttonTapped: function(button, event) { - var result = (button.onTap || noop).apply(self, [event]); - event = event.originalEvent || event; //jquery events - - if (!event.defaultPrevented) { - self.responseDeferred.resolve(result); - } - } - }); - - $q.when( - options.templateUrl ? - $ionicTemplateLoader.load(options.templateUrl) : - (options.template || options.content || '') - ).then(function(template) { - var popupBody = jqLite(self.element[0].querySelector('.popup-body')); - if (template) { - popupBody.html(template); - $compile(popupBody.contents())(self.scope); - } else { - popupBody.remove(); - } - }); - - self.show = function() { - if (self.isShown || self.removed) return; - - $ionicModal.stack.add(self); - self.isShown = true; - ionic.requestAnimationFrame(function() { - //if hidden while waiting for raf, don't show - if (!self.isShown) return; - - self.element.removeClass('popup-hidden'); - self.element.addClass('popup-showing active'); - focusInput(self.element); - }); - }; - - self.hide = function(callback) { - callback = callback || noop; - if (!self.isShown) return callback(); - - $ionicModal.stack.remove(self); - self.isShown = false; - self.element.removeClass('active'); - self.element.addClass('popup-hidden'); - $timeout(callback, 250, false); - }; - - self.remove = function() { - if (self.removed) return; - - self.hide(function() { - self.element.remove(); - self.scope.$destroy(); - }); - - self.removed = true; - }; - - return self; - } - - function onHardwareBackButton() { - var last = popupStack[popupStack.length - 1]; - last && last.responseDeferred.resolve(); - } - - function showPopup(options) { - var popup = $ionicPopup._createPopup(options); - var showDelay = 0; - - if (popupStack.length > 0) { - showDelay = config.stackPushDelay; - $timeout(popupStack[popupStack.length - 1].hide, showDelay, false); - } else { - //Add popup-open & backdrop if this is first popup - $ionicBody.addClass('popup-open'); - $ionicBackdrop.retain(); - //only show the backdrop on the first popup - $ionicPopup._backButtonActionDone = $ionicPlatform.registerBackButtonAction( - onHardwareBackButton, - IONIC_BACK_PRIORITY.popup - ); - } - - // Expose a 'close' method on the returned promise - popup.responseDeferred.promise.close = function popupClose(result) { - if (!popup.removed) popup.responseDeferred.resolve(result); - }; - //DEPRECATED: notify the promise with an object with a close method - popup.responseDeferred.notify({ close: popup.responseDeferred.close }); - - doShow(); - - return popup.responseDeferred.promise; - - function doShow() { - popupStack.push(popup); - $timeout(popup.show, showDelay, false); - - popup.responseDeferred.promise.then(function(result) { - var index = popupStack.indexOf(popup); - if (index !== -1) { - popupStack.splice(index, 1); - } - - popup.remove(); - - if (popupStack.length > 0) { - popupStack[popupStack.length - 1].show(); - } else { - $ionicBackdrop.release(); - //Remove popup-open & backdrop if this is last popup - $timeout(function() { - // wait to remove this due to a 300ms delay native - // click which would trigging whatever was underneath this - if (!popupStack.length) { - $ionicBody.removeClass('popup-open'); - } - }, 400, false); - ($ionicPopup._backButtonActionDone || noop)(); - } - - - return result; - }); - - } - - } - - function focusInput(element) { - var focusOn = element[0].querySelector('[autofocus]'); - if (focusOn) { - focusOn.focus(); - } - } - - function showAlert(opts) { - return showPopup(extend({ - buttons: [{ - text: opts.okText || 'OK', - type: opts.okType || 'button-positive', - onTap: function() { - return true; - } - }] - }, opts || {})); - } - - function showConfirm(opts) { - return showPopup(extend({ - buttons: [{ - text: opts.cancelText || 'Cancel', - type: opts.cancelType || 'button-default', - onTap: function() { return false; } - }, { - text: opts.okText || 'OK', - type: opts.okType || 'button-positive', - onTap: function() { return true; } - }] - }, opts || {})); - } - - function showPrompt(opts) { - var scope = $rootScope.$new(true); - scope.data = {}; - scope.data.fieldtype = opts.inputType ? opts.inputType : 'text'; - scope.data.response = opts.defaultText ? opts.defaultText : ''; - scope.data.placeholder = opts.inputPlaceholder ? opts.inputPlaceholder : ''; - scope.data.maxlength = opts.maxLength ? parseInt(opts.maxLength) : ''; - var text = ''; - if (opts.template && /<[a-z][\s\S]*>/i.test(opts.template) === false) { - text = '' + opts.template + ''; - delete opts.template; - } - return showPopup(extend({ - template: text + '', - scope: scope, - buttons: [{ - text: opts.cancelText || 'Cancel', - type: opts.cancelType || 'button-default', - onTap: function() {} - }, { - text: opts.okText || 'OK', - type: opts.okType || 'button-positive', - onTap: function() { - return scope.data.response || ''; - } - }] - }, opts || {})); - } -}]); - -/** - * @ngdoc service - * @name $ionicPosition - * @module ionic - * @description - * A set of utility methods that can be use to retrieve position of DOM elements. - * It is meant to be used where we need to absolute-position DOM elements in - * relation to other, existing elements (this is the case for tooltips, popovers, etc.). - * - * Adapted from [AngularUI Bootstrap](https://github.com/angular-ui/bootstrap/blob/master/src/position/position.js), - * ([license](https://github.com/angular-ui/bootstrap/blob/master/LICENSE)) - */ -IonicModule -.factory('$ionicPosition', ['$document', '$window', function($document, $window) { - - function getStyle(el, cssprop) { - if (el.currentStyle) { //IE - return el.currentStyle[cssprop]; - } else if ($window.getComputedStyle) { - return $window.getComputedStyle(el)[cssprop]; - } - // finally try and get inline style - return el.style[cssprop]; - } - - /** - * Checks if a given element is statically positioned - * @param element - raw DOM element - */ - function isStaticPositioned(element) { - return (getStyle(element, 'position') || 'static') === 'static'; - } - - /** - * returns the closest, non-statically positioned parentOffset of a given element - * @param element - */ - var parentOffsetEl = function(element) { - var docDomEl = $document[0]; - var offsetParent = element.offsetParent || docDomEl; - while (offsetParent && offsetParent !== docDomEl && isStaticPositioned(offsetParent)) { - offsetParent = offsetParent.offsetParent; - } - return offsetParent || docDomEl; - }; - - return { - /** - * @ngdoc method - * @name $ionicPosition#position - * @description Get the current coordinates of the element, relative to the offset parent. - * Read-only equivalent of [jQuery's position function](http://api.jquery.com/position/). - * @param {element} element The element to get the position of. - * @returns {object} Returns an object containing the properties top, left, width and height. - */ - position: function(element) { - var elBCR = this.offset(element); - var offsetParentBCR = { top: 0, left: 0 }; - var offsetParentEl = parentOffsetEl(element[0]); - if (offsetParentEl != $document[0]) { - offsetParentBCR = this.offset(jqLite(offsetParentEl)); - offsetParentBCR.top += offsetParentEl.clientTop - offsetParentEl.scrollTop; - offsetParentBCR.left += offsetParentEl.clientLeft - offsetParentEl.scrollLeft; - } - - var boundingClientRect = element[0].getBoundingClientRect(); - return { - width: boundingClientRect.width || element.prop('offsetWidth'), - height: boundingClientRect.height || element.prop('offsetHeight'), - top: elBCR.top - offsetParentBCR.top, - left: elBCR.left - offsetParentBCR.left - }; - }, - - /** - * @ngdoc method - * @name $ionicPosition#offset - * @description Get the current coordinates of the element, relative to the document. - * Read-only equivalent of [jQuery's offset function](http://api.jquery.com/offset/). - * @param {element} element The element to get the offset of. - * @returns {object} Returns an object containing the properties top, left, width and height. - */ - offset: function(element) { - var boundingClientRect = element[0].getBoundingClientRect(); - return { - width: boundingClientRect.width || element.prop('offsetWidth'), - height: boundingClientRect.height || element.prop('offsetHeight'), - top: boundingClientRect.top + ($window.pageYOffset || $document[0].documentElement.scrollTop), - left: boundingClientRect.left + ($window.pageXOffset || $document[0].documentElement.scrollLeft) - }; - } - - }; -}]); - - -/** - * @ngdoc service - * @name $ionicScrollDelegate - * @module ionic - * @description - * Delegate for controlling scrollViews (created by - * {@link ionic.directive:ionContent} and - * {@link ionic.directive:ionScroll} directives). - * - * Methods called directly on the $ionicScrollDelegate service will control all scroll - * views. Use the {@link ionic.service:$ionicScrollDelegate#$getByHandle $getByHandle} - * method to control specific scrollViews. - * - * @usage - * - * ```html - * - * - * - * - * - * ``` - * ```js - * function MainCtrl($scope, $ionicScrollDelegate) { - * $scope.scrollTop = function() { - * $ionicScrollDelegate.scrollTop(); - * }; - * } - * ``` - * - * Example of advanced usage, with two scroll areas using `delegate-handle` - * for fine control. - * - * ```html - * - * - * - * - * - * - * - * - * ``` - * ```js - * function MainCtrl($scope, $ionicScrollDelegate) { - * $scope.scrollMainToTop = function() { - * $ionicScrollDelegate.$getByHandle('mainScroll').scrollTop(); - * }; - * $scope.scrollSmallToTop = function() { - * $ionicScrollDelegate.$getByHandle('small').scrollTop(); - * }; - * } - * ``` - */ -IonicModule -.service('$ionicScrollDelegate', ionic.DelegateService([ - /** - * @ngdoc method - * @name $ionicScrollDelegate#resize - * @description Tell the scrollView to recalculate the size of its container. - */ - 'resize', - /** - * @ngdoc method - * @name $ionicScrollDelegate#scrollTop - * @param {boolean=} shouldAnimate Whether the scroll should animate. - */ - 'scrollTop', - /** - * @ngdoc method - * @name $ionicScrollDelegate#scrollBottom - * @param {boolean=} shouldAnimate Whether the scroll should animate. - */ - 'scrollBottom', - /** - * @ngdoc method - * @name $ionicScrollDelegate#scrollTo - * @param {number} left The x-value to scroll to. - * @param {number} top The y-value to scroll to. - * @param {boolean=} shouldAnimate Whether the scroll should animate. - */ - 'scrollTo', - /** - * @ngdoc method - * @name $ionicScrollDelegate#scrollBy - * @param {number} left The x-offset to scroll by. - * @param {number} top The y-offset to scroll by. - * @param {boolean=} shouldAnimate Whether the scroll should animate. - */ - 'scrollBy', - /** - * @ngdoc method - * @name $ionicScrollDelegate#zoomTo - * @param {number} level Level to zoom to. - * @param {boolean=} animate Whether to animate the zoom. - * @param {number=} originLeft Zoom in at given left coordinate. - * @param {number=} originTop Zoom in at given top coordinate. - */ - 'zoomTo', - /** - * @ngdoc method - * @name $ionicScrollDelegate#zoomBy - * @param {number} factor The factor to zoom by. - * @param {boolean=} animate Whether to animate the zoom. - * @param {number=} originLeft Zoom in at given left coordinate. - * @param {number=} originTop Zoom in at given top coordinate. - */ - 'zoomBy', - /** - * @ngdoc method - * @name $ionicScrollDelegate#getScrollPosition - * @returns {object} The scroll position of this view, with the following properties: - * - `{number}` `left` The distance the user has scrolled from the left (starts at 0). - * - `{number}` `top` The distance the user has scrolled from the top (starts at 0). - * - `{number}` `zoom` The current zoom level. - */ - 'getScrollPosition', - /** - * @ngdoc method - * @name $ionicScrollDelegate#anchorScroll - * @description Tell the scrollView to scroll to the element with an id - * matching window.location.hash. - * - * If no matching element is found, it will scroll to top. - * - * @param {boolean=} shouldAnimate Whether the scroll should animate. - */ - 'anchorScroll', - /** - * @ngdoc method - * @name $ionicScrollDelegate#freezeScroll - * @description Does not allow this scroll view to scroll either x or y. - * @param {boolean=} shouldFreeze Should this scroll view be prevented from scrolling or not. - * @returns {boolean} If the scroll view is being prevented from scrolling or not. - */ - 'freezeScroll', - /** - * @ngdoc method - * @name $ionicScrollDelegate#freezeAllScrolls - * @description Does not allow any of the app's scroll views to scroll either x or y. - * @param {boolean=} shouldFreeze Should all app scrolls be prevented from scrolling or not. - */ - 'freezeAllScrolls', - /** - * @ngdoc method - * @name $ionicScrollDelegate#getScrollView - * @returns {object} The scrollView associated with this delegate. - */ - 'getScrollView' - /** - * @ngdoc method - * @name $ionicScrollDelegate#$getByHandle - * @param {string} handle - * @returns `delegateInstance` A delegate instance that controls only the - * scrollViews with `delegate-handle` matching the given handle. - * - * Example: `$ionicScrollDelegate.$getByHandle('my-handle').scrollTop();` - */ -])); - - -/** - * @ngdoc service - * @name $ionicSideMenuDelegate - * @module ionic - * - * @description - * Delegate for controlling the {@link ionic.directive:ionSideMenus} directive. - * - * Methods called directly on the $ionicSideMenuDelegate service will control all side - * menus. Use the {@link ionic.service:$ionicSideMenuDelegate#$getByHandle $getByHandle} - * method to control specific ionSideMenus instances. - * - * @usage - * - * ```html - * - * - * - * Content! - * - * - * - * Left Menu! - * - * - * - * ``` - * ```js - * function MainCtrl($scope, $ionicSideMenuDelegate) { - * $scope.toggleLeftSideMenu = function() { - * $ionicSideMenuDelegate.toggleLeft(); - * }; - * } - * ``` - */ -IonicModule -.service('$ionicSideMenuDelegate', ionic.DelegateService([ - /** - * @ngdoc method - * @name $ionicSideMenuDelegate#toggleLeft - * @description Toggle the left side menu (if it exists). - * @param {boolean=} isOpen Whether to open or close the menu. - * Default: Toggles the menu. - */ - 'toggleLeft', - /** - * @ngdoc method - * @name $ionicSideMenuDelegate#toggleRight - * @description Toggle the right side menu (if it exists). - * @param {boolean=} isOpen Whether to open or close the menu. - * Default: Toggles the menu. - */ - 'toggleRight', - /** - * @ngdoc method - * @name $ionicSideMenuDelegate#getOpenRatio - * @description Gets the ratio of open amount over menu width. For example, a - * menu of width 100 that is opened by 50 pixels is 50% opened, and would return - * a ratio of 0.5. - * - * @returns {float} 0 if nothing is open, between 0 and 1 if left menu is - * opened/opening, and between 0 and -1 if right menu is opened/opening. - */ - 'getOpenRatio', - /** - * @ngdoc method - * @name $ionicSideMenuDelegate#isOpen - * @returns {boolean} Whether either the left or right menu is currently opened. - */ - 'isOpen', - /** - * @ngdoc method - * @name $ionicSideMenuDelegate#isOpenLeft - * @returns {boolean} Whether the left menu is currently opened. - */ - 'isOpenLeft', - /** - * @ngdoc method - * @name $ionicSideMenuDelegate#isOpenRight - * @returns {boolean} Whether the right menu is currently opened. - */ - 'isOpenRight', - /** - * @ngdoc method - * @name $ionicSideMenuDelegate#canDragContent - * @param {boolean=} canDrag Set whether the content can or cannot be dragged to open - * side menus. - * @returns {boolean} Whether the content can be dragged to open side menus. - */ - 'canDragContent', - /** - * @ngdoc method - * @name $ionicSideMenuDelegate#edgeDragThreshold - * @param {boolean|number=} value Set whether the content drag can only start if it is below a certain threshold distance from the edge of the screen. Accepts three different values: - * - If a non-zero number is given, that many pixels is used as the maximum allowed distance from the edge that starts dragging the side menu. - * - If true is given, the default number of pixels (25) is used as the maximum allowed distance. - * - If false or 0 is given, the edge drag threshold is disabled, and dragging from anywhere on the content is allowed. - * @returns {boolean} Whether the drag can start only from within the edge of screen threshold. - */ - 'edgeDragThreshold' - /** - * @ngdoc method - * @name $ionicSideMenuDelegate#$getByHandle - * @param {string} handle - * @returns `delegateInstance` A delegate instance that controls only the - * {@link ionic.directive:ionSideMenus} directives with `delegate-handle` matching - * the given handle. - * - * Example: `$ionicSideMenuDelegate.$getByHandle('my-handle').toggleLeft();` - */ -])); - - -/** - * @ngdoc service - * @name $ionicSlideBoxDelegate - * @module ionic - * @description - * Delegate that controls the {@link ionic.directive:ionSlideBox} directive. - * - * Methods called directly on the $ionicSlideBoxDelegate service will control all slide boxes. Use the {@link ionic.service:$ionicSlideBoxDelegate#$getByHandle $getByHandle} - * method to control specific slide box instances. - * - * @usage - * - * ```html - * - * - * - *
- * - *
- * - * - *
- * Slide 2! - *
- * - * - * - * ``` - * ```js - * function MyCtrl($scope, $ionicSlideBoxDelegate) { - * $scope.nextSlide = function() { - * $ionicSlideBoxDelegate.next(); - * } - * } - * ``` - */ -IonicModule -.service('$ionicSlideBoxDelegate', ionic.DelegateService([ - /** - * @ngdoc method - * @name $ionicSlideBoxDelegate#update - * @description - * Update the slidebox (for example if using Angular with ng-repeat, - * resize it for the elements inside). - */ - 'update', - /** - * @ngdoc method - * @name $ionicSlideBoxDelegate#slide - * @param {number} to The index to slide to. - * @param {number=} speed The number of milliseconds the change should take. - */ - 'slide', - 'select', - /** - * @ngdoc method - * @name $ionicSlideBoxDelegate#enableSlide - * @param {boolean=} shouldEnable Whether to enable sliding the slidebox. - * @returns {boolean} Whether sliding is enabled. - */ - 'enableSlide', - /** - * @ngdoc method - * @name $ionicSlideBoxDelegate#previous - * @param {number=} speed The number of milliseconds the change should take. - * @description Go to the previous slide. Wraps around if at the beginning. - */ - 'previous', - /** - * @ngdoc method - * @name $ionicSlideBoxDelegate#next - * @param {number=} speed The number of milliseconds the change should take. - * @description Go to the next slide. Wraps around if at the end. - */ - 'next', - /** - * @ngdoc method - * @name $ionicSlideBoxDelegate#stop - * @description Stop sliding. The slideBox will not move again until - * explicitly told to do so. - */ - 'stop', - 'autoPlay', - /** - * @ngdoc method - * @name $ionicSlideBoxDelegate#start - * @description Start sliding again if the slideBox was stopped. - */ - 'start', - /** - * @ngdoc method - * @name $ionicSlideBoxDelegate#currentIndex - * @returns number The index of the current slide. - */ - 'currentIndex', - 'selected', - /** - * @ngdoc method - * @name $ionicSlideBoxDelegate#slidesCount - * @returns number The number of slides there are currently. - */ - 'slidesCount', - 'count', - 'loop' - /** - * @ngdoc method - * @name $ionicSlideBoxDelegate#$getByHandle - * @param {string} handle - * @returns `delegateInstance` A delegate instance that controls only the - * {@link ionic.directive:ionSlideBox} directives with `delegate-handle` matching - * the given handle. - * - * Example: `$ionicSlideBoxDelegate.$getByHandle('my-handle').stop();` - */ -])); - - -/** - * @ngdoc service - * @name $ionicTabsDelegate - * @module ionic - * - * @description - * Delegate for controlling the {@link ionic.directive:ionTabs} directive. - * - * Methods called directly on the $ionicTabsDelegate service will control all ionTabs - * directives. Use the {@link ionic.service:$ionicTabsDelegate#$getByHandle $getByHandle} - * method to control specific ionTabs instances. - * - * @usage - * - * ```html - * - * - * - * - * Hello tab 1! - * - * - * Hello tab 2! - * - * - * - * ``` - * ```js - * function MyCtrl($scope, $ionicTabsDelegate) { - * $scope.selectTabWithIndex = function(index) { - * $ionicTabsDelegate.select(index); - * } - * } - * ``` - */ -IonicModule -.service('$ionicTabsDelegate', ionic.DelegateService([ - /** - * @ngdoc method - * @name $ionicTabsDelegate#select - * @description Select the tab matching the given index. - * - * @param {number} index Index of the tab to select. - */ - 'select', - /** - * @ngdoc method - * @name $ionicTabsDelegate#selectedIndex - * @returns `number` The index of the selected tab, or -1. - */ - 'selectedIndex', - /** - * @ngdoc method - * @name $ionicTabsDelegate#showBar - * @description - * Set/get whether the {@link ionic.directive:ionTabs} is shown - * @param {boolean} show Whether to show the bar. - * @returns {boolean} Whether the bar is shown. - */ - 'showBar' - /** - * @ngdoc method - * @name $ionicTabsDelegate#$getByHandle - * @param {string} handle - * @returns `delegateInstance` A delegate instance that controls only the - * {@link ionic.directive:ionTabs} directives with `delegate-handle` matching - * the given handle. - * - * Example: `$ionicTabsDelegate.$getByHandle('my-handle').select(0);` - */ -])); - -// closure to keep things neat -(function() { - var templatesToCache = []; - -/** - * @ngdoc service - * @name $ionicTemplateCache - * @module ionic - * @description A service that preemptively caches template files to eliminate transition flicker and boost performance. - * @usage - * State templates are cached automatically, but you can optionally cache other templates. - * - * ```js - * $ionicTemplateCache('myNgIncludeTemplate.html'); - * ``` - * - * Optionally disable all preemptive caching with the `$ionicConfigProvider` or individual states by setting `prefetchTemplate` - * in the `$state` definition - * - * ```js - * angular.module('myApp', ['ionic']) - * .config(function($stateProvider, $ionicConfigProvider) { - * - * // disable preemptive template caching globally - * $ionicConfigProvider.templates.prefetch(false); - * - * // disable individual states - * $stateProvider - * .state('tabs', { - * url: "/tab", - * abstract: true, - * prefetchTemplate: false, - * templateUrl: "tabs-templates/tabs.html" - * }) - * .state('tabs.home', { - * url: "/home", - * views: { - * 'home-tab': { - * prefetchTemplate: false, - * templateUrl: "tabs-templates/home.html", - * controller: 'HomeTabCtrl' - * } - * } - * }); - * }); - * ``` - */ -IonicModule -.factory('$ionicTemplateCache', [ -'$http', -'$templateCache', -'$timeout', -function($http, $templateCache, $timeout) { - var toCache = templatesToCache, - hasRun; - - function $ionicTemplateCache(templates) { - if (typeof templates === 'undefined') { - return run(); - } - if (isString(templates)) { - templates = [templates]; - } - forEach(templates, function(template) { - toCache.push(template); - }); - if (hasRun) { - run(); - } - } - - // run through methods - internal method - function run() { - var template; - $ionicTemplateCache._runCount++; - - hasRun = true; - // ignore if race condition already zeroed out array - if (toCache.length === 0) return; - - var i = 0; - while (i < 4 && (template = toCache.pop())) { - // note that inline templates are ignored by this request - if (isString(template)) $http.get(template, { cache: $templateCache }); - i++; - } - // only preload 3 templates a second - if (toCache.length) { - $timeout(run, 1000); - } - } - - // exposing for testing - $ionicTemplateCache._runCount = 0; - // default method - return $ionicTemplateCache; -}]) - -// Intercepts the $stateprovider.state() command to look for templateUrls that can be cached -.config([ -'$stateProvider', -'$ionicConfigProvider', -function($stateProvider, $ionicConfigProvider) { - var stateProviderState = $stateProvider.state; - $stateProvider.state = function(stateName, definition) { - // don't even bother if it's disabled. note, another config may run after this, so it's not a catch-all - if (typeof definition === 'object') { - var enabled = definition.prefetchTemplate !== false && templatesToCache.length < $ionicConfigProvider.templates.maxPrefetch(); - if (enabled && isString(definition.templateUrl)) templatesToCache.push(definition.templateUrl); - if (angular.isObject(definition.views)) { - for (var key in definition.views) { - enabled = definition.views[key].prefetchTemplate !== false && templatesToCache.length < $ionicConfigProvider.templates.maxPrefetch(); - if (enabled && isString(definition.views[key].templateUrl)) templatesToCache.push(definition.views[key].templateUrl); - } - } - } - return stateProviderState.call($stateProvider, stateName, definition); - }; -}]) - -// process the templateUrls collected by the $stateProvider, adding them to the cache -.run(['$ionicTemplateCache', function($ionicTemplateCache) { - $ionicTemplateCache(); -}]); - -})(); - -IonicModule -.factory('$ionicTemplateLoader', [ - '$compile', - '$controller', - '$http', - '$q', - '$rootScope', - '$templateCache', -function($compile, $controller, $http, $q, $rootScope, $templateCache) { - - return { - load: fetchTemplate, - compile: loadAndCompile - }; - - function fetchTemplate(url) { - return $http.get(url, {cache: $templateCache}) - .then(function(response) { - return response.data && response.data.trim(); - }); - } - - function loadAndCompile(options) { - options = extend({ - template: '', - templateUrl: '', - scope: null, - controller: null, - locals: {}, - appendTo: null - }, options || {}); - - var templatePromise = options.templateUrl ? - this.load(options.templateUrl) : - $q.when(options.template); - - return templatePromise.then(function(template) { - var controller; - var scope = options.scope || $rootScope.$new(); - - //Incase template doesn't have just one root element, do this - var element = jqLite('
').html(template).contents(); - - if (options.controller) { - controller = $controller( - options.controller, - extend(options.locals, { - $scope: scope - }) - ); - element.children().data('$ngControllerController', controller); - } - if (options.appendTo) { - jqLite(options.appendTo).append(element); - } - - $compile(element)(scope); - - return { - element: element, - scope: scope - }; - }); - } - -}]); - -/** - * @private - * DEPRECATED, as of v1.0.0-beta14 ------- - */ -IonicModule -.factory('$ionicViewService', ['$ionicHistory', '$log', function($ionicHistory, $log) { - - function warn(oldMethod, newMethod) { - $log.warn('$ionicViewService' + oldMethod + ' is deprecated, please use $ionicHistory' + newMethod + ' instead: http://ionicframework.com/docs/nightly/api/service/$ionicHistory/'); - } - - warn('', ''); - - var methodsMap = { - getCurrentView: 'currentView', - getBackView: 'backView', - getForwardView: 'forwardView', - getCurrentStateName: 'currentStateName', - nextViewOptions: 'nextViewOptions', - clearHistory: 'clearHistory' - }; - - forEach(methodsMap, function(newMethod, oldMethod) { - methodsMap[oldMethod] = function() { - warn('.' + oldMethod, '.' + newMethod); - return $ionicHistory[newMethod].apply(this, arguments); - }; - }); - - return methodsMap; - -}]); - -/** - * @private - * TODO document - */ - -IonicModule.factory('$ionicViewSwitcher', [ - '$timeout', - '$document', - '$q', - '$ionicClickBlock', - '$ionicConfig', - '$ionicNavBarDelegate', -function($timeout, $document, $q, $ionicClickBlock, $ionicConfig, $ionicNavBarDelegate) { - - var TRANSITIONEND_EVENT = 'webkitTransitionEnd transitionend'; - var DATA_NO_CACHE = '$noCache'; - var DATA_DESTROY_ELE = '$destroyEle'; - var DATA_ELE_IDENTIFIER = '$eleId'; - var DATA_VIEW_ACCESSED = '$accessed'; - var DATA_FALLBACK_TIMER = '$fallbackTimer'; - var DATA_VIEW = '$viewData'; - var NAV_VIEW_ATTR = 'nav-view'; - var VIEW_STATUS_ACTIVE = 'active'; - var VIEW_STATUS_CACHED = 'cached'; - var VIEW_STATUS_STAGED = 'stage'; - - var transitionCounter = 0; - var nextTransition, nextDirection; - ionic.transition = ionic.transition || {}; - ionic.transition.isActive = false; - var isActiveTimer; - var cachedAttr = ionic.DomUtil.cachedAttr; - var transitionPromises = []; - var defaultTimeout = 1100; - - var ionicViewSwitcher = { - - create: function(navViewCtrl, viewLocals, enteringView, leavingView, renderStart, renderEnd) { - // get a reference to an entering/leaving element if they exist - // loop through to see if the view is already in the navViewElement - var enteringEle, leavingEle; - var transitionId = ++transitionCounter; - var alreadyInDom; - - var switcher = { - - init: function(registerData, callback) { - ionicViewSwitcher.isTransitioning(true); - - switcher.loadViewElements(registerData); - - switcher.render(registerData, function() { - callback && callback(); - }); - }, - - loadViewElements: function(registerData) { - var x, l, viewEle; - var viewElements = navViewCtrl.getViewElements(); - var enteringEleIdentifier = getViewElementIdentifier(viewLocals, enteringView); - var navViewActiveEleId = navViewCtrl.activeEleId(); - - for (x = 0, l = viewElements.length; x < l; x++) { - viewEle = viewElements.eq(x); - - if (viewEle.data(DATA_ELE_IDENTIFIER) === enteringEleIdentifier) { - // we found an existing element in the DOM that should be entering the view - if (viewEle.data(DATA_NO_CACHE)) { - // the existing element should not be cached, don't use it - viewEle.data(DATA_ELE_IDENTIFIER, enteringEleIdentifier + ionic.Utils.nextUid()); - viewEle.data(DATA_DESTROY_ELE, true); - - } else { - enteringEle = viewEle; - } - - } else if (isDefined(navViewActiveEleId) && viewEle.data(DATA_ELE_IDENTIFIER) === navViewActiveEleId) { - leavingEle = viewEle; - } - - if (enteringEle && leavingEle) break; - } - - alreadyInDom = !!enteringEle; - - if (!alreadyInDom) { - // still no existing element to use - // create it using existing template/scope/locals - enteringEle = registerData.ele || ionicViewSwitcher.createViewEle(viewLocals); - - // existing elements in the DOM are looked up by their state name and state id - enteringEle.data(DATA_ELE_IDENTIFIER, enteringEleIdentifier); - } - - if (renderEnd) { - navViewCtrl.activeEleId(enteringEleIdentifier); - } - - registerData.ele = null; - }, - - render: function(registerData, callback) { - if (alreadyInDom) { - // it was already found in the DOM, just reconnect the scope - ionic.Utils.reconnectScope(enteringEle.scope()); - - } else { - // the entering element is not already in the DOM - // set that the entering element should be "staged" and its - // styles of where this element will go before it hits the DOM - navViewAttr(enteringEle, VIEW_STATUS_STAGED); - - var enteringData = getTransitionData(viewLocals, enteringEle, registerData.direction, enteringView); - var transitionFn = $ionicConfig.transitions.views[enteringData.transition] || $ionicConfig.transitions.views.none; - transitionFn(enteringEle, null, enteringData.direction, true).run(0); - - enteringEle.data(DATA_VIEW, { - viewId: enteringData.viewId, - historyId: enteringData.historyId, - stateName: enteringData.stateName, - stateParams: enteringData.stateParams - }); - - // if the current state has cache:false - // or the element has cache-view="false" attribute - if (viewState(viewLocals).cache === false || viewState(viewLocals).cache === 'false' || - enteringEle.attr('cache-view') == 'false' || $ionicConfig.views.maxCache() === 0) { - enteringEle.data(DATA_NO_CACHE, true); - } - - // append the entering element to the DOM, create a new scope and run link - var viewScope = navViewCtrl.appendViewElement(enteringEle, viewLocals); - - delete enteringData.direction; - delete enteringData.transition; - viewScope.$emit('$ionicView.loaded', enteringData); - } - - // update that this view was just accessed - enteringEle.data(DATA_VIEW_ACCESSED, Date.now()); - - callback && callback(); - }, - - transition: function(direction, enableBack, allowAnimate) { - var deferred; - var enteringData = getTransitionData(viewLocals, enteringEle, direction, enteringView); - var leavingData = extend(extend({}, enteringData), getViewData(leavingView)); - enteringData.transitionId = leavingData.transitionId = transitionId; - enteringData.fromCache = !!alreadyInDom; - enteringData.enableBack = !!enableBack; - enteringData.renderStart = renderStart; - enteringData.renderEnd = renderEnd; - - cachedAttr(enteringEle.parent(), 'nav-view-transition', enteringData.transition); - cachedAttr(enteringEle.parent(), 'nav-view-direction', enteringData.direction); - - // cancel any previous transition complete fallbacks - $timeout.cancel(enteringEle.data(DATA_FALLBACK_TIMER)); - - // get the transition ready and see if it'll animate - var transitionFn = $ionicConfig.transitions.views[enteringData.transition] || $ionicConfig.transitions.views.none; - var viewTransition = transitionFn(enteringEle, leavingEle, enteringData.direction, - enteringData.shouldAnimate && allowAnimate && renderEnd); - - if (viewTransition.shouldAnimate) { - // attach transitionend events (and fallback timer) - enteringEle.on(TRANSITIONEND_EVENT, completeOnTransitionEnd); - enteringEle.data(DATA_FALLBACK_TIMER, $timeout(transitionComplete, defaultTimeout)); - $ionicClickBlock.show(defaultTimeout); - } - - if (renderStart) { - // notify the views "before" the transition starts - switcher.emit('before', enteringData, leavingData); - - // stage entering element, opacity 0, no transition duration - navViewAttr(enteringEle, VIEW_STATUS_STAGED); - - // render the elements in the correct location for their starting point - viewTransition.run(0); - } - - if (renderEnd) { - // create a promise so we can keep track of when all transitions finish - // only required if this transition should complete - deferred = $q.defer(); - transitionPromises.push(deferred.promise); - } - - if (renderStart && renderEnd) { - // CSS "auto" transitioned, not manually transitioned - // wait a frame so the styles apply before auto transitioning - $timeout(function() { - ionic.requestAnimationFrame(onReflow); - }); - } else if (!renderEnd) { - // just the start of a manual transition - // but it will not render the end of the transition - navViewAttr(enteringEle, 'entering'); - navViewAttr(leavingEle, 'leaving'); - - // return the transition run method so each step can be ran manually - return { - run: viewTransition.run, - cancel: function(shouldAnimate) { - if (shouldAnimate) { - enteringEle.on(TRANSITIONEND_EVENT, cancelOnTransitionEnd); - enteringEle.data(DATA_FALLBACK_TIMER, $timeout(cancelTransition, defaultTimeout)); - $ionicClickBlock.show(defaultTimeout); - } else { - cancelTransition(); - } - viewTransition.shouldAnimate = shouldAnimate; - viewTransition.run(0); - viewTransition = null; - } - }; - - } else if (renderEnd) { - // just the end of a manual transition - // happens after the manual transition has completed - // and a full history change has happened - onReflow(); - } - - - function onReflow() { - // remove that we're staging the entering element so it can auto transition - navViewAttr(enteringEle, viewTransition.shouldAnimate ? 'entering' : VIEW_STATUS_ACTIVE); - navViewAttr(leavingEle, viewTransition.shouldAnimate ? 'leaving' : VIEW_STATUS_CACHED); - - // start the auto transition and let the CSS take over - viewTransition.run(1); - - // trigger auto transitions on the associated nav bars - $ionicNavBarDelegate._instances.forEach(function(instance) { - instance.triggerTransitionStart(transitionId); - }); - - if (!viewTransition.shouldAnimate) { - // no animated auto transition - transitionComplete(); - } - } - - // Make sure that transitionend events bubbling up from children won't fire - // transitionComplete. Will only go forward if ev.target == the element listening. - function completeOnTransitionEnd(ev) { - if (ev.target !== this) return; - transitionComplete(); - } - function transitionComplete() { - if (transitionComplete.x) return; - transitionComplete.x = true; - - enteringEle.off(TRANSITIONEND_EVENT, completeOnTransitionEnd); - $timeout.cancel(enteringEle.data(DATA_FALLBACK_TIMER)); - leavingEle && $timeout.cancel(leavingEle.data(DATA_FALLBACK_TIMER)); - - // resolve that this one transition (there could be many w/ nested views) - deferred && deferred.resolve(navViewCtrl); - - // the most recent transition added has completed and all the active - // transition promises should be added to the services array of promises - if (transitionId === transitionCounter) { - $q.all(transitionPromises).then(ionicViewSwitcher.transitionEnd); - - // emit that the views have finished transitioning - // each parent nav-view will update which views are active and cached - switcher.emit('after', enteringData, leavingData); - switcher.cleanup(enteringData); - } - - // tell the nav bars that the transition has ended - $ionicNavBarDelegate._instances.forEach(function(instance) { - instance.triggerTransitionEnd(); - }); - - - // remove any references that could cause memory issues - nextTransition = nextDirection = enteringView = leavingView = enteringEle = leavingEle = null; - } - - // Make sure that transitionend events bubbling up from children won't fire - // transitionComplete. Will only go forward if ev.target == the element listening. - function cancelOnTransitionEnd(ev) { - if (ev.target !== this) return; - cancelTransition(); - } - function cancelTransition() { - navViewAttr(enteringEle, VIEW_STATUS_CACHED); - navViewAttr(leavingEle, VIEW_STATUS_ACTIVE); - enteringEle.off(TRANSITIONEND_EVENT, cancelOnTransitionEnd); - $timeout.cancel(enteringEle.data(DATA_FALLBACK_TIMER)); - ionicViewSwitcher.transitionEnd([navViewCtrl]); - } - - }, - - emit: function(step, enteringData, leavingData) { - var enteringScope = getScopeForElement(enteringEle, enteringData); - var leavingScope = getScopeForElement(leavingEle, leavingData); - - var prefixesAreEqual; - - if ( !enteringData.viewId || enteringData.abstractView ) { - // it's an abstract view, so treat it accordingly - - // we only get access to the leaving scope once in the transition, - // so dispatch all events right away if it exists - if ( leavingScope ) { - leavingScope.$emit('$ionicView.beforeLeave', leavingData); - leavingScope.$emit('$ionicView.leave', leavingData); - leavingScope.$emit('$ionicView.afterLeave', leavingData); - leavingScope.$broadcast('$ionicParentView.beforeLeave', leavingData); - leavingScope.$broadcast('$ionicParentView.leave', leavingData); - leavingScope.$broadcast('$ionicParentView.afterLeave', leavingData); - } - } - else { - // it's a regular view, so do the normal process - if (step == 'after') { - if (enteringScope) { - enteringScope.$emit('$ionicView.enter', enteringData); - enteringScope.$broadcast('$ionicParentView.enter', enteringData); - } - - if (leavingScope) { - leavingScope.$emit('$ionicView.leave', leavingData); - leavingScope.$broadcast('$ionicParentView.leave', leavingData); - } - else if (enteringScope && leavingData && leavingData.viewId && enteringData.stateName !== leavingData.stateName) { - // we only want to dispatch this when we are doing a single-tier - // state change such as changing a tab, so compare the state - // for the same state-prefix but different suffix - prefixesAreEqual = compareStatePrefixes(enteringData.stateName, leavingData.stateName); - if ( prefixesAreEqual ) { - enteringScope.$emit('$ionicNavView.leave', leavingData); - } - } - } - - if (enteringScope) { - enteringScope.$emit('$ionicView.' + step + 'Enter', enteringData); - enteringScope.$broadcast('$ionicParentView.' + step + 'Enter', enteringData); - } - - if (leavingScope) { - leavingScope.$emit('$ionicView.' + step + 'Leave', leavingData); - leavingScope.$broadcast('$ionicParentView.' + step + 'Leave', leavingData); - - } else if (enteringScope && leavingData && leavingData.viewId && enteringData.stateName !== leavingData.stateName) { - // we only want to dispatch this when we are doing a single-tier - // state change such as changing a tab, so compare the state - // for the same state-prefix but different suffix - prefixesAreEqual = compareStatePrefixes(enteringData.stateName, leavingData.stateName); - if ( prefixesAreEqual ) { - enteringScope.$emit('$ionicNavView.' + step + 'Leave', leavingData); - } - } - } - }, - - cleanup: function(transData) { - // check if any views should be removed - if (leavingEle && transData.direction == 'back' && !$ionicConfig.views.forwardCache()) { - // if they just navigated back we can destroy the forward view - // do not remove forward views if cacheForwardViews config is true - destroyViewEle(leavingEle); - } - - var viewElements = navViewCtrl.getViewElements(); - var viewElementsLength = viewElements.length; - var x, viewElement; - var removeOldestAccess = (viewElementsLength - 1) > $ionicConfig.views.maxCache(); - var removableEle; - var oldestAccess = Date.now(); - - for (x = 0; x < viewElementsLength; x++) { - viewElement = viewElements.eq(x); - - if (removeOldestAccess && viewElement.data(DATA_VIEW_ACCESSED) < oldestAccess) { - // remember what was the oldest element to be accessed so it can be destroyed - oldestAccess = viewElement.data(DATA_VIEW_ACCESSED); - removableEle = viewElements.eq(x); - - } else if (viewElement.data(DATA_DESTROY_ELE) && navViewAttr(viewElement) != VIEW_STATUS_ACTIVE) { - destroyViewEle(viewElement); - } - } - - destroyViewEle(removableEle); - - if (enteringEle.data(DATA_NO_CACHE)) { - enteringEle.data(DATA_DESTROY_ELE, true); - } - }, - - enteringEle: function() { return enteringEle; }, - leavingEle: function() { return leavingEle; } - - }; - - return switcher; - }, - - transitionEnd: function(navViewCtrls) { - forEach(navViewCtrls, function(navViewCtrl) { - navViewCtrl.transitionEnd(); - }); - - ionicViewSwitcher.isTransitioning(false); - $ionicClickBlock.hide(); - transitionPromises = []; - }, - - nextTransition: function(val) { - nextTransition = val; - }, - - nextDirection: function(val) { - nextDirection = val; - }, - - isTransitioning: function(val) { - if (arguments.length) { - ionic.transition.isActive = !!val; - $timeout.cancel(isActiveTimer); - if (val) { - isActiveTimer = $timeout(function() { - ionicViewSwitcher.isTransitioning(false); - }, 999); - } - } - return ionic.transition.isActive; - }, - - createViewEle: function(viewLocals) { - var containerEle = $document[0].createElement('div'); - if (viewLocals && viewLocals.$template) { - containerEle.innerHTML = viewLocals.$template; - if (containerEle.children.length === 1) { - containerEle.children[0].classList.add('pane'); - if ( viewLocals.$$state && viewLocals.$$state.self && viewLocals.$$state.self['abstract'] ) { - angular.element(containerEle.children[0]).attr("abstract", "true"); - } - else { - if ( viewLocals.$$state && viewLocals.$$state.self ) { - angular.element(containerEle.children[0]).attr("state", viewLocals.$$state.self.name); - } - - } - return jqLite(containerEle.children[0]); - } - } - containerEle.className = "pane"; - return jqLite(containerEle); - }, - - viewEleIsActive: function(viewEle, isActiveAttr) { - navViewAttr(viewEle, isActiveAttr ? VIEW_STATUS_ACTIVE : VIEW_STATUS_CACHED); - }, - - getTransitionData: getTransitionData, - navViewAttr: navViewAttr, - destroyViewEle: destroyViewEle - - }; - - return ionicViewSwitcher; - - - function getViewElementIdentifier(locals, view) { - if (viewState(locals)['abstract']) return viewState(locals).name; - if (view) return view.stateId || view.viewId; - return ionic.Utils.nextUid(); - } - - function viewState(locals) { - return locals && locals.$$state && locals.$$state.self || {}; - } - - function getTransitionData(viewLocals, enteringEle, direction, view) { - // Priority - // 1) attribute directive on the button/link to this view - // 2) entering element's attribute - // 3) entering view's $state config property - // 4) view registration data - // 5) global config - // 6) fallback value - - var state = viewState(viewLocals); - var viewTransition = nextTransition || cachedAttr(enteringEle, 'view-transition') || state.viewTransition || $ionicConfig.views.transition() || 'ios'; - var navBarTransition = $ionicConfig.navBar.transition(); - direction = nextDirection || cachedAttr(enteringEle, 'view-direction') || state.viewDirection || direction || 'none'; - - return extend(getViewData(view), { - transition: viewTransition, - navBarTransition: navBarTransition === 'view' ? viewTransition : navBarTransition, - direction: direction, - shouldAnimate: (viewTransition !== 'none' && direction !== 'none') - }); - } - - function getViewData(view) { - view = view || {}; - return { - viewId: view.viewId, - historyId: view.historyId, - stateId: view.stateId, - stateName: view.stateName, - stateParams: view.stateParams - }; - } - - function navViewAttr(ele, value) { - if (arguments.length > 1) { - cachedAttr(ele, NAV_VIEW_ATTR, value); - } else { - return cachedAttr(ele, NAV_VIEW_ATTR); - } - } - - function destroyViewEle(ele) { - // we found an element that should be removed - // destroy its scope, then remove the element - if (ele && ele.length) { - var viewScope = ele.scope(); - if (viewScope) { - viewScope.$emit('$ionicView.unloaded', ele.data(DATA_VIEW)); - viewScope.$destroy(); - } - ele.remove(); - } - } - - function compareStatePrefixes(enteringStateName, exitingStateName) { - var enteringStateSuffixIndex = enteringStateName.lastIndexOf('.'); - var exitingStateSuffixIndex = exitingStateName.lastIndexOf('.'); - - // if either of the prefixes are empty, just return false - if ( enteringStateSuffixIndex < 0 || exitingStateSuffixIndex < 0 ) { - return false; - } - - var enteringPrefix = enteringStateName.substring(0, enteringStateSuffixIndex); - var exitingPrefix = exitingStateName.substring(0, exitingStateSuffixIndex); - - return enteringPrefix === exitingPrefix; - } - - function getScopeForElement(element, stateData) { - if ( !element ) { - return null; - } - // check if it's abstract - var attributeValue = angular.element(element).attr("abstract"); - var stateValue = angular.element(element).attr("state"); - - if ( attributeValue !== "true" ) { - // it's not an abstract view, so make sure the element - // matches the state. Due to abstract view weirdness, - // sometimes it doesn't. If it doesn't, don't dispatch events - // so leave the scope undefined - if ( stateValue === stateData.stateName ) { - return angular.element(element).scope(); - } - return null; - } - else { - // it is an abstract element, so look for element with the "state" attributeValue - // set to the name of the stateData state - var elements = aggregateNavViewChildren(element); - for ( var i = 0; i < elements.length; i++ ) { - var state = angular.element(elements[i]).attr("state"); - if ( state === stateData.stateName ) { - stateData.abstractView = true; - return angular.element(elements[i]).scope(); - } - } - // we didn't find a match, so return null - return null; - } - } - - function aggregateNavViewChildren(element) { - var aggregate = []; - var navViews = angular.element(element).find("ion-nav-view"); - for ( var i = 0; i < navViews.length; i++ ) { - var children = angular.element(navViews[i]).children(); - var childrenAggregated = []; - for ( var j = 0; j < children.length; j++ ) { - childrenAggregated = childrenAggregated.concat(children[j]); - } - aggregate = aggregate.concat(childrenAggregated); - } - return aggregate; - } - -}]); - -/** - * ================== angular-ios9-uiwebview.patch.js v1.1.1 ================== - * - * This patch works around iOS9 UIWebView regression that causes infinite digest - * errors in Angular. - * - * The patch can be applied to Angular 1.2.0 – 1.4.5. Newer versions of Angular - * have the workaround baked in. - * - * To apply this patch load/bundle this file with your application and add a - * dependency on the "ngIOS9UIWebViewPatch" module to your main app module. - * - * For example: - * - * ``` - * angular.module('myApp', ['ngRoute'])` - * ``` - * - * becomes - * - * ``` - * angular.module('myApp', ['ngRoute', 'ngIOS9UIWebViewPatch']) - * ``` - * - * - * More info: - * - https://openradar.appspot.com/22186109 - * - https://github.com/angular/angular.js/issues/12241 - * - https://github.com/driftyco/ionic/issues/4082 - * - * - * @license AngularJS - * (c) 2010-2015 Google, Inc. http://angularjs.org - * License: MIT - */ - -angular.module('ngIOS9UIWebViewPatch', ['ng']).config(['$provide', function($provide) { - 'use strict'; - - $provide.decorator('$browser', ['$delegate', '$window', function($delegate, $window) { - - if (isIOS9UIWebView($window.navigator.userAgent)) { - return applyIOS9Shim($delegate); - } - - return $delegate; - - function isIOS9UIWebView(userAgent) { - return /(iPhone|iPad|iPod).* OS 9_\d/.test(userAgent) && !/Version\/9\./.test(userAgent); - } - - function applyIOS9Shim(browser) { - var pendingLocationUrl = null; - var originalUrlFn = browser.url; - - browser.url = function() { - if (arguments.length) { - pendingLocationUrl = arguments[0]; - return originalUrlFn.apply(browser, arguments); - } - - return pendingLocationUrl || originalUrlFn.apply(browser, arguments); - }; - - window.addEventListener('popstate', clearPendingLocationUrl, false); - window.addEventListener('hashchange', clearPendingLocationUrl, false); - - function clearPendingLocationUrl() { - pendingLocationUrl = null; - } - - return browser; - } - }]); -}]); - -/** - * @private - * Parts of Ionic requires that $scope data is attached to the element. - * We do not want to disable adding $scope data to the $element when - * $compileProvider.debugInfoEnabled(false) is used. - */ -IonicModule.config(['$provide', function($provide) { - $provide.decorator('$compile', ['$delegate', function($compile) { - $compile.$$addScopeInfo = function $$addScopeInfo($element, scope, isolated, noTemplate) { - var dataName = isolated ? (noTemplate ? '$isolateScopeNoTemplate' : '$isolateScope') : '$scope'; - $element.data(dataName, scope); - }; - return $compile; - }]); -}]); - -/** - * @private - */ -IonicModule.config([ - '$provide', -function($provide) { - function $LocationDecorator($location, $timeout) { - - $location.__hash = $location.hash; - //Fix: when window.location.hash is set, the scrollable area - //found nearest to body's scrollTop is set to scroll to an element - //with that ID. - $location.hash = function(value) { - if (isDefined(value) && value.length > 0) { - $timeout(function() { - var scroll = document.querySelector('.scroll-content'); - if (scroll) { - scroll.scrollTop = 0; - } - }, 0, false); - } - return $location.__hash(value); - }; - - return $location; - } - - $provide.decorator('$location', ['$delegate', '$timeout', $LocationDecorator]); -}]); - -IonicModule - -.controller('$ionicHeaderBar', [ - '$scope', - '$element', - '$attrs', - '$q', - '$ionicConfig', - '$ionicHistory', -function($scope, $element, $attrs, $q, $ionicConfig, $ionicHistory) { - var TITLE = 'title'; - var BACK_TEXT = 'back-text'; - var BACK_BUTTON = 'back-button'; - var DEFAULT_TITLE = 'default-title'; - var PREVIOUS_TITLE = 'previous-title'; - var HIDE = 'hide'; - - var self = this; - var titleText = ''; - var previousTitleText = ''; - var titleLeft = 0; - var titleRight = 0; - var titleCss = ''; - var isBackEnabled = false; - var isBackShown = true; - var isNavBackShown = true; - var isBackElementShown = false; - var titleTextWidth = 0; - - - self.beforeEnter = function(viewData) { - $scope.$broadcast('$ionicView.beforeEnter', viewData); - }; - - - self.title = function(newTitleText) { - if (arguments.length && newTitleText !== titleText) { - getEle(TITLE).innerHTML = newTitleText; - titleText = newTitleText; - titleTextWidth = 0; - } - return titleText; - }; - - - self.enableBack = function(shouldEnable, disableReset) { - // whether or not the back button show be visible, according - // to the navigation and history - if (arguments.length) { - isBackEnabled = shouldEnable; - if (!disableReset) self.updateBackButton(); - } - return isBackEnabled; - }; - - - self.showBack = function(shouldShow, disableReset) { - // different from enableBack() because this will always have the back - // visually hidden if false, even if the history says it should show - if (arguments.length) { - isBackShown = shouldShow; - if (!disableReset) self.updateBackButton(); - } - return isBackShown; - }; - - - self.showNavBack = function(shouldShow) { - // different from showBack() because this is for the entire nav bar's - // setting for all of it's child headers. For internal use. - isNavBackShown = shouldShow; - self.updateBackButton(); - }; - - - self.updateBackButton = function() { - var ele; - if ((isBackShown && isNavBackShown && isBackEnabled) !== isBackElementShown) { - isBackElementShown = isBackShown && isNavBackShown && isBackEnabled; - ele = getEle(BACK_BUTTON); - ele && ele.classList[ isBackElementShown ? 'remove' : 'add' ](HIDE); - } - - if (isBackEnabled) { - ele = ele || getEle(BACK_BUTTON); - if (ele) { - if (self.backButtonIcon !== $ionicConfig.backButton.icon()) { - ele = getEle(BACK_BUTTON + ' .icon'); - if (ele) { - self.backButtonIcon = $ionicConfig.backButton.icon(); - ele.className = 'icon ' + self.backButtonIcon; - } - } - - if (self.backButtonText !== $ionicConfig.backButton.text()) { - ele = getEle(BACK_BUTTON + ' .back-text'); - if (ele) { - ele.textContent = self.backButtonText = $ionicConfig.backButton.text(); - } - } - } - } - }; - - - self.titleTextWidth = function() { - var element = getEle(TITLE); - if ( element ) { - // If the element has a nav-bar-title, use that instead - // to calculate the width of the title - var children = angular.element(element).children(); - for ( var i = 0; i < children.length; i++ ) { - if ( angular.element(children[i]).hasClass('nav-bar-title') ) { - element = children[i]; - break; - } - } - } - var bounds = ionic.DomUtil.getTextBounds(element); - titleTextWidth = Math.min(bounds && bounds.width || 30); - return titleTextWidth; - }; - - - self.titleWidth = function() { - var titleWidth = self.titleTextWidth(); - var offsetWidth = getEle(TITLE).offsetWidth; - if (offsetWidth < titleWidth) { - titleWidth = offsetWidth + (titleLeft - titleRight - 5); - } - return titleWidth; - }; - - - self.titleTextX = function() { - return ($element[0].offsetWidth / 2) - (self.titleWidth() / 2); - }; - - - self.titleLeftRight = function() { - return titleLeft - titleRight; - }; - - - self.backButtonTextLeft = function() { - var offsetLeft = 0; - var ele = getEle(BACK_TEXT); - while (ele) { - offsetLeft += ele.offsetLeft; - ele = ele.parentElement; - } - return offsetLeft; - }; - - - self.resetBackButton = function(viewData) { - if ($ionicConfig.backButton.previousTitleText()) { - var previousTitleEle = getEle(PREVIOUS_TITLE); - if (previousTitleEle) { - previousTitleEle.classList.remove(HIDE); - - var view = (viewData && $ionicHistory.getViewById(viewData.viewId)); - var newPreviousTitleText = $ionicHistory.backTitle(view); - - if (newPreviousTitleText !== previousTitleText) { - previousTitleText = previousTitleEle.innerHTML = newPreviousTitleText; - } - } - var defaultTitleEle = getEle(DEFAULT_TITLE); - if (defaultTitleEle) { - defaultTitleEle.classList.remove(HIDE); - } - } - }; - - - self.align = function(textAlign) { - var titleEle = getEle(TITLE); - - textAlign = textAlign || $attrs.alignTitle || $ionicConfig.navBar.alignTitle(); - - var widths = self.calcWidths(textAlign, false); - - if (isBackShown && previousTitleText && $ionicConfig.backButton.previousTitleText()) { - var previousTitleWidths = self.calcWidths(textAlign, true); - - var availableTitleWidth = $element[0].offsetWidth - previousTitleWidths.titleLeft - previousTitleWidths.titleRight; - - if (self.titleTextWidth() <= availableTitleWidth) { - widths = previousTitleWidths; - } - } - - return self.updatePositions(titleEle, widths.titleLeft, widths.titleRight, widths.buttonsLeft, widths.buttonsRight, widths.css, widths.showPrevTitle); - }; - - - self.calcWidths = function(textAlign, isPreviousTitle) { - var titleEle = getEle(TITLE); - var backBtnEle = getEle(BACK_BUTTON); - var x, y, z, b, c, d, childSize, bounds; - var childNodes = $element[0].childNodes; - var buttonsLeft = 0; - var buttonsRight = 0; - var isCountRightOfTitle; - var updateTitleLeft = 0; - var updateTitleRight = 0; - var updateCss = ''; - var backButtonWidth = 0; - - // Compute how wide the left children are - // Skip all titles (there may still be two titles, one leaving the dom) - // Once we encounter a titleEle, realize we are now counting the right-buttons, not left - for (x = 0; x < childNodes.length; x++) { - c = childNodes[x]; - - childSize = 0; - if (c.nodeType == 1) { - // element node - if (c === titleEle) { - isCountRightOfTitle = true; - continue; - } - - if (c.classList.contains(HIDE)) { - continue; - } - - if (isBackShown && c === backBtnEle) { - - for (y = 0; y < c.childNodes.length; y++) { - b = c.childNodes[y]; - - if (b.nodeType == 1) { - - if (b.classList.contains(BACK_TEXT)) { - for (z = 0; z < b.children.length; z++) { - d = b.children[z]; - - if (isPreviousTitle) { - if (d.classList.contains(DEFAULT_TITLE)) continue; - backButtonWidth += d.offsetWidth; - } else { - if (d.classList.contains(PREVIOUS_TITLE)) continue; - backButtonWidth += d.offsetWidth; - } - } - - } else { - backButtonWidth += b.offsetWidth; - } - - } else if (b.nodeType == 3 && b.nodeValue.trim()) { - bounds = ionic.DomUtil.getTextBounds(b); - backButtonWidth += bounds && bounds.width || 0; - } - - } - childSize = backButtonWidth || c.offsetWidth; - - } else { - // not the title, not the back button, not a hidden element - childSize = c.offsetWidth; - } - - } else if (c.nodeType == 3 && c.nodeValue.trim()) { - // text node - bounds = ionic.DomUtil.getTextBounds(c); - childSize = bounds && bounds.width || 0; - } - - if (isCountRightOfTitle) { - buttonsRight += childSize; - } else { - buttonsLeft += childSize; - } - } - - // Size and align the header titleEle based on the sizes of the left and - // right children, and the desired alignment mode - if (textAlign == 'left') { - updateCss = 'title-left'; - if (buttonsLeft) { - updateTitleLeft = buttonsLeft + 15; - } - if (buttonsRight) { - updateTitleRight = buttonsRight + 15; - } - - } else if (textAlign == 'right') { - updateCss = 'title-right'; - if (buttonsLeft) { - updateTitleLeft = buttonsLeft + 15; - } - if (buttonsRight) { - updateTitleRight = buttonsRight + 15; - } - - } else { - // center the default - var margin = Math.max(buttonsLeft, buttonsRight) + 10; - if (margin > 10) { - updateTitleLeft = updateTitleRight = margin; - } - } - - return { - backButtonWidth: backButtonWidth, - buttonsLeft: buttonsLeft, - buttonsRight: buttonsRight, - titleLeft: updateTitleLeft, - titleRight: updateTitleRight, - showPrevTitle: isPreviousTitle, - css: updateCss - }; - }; - - - self.updatePositions = function(titleEle, updateTitleLeft, updateTitleRight, buttonsLeft, buttonsRight, updateCss, showPreviousTitle) { - var deferred = $q.defer(); - - // only make DOM updates when there are actual changes - if (titleEle) { - if (updateTitleLeft !== titleLeft) { - titleEle.style.left = updateTitleLeft ? updateTitleLeft + 'px' : ''; - titleLeft = updateTitleLeft; - } - if (updateTitleRight !== titleRight) { - titleEle.style.right = updateTitleRight ? updateTitleRight + 'px' : ''; - titleRight = updateTitleRight; - } - - if (updateCss !== titleCss) { - updateCss && titleEle.classList.add(updateCss); - titleCss && titleEle.classList.remove(titleCss); - titleCss = updateCss; - } - } - - if ($ionicConfig.backButton.previousTitleText()) { - var prevTitle = getEle(PREVIOUS_TITLE); - var defaultTitle = getEle(DEFAULT_TITLE); - - prevTitle && prevTitle.classList[ showPreviousTitle ? 'remove' : 'add'](HIDE); - defaultTitle && defaultTitle.classList[ showPreviousTitle ? 'add' : 'remove'](HIDE); - } - - ionic.requestAnimationFrame(function() { - if (titleEle && titleEle.offsetWidth + 10 < titleEle.scrollWidth) { - var minRight = buttonsRight + 5; - var testRight = $element[0].offsetWidth - titleLeft - self.titleTextWidth() - 20; - updateTitleRight = testRight < minRight ? minRight : testRight; - if (updateTitleRight !== titleRight) { - titleEle.style.right = updateTitleRight + 'px'; - titleRight = updateTitleRight; - } - } - deferred.resolve(); - }); - - return deferred.promise; - }; - - - self.setCss = function(elementClassname, css) { - ionic.DomUtil.cachedStyles(getEle(elementClassname), css); - }; - - - var eleCache = {}; - function getEle(className) { - if (!eleCache[className]) { - eleCache[className] = $element[0].querySelector('.' + className); - } - return eleCache[className]; - } - - - $scope.$on('$destroy', function() { - for (var n in eleCache) eleCache[n] = null; - }); - -}]); - -IonicModule -.controller('$ionInfiniteScroll', [ - '$scope', - '$attrs', - '$element', - '$timeout', -function($scope, $attrs, $element, $timeout) { - var self = this; - self.isLoading = false; - - $scope.icon = function() { - return isDefined($attrs.icon) ? $attrs.icon : 'ion-load-d'; - }; - - $scope.spinner = function() { - return isDefined($attrs.spinner) ? $attrs.spinner : ''; - }; - - $scope.$on('scroll.infiniteScrollComplete', function() { - finishInfiniteScroll(); - }); - - $scope.$on('$destroy', function() { - if (self.scrollCtrl && self.scrollCtrl.$element) self.scrollCtrl.$element.off('scroll', self.checkBounds); - if (self.scrollEl && self.scrollEl.removeEventListener) { - self.scrollEl.removeEventListener('scroll', self.checkBounds); - } - }); - - // debounce checking infinite scroll events - self.checkBounds = ionic.Utils.throttle(checkInfiniteBounds, 300); - - function onInfinite() { - ionic.requestAnimationFrame(function() { - $element[0].classList.add('active'); - }); - self.isLoading = true; - $scope.$parent && $scope.$parent.$apply($attrs.onInfinite || ''); - } - - function finishInfiniteScroll() { - ionic.requestAnimationFrame(function() { - $element[0].classList.remove('active'); - }); - $timeout(function() { - if (self.jsScrolling) self.scrollView.resize(); - // only check bounds again immediately if the page isn't cached (scroll el has height) - if ((self.jsScrolling && self.scrollView.__container && self.scrollView.__container.offsetHeight > 0) || - !self.jsScrolling) { - self.checkBounds(); - } - }, 30, false); - self.isLoading = false; - } - - // check if we've scrolled far enough to trigger an infinite scroll - function checkInfiniteBounds() { - if (self.isLoading) return; - var maxScroll = {}; - - if (self.jsScrolling) { - maxScroll = self.getJSMaxScroll(); - var scrollValues = self.scrollView.getValues(); - if ((maxScroll.left !== -1 && scrollValues.left >= maxScroll.left) || - (maxScroll.top !== -1 && scrollValues.top >= maxScroll.top)) { - onInfinite(); - } - } else { - maxScroll = self.getNativeMaxScroll(); - if (( - maxScroll.left !== -1 && - self.scrollEl.scrollLeft >= maxScroll.left - self.scrollEl.clientWidth - ) || ( - maxScroll.top !== -1 && - self.scrollEl.scrollTop >= maxScroll.top - self.scrollEl.clientHeight - )) { - onInfinite(); - } - } - } - - // determine the threshold at which we should fire an infinite scroll - // note: this gets processed every scroll event, can it be cached? - self.getJSMaxScroll = function() { - var maxValues = self.scrollView.getScrollMax(); - return { - left: self.scrollView.options.scrollingX ? - calculateMaxValue(maxValues.left) : - -1, - top: self.scrollView.options.scrollingY ? - calculateMaxValue(maxValues.top) : - -1 - }; - }; - - self.getNativeMaxScroll = function() { - var maxValues = { - left: self.scrollEl.scrollWidth, - top: self.scrollEl.scrollHeight - }; - var computedStyle = window.getComputedStyle(self.scrollEl) || {}; - return { - left: maxValues.left && - (computedStyle.overflowX === 'scroll' || - computedStyle.overflowX === 'auto' || - self.scrollEl.style['overflow-x'] === 'scroll') ? - calculateMaxValue(maxValues.left) : -1, - top: maxValues.top && - (computedStyle.overflowY === 'scroll' || - computedStyle.overflowY === 'auto' || - self.scrollEl.style['overflow-y'] === 'scroll' ) ? - calculateMaxValue(maxValues.top) : -1 - }; - }; - - // determine pixel refresh distance based on % or value - function calculateMaxValue(maximum) { - var distance = ($attrs.distance || '2.5%').trim(); - var isPercent = distance.indexOf('%') !== -1; - return isPercent ? - maximum * (1 - parseFloat(distance) / 100) : - maximum - parseFloat(distance); - } - - //for testing - self.__finishInfiniteScroll = finishInfiniteScroll; - -}]); - -/** - * @ngdoc service - * @name $ionicListDelegate - * @module ionic - * - * @description - * Delegate for controlling the {@link ionic.directive:ionList} directive. - * - * Methods called directly on the $ionicListDelegate service will control all lists. - * Use the {@link ionic.service:$ionicListDelegate#$getByHandle $getByHandle} - * method to control specific ionList instances. - * - * @usage - * ```html - * {% raw %} - * - * - * - * - * Hello, {{i}}! - * - * - * - * - * {% endraw %} - * ``` - - * ```js - * function MyCtrl($scope, $ionicListDelegate) { - * $scope.showDeleteButtons = function() { - * $ionicListDelegate.showDelete(true); - * }; - * } - * ``` - */ -IonicModule.service('$ionicListDelegate', ionic.DelegateService([ - /** - * @ngdoc method - * @name $ionicListDelegate#showReorder - * @param {boolean=} showReorder Set whether or not this list is showing its reorder buttons. - * @returns {boolean} Whether the reorder buttons are shown. - */ - 'showReorder', - /** - * @ngdoc method - * @name $ionicListDelegate#showDelete - * @param {boolean=} showDelete Set whether or not this list is showing its delete buttons. - * @returns {boolean} Whether the delete buttons are shown. - */ - 'showDelete', - /** - * @ngdoc method - * @name $ionicListDelegate#canSwipeItems - * @param {boolean=} canSwipeItems Set whether or not this list is able to swipe to show - * option buttons. - * @returns {boolean} Whether the list is able to swipe to show option buttons. - */ - 'canSwipeItems', - /** - * @ngdoc method - * @name $ionicListDelegate#closeOptionButtons - * @description Closes any option buttons on the list that are swiped open. - */ - 'closeOptionButtons' - /** - * @ngdoc method - * @name $ionicListDelegate#$getByHandle - * @param {string} handle - * @returns `delegateInstance` A delegate instance that controls only the - * {@link ionic.directive:ionList} directives with `delegate-handle` matching - * the given handle. - * - * Example: `$ionicListDelegate.$getByHandle('my-handle').showReorder(true);` - */ -])) - -.controller('$ionicList', [ - '$scope', - '$attrs', - '$ionicListDelegate', - '$ionicHistory', -function($scope, $attrs, $ionicListDelegate, $ionicHistory) { - var self = this; - var isSwipeable = true; - var isReorderShown = false; - var isDeleteShown = false; - - var deregisterInstance = $ionicListDelegate._registerInstance( - self, $attrs.delegateHandle, function() { - return $ionicHistory.isActiveScope($scope); - } - ); - $scope.$on('$destroy', deregisterInstance); - - self.showReorder = function(show) { - if (arguments.length) { - isReorderShown = !!show; - } - return isReorderShown; - }; - - self.showDelete = function(show) { - if (arguments.length) { - isDeleteShown = !!show; - } - return isDeleteShown; - }; - - self.canSwipeItems = function(can) { - if (arguments.length) { - isSwipeable = !!can; - } - return isSwipeable; - }; - - self.closeOptionButtons = function() { - self.listView && self.listView.clearDragEffects(); - }; -}]); - -IonicModule - -.controller('$ionicNavBar', [ - '$scope', - '$element', - '$attrs', - '$compile', - '$timeout', - '$ionicNavBarDelegate', - '$ionicConfig', - '$ionicHistory', -function($scope, $element, $attrs, $compile, $timeout, $ionicNavBarDelegate, $ionicConfig, $ionicHistory) { - - var CSS_HIDE = 'hide'; - var DATA_NAV_BAR_CTRL = '$ionNavBarController'; - var PRIMARY_BUTTONS = 'primaryButtons'; - var SECONDARY_BUTTONS = 'secondaryButtons'; - var BACK_BUTTON = 'backButton'; - var ITEM_TYPES = 'primaryButtons secondaryButtons leftButtons rightButtons title'.split(' '); - - var self = this; - var headerBars = []; - var navElementHtml = {}; - var isVisible = true; - var queuedTransitionStart, queuedTransitionEnd, latestTransitionId; - - $element.parent().data(DATA_NAV_BAR_CTRL, self); - - var delegateHandle = $attrs.delegateHandle || 'navBar' + ionic.Utils.nextUid(); - - var deregisterInstance = $ionicNavBarDelegate._registerInstance(self, delegateHandle); - - - self.init = function() { - $element.addClass('nav-bar-container'); - ionic.DomUtil.cachedAttr($element, 'nav-bar-transition', $ionicConfig.views.transition()); - - // create two nav bar blocks which will trade out which one is shown - self.createHeaderBar(false); - self.createHeaderBar(true); - - $scope.$emit('ionNavBar.init', delegateHandle); - }; - - - self.createHeaderBar = function(isActive) { - var containerEle = jqLite('
'); - ionic.DomUtil.cachedAttr(containerEle, 'nav-bar', isActive ? 'active' : 'cached'); - - var alignTitle = $attrs.alignTitle || $ionicConfig.navBar.alignTitle(); - var headerBarEle = jqLite('').addClass($attrs['class']).attr('align-title', alignTitle); - if (isDefined($attrs.noTapScroll)) headerBarEle.attr('no-tap-scroll', $attrs.noTapScroll); - var titleEle = jqLite('
'); - var navEle = {}; - var lastViewItemEle = {}; - var leftButtonsEle, rightButtonsEle; - - navEle[BACK_BUTTON] = createNavElement(BACK_BUTTON); - navEle[BACK_BUTTON] && headerBarEle.append(navEle[BACK_BUTTON]); - - // append title in the header, this is the rock to where buttons append - headerBarEle.append(titleEle); - - forEach(ITEM_TYPES, function(itemType) { - // create default button elements - navEle[itemType] = createNavElement(itemType); - // append and position buttons - positionItem(navEle[itemType], itemType); - }); - - // add header-item to the root children - for (var x = 0; x < headerBarEle[0].children.length; x++) { - headerBarEle[0].children[x].classList.add('header-item'); - } - - // compile header and append to the DOM - containerEle.append(headerBarEle); - $element.append($compile(containerEle)($scope.$new())); - - var headerBarCtrl = headerBarEle.data('$ionHeaderBarController'); - headerBarCtrl.backButtonIcon = $ionicConfig.backButton.icon(); - headerBarCtrl.backButtonText = $ionicConfig.backButton.text(); - - var headerBarInstance = { - isActive: isActive, - title: function(newTitleText) { - headerBarCtrl.title(newTitleText); - }, - setItem: function(navBarItemEle, itemType) { - // first make sure any exiting nav bar item has been removed - headerBarInstance.removeItem(itemType); - - if (navBarItemEle) { - if (itemType === 'title') { - // clear out the text based title - headerBarInstance.title(""); - } - - // there's a custom nav bar item - positionItem(navBarItemEle, itemType); - - if (navEle[itemType]) { - // make sure the default on this itemType is hidden - navEle[itemType].addClass(CSS_HIDE); - } - lastViewItemEle[itemType] = navBarItemEle; - - } else if (navEle[itemType]) { - // there's a default button for this side and no view button - navEle[itemType].removeClass(CSS_HIDE); - } - }, - removeItem: function(itemType) { - if (lastViewItemEle[itemType]) { - lastViewItemEle[itemType].scope().$destroy(); - lastViewItemEle[itemType].remove(); - lastViewItemEle[itemType] = null; - } - }, - containerEle: function() { - return containerEle; - }, - headerBarEle: function() { - return headerBarEle; - }, - afterLeave: function() { - forEach(ITEM_TYPES, function(itemType) { - headerBarInstance.removeItem(itemType); - }); - headerBarCtrl.resetBackButton(); - }, - controller: function() { - return headerBarCtrl; - }, - destroy: function() { - forEach(ITEM_TYPES, function(itemType) { - headerBarInstance.removeItem(itemType); - }); - containerEle.scope().$destroy(); - for (var n in navEle) { - if (navEle[n]) { - navEle[n].removeData(); - navEle[n] = null; - } - } - leftButtonsEle && leftButtonsEle.removeData(); - rightButtonsEle && rightButtonsEle.removeData(); - titleEle.removeData(); - headerBarEle.removeData(); - containerEle.remove(); - containerEle = headerBarEle = titleEle = leftButtonsEle = rightButtonsEle = null; - } - }; - - function positionItem(ele, itemType) { - if (!ele) return; - - if (itemType === 'title') { - // title element - titleEle.append(ele); - - } else if (itemType == 'rightButtons' || - (itemType == SECONDARY_BUTTONS && $ionicConfig.navBar.positionSecondaryButtons() != 'left') || - (itemType == PRIMARY_BUTTONS && $ionicConfig.navBar.positionPrimaryButtons() == 'right')) { - // right side - if (!rightButtonsEle) { - rightButtonsEle = jqLite('
'); - headerBarEle.append(rightButtonsEle); - } - if (itemType == SECONDARY_BUTTONS) { - rightButtonsEle.append(ele); - } else { - rightButtonsEle.prepend(ele); - } - - } else { - // left side - if (!leftButtonsEle) { - leftButtonsEle = jqLite('
'); - if (navEle[BACK_BUTTON]) { - navEle[BACK_BUTTON].after(leftButtonsEle); - } else { - headerBarEle.prepend(leftButtonsEle); - } - } - if (itemType == SECONDARY_BUTTONS) { - leftButtonsEle.append(ele); - } else { - leftButtonsEle.prepend(ele); - } - } - - } - - headerBars.push(headerBarInstance); - - return headerBarInstance; - }; - - - self.navElement = function(type, html) { - if (isDefined(html)) { - navElementHtml[type] = html; - } - return navElementHtml[type]; - }; - - - self.update = function(viewData) { - var showNavBar = !viewData.hasHeaderBar && viewData.showNavBar; - viewData.transition = $ionicConfig.views.transition(); - - if (!showNavBar) { - viewData.direction = 'none'; - } - - self.enable(showNavBar); - var enteringHeaderBar = self.isInitialized ? getOffScreenHeaderBar() : getOnScreenHeaderBar(); - var leavingHeaderBar = self.isInitialized ? getOnScreenHeaderBar() : null; - var enteringHeaderCtrl = enteringHeaderBar.controller(); - - // update if the entering header should show the back button or not - enteringHeaderCtrl.enableBack(viewData.enableBack, true); - enteringHeaderCtrl.showBack(viewData.showBack, true); - enteringHeaderCtrl.updateBackButton(); - - // update the entering header bar's title - self.title(viewData.title, enteringHeaderBar); - - self.showBar(showNavBar); - - // update the nav bar items, depending if the view has their own or not - if (viewData.navBarItems) { - forEach(ITEM_TYPES, function(itemType) { - enteringHeaderBar.setItem(viewData.navBarItems[itemType], itemType); - }); - } - - // begin transition of entering and leaving header bars - self.transition(enteringHeaderBar, leavingHeaderBar, viewData); - - self.isInitialized = true; - navSwipeAttr(''); - }; - - - self.transition = function(enteringHeaderBar, leavingHeaderBar, viewData) { - var enteringHeaderBarCtrl = enteringHeaderBar.controller(); - var transitionFn = $ionicConfig.transitions.navBar[viewData.navBarTransition] || $ionicConfig.transitions.navBar.none; - var transitionId = viewData.transitionId; - - enteringHeaderBarCtrl.beforeEnter(viewData); - - var navBarTransition = transitionFn(enteringHeaderBar, leavingHeaderBar, viewData.direction, viewData.shouldAnimate && self.isInitialized); - - ionic.DomUtil.cachedAttr($element, 'nav-bar-transition', viewData.navBarTransition); - ionic.DomUtil.cachedAttr($element, 'nav-bar-direction', viewData.direction); - - if (navBarTransition.shouldAnimate && viewData.renderEnd) { - navBarAttr(enteringHeaderBar, 'stage'); - } else { - navBarAttr(enteringHeaderBar, 'entering'); - navBarAttr(leavingHeaderBar, 'leaving'); - } - - enteringHeaderBarCtrl.resetBackButton(viewData); - - navBarTransition.run(0); - - self.activeTransition = { - run: function(step) { - navBarTransition.shouldAnimate = false; - navBarTransition.direction = 'back'; - navBarTransition.run(step); - }, - cancel: function(shouldAnimate, speed, cancelData) { - navSwipeAttr(speed); - navBarAttr(leavingHeaderBar, 'active'); - navBarAttr(enteringHeaderBar, 'cached'); - navBarTransition.shouldAnimate = shouldAnimate; - navBarTransition.run(0); - self.activeTransition = navBarTransition = null; - - var runApply; - if (cancelData.showBar !== self.showBar()) { - self.showBar(cancelData.showBar); - } - if (cancelData.showBackButton !== self.showBackButton()) { - self.showBackButton(cancelData.showBackButton); - } - if (runApply) { - $scope.$apply(); - } - }, - complete: function(shouldAnimate, speed) { - navSwipeAttr(speed); - navBarTransition.shouldAnimate = shouldAnimate; - navBarTransition.run(1); - queuedTransitionEnd = transitionEnd; - } - }; - - $timeout(enteringHeaderBarCtrl.align, 16); - - queuedTransitionStart = function() { - if (latestTransitionId !== transitionId) return; - - navBarAttr(enteringHeaderBar, 'entering'); - navBarAttr(leavingHeaderBar, 'leaving'); - - navBarTransition.run(1); - - queuedTransitionEnd = function() { - if (latestTransitionId == transitionId || !navBarTransition.shouldAnimate) { - transitionEnd(); - } - }; - - queuedTransitionStart = null; - }; - - function transitionEnd() { - for (var x = 0; x < headerBars.length; x++) { - headerBars[x].isActive = false; - } - enteringHeaderBar.isActive = true; - - navBarAttr(enteringHeaderBar, 'active'); - navBarAttr(leavingHeaderBar, 'cached'); - - self.activeTransition = navBarTransition = queuedTransitionEnd = null; - } - - queuedTransitionStart(); - }; - - - self.triggerTransitionStart = function(triggerTransitionId) { - latestTransitionId = triggerTransitionId; - queuedTransitionStart && queuedTransitionStart(); - }; - - - self.triggerTransitionEnd = function() { - queuedTransitionEnd && queuedTransitionEnd(); - }; - - - self.showBar = function(shouldShow) { - if (arguments.length) { - self.visibleBar(shouldShow); - $scope.$parent.$hasHeader = !!shouldShow; - } - return !!$scope.$parent.$hasHeader; - }; - - - self.visibleBar = function(shouldShow) { - if (shouldShow && !isVisible) { - $element.removeClass(CSS_HIDE); - self.align(); - } else if (!shouldShow && isVisible) { - $element.addClass(CSS_HIDE); - } - isVisible = shouldShow; - }; - - - self.enable = function(val) { - // set primary to show first - self.visibleBar(val); - - // set non primary to hide second - for (var x = 0; x < $ionicNavBarDelegate._instances.length; x++) { - if ($ionicNavBarDelegate._instances[x] !== self) $ionicNavBarDelegate._instances[x].visibleBar(false); - } - }; - - - /** - * @ngdoc method - * @name $ionicNavBar#showBackButton - * @description Show/hide the nav bar back button when there is a - * back view. If the back button is not possible, for example, the - * first view in the stack, then this will not force the back button - * to show. - */ - self.showBackButton = function(shouldShow) { - if (arguments.length) { - for (var x = 0; x < headerBars.length; x++) { - headerBars[x].controller().showNavBack(!!shouldShow); - } - $scope.$isBackButtonShown = !!shouldShow; - } - return $scope.$isBackButtonShown; - }; - - - /** - * @ngdoc method - * @name $ionicNavBar#showActiveBackButton - * @description Show/hide only the active header bar's back button. - */ - self.showActiveBackButton = function(shouldShow) { - var headerBar = getOnScreenHeaderBar(); - if (headerBar) { - if (arguments.length) { - return headerBar.controller().showBack(shouldShow); - } - return headerBar.controller().showBack(); - } - }; - - - self.title = function(newTitleText, headerBar) { - if (isDefined(newTitleText)) { - newTitleText = newTitleText || ''; - headerBar = headerBar || getOnScreenHeaderBar(); - headerBar && headerBar.title(newTitleText); - $scope.$title = newTitleText; - $ionicHistory.currentTitle(newTitleText); - } - return $scope.$title; - }; - - - self.align = function(val, headerBar) { - headerBar = headerBar || getOnScreenHeaderBar(); - headerBar && headerBar.controller().align(val); - }; - - - self.hasTabsTop = function(isTabsTop) { - $element[isTabsTop ? 'addClass' : 'removeClass']('nav-bar-tabs-top'); - }; - - self.hasBarSubheader = function(isBarSubheader) { - $element[isBarSubheader ? 'addClass' : 'removeClass']('nav-bar-has-subheader'); - }; - - // DEPRECATED, as of v1.0.0-beta14 ------- - self.changeTitle = function(val) { - deprecatedWarning('changeTitle(val)', 'title(val)'); - self.title(val); - }; - self.setTitle = function(val) { - deprecatedWarning('setTitle(val)', 'title(val)'); - self.title(val); - }; - self.getTitle = function() { - deprecatedWarning('getTitle()', 'title()'); - return self.title(); - }; - self.back = function() { - deprecatedWarning('back()', '$ionicHistory.goBack()'); - $ionicHistory.goBack(); - }; - self.getPreviousTitle = function() { - deprecatedWarning('getPreviousTitle()', '$ionicHistory.backTitle()'); - $ionicHistory.goBack(); - }; - function deprecatedWarning(oldMethod, newMethod) { - var warn = console.warn || console.log; - warn && warn.call(console, 'navBarController.' + oldMethod + ' is deprecated, please use ' + newMethod + ' instead'); - } - // END DEPRECATED ------- - - - function createNavElement(type) { - if (navElementHtml[type]) { - return jqLite(navElementHtml[type]); - } - } - - - function getOnScreenHeaderBar() { - for (var x = 0; x < headerBars.length; x++) { - if (headerBars[x].isActive) return headerBars[x]; - } - } - - - function getOffScreenHeaderBar() { - for (var x = 0; x < headerBars.length; x++) { - if (!headerBars[x].isActive) return headerBars[x]; - } - } - - - function navBarAttr(ctrl, val) { - ctrl && ionic.DomUtil.cachedAttr(ctrl.containerEle(), 'nav-bar', val); - } - - function navSwipeAttr(val) { - ionic.DomUtil.cachedAttr($element, 'nav-swipe', val); - } - - - $scope.$on('$destroy', function() { - $scope.$parent.$hasHeader = false; - $element.parent().removeData(DATA_NAV_BAR_CTRL); - for (var x = 0; x < headerBars.length; x++) { - headerBars[x].destroy(); - } - $element.remove(); - $element = headerBars = null; - deregisterInstance(); - }); - -}]); - -IonicModule -.controller('$ionicNavView', [ - '$scope', - '$element', - '$attrs', - '$compile', - '$controller', - '$ionicNavBarDelegate', - '$ionicNavViewDelegate', - '$ionicHistory', - '$ionicViewSwitcher', - '$ionicConfig', - '$ionicScrollDelegate', - '$ionicSideMenuDelegate', -function($scope, $element, $attrs, $compile, $controller, $ionicNavBarDelegate, $ionicNavViewDelegate, $ionicHistory, $ionicViewSwitcher, $ionicConfig, $ionicScrollDelegate, $ionicSideMenuDelegate) { - - var DATA_ELE_IDENTIFIER = '$eleId'; - var DATA_DESTROY_ELE = '$destroyEle'; - var DATA_NO_CACHE = '$noCache'; - var VIEW_STATUS_ACTIVE = 'active'; - var VIEW_STATUS_CACHED = 'cached'; - - var self = this; - var direction; - var isPrimary = false; - var navBarDelegate; - var activeEleId; - var navViewAttr = $ionicViewSwitcher.navViewAttr; - var disableRenderStartViewId, disableAnimation; - - self.scope = $scope; - self.element = $element; - - self.init = function() { - var navViewName = $attrs.name || ''; - - // Find the details of the parent view directive (if any) and use it - // to derive our own qualified view name, then hang our own details - // off the DOM so child directives can find it. - var parent = $element.parent().inheritedData('$uiView'); - var parentViewName = ((parent && parent.state) ? parent.state.name : ''); - if (navViewName.indexOf('@') < 0) navViewName = navViewName + '@' + parentViewName; - - var viewData = { name: navViewName, state: null }; - $element.data('$uiView', viewData); - - var deregisterInstance = $ionicNavViewDelegate._registerInstance(self, $attrs.delegateHandle); - $scope.$on('$destroy', function() { - deregisterInstance(); - - // ensure no scrolls have been left frozen - if (self.isSwipeFreeze) { - $ionicScrollDelegate.freezeAllScrolls(false); - } - }); - - $scope.$on('$ionicHistory.deselect', self.cacheCleanup); - $scope.$on('$ionicTabs.top', onTabsTop); - $scope.$on('$ionicSubheader', onBarSubheader); - - $scope.$on('$ionicTabs.beforeLeave', onTabsLeave); - $scope.$on('$ionicTabs.afterLeave', onTabsLeave); - $scope.$on('$ionicTabs.leave', onTabsLeave); - - ionic.Platform.ready(function() { - if ( ionic.Platform.isWebView() && ionic.Platform.isIOS() ) { - self.initSwipeBack(); - } - }); - - return viewData; - }; - - - self.register = function(viewLocals) { - var leavingView = extend({}, $ionicHistory.currentView()); - - // register that a view is coming in and get info on how it should transition - var registerData = $ionicHistory.register($scope, viewLocals); - - // update which direction - self.update(registerData); - - // begin rendering and transitioning - var enteringView = $ionicHistory.getViewById(registerData.viewId) || {}; - - var renderStart = (disableRenderStartViewId !== registerData.viewId); - self.render(registerData, viewLocals, enteringView, leavingView, renderStart, true); - }; - - - self.update = function(registerData) { - // always reset that this is the primary navView - isPrimary = true; - - // remember what direction this navView should use - // this may get updated later by a child navView - direction = registerData.direction; - - var parentNavViewCtrl = $element.parent().inheritedData('$ionNavViewController'); - if (parentNavViewCtrl) { - // this navView is nested inside another one - // update the parent to use this direction and not - // the other it originally was set to - - // inform the parent navView that it is not the primary navView - parentNavViewCtrl.isPrimary(false); - - if (direction === 'enter' || direction === 'exit') { - // they're entering/exiting a history - // find parent navViewController - parentNavViewCtrl.direction(direction); - - if (direction === 'enter') { - // reset the direction so this navView doesn't animate - // because it's parent will - direction = 'none'; - } - } - } - }; - - - self.render = function(registerData, viewLocals, enteringView, leavingView, renderStart, renderEnd) { - // register the view and figure out where it lives in the various - // histories and nav stacks, along with how views should enter/leave - var switcher = $ionicViewSwitcher.create(self, viewLocals, enteringView, leavingView, renderStart, renderEnd); - - // init the rendering of views for this navView directive - switcher.init(registerData, function() { - // the view is now compiled, in the dom and linked, now lets transition the views. - // this uses a callback incase THIS nav-view has a nested nav-view, and after the NESTED - // nav-view links, the NESTED nav-view would update which direction THIS nav-view should use - - // kick off the transition of views - switcher.transition(self.direction(), registerData.enableBack, !disableAnimation); - - // reset private vars for next time - disableRenderStartViewId = disableAnimation = null; - }); - - }; - - - self.beforeEnter = function(transitionData) { - if (isPrimary) { - // only update this nav-view's nav-bar if this is the primary nav-view - navBarDelegate = transitionData.navBarDelegate; - var associatedNavBarCtrl = getAssociatedNavBarCtrl(); - associatedNavBarCtrl && associatedNavBarCtrl.update(transitionData); - navSwipeAttr(''); - } - }; - - - self.activeEleId = function(eleId) { - if (arguments.length) { - activeEleId = eleId; - } - return activeEleId; - }; - - - self.transitionEnd = function() { - var viewElements = $element.children(); - var x, l, viewElement; - - for (x = 0, l = viewElements.length; x < l; x++) { - viewElement = viewElements.eq(x); - - if (viewElement.data(DATA_ELE_IDENTIFIER) === activeEleId) { - // this is the active element - navViewAttr(viewElement, VIEW_STATUS_ACTIVE); - - } else if (navViewAttr(viewElement) === 'leaving' || navViewAttr(viewElement) === VIEW_STATUS_ACTIVE || navViewAttr(viewElement) === VIEW_STATUS_CACHED) { - // this is a leaving element or was the former active element, or is an cached element - if (viewElement.data(DATA_DESTROY_ELE) || viewElement.data(DATA_NO_CACHE)) { - // this element shouldn't stay cached - $ionicViewSwitcher.destroyViewEle(viewElement); - - } else { - // keep in the DOM, mark as cached - navViewAttr(viewElement, VIEW_STATUS_CACHED); - - // disconnect the leaving scope - ionic.Utils.disconnectScope(viewElement.scope()); - } - } - } - - navSwipeAttr(''); - - // ensure no scrolls have been left frozen - if (self.isSwipeFreeze) { - $ionicScrollDelegate.freezeAllScrolls(false); - } - }; - - - function onTabsLeave(ev, data) { - var viewElements = $element.children(); - var viewElement, viewScope; - - for (var x = 0, l = viewElements.length; x < l; x++) { - viewElement = viewElements.eq(x); - if (navViewAttr(viewElement) == VIEW_STATUS_ACTIVE) { - viewScope = viewElement.scope(); - viewScope && viewScope.$emit(ev.name.replace('Tabs', 'View'), data); - viewScope && viewScope.$broadcast(ev.name.replace('Tabs', 'ParentView'), data); - break; - } - } - } - - - self.cacheCleanup = function() { - var viewElements = $element.children(); - for (var x = 0, l = viewElements.length; x < l; x++) { - if (viewElements.eq(x).data(DATA_DESTROY_ELE)) { - $ionicViewSwitcher.destroyViewEle(viewElements.eq(x)); - } - } - }; - - - self.clearCache = function(stateIds) { - var viewElements = $element.children(); - var viewElement, viewScope, x, l, y, eleIdentifier; - - for (x = 0, l = viewElements.length; x < l; x++) { - viewElement = viewElements.eq(x); - - if (stateIds) { - eleIdentifier = viewElement.data(DATA_ELE_IDENTIFIER); - - for (y = 0; y < stateIds.length; y++) { - if (eleIdentifier === stateIds[y]) { - $ionicViewSwitcher.destroyViewEle(viewElement); - } - } - continue; - } - - if (navViewAttr(viewElement) == VIEW_STATUS_CACHED) { - $ionicViewSwitcher.destroyViewEle(viewElement); - - } else if (navViewAttr(viewElement) == VIEW_STATUS_ACTIVE) { - viewScope = viewElement.scope(); - viewScope && viewScope.$broadcast('$ionicView.clearCache'); - } - - } - }; - - - self.getViewElements = function() { - return $element.children(); - }; - - - self.appendViewElement = function(viewEle, viewLocals) { - // compile the entering element and get the link function - var linkFn = $compile(viewEle); - - $element.append(viewEle); - - var viewScope = $scope.$new(); - - if (viewLocals && viewLocals.$$controller) { - viewLocals.$scope = viewScope; - var controller = $controller(viewLocals.$$controller, viewLocals); - if (viewLocals.$$controllerAs) { - viewScope[viewLocals.$$controllerAs] = controller; - } - $element.children().data('$ngControllerController', controller); - } - - linkFn(viewScope); - - return viewScope; - }; - - - self.title = function(val) { - var associatedNavBarCtrl = getAssociatedNavBarCtrl(); - associatedNavBarCtrl && associatedNavBarCtrl.title(val); - }; - - - /** - * @ngdoc method - * @name $ionicNavView#enableBackButton - * @description Enable/disable if the back button can be shown or not. For - * example, the very first view in the navigation stack would not have a - * back view, so the back button would be disabled. - */ - self.enableBackButton = function(shouldEnable) { - var associatedNavBarCtrl = getAssociatedNavBarCtrl(); - associatedNavBarCtrl && associatedNavBarCtrl.enableBackButton(shouldEnable); - }; - - - /** - * @ngdoc method - * @name $ionicNavView#showBackButton - * @description Show/hide the nav bar active back button. If the back button - * is not possible this will not force the back button to show. The - * `enableBackButton()` method handles if a back button is even possible or not. - */ - self.showBackButton = function(shouldShow) { - var associatedNavBarCtrl = getAssociatedNavBarCtrl(); - if (associatedNavBarCtrl) { - if (arguments.length) { - return associatedNavBarCtrl.showActiveBackButton(shouldShow); - } - return associatedNavBarCtrl.showActiveBackButton(); - } - return true; - }; - - - self.showBar = function(val) { - var associatedNavBarCtrl = getAssociatedNavBarCtrl(); - if (associatedNavBarCtrl) { - if (arguments.length) { - return associatedNavBarCtrl.showBar(val); - } - return associatedNavBarCtrl.showBar(); - } - return true; - }; - - - self.isPrimary = function(val) { - if (arguments.length) { - isPrimary = val; - } - return isPrimary; - }; - - - self.direction = function(val) { - if (arguments.length) { - direction = val; - } - return direction; - }; - - - self.initSwipeBack = function() { - var swipeBackHitWidth = $ionicConfig.views.swipeBackHitWidth(); - var viewTransition, associatedNavBarCtrl, backView; - var deregDragStart, deregDrag, deregRelease; - var windowWidth, startDragX, dragPoints; - var cancelData = {}; - - function onDragStart(ev) { - if (!isPrimary || !$ionicConfig.views.swipeBackEnabled() || $ionicSideMenuDelegate.isOpenRight() ) return; - - - startDragX = getDragX(ev); - if (startDragX > swipeBackHitWidth) return; - - backView = $ionicHistory.backView(); - - var currentView = $ionicHistory.currentView(); - - if (!backView || backView.historyId !== currentView.historyId || currentView.canSwipeBack === false) return; - - if (!windowWidth) windowWidth = window.innerWidth; - - self.isSwipeFreeze = $ionicScrollDelegate.freezeAllScrolls(true); - - var registerData = { - direction: 'back' - }; - - dragPoints = []; - - cancelData = { - showBar: self.showBar(), - showBackButton: self.showBackButton() - }; - - var switcher = $ionicViewSwitcher.create(self, registerData, backView, currentView, true, false); - switcher.loadViewElements(registerData); - switcher.render(registerData); - - viewTransition = switcher.transition('back', $ionicHistory.enabledBack(backView), true); - - associatedNavBarCtrl = getAssociatedNavBarCtrl(); - - deregDrag = ionic.onGesture('drag', onDrag, $element[0]); - deregRelease = ionic.onGesture('release', onRelease, $element[0]); - } - - function onDrag(ev) { - if (isPrimary && viewTransition) { - var dragX = getDragX(ev); - - dragPoints.push({ - t: Date.now(), - x: dragX - }); - - if (dragX >= windowWidth - 15) { - onRelease(ev); - - } else { - var step = Math.min(Math.max(getSwipeCompletion(dragX), 0), 1); - viewTransition.run(step); - associatedNavBarCtrl && associatedNavBarCtrl.activeTransition && associatedNavBarCtrl.activeTransition.run(step); - } - - } - } - - function onRelease(ev) { - if (isPrimary && viewTransition && dragPoints && dragPoints.length > 1) { - - var now = Date.now(); - var releaseX = getDragX(ev); - var startDrag = dragPoints[dragPoints.length - 1]; - - for (var x = dragPoints.length - 2; x >= 0; x--) { - if (now - startDrag.t > 200) { - break; - } - startDrag = dragPoints[x]; - } - - var isSwipingRight = (releaseX >= dragPoints[dragPoints.length - 2].x); - var releaseSwipeCompletion = getSwipeCompletion(releaseX); - var velocity = Math.abs(startDrag.x - releaseX) / (now - startDrag.t); - - // private variables because ui-router has no way to pass custom data using $state.go - disableRenderStartViewId = backView.viewId; - disableAnimation = (releaseSwipeCompletion < 0.03 || releaseSwipeCompletion > 0.97); - - if (isSwipingRight && (releaseSwipeCompletion > 0.5 || velocity > 0.1)) { - // complete view transition on release - var speed = (velocity > 0.5 || velocity < 0.05 || releaseX > windowWidth - 45) ? 'fast' : 'slow'; - navSwipeAttr(disableAnimation ? '' : speed); - backView.go(); - associatedNavBarCtrl && associatedNavBarCtrl.activeTransition && associatedNavBarCtrl.activeTransition.complete(!disableAnimation, speed); - - } else { - // cancel view transition on release - navSwipeAttr(disableAnimation ? '' : 'fast'); - disableRenderStartViewId = null; - viewTransition.cancel(!disableAnimation); - associatedNavBarCtrl && associatedNavBarCtrl.activeTransition && associatedNavBarCtrl.activeTransition.cancel(!disableAnimation, 'fast', cancelData); - disableAnimation = null; - } - - } - - ionic.offGesture(deregDrag, 'drag', onDrag); - ionic.offGesture(deregRelease, 'release', onRelease); - - windowWidth = viewTransition = dragPoints = null; - - self.isSwipeFreeze = $ionicScrollDelegate.freezeAllScrolls(false); - } - - function getDragX(ev) { - return ionic.tap.pointerCoord(ev.gesture.srcEvent).x; - } - - function getSwipeCompletion(dragX) { - return (dragX - startDragX) / windowWidth; - } - - deregDragStart = ionic.onGesture('dragstart', onDragStart, $element[0]); - - $scope.$on('$destroy', function() { - ionic.offGesture(deregDragStart, 'dragstart', onDragStart); - ionic.offGesture(deregDrag, 'drag', onDrag); - ionic.offGesture(deregRelease, 'release', onRelease); - self.element = viewTransition = associatedNavBarCtrl = null; - }); - }; - - - function navSwipeAttr(val) { - ionic.DomUtil.cachedAttr($element, 'nav-swipe', val); - } - - - function onTabsTop(ev, isTabsTop) { - var associatedNavBarCtrl = getAssociatedNavBarCtrl(); - associatedNavBarCtrl && associatedNavBarCtrl.hasTabsTop(isTabsTop); - } - - function onBarSubheader(ev, isBarSubheader) { - var associatedNavBarCtrl = getAssociatedNavBarCtrl(); - associatedNavBarCtrl && associatedNavBarCtrl.hasBarSubheader(isBarSubheader); - } - - function getAssociatedNavBarCtrl() { - if (navBarDelegate) { - for (var x = 0; x < $ionicNavBarDelegate._instances.length; x++) { - if ($ionicNavBarDelegate._instances[x].$$delegateHandle == navBarDelegate) { - return $ionicNavBarDelegate._instances[x]; - } - } - } - return $element.inheritedData('$ionNavBarController'); - } - -}]); - -IonicModule -.controller('$ionicRefresher', [ - '$scope', - '$attrs', - '$element', - '$ionicBind', - '$timeout', - function($scope, $attrs, $element, $ionicBind, $timeout) { - var self = this, - isDragging = false, - isOverscrolling = false, - dragOffset = 0, - lastOverscroll = 0, - ptrThreshold = 60, - activated = false, - scrollTime = 500, - startY = null, - deltaY = null, - canOverscroll = true, - scrollParent, - scrollChild; - - if (!isDefined($attrs.pullingIcon)) { - $attrs.$set('pullingIcon', 'ion-android-arrow-down'); - } - - $scope.showSpinner = !isDefined($attrs.refreshingIcon) && $attrs.spinner != 'none'; - - $scope.showIcon = isDefined($attrs.refreshingIcon); - - $ionicBind($scope, $attrs, { - pullingIcon: '@', - pullingText: '@', - refreshingIcon: '@', - refreshingText: '@', - spinner: '@', - disablePullingRotation: '@', - $onRefresh: '&onRefresh', - $onPulling: '&onPulling' - }); - - function handleMousedown(e) { - e.touches = e.touches || [{ - screenX: e.screenX, - screenY: e.screenY - }]; - // Mouse needs this - startY = Math.floor(e.touches[0].screenY); - } - - function handleTouchstart(e) { - e.touches = e.touches || [{ - screenX: e.screenX, - screenY: e.screenY - }]; - - startY = e.touches[0].screenY; - } - - function handleTouchend() { - // reset Y - startY = null; - // if this wasn't an overscroll, get out immediately - if (!canOverscroll && !isDragging) { - return; - } - // the user has overscrolled but went back to native scrolling - if (!isDragging) { - dragOffset = 0; - isOverscrolling = false; - setScrollLock(false); - } else { - isDragging = false; - dragOffset = 0; - - // the user has scroll far enough to trigger a refresh - if (lastOverscroll > ptrThreshold) { - start(); - scrollTo(ptrThreshold, scrollTime); - - // the user has overscrolled but not far enough to trigger a refresh - } else { - scrollTo(0, scrollTime, deactivate); - isOverscrolling = false; - } - } - } - - function handleTouchmove(e) { - e.touches = e.touches || [{ - screenX: e.screenX, - screenY: e.screenY - }]; - - // Force mouse events to have had a down event first - if (!startY && e.type == 'mousemove') { - return; - } - - // if multitouch or regular scroll event, get out immediately - if (!canOverscroll || e.touches.length > 1) { - return; - } - //if this is a new drag, keep track of where we start - if (startY === null) { - startY = e.touches[0].screenY; - } - - deltaY = e.touches[0].screenY - startY; - - // how far have we dragged so far? - // kitkat fix for touchcancel events http://updates.html5rocks.com/2014/05/A-More-Compatible-Smoother-Touch - // Only do this if we're not on crosswalk - if (ionic.Platform.isAndroid() && ionic.Platform.version() === 4.4 && !ionic.Platform.isCrosswalk() && scrollParent.scrollTop === 0 && deltaY > 0) { - isDragging = true; - e.preventDefault(); - } - - - // if we've dragged up and back down in to native scroll territory - if (deltaY - dragOffset <= 0 || scrollParent.scrollTop !== 0) { - - if (isOverscrolling) { - isOverscrolling = false; - setScrollLock(false); - } - - if (isDragging) { - nativescroll(scrollParent, deltaY - dragOffset * -1); - } - - // if we're not at overscroll 0 yet, 0 out - if (lastOverscroll !== 0) { - overscroll(0); - } - return; - - } else if (deltaY > 0 && scrollParent.scrollTop === 0 && !isOverscrolling) { - // starting overscroll, but drag started below scrollTop 0, so we need to offset the position - dragOffset = deltaY; - } - - // prevent native scroll events while overscrolling - e.preventDefault(); - - // if not overscrolling yet, initiate overscrolling - if (!isOverscrolling) { - isOverscrolling = true; - setScrollLock(true); - } - - isDragging = true; - // overscroll according to the user's drag so far - overscroll((deltaY - dragOffset) / 3); - - // update the icon accordingly - if (!activated && lastOverscroll > ptrThreshold) { - activated = true; - ionic.requestAnimationFrame(activate); - - } else if (activated && lastOverscroll < ptrThreshold) { - activated = false; - ionic.requestAnimationFrame(deactivate); - } - } - - function handleScroll(e) { - // canOverscrol is used to greatly simplify the drag handler during normal scrolling - canOverscroll = (e.target.scrollTop === 0) || isDragging; - } - - function overscroll(val) { - scrollChild.style[ionic.CSS.TRANSFORM] = 'translate3d(0px, ' + val + 'px, 0px)'; - lastOverscroll = val; - } - - function nativescroll(target, newScrollTop) { - // creates a scroll event that bubbles, can be cancelled, and with its view - // and detail property initialized to window and 1, respectively - target.scrollTop = newScrollTop; - var e = document.createEvent("UIEvents"); - e.initUIEvent("scroll", true, true, window, 1); - target.dispatchEvent(e); - } - - function setScrollLock(enabled) { - // set the scrollbar to be position:fixed in preparation to overscroll - // or remove it so the app can be natively scrolled - if (enabled) { - ionic.requestAnimationFrame(function() { - scrollChild.classList.add('overscroll'); - show(); - }); - - } else { - ionic.requestAnimationFrame(function() { - scrollChild.classList.remove('overscroll'); - hide(); - deactivate(); - }); - } - } - - $scope.$on('scroll.refreshComplete', function() { - // prevent the complete from firing before the scroll has started - $timeout(function() { - - ionic.requestAnimationFrame(tail); - - // scroll back to home during tail animation - scrollTo(0, scrollTime, deactivate); - - // return to native scrolling after tail animation has time to finish - $timeout(function() { - - if (isOverscrolling) { - isOverscrolling = false; - setScrollLock(false); - } - - }, scrollTime); - - }, scrollTime); - }); - - function scrollTo(Y, duration, callback) { - // scroll animation loop w/ easing - // credit https://gist.github.com/dezinezync/5487119 - var start = Date.now(), - from = lastOverscroll; - - if (from === Y) { - callback(); - return; /* Prevent scrolling to the Y point if already there */ - } - - // decelerating to zero velocity - function easeOutCubic(t) { - return (--t) * t * t + 1; - } - - // scroll loop - function scroll() { - var currentTime = Date.now(), - time = Math.min(1, ((currentTime - start) / duration)), - // where .5 would be 50% of time on a linear scale easedT gives a - // fraction based on the easing method - easedT = easeOutCubic(time); - - overscroll(Math.floor((easedT * (Y - from)) + from)); - - if (time < 1) { - ionic.requestAnimationFrame(scroll); - - } else { - - if (Y < 5 && Y > -5) { - isOverscrolling = false; - setScrollLock(false); - } - - callback && callback(); - } - } - - // start scroll loop - ionic.requestAnimationFrame(scroll); - } - - - var touchStartEvent, touchMoveEvent, touchEndEvent; - if (window.navigator.pointerEnabled) { - touchStartEvent = 'pointerdown'; - touchMoveEvent = 'pointermove'; - touchEndEvent = 'pointerup'; - } else if (window.navigator.msPointerEnabled) { - touchStartEvent = 'MSPointerDown'; - touchMoveEvent = 'MSPointerMove'; - touchEndEvent = 'MSPointerUp'; - } else { - touchStartEvent = 'touchstart'; - touchMoveEvent = 'touchmove'; - touchEndEvent = 'touchend'; - } - - self.init = function() { - scrollParent = $element.parent().parent()[0]; - scrollChild = $element.parent()[0]; - - if (!scrollParent || !scrollParent.classList.contains('ionic-scroll') || - !scrollChild || !scrollChild.classList.contains('scroll')) { - throw new Error('Refresher must be immediate child of ion-content or ion-scroll'); - } - - - ionic.on(touchStartEvent, handleTouchstart, scrollChild); - ionic.on(touchMoveEvent, handleTouchmove, scrollChild); - ionic.on(touchEndEvent, handleTouchend, scrollChild); - ionic.on('mousedown', handleMousedown, scrollChild); - ionic.on('mousemove', handleTouchmove, scrollChild); - ionic.on('mouseup', handleTouchend, scrollChild); - ionic.on('scroll', handleScroll, scrollParent); - - // cleanup when done - $scope.$on('$destroy', destroy); - }; - - function destroy() { - if ( scrollChild ) { - ionic.off(touchStartEvent, handleTouchstart, scrollChild); - ionic.off(touchMoveEvent, handleTouchmove, scrollChild); - ionic.off(touchEndEvent, handleTouchend, scrollChild); - ionic.off('mousedown', handleMousedown, scrollChild); - ionic.off('mousemove', handleTouchmove, scrollChild); - ionic.off('mouseup', handleTouchend, scrollChild); - } - if ( scrollParent ) { - ionic.off('scroll', handleScroll, scrollParent); - } - scrollParent = null; - scrollChild = null; - } - - // DOM manipulation and broadcast methods shared by JS and Native Scrolling - // getter used by JS Scrolling - self.getRefresherDomMethods = function() { - return { - activate: activate, - deactivate: deactivate, - start: start, - show: show, - hide: hide, - tail: tail - }; - }; - - function activate() { - $element[0].classList.add('active'); - $scope.$onPulling(); - } - - function deactivate() { - // give tail 150ms to finish - $timeout(function() { - // deactivateCallback - $element.removeClass('active refreshing refreshing-tail'); - if (activated) activated = false; - }, 150); - } - - function start() { - // startCallback - $element[0].classList.add('refreshing'); - var q = $scope.$onRefresh(); - - if (q && q.then) { - q['finally'](function() { - $scope.$broadcast('scroll.refreshComplete'); - }); - } - } - - function show() { - // showCallback - $element[0].classList.remove('invisible'); - } - - function hide() { - // showCallback - $element[0].classList.add('invisible'); - } - - function tail() { - // tailCallback - $element[0].classList.add('refreshing-tail'); - } - - // for testing - self.__handleTouchmove = handleTouchmove; - self.__getScrollChild = function() { return scrollChild; }; - self.__getScrollParent = function() { return scrollParent; }; - } -]); - -/** - * @private - */ -IonicModule - -.controller('$ionicScroll', [ - '$scope', - 'scrollViewOptions', - '$timeout', - '$window', - '$location', - '$document', - '$ionicScrollDelegate', - '$ionicHistory', -function($scope, - scrollViewOptions, - $timeout, - $window, - $location, - $document, - $ionicScrollDelegate, - $ionicHistory) { - - var self = this; - // for testing - self.__timeout = $timeout; - - self._scrollViewOptions = scrollViewOptions; //for testing - self.isNative = function() { - return !!scrollViewOptions.nativeScrolling; - }; - - var element = self.element = scrollViewOptions.el; - var $element = self.$element = jqLite(element); - var scrollView; - if (self.isNative()) { - scrollView = self.scrollView = new ionic.views.ScrollNative(scrollViewOptions); - } else { - scrollView = self.scrollView = new ionic.views.Scroll(scrollViewOptions); - } - - - //Attach self to element as a controller so other directives can require this controller - //through `require: '$ionicScroll' - //Also attach to parent so that sibling elements can require this - ($element.parent().length ? $element.parent() : $element) - .data('$$ionicScrollController', self); - - var deregisterInstance = $ionicScrollDelegate._registerInstance( - self, scrollViewOptions.delegateHandle, function() { - return $ionicHistory.isActiveScope($scope); - } - ); - - if (!isDefined(scrollViewOptions.bouncing)) { - ionic.Platform.ready(function() { - if (scrollView && scrollView.options) { - scrollView.options.bouncing = true; - if (ionic.Platform.isAndroid()) { - // No bouncing by default on Android - scrollView.options.bouncing = false; - // Faster scroll decel - scrollView.options.deceleration = 0.95; - } - } - }); - } - - var resize = angular.bind(scrollView, scrollView.resize); - angular.element($window).on('resize', resize); - - var scrollFunc = function(e) { - var detail = (e.originalEvent || e).detail || {}; - $scope.$onScroll && $scope.$onScroll({ - event: e, - scrollTop: detail.scrollTop || 0, - scrollLeft: detail.scrollLeft || 0 - }); - }; - - $element.on('scroll', scrollFunc); - - $scope.$on('$destroy', function() { - deregisterInstance(); - scrollView && scrollView.__cleanup && scrollView.__cleanup(); - angular.element($window).off('resize', resize); - if ( $element ) { - $element.off('scroll', scrollFunc); - } - if ( self._scrollViewOptions ) { - self._scrollViewOptions.el = null; - } - if ( scrollViewOptions ) { - scrollViewOptions.el = null; - } - - scrollView = self.scrollView = scrollViewOptions = self._scrollViewOptions = element = self.$element = $element = null; - }); - - $timeout(function() { - scrollView && scrollView.run && scrollView.run(); - }); - - self.getScrollView = function() { - return scrollView; - }; - - self.getScrollPosition = function() { - return scrollView.getValues(); - }; - - self.resize = function() { - return $timeout(resize, 0, false).then(function() { - $element && $element.triggerHandler('scroll-resize'); - }); - }; - - self.scrollTop = function(shouldAnimate) { - self.resize().then(function() { - if (!scrollView) { - return; - } - scrollView.scrollTo(0, 0, !!shouldAnimate); - }); - }; - - self.scrollBottom = function(shouldAnimate) { - self.resize().then(function() { - if (!scrollView) { - return; - } - var max = scrollView.getScrollMax(); - scrollView.scrollTo(max.left, max.top, !!shouldAnimate); - }); - }; - - self.scrollTo = function(left, top, shouldAnimate) { - self.resize().then(function() { - if (!scrollView) { - return; - } - scrollView.scrollTo(left, top, !!shouldAnimate); - }); - }; - - self.zoomTo = function(zoom, shouldAnimate, originLeft, originTop) { - self.resize().then(function() { - if (!scrollView) { - return; - } - scrollView.zoomTo(zoom, !!shouldAnimate, originLeft, originTop); - }); - }; - - self.zoomBy = function(zoom, shouldAnimate, originLeft, originTop) { - self.resize().then(function() { - if (!scrollView) { - return; - } - scrollView.zoomBy(zoom, !!shouldAnimate, originLeft, originTop); - }); - }; - - self.scrollBy = function(left, top, shouldAnimate) { - self.resize().then(function() { - if (!scrollView) { - return; - } - scrollView.scrollBy(left, top, !!shouldAnimate); - }); - }; - - self.anchorScroll = function(shouldAnimate) { - self.resize().then(function() { - if (!scrollView) { - return; - } - var hash = $location.hash(); - var elm = hash && $document[0].getElementById(hash); - if (!(hash && elm)) { - scrollView.scrollTo(0, 0, !!shouldAnimate); - return; - } - var curElm = elm; - var scrollLeft = 0, scrollTop = 0; - do { - if (curElm !== null) scrollLeft += curElm.offsetLeft; - if (curElm !== null) scrollTop += curElm.offsetTop; - curElm = curElm.offsetParent; - } while (curElm.attributes != self.element.attributes && curElm.offsetParent); - scrollView.scrollTo(scrollLeft, scrollTop, !!shouldAnimate); - }); - }; - - self.freezeScroll = scrollView.freeze; - self.freezeScrollShut = scrollView.freezeShut; - - self.freezeAllScrolls = function(shouldFreeze) { - for (var i = 0; i < $ionicScrollDelegate._instances.length; i++) { - $ionicScrollDelegate._instances[i].freezeScroll(shouldFreeze); - } - }; - - - /** - * @private - */ - self._setRefresher = function(refresherScope, refresherElement, refresherMethods) { - self.refresher = refresherElement; - var refresherHeight = self.refresher.clientHeight || 60; - scrollView.activatePullToRefresh( - refresherHeight, - refresherMethods - ); - }; - -}]); - -IonicModule -.controller('$ionicSideMenus', [ - '$scope', - '$attrs', - '$ionicSideMenuDelegate', - '$ionicPlatform', - '$ionicBody', - '$ionicHistory', - '$ionicScrollDelegate', - 'IONIC_BACK_PRIORITY', - '$rootScope', -function($scope, $attrs, $ionicSideMenuDelegate, $ionicPlatform, $ionicBody, $ionicHistory, $ionicScrollDelegate, IONIC_BACK_PRIORITY, $rootScope) { - var self = this; - var rightShowing, leftShowing, isDragging; - var startX, lastX, offsetX, isAsideExposed; - var enableMenuWithBackViews = true; - - self.$scope = $scope; - - self.initialize = function(options) { - self.left = options.left; - self.right = options.right; - self.setContent(options.content); - self.dragThresholdX = options.dragThresholdX || 10; - $ionicHistory.registerHistory(self.$scope); - }; - - /** - * Set the content view controller if not passed in the constructor options. - * - * @param {object} content - */ - self.setContent = function(content) { - if (content) { - self.content = content; - - self.content.onDrag = function(e) { - self._handleDrag(e); - }; - - self.content.endDrag = function(e) { - self._endDrag(e); - }; - } - }; - - self.isOpenLeft = function() { - return self.getOpenAmount() > 0; - }; - - self.isOpenRight = function() { - return self.getOpenAmount() < 0; - }; - - /** - * Toggle the left menu to open 100% - */ - self.toggleLeft = function(shouldOpen) { - if (isAsideExposed || !self.left.isEnabled) return; - var openAmount = self.getOpenAmount(); - if (arguments.length === 0) { - shouldOpen = openAmount <= 0; - } - self.content.enableAnimation(); - if (!shouldOpen) { - self.openPercentage(0); - $rootScope.$emit('$ionicSideMenuClose', 'left'); - } else { - self.openPercentage(100); - $rootScope.$emit('$ionicSideMenuOpen', 'left'); - } - }; - - /** - * Toggle the right menu to open 100% - */ - self.toggleRight = function(shouldOpen) { - if (isAsideExposed || !self.right.isEnabled) return; - var openAmount = self.getOpenAmount(); - if (arguments.length === 0) { - shouldOpen = openAmount >= 0; - } - self.content.enableAnimation(); - if (!shouldOpen) { - self.openPercentage(0); - $rootScope.$emit('$ionicSideMenuClose', 'right'); - } else { - self.openPercentage(-100); - $rootScope.$emit('$ionicSideMenuOpen', 'right'); - } - }; - - self.toggle = function(side) { - if (side == 'right') { - self.toggleRight(); - } else { - self.toggleLeft(); - } - }; - - /** - * Close all menus. - */ - self.close = function() { - self.openPercentage(0); - $rootScope.$emit('$ionicSideMenuClose', 'left'); - $rootScope.$emit('$ionicSideMenuClose', 'right'); - }; - - /** - * @return {float} The amount the side menu is open, either positive or negative for left (positive), or right (negative) - */ - self.getOpenAmount = function() { - return self.content && self.content.getTranslateX() || 0; - }; - - /** - * @return {float} The ratio of open amount over menu width. For example, a - * menu of width 100 open 50 pixels would be open 50% or a ratio of 0.5. Value is negative - * for right menu. - */ - self.getOpenRatio = function() { - var amount = self.getOpenAmount(); - if (amount >= 0) { - return amount / self.left.width; - } - return amount / self.right.width; - }; - - self.isOpen = function() { - return self.getOpenAmount() !== 0; - }; - - /** - * @return {float} The percentage of open amount over menu width. For example, a - * menu of width 100 open 50 pixels would be open 50%. Value is negative - * for right menu. - */ - self.getOpenPercentage = function() { - return self.getOpenRatio() * 100; - }; - - /** - * Open the menu with a given percentage amount. - * @param {float} percentage The percentage (positive or negative for left/right) to open the menu. - */ - self.openPercentage = function(percentage) { - var p = percentage / 100; - - if (self.left && percentage >= 0) { - self.openAmount(self.left.width * p); - } else if (self.right && percentage < 0) { - self.openAmount(self.right.width * p); - } - - // add the CSS class "menu-open" if the percentage does not - // equal 0, otherwise remove the class from the body element - $ionicBody.enableClass((percentage !== 0), 'menu-open'); - - self.content.setCanScroll(percentage == 0); - }; - - /* - function freezeAllScrolls(shouldFreeze) { - if (shouldFreeze && !self.isScrollFreeze) { - $ionicScrollDelegate.freezeAllScrolls(shouldFreeze); - - } else if (!shouldFreeze && self.isScrollFreeze) { - $ionicScrollDelegate.freezeAllScrolls(false); - } - self.isScrollFreeze = shouldFreeze; - } - */ - - /** - * Open the menu the given pixel amount. - * @param {float} amount the pixel amount to open the menu. Positive value for left menu, - * negative value for right menu (only one menu will be visible at a time). - */ - self.openAmount = function(amount) { - var maxLeft = self.left && self.left.width || 0; - var maxRight = self.right && self.right.width || 0; - - // Check if we can move to that side, depending if the left/right panel is enabled - if (!(self.left && self.left.isEnabled) && amount > 0) { - self.content.setTranslateX(0); - return; - } - - if (!(self.right && self.right.isEnabled) && amount < 0) { - self.content.setTranslateX(0); - return; - } - - if (leftShowing && amount > maxLeft) { - self.content.setTranslateX(maxLeft); - return; - } - - if (rightShowing && amount < -maxRight) { - self.content.setTranslateX(-maxRight); - return; - } - - self.content.setTranslateX(amount); - - leftShowing = amount > 0; - rightShowing = amount < 0; - - if (amount > 0) { - // Push the z-index of the right menu down - self.right && self.right.pushDown && self.right.pushDown(); - // Bring the z-index of the left menu up - self.left && self.left.bringUp && self.left.bringUp(); - } else { - // Bring the z-index of the right menu up - self.right && self.right.bringUp && self.right.bringUp(); - // Push the z-index of the left menu down - self.left && self.left.pushDown && self.left.pushDown(); - } - }; - - /** - * Given an event object, find the final resting position of this side - * menu. For example, if the user "throws" the content to the right and - * releases the touch, the left menu should snap open (animated, of course). - * - * @param {Event} e the gesture event to use for snapping - */ - self.snapToRest = function(e) { - // We want to animate at the end of this - self.content.enableAnimation(); - isDragging = false; - - // Check how much the panel is open after the drag, and - // what the drag velocity is - var ratio = self.getOpenRatio(); - - if (ratio === 0) { - // Just to be safe - self.openPercentage(0); - return; - } - - var velocityThreshold = 0.3; - var velocityX = e.gesture.velocityX; - var direction = e.gesture.direction; - - // Going right, less than half, too slow (snap back) - if (ratio > 0 && ratio < 0.5 && direction == 'right' && velocityX < velocityThreshold) { - self.openPercentage(0); - } - - // Going left, more than half, too slow (snap back) - else if (ratio > 0.5 && direction == 'left' && velocityX < velocityThreshold) { - self.openPercentage(100); - } - - // Going left, less than half, too slow (snap back) - else if (ratio < 0 && ratio > -0.5 && direction == 'left' && velocityX < velocityThreshold) { - self.openPercentage(0); - } - - // Going right, more than half, too slow (snap back) - else if (ratio < 0.5 && direction == 'right' && velocityX < velocityThreshold) { - self.openPercentage(-100); - } - - // Going right, more than half, or quickly (snap open) - else if (direction == 'right' && ratio >= 0 && (ratio >= 0.5 || velocityX > velocityThreshold)) { - self.openPercentage(100); - } - - // Going left, more than half, or quickly (span open) - else if (direction == 'left' && ratio <= 0 && (ratio <= -0.5 || velocityX > velocityThreshold)) { - self.openPercentage(-100); - } - - // Snap back for safety - else { - self.openPercentage(0); - } - }; - - self.enableMenuWithBackViews = function(val) { - if (arguments.length) { - enableMenuWithBackViews = !!val; - } - return enableMenuWithBackViews; - }; - - self.isAsideExposed = function() { - return !!isAsideExposed; - }; - - self.exposeAside = function(shouldExposeAside) { - if (!(self.left && self.left.isEnabled) && !(self.right && self.right.isEnabled)) return; - self.close(); - - isAsideExposed = shouldExposeAside; - if ((self.left && self.left.isEnabled) && (self.right && self.right.isEnabled)) { - self.content.setMarginLeftAndRight(isAsideExposed ? self.left.width : 0, isAsideExposed ? self.right.width : 0); - } else if (self.left && self.left.isEnabled) { - // set the left marget width if it should be exposed - // otherwise set false so there's no left margin - self.content.setMarginLeft(isAsideExposed ? self.left.width : 0); - } else if (self.right && self.right.isEnabled) { - self.content.setMarginRight(isAsideExposed ? self.right.width : 0); - } - self.$scope.$emit('$ionicExposeAside', isAsideExposed); - }; - - self.activeAsideResizing = function(isResizing) { - $ionicBody.enableClass(isResizing, 'aside-resizing'); - }; - - // End a drag with the given event - self._endDrag = function(e) { - if (isAsideExposed) return; - - if (isDragging) { - self.snapToRest(e); - } - startX = null; - lastX = null; - offsetX = null; - }; - - // Handle a drag event - self._handleDrag = function(e) { - if (isAsideExposed || !$scope.dragContent) return; - - // If we don't have start coords, grab and store them - if (!startX) { - startX = e.gesture.touches[0].pageX; - lastX = startX; - } else { - // Grab the current tap coords - lastX = e.gesture.touches[0].pageX; - } - - // Calculate difference from the tap points - if (!isDragging && Math.abs(lastX - startX) > self.dragThresholdX) { - // if the difference is greater than threshold, start dragging using the current - // point as the starting point - startX = lastX; - - isDragging = true; - // Initialize dragging - self.content.disableAnimation(); - offsetX = self.getOpenAmount(); - } - - if (isDragging) { - self.openAmount(offsetX + (lastX - startX)); - //self.content.setCanScroll(false); - } - }; - - self.canDragContent = function(canDrag) { - if (arguments.length) { - $scope.dragContent = !!canDrag; - } - return $scope.dragContent; - }; - - self.edgeThreshold = 25; - self.edgeThresholdEnabled = false; - self.edgeDragThreshold = function(value) { - if (arguments.length) { - if (isNumber(value) && value > 0) { - self.edgeThreshold = value; - self.edgeThresholdEnabled = true; - } else { - self.edgeThresholdEnabled = !!value; - } - } - return self.edgeThresholdEnabled; - }; - - self.isDraggableTarget = function(e) { - //Only restrict edge when sidemenu is closed and restriction is enabled - var shouldOnlyAllowEdgeDrag = self.edgeThresholdEnabled && !self.isOpen(); - var startX = e.gesture.startEvent && e.gesture.startEvent.center && - e.gesture.startEvent.center.pageX; - - var dragIsWithinBounds = !shouldOnlyAllowEdgeDrag || - startX <= self.edgeThreshold || - startX >= self.content.element.offsetWidth - self.edgeThreshold; - - var backView = $ionicHistory.backView(); - var menuEnabled = enableMenuWithBackViews ? true : !backView; - if (!menuEnabled) { - var currentView = $ionicHistory.currentView() || {}; - return (dragIsWithinBounds && (backView.historyId !== currentView.historyId)); - } - - return ($scope.dragContent || self.isOpen()) && - dragIsWithinBounds && - !e.gesture.srcEvent.defaultPrevented && - menuEnabled && - !e.target.tagName.match(/input|textarea|select|object|embed/i) && - !e.target.isContentEditable && - !(e.target.dataset ? e.target.dataset.preventScroll : e.target.getAttribute('data-prevent-scroll') == 'true'); - }; - - $scope.sideMenuContentTranslateX = 0; - - var deregisterBackButtonAction = noop; - var closeSideMenu = angular.bind(self, self.close); - - $scope.$watch(function() { - return self.getOpenAmount() !== 0; - }, function(isOpen) { - deregisterBackButtonAction(); - if (isOpen) { - deregisterBackButtonAction = $ionicPlatform.registerBackButtonAction( - closeSideMenu, - IONIC_BACK_PRIORITY.sideMenu - ); - } - }); - - var deregisterInstance = $ionicSideMenuDelegate._registerInstance( - self, $attrs.delegateHandle, function() { - return $ionicHistory.isActiveScope($scope); - } - ); - - $scope.$on('$destroy', function() { - deregisterInstance(); - deregisterBackButtonAction(); - self.$scope = null; - if (self.content) { - self.content.setCanScroll(true); - self.content.element = null; - self.content = null; - } - }); - - self.initialize({ - left: { - width: 275 - }, - right: { - width: 275 - } - }); - -}]); - -(function(ionic) { - - var TRANSLATE32 = 'translate(32,32)'; - var STROKE_OPACITY = 'stroke-opacity'; - var ROUND = 'round'; - var INDEFINITE = 'indefinite'; - var DURATION = '750ms'; - var NONE = 'none'; - var SHORTCUTS = { - a: 'animate', - an: 'attributeName', - at: 'animateTransform', - c: 'circle', - da: 'stroke-dasharray', - os: 'stroke-dashoffset', - f: 'fill', - lc: 'stroke-linecap', - rc: 'repeatCount', - sw: 'stroke-width', - t: 'transform', - v: 'values' - }; - - var SPIN_ANIMATION = { - v: '0,32,32;360,32,32', - an: 'transform', - type: 'rotate', - rc: INDEFINITE, - dur: DURATION - }; - - function createSvgElement(tagName, data, parent, spinnerName) { - var ele = document.createElement(SHORTCUTS[tagName] || tagName); - var k, x, y; - - for (k in data) { - - if (angular.isArray(data[k])) { - for (x = 0; x < data[k].length; x++) { - if (data[k][x].fn) { - for (y = 0; y < data[k][x].t; y++) { - createSvgElement(k, data[k][x].fn(y, spinnerName), ele, spinnerName); - } - } else { - createSvgElement(k, data[k][x], ele, spinnerName); - } - } - - } else { - setSvgAttribute(ele, k, data[k]); - } - } - - parent.appendChild(ele); - } - - function setSvgAttribute(ele, k, v) { - ele.setAttribute(SHORTCUTS[k] || k, v); - } - - function animationValues(strValues, i) { - var values = strValues.split(';'); - var back = values.slice(i); - var front = values.slice(0, values.length - back.length); - values = back.concat(front).reverse(); - return values.join(';') + ';' + values[0]; - } - - var IOS_SPINNER = { - sw: 4, - lc: ROUND, - line: [{ - fn: function(i, spinnerName) { - return { - y1: spinnerName == 'ios' ? 17 : 12, - y2: spinnerName == 'ios' ? 29 : 20, - t: TRANSLATE32 + ' rotate(' + (30 * i + (i < 6 ? 180 : -180)) + ')', - a: [{ - fn: function() { - return { - an: STROKE_OPACITY, - dur: DURATION, - v: animationValues('0;.1;.15;.25;.35;.45;.55;.65;.7;.85;1', i), - rc: INDEFINITE - }; - }, - t: 1 - }] - }; - }, - t: 12 - }] - }; - - var spinners = { - - android: { - c: [{ - sw: 6, - da: 128, - os: 82, - r: 26, - cx: 32, - cy: 32, - f: NONE - }] - }, - - ios: IOS_SPINNER, - - 'ios-small': IOS_SPINNER, - - bubbles: { - sw: 0, - c: [{ - fn: function(i) { - return { - cx: 24 * Math.cos(2 * Math.PI * i / 8), - cy: 24 * Math.sin(2 * Math.PI * i / 8), - t: TRANSLATE32, - a: [{ - fn: function() { - return { - an: 'r', - dur: DURATION, - v: animationValues('1;2;3;4;5;6;7;8', i), - rc: INDEFINITE - }; - }, - t: 1 - }] - }; - }, - t: 8 - }] - }, - - circles: { - - c: [{ - fn: function(i) { - return { - r: 5, - cx: 24 * Math.cos(2 * Math.PI * i / 8), - cy: 24 * Math.sin(2 * Math.PI * i / 8), - t: TRANSLATE32, - sw: 0, - a: [{ - fn: function() { - return { - an: 'fill-opacity', - dur: DURATION, - v: animationValues('.3;.3;.3;.4;.7;.85;.9;1', i), - rc: INDEFINITE - }; - }, - t: 1 - }] - }; - }, - t: 8 - }] - }, - - crescent: { - c: [{ - sw: 4, - da: 128, - os: 82, - r: 26, - cx: 32, - cy: 32, - f: NONE, - at: [SPIN_ANIMATION] - }] - }, - - dots: { - - c: [{ - fn: function(i) { - return { - cx: 16 + (16 * i), - cy: 32, - sw: 0, - a: [{ - fn: function() { - return { - an: 'fill-opacity', - dur: DURATION, - v: animationValues('.5;.6;.8;1;.8;.6;.5', i), - rc: INDEFINITE - }; - }, - t: 1 - }, { - fn: function() { - return { - an: 'r', - dur: DURATION, - v: animationValues('4;5;6;5;4;3;3', i), - rc: INDEFINITE - }; - }, - t: 1 - }] - }; - }, - t: 3 - }] - }, - - lines: { - sw: 7, - lc: ROUND, - line: [{ - fn: function(i) { - return { - x1: 10 + (i * 14), - x2: 10 + (i * 14), - a: [{ - fn: function() { - return { - an: 'y1', - dur: DURATION, - v: animationValues('16;18;28;18;16', i), - rc: INDEFINITE - }; - }, - t: 1 - }, { - fn: function() { - return { - an: 'y2', - dur: DURATION, - v: animationValues('48;44;36;46;48', i), - rc: INDEFINITE - }; - }, - t: 1 - }, { - fn: function() { - return { - an: STROKE_OPACITY, - dur: DURATION, - v: animationValues('1;.8;.5;.4;1', i), - rc: INDEFINITE - }; - }, - t: 1 - }] - }; - }, - t: 4 - }] - }, - - ripple: { - f: NONE, - 'fill-rule': 'evenodd', - sw: 3, - circle: [{ - fn: function(i) { - return { - cx: 32, - cy: 32, - a: [{ - fn: function() { - return { - an: 'r', - begin: (i * -1) + 's', - dur: '2s', - v: '0;24', - keyTimes: '0;1', - keySplines: '0.1,0.2,0.3,1', - calcMode: 'spline', - rc: INDEFINITE - }; - }, - t: 1 - }, { - fn: function() { - return { - an: STROKE_OPACITY, - begin: (i * -1) + 's', - dur: '2s', - v: '.2;1;.2;0', - rc: INDEFINITE - }; - }, - t: 1 - }] - }; - }, - t: 2 - }] - }, - - spiral: { - defs: [{ - linearGradient: [{ - id: 'sGD', - gradientUnits: 'userSpaceOnUse', - x1: 55, y1: 46, x2: 2, y2: 46, - stop: [{ - offset: 0.1, - class: 'stop1' - }, { - offset: 1, - class: 'stop2' - }] - }] - }], - g: [{ - sw: 4, - lc: ROUND, - f: NONE, - path: [{ - stroke: 'url(#sGD)', - d: 'M4,32 c0,15,12,28,28,28c8,0,16-4,21-9' - }, { - d: 'M60,32 C60,16,47.464,4,32,4S4,16,4,32' - }], - at: [SPIN_ANIMATION] - }] - } - - }; - - var animations = { - - android: function(ele) { - // Note that this is called as a function, not a constructor. - var self = {}; - - this.stop = false; - - var rIndex = 0; - var rotateCircle = 0; - var startTime; - var svgEle = ele.querySelector('g'); - var circleEle = ele.querySelector('circle'); - - function run() { - if (self.stop) return; - - var v = easeInOutCubic(Date.now() - startTime, 650); - var scaleX = 1; - var translateX = 0; - var dasharray = (188 - (58 * v)); - var dashoffset = (182 - (182 * v)); - - if (rIndex % 2) { - scaleX = -1; - translateX = -64; - dasharray = (128 - (-58 * v)); - dashoffset = (182 * v); - } - - var rotateLine = [0, -101, -90, -11, -180, 79, -270, -191][rIndex]; - - setSvgAttribute(circleEle, 'da', Math.max(Math.min(dasharray, 188), 128)); - setSvgAttribute(circleEle, 'os', Math.max(Math.min(dashoffset, 182), 0)); - setSvgAttribute(circleEle, 't', 'scale(' + scaleX + ',1) translate(' + translateX + ',0) rotate(' + rotateLine + ',32,32)'); - - rotateCircle += 4.1; - if (rotateCircle > 359) rotateCircle = 0; - setSvgAttribute(svgEle, 't', 'rotate(' + rotateCircle + ',32,32)'); - - if (v >= 1) { - rIndex++; - if (rIndex > 7) rIndex = 0; - startTime = Date.now(); - } - - ionic.requestAnimationFrame(run); - } - - return function() { - startTime = Date.now(); - run(); - return self; - }; - - } - - }; - - function easeInOutCubic(t, c) { - t /= c / 2; - if (t < 1) return 1 / 2 * t * t * t; - t -= 2; - return 1 / 2 * (t * t * t + 2); - } - - - IonicModule - .controller('$ionicSpinner', [ - '$element', - '$attrs', - '$ionicConfig', - function($element, $attrs, $ionicConfig) { - var spinnerName, anim; - - this.init = function() { - spinnerName = $attrs.icon || $ionicConfig.spinner.icon(); - - var container = document.createElement('div'); - createSvgElement('svg', { - viewBox: '0 0 64 64', - g: [spinners[spinnerName]] - }, container, spinnerName); - - // Specifically for animations to work, - // Android 4.3 and below requires the element to be - // added as an html string, rather than dynmically - // building up the svg element and appending it. - $element.html(container.innerHTML); - - this.start(); - - return spinnerName; - }; - - this.start = function() { - animations[spinnerName] && (anim = animations[spinnerName]($element[0])()); - }; - - this.stop = function() { - animations[spinnerName] && (anim.stop = true); - }; - - }]); - -})(ionic); - -IonicModule -.controller('$ionicTab', [ - '$scope', - '$ionicHistory', - '$attrs', - '$location', - '$state', -function($scope, $ionicHistory, $attrs, $location, $state) { - this.$scope = $scope; - - //All of these exposed for testing - this.hrefMatchesState = function() { - return $attrs.href && $location.path().indexOf( - $attrs.href.replace(/^#/, '').replace(/\/$/, '') - ) === 0; - }; - this.srefMatchesState = function() { - return $attrs.uiSref && $state.includes($attrs.uiSref.split('(')[0]); - }; - this.navNameMatchesState = function() { - return this.navViewName && $ionicHistory.isCurrentStateNavView(this.navViewName); - }; - - this.tabMatchesState = function() { - return this.hrefMatchesState() || this.srefMatchesState() || this.navNameMatchesState(); - }; -}]); - -IonicModule -.controller('$ionicTabs', [ - '$scope', - '$element', - '$ionicHistory', -function($scope, $element, $ionicHistory) { - var self = this; - var selectedTab = null; - var previousSelectedTab = null; - var selectedTabIndex; - var isVisible = true; - self.tabs = []; - - self.selectedIndex = function() { - return self.tabs.indexOf(selectedTab); - }; - self.selectedTab = function() { - return selectedTab; - }; - self.previousSelectedTab = function() { - return previousSelectedTab; - }; - - self.add = function(tab) { - $ionicHistory.registerHistory(tab); - self.tabs.push(tab); - }; - - self.remove = function(tab) { - var tabIndex = self.tabs.indexOf(tab); - if (tabIndex === -1) { - return; - } - //Use a field like '$tabSelected' so developers won't accidentally set it in controllers etc - if (tab.$tabSelected) { - self.deselect(tab); - //Try to select a new tab if we're removing a tab - if (self.tabs.length === 1) { - //Do nothing if there are no other tabs to select - } else { - //Select previous tab if it's the last tab, else select next tab - var newTabIndex = tabIndex === self.tabs.length - 1 ? tabIndex - 1 : tabIndex + 1; - self.select(self.tabs[newTabIndex]); - } - } - self.tabs.splice(tabIndex, 1); - }; - - self.deselect = function(tab) { - if (tab.$tabSelected) { - previousSelectedTab = selectedTab; - selectedTab = selectedTabIndex = null; - tab.$tabSelected = false; - (tab.onDeselect || noop)(); - tab.$broadcast && tab.$broadcast('$ionicHistory.deselect'); - } - }; - - self.select = function(tab, shouldEmitEvent) { - var tabIndex; - if (isNumber(tab)) { - tabIndex = tab; - if (tabIndex >= self.tabs.length) return; - tab = self.tabs[tabIndex]; - } else { - tabIndex = self.tabs.indexOf(tab); - } - - if (arguments.length === 1) { - shouldEmitEvent = !!(tab.navViewName || tab.uiSref); - } - - if (selectedTab && selectedTab.$historyId == tab.$historyId) { - if (shouldEmitEvent) { - $ionicHistory.goToHistoryRoot(tab.$historyId); - } - - } else if (selectedTabIndex !== tabIndex) { - forEach(self.tabs, function(tab) { - self.deselect(tab); - }); - - selectedTab = tab; - selectedTabIndex = tabIndex; - - if (self.$scope && self.$scope.$parent) { - self.$scope.$parent.$activeHistoryId = tab.$historyId; - } - - //Use a funny name like $tabSelected so the developer doesn't overwrite the var in a child scope - tab.$tabSelected = true; - (tab.onSelect || noop)(); - - if (shouldEmitEvent) { - $scope.$emit('$ionicHistory.change', { - type: 'tab', - tabIndex: tabIndex, - historyId: tab.$historyId, - navViewName: tab.navViewName, - hasNavView: !!tab.navViewName, - title: tab.title, - url: tab.href, - uiSref: tab.uiSref - }); - } - - $scope.$broadcast("tabSelected", { selectedTab: tab, selectedTabIndex: tabIndex}); - } - }; - - self.hasActiveScope = function() { - for (var x = 0; x < self.tabs.length; x++) { - if ($ionicHistory.isActiveScope(self.tabs[x])) { - return true; - } - } - return false; - }; - - self.showBar = function(show) { - if (arguments.length) { - if (show) { - $element.removeClass('tabs-item-hide'); - } else { - $element.addClass('tabs-item-hide'); - } - isVisible = !!show; - } - return isVisible; - }; -}]); - -IonicModule -.controller('$ionicView', [ - '$scope', - '$element', - '$attrs', - '$compile', - '$rootScope', -function($scope, $element, $attrs, $compile, $rootScope) { - var self = this; - var navElementHtml = {}; - var navViewCtrl; - var navBarDelegateHandle; - var hasViewHeaderBar; - var deregisters = []; - var viewTitle; - - var deregIonNavBarInit = $scope.$on('ionNavBar.init', function(ev, delegateHandle) { - // this view has its own ion-nav-bar, remember the navBarDelegateHandle for this view - ev.stopPropagation(); - navBarDelegateHandle = delegateHandle; - }); - - - self.init = function() { - deregIonNavBarInit(); - - var modalCtrl = $element.inheritedData('$ionModalController'); - navViewCtrl = $element.inheritedData('$ionNavViewController'); - - // don't bother if inside a modal or there's no parent navView - if (!navViewCtrl || modalCtrl) return; - - // add listeners for when this view changes - $scope.$on('$ionicView.beforeEnter', self.beforeEnter); - $scope.$on('$ionicView.afterEnter', afterEnter); - $scope.$on('$ionicView.beforeLeave', deregisterFns); - }; - - self.beforeEnter = function(ev, transData) { - // this event was emitted, starting at intial ion-view, then bubbles up - // only the first ion-view should do something with it, parent ion-views should ignore - if (transData && !transData.viewNotified) { - transData.viewNotified = true; - - if (!$rootScope.$$phase) $scope.$digest(); - viewTitle = isDefined($attrs.viewTitle) ? $attrs.viewTitle : $attrs.title; - - var navBarItems = {}; - for (var n in navElementHtml) { - navBarItems[n] = generateNavBarItem(navElementHtml[n]); - } - - navViewCtrl.beforeEnter(extend(transData, { - title: viewTitle, - showBack: !attrTrue('hideBackButton'), - navBarItems: navBarItems, - navBarDelegate: navBarDelegateHandle || null, - showNavBar: !attrTrue('hideNavBar'), - hasHeaderBar: !!hasViewHeaderBar - })); - - // make sure any existing observers are cleaned up - deregisterFns(); - } - }; - - - function afterEnter() { - // only listen for title updates after it has entered - // but also deregister the observe before it leaves - var viewTitleAttr = isDefined($attrs.viewTitle) && 'viewTitle' || isDefined($attrs.title) && 'title'; - if (viewTitleAttr) { - titleUpdate($attrs[viewTitleAttr]); - deregisters.push($attrs.$observe(viewTitleAttr, titleUpdate)); - } - - if (isDefined($attrs.hideBackButton)) { - deregisters.push($scope.$watch($attrs.hideBackButton, function(val) { - navViewCtrl.showBackButton(!val); - })); - } - - if (isDefined($attrs.hideNavBar)) { - deregisters.push($scope.$watch($attrs.hideNavBar, function(val) { - navViewCtrl.showBar(!val); - })); - } - } - - - function titleUpdate(newTitle) { - if (isDefined(newTitle) && newTitle !== viewTitle) { - viewTitle = newTitle; - navViewCtrl.title(viewTitle); - } - } - - - function deregisterFns() { - // remove all existing $attrs.$observe's - for (var x = 0; x < deregisters.length; x++) { - deregisters[x](); - } - deregisters = []; - } - - - function generateNavBarItem(html) { - if (html) { - // every time a view enters we need to recreate its view buttons if they exist - return $compile(html)($scope.$new()); - } - } - - - function attrTrue(key) { - return !!$scope.$eval($attrs[key]); - } - - - self.navElement = function(type, html) { - navElementHtml[type] = html; - }; - -}]); - -/* - * We don't document the ionActionSheet directive, we instead document - * the $ionicActionSheet service - */ -IonicModule -.directive('ionActionSheet', ['$document', function($document) { - return { - restrict: 'E', - scope: true, - replace: true, - link: function($scope, $element) { - - var keyUp = function(e) { - if (e.which == 27) { - $scope.cancel(); - $scope.$apply(); - } - }; - - var backdropClick = function(e) { - if (e.target == $element[0]) { - $scope.cancel(); - $scope.$apply(); - } - }; - $scope.$on('$destroy', function() { - $element.remove(); - $document.unbind('keyup', keyUp); - }); - - $document.bind('keyup', keyUp); - $element.bind('click', backdropClick); - }, - template: '
' + - '
' + - '
' + - '
' + - '
' + - '' + - '' + - '
' + - '
' + - '' + - '
' + - '
' + - '
' + - '
' - }; -}]); - - -/** - * @ngdoc directive - * @name ionCheckbox - * @module ionic - * @restrict E - * @codepen hqcju - * @description - * The checkbox is no different than the HTML checkbox input, except it's styled differently. - * - * The checkbox behaves like any [AngularJS checkbox](http://docs.angularjs.org/api/ng/input/input[checkbox]). - * - * @usage - * ```html - * Checkbox Label - * ``` - */ - -IonicModule -.directive('ionCheckbox', ['$ionicConfig', function($ionicConfig) { - return { - restrict: 'E', - replace: true, - require: '?ngModel', - transclude: true, - template: - '', - compile: function(element, attr) { - var input = element.find('input'); - forEach({ - 'name': attr.name, - 'ng-value': attr.ngValue, - 'ng-model': attr.ngModel, - 'ng-checked': attr.ngChecked, - 'ng-disabled': attr.ngDisabled, - 'ng-true-value': attr.ngTrueValue, - 'ng-false-value': attr.ngFalseValue, - 'ng-change': attr.ngChange, - 'ng-required': attr.ngRequired, - 'required': attr.required - }, function(value, name) { - if (isDefined(value)) { - input.attr(name, value); - } - }); - var checkboxWrapper = element[0].querySelector('.checkbox'); - checkboxWrapper.classList.add('checkbox-' + $ionicConfig.form.checkbox()); - } - }; -}]); - - -/** - * @ngdoc directive - * @restrict A - * @name collectionRepeat - * @module ionic - * @codepen 7ec1ec58f2489ab8f359fa1a0fe89c15 - * @description - * `collection-repeat` allows an app to show huge lists of items much more performantly than - * `ng-repeat`. - * - * It renders into the DOM only as many items as are currently visible. - * - * This means that on a phone screen that can fit eight items, only the eight items matching - * the current scroll position will be rendered. - * - * **The Basics**: - * - * - The data given to collection-repeat must be an array. - * - If the `item-height` and `item-width` attributes are not supplied, it will be assumed that - * every item in the list has the same dimensions as the first item. - * - Don't use angular one-time binding (`::`) with collection-repeat. The scope of each item is - * assigned new data and re-digested as you scroll. Bindings need to update, and one-time bindings - * won't. - * - * **Performance Tips**: - * - * - The iOS webview has a performance bottleneck when switching out `` attributes. - * To increase performance of images on iOS, cache your images in advance and, - * if possible, lower the number of unique images. We're working on [a solution](https://github.com/driftyco/ionic/issues/3194). - * - * @usage - * #### Basic Item List ([codepen](http://codepen.io/ionic/pen/0c2c35a34a8b18ad4d793fef0b081693)) - * ```html - * - * - * {% raw %}{{item}}{% endraw %} - * - * - * ``` - * - * #### Grid of Images ([codepen](http://codepen.io/ionic/pen/5515d4efd9d66f780e96787387f41664)) - * ```html - * - * - * - * ``` - * - * #### Horizontal Scroller, Dynamic Item Width ([codepen](http://codepen.io/ionic/pen/67cc56b349124a349acb57a0740e030e)) - * ```html - * - *

Available Kittens:

- * - *
- * - *
- * - * - * ``` - * - * @param {expression} collection-repeat The expression indicating how to enumerate a collection, - * of the format `variable in expression` – where variable is the user defined loop variable - * and `expression` is a scope expression giving the collection to enumerate. - * For example: `album in artist.albums` or `album in artist.albums | orderBy:'name'`. - * @param {expression=} item-width The width of the repeated element. The expression must return - * a number (pixels) or a percentage. Defaults to the width of the first item in the list. - * (previously named collection-item-width) - * @param {expression=} item-height The height of the repeated element. The expression must return - * a number (pixels) or a percentage. Defaults to the height of the first item in the list. - * (previously named collection-item-height) - * @param {number=} item-render-buffer The number of items to load before and after the visible - * items in the list. Default 3. Tip: set this higher if you have lots of images to preload, but - * don't set it too high or you'll see performance loss. - * @param {boolean=} force-refresh-images Force images to refresh as you scroll. This fixes a problem - * where, when an element is interchanged as scrolling, its image will still have the old src - * while the new src loads. Setting this to true comes with a small performance loss. - */ - -IonicModule -.directive('collectionRepeat', CollectionRepeatDirective) -.factory('$ionicCollectionManager', RepeatManagerFactory); - -var ONE_PX_TRANSPARENT_IMG_SRC = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'; -var WIDTH_HEIGHT_REGEX = /height:.*?px;\s*width:.*?px/; -var DEFAULT_RENDER_BUFFER = 3; - -CollectionRepeatDirective.$inject = ['$ionicCollectionManager', '$parse', '$window', '$$rAF', '$rootScope', '$timeout']; -function CollectionRepeatDirective($ionicCollectionManager, $parse, $window, $$rAF, $rootScope, $timeout) { - return { - restrict: 'A', - priority: 1000, - transclude: 'element', - $$tlb: true, - require: '^^$ionicScroll', - link: postLink - }; - - function postLink(scope, element, attr, scrollCtrl, transclude) { - var scrollView = scrollCtrl.scrollView; - var node = element[0]; - var containerNode = angular.element('
')[0]; - node.parentNode.replaceChild(containerNode, node); - - if (scrollView.options.scrollingX && scrollView.options.scrollingY) { - throw new Error("collection-repeat expected a parent x or y scrollView, not " + - "an xy scrollView."); - } - - var repeatExpr = attr.collectionRepeat; - var match = repeatExpr.match(/^\s*([\s\S]+?)\s+in\s+([\s\S]+?)(?:\s+track\s+by\s+([\s\S]+?))?\s*$/); - if (!match) { - throw new Error("collection-repeat expected expression in form of '_item_ in " + - "_collection_[ track by _id_]' but got '" + attr.collectionRepeat + "'."); - } - var keyExpr = match[1]; - var listExpr = match[2]; - var listGetter = $parse(listExpr); - var heightData = {}; - var widthData = {}; - var computedStyleDimensions = {}; - var data = []; - var repeatManager; - - // attr.collectionBufferSize is deprecated - var renderBufferExpr = attr.itemRenderBuffer || attr.collectionBufferSize; - var renderBuffer = angular.isDefined(renderBufferExpr) ? - parseInt(renderBufferExpr) : - DEFAULT_RENDER_BUFFER; - - // attr.collectionItemHeight is deprecated - var heightExpr = attr.itemHeight || attr.collectionItemHeight; - // attr.collectionItemWidth is deprecated - var widthExpr = attr.itemWidth || attr.collectionItemWidth; - - var afterItemsContainer = initAfterItemsContainer(); - - var changeValidator = makeChangeValidator(); - initDimensions(); - - // Dimensions are refreshed on resize or data change. - scrollCtrl.$element.on('scroll-resize', refreshDimensions); - - angular.element($window).on('resize', onResize); - var unlistenToExposeAside = $rootScope.$on('$ionicExposeAside', ionic.animationFrameThrottle(function() { - scrollCtrl.scrollView.resize(); - onResize(); - })); - $timeout(refreshDimensions, 0, false); - - function onResize() { - if (changeValidator.resizeRequiresRefresh(scrollView.__clientWidth, scrollView.__clientHeight)) { - refreshDimensions(); - } - } - - scope.$watchCollection(listGetter, function(newValue) { - data = newValue || (newValue = []); - if (!angular.isArray(newValue)) { - throw new Error("collection-repeat expected an array for '" + listExpr + "', " + - "but got a " + typeof value); - } - // Wait for this digest to end before refreshing everything. - scope.$$postDigest(function() { - getRepeatManager().setData(data); - if (changeValidator.dataChangeRequiresRefresh(data)) refreshDimensions(); - }); - }); - - scope.$on('$destroy', function() { - angular.element($window).off('resize', onResize); - unlistenToExposeAside(); - scrollCtrl.$element && scrollCtrl.$element.off('scroll-resize', refreshDimensions); - - computedStyleNode && computedStyleNode.parentNode && - computedStyleNode.parentNode.removeChild(computedStyleNode); - computedStyleScope && computedStyleScope.$destroy(); - computedStyleScope = computedStyleNode = null; - - repeatManager && repeatManager.destroy(); - repeatManager = null; - }); - - function makeChangeValidator() { - var self; - return (self = { - dataLength: 0, - width: 0, - height: 0, - // A resize triggers a refresh only if we have data, the scrollView has size, - // and the size has changed. - resizeRequiresRefresh: function(newWidth, newHeight) { - var requiresRefresh = self.dataLength && newWidth && newHeight && - (newWidth !== self.width || newHeight !== self.height); - - self.width = newWidth; - self.height = newHeight; - - return !!requiresRefresh; - }, - // A change in data only triggers a refresh if the data has length, or if the data's - // length is less than before. - dataChangeRequiresRefresh: function(newData) { - var requiresRefresh = newData.length > 0 || newData.length < self.dataLength; - - self.dataLength = newData.length; - - return !!requiresRefresh; - } - }); - } - - function getRepeatManager() { - return repeatManager || (repeatManager = new $ionicCollectionManager({ - afterItemsNode: afterItemsContainer[0], - containerNode: containerNode, - heightData: heightData, - widthData: widthData, - forceRefreshImages: !!(isDefined(attr.forceRefreshImages) && attr.forceRefreshImages !== 'false'), - keyExpression: keyExpr, - renderBuffer: renderBuffer, - scope: scope, - scrollView: scrollCtrl.scrollView, - transclude: transclude - })); - } - - function initAfterItemsContainer() { - var container = angular.element( - scrollView.__content.querySelector('.collection-repeat-after-container') - ); - // Put everything in the view after the repeater into a container. - if (!container.length) { - var elementIsAfterRepeater = false; - var afterNodes = [].filter.call(scrollView.__content.childNodes, function(node) { - if (ionic.DomUtil.contains(node, containerNode)) { - elementIsAfterRepeater = true; - return false; - } - return elementIsAfterRepeater; - }); - container = angular.element(''); - if (scrollView.options.scrollingX) { - container.addClass('horizontal'); - } - container.append(afterNodes); - scrollView.__content.appendChild(container[0]); - } - return container; - } - - function initDimensions() { - //Height and width have four 'modes': - //1) Computed Mode - // - Nothing is supplied, so we getComputedStyle() on one element in the list and use - // that width and height value for the width and height of every item. This is re-computed - // every resize. - //2) Constant Mode, Static Integer - // - The user provides a constant number for width or height, in pixels. We parse it, - // store it on the `value` field, and it never changes - //3) Constant Mode, Percent - // - The user provides a percent string for width or height. The getter for percent is - // stored on the `getValue()` field, and is re-evaluated once every resize. The result - // is stored on the `value` field. - //4) Dynamic Mode - // - The user provides a dynamic expression for the width or height. This is re-evaluated - // for every item, stored on the `.getValue()` field. - if (heightExpr) { - parseDimensionAttr(heightExpr, heightData); - } else { - heightData.computed = true; - } - if (widthExpr) { - parseDimensionAttr(widthExpr, widthData); - } else { - widthData.computed = true; - } - } - - function refreshDimensions() { - var hasData = data.length > 0; - - if (hasData && (heightData.computed || widthData.computed)) { - computeStyleDimensions(); - } - - if (hasData && heightData.computed) { - heightData.value = computedStyleDimensions.height; - if (!heightData.value) { - throw new Error('collection-repeat tried to compute the height of repeated elements "' + - repeatExpr + '", but was unable to. Please provide the "item-height" attribute. ' + - 'http://ionicframework.com/docs/api/directive/collectionRepeat/'); - } - } else if (!heightData.dynamic && heightData.getValue) { - // If it's a constant with a getter (eg percent), we just refresh .value after resize - heightData.value = heightData.getValue(); - } - - if (hasData && widthData.computed) { - widthData.value = computedStyleDimensions.width; - if (!widthData.value) { - throw new Error('collection-repeat tried to compute the width of repeated elements "' + - repeatExpr + '", but was unable to. Please provide the "item-width" attribute. ' + - 'http://ionicframework.com/docs/api/directive/collectionRepeat/'); - } - } else if (!widthData.dynamic && widthData.getValue) { - // If it's a constant with a getter (eg percent), we just refresh .value after resize - widthData.value = widthData.getValue(); - } - // Dynamic dimensions aren't updated on resize. Since they're already dynamic anyway, - // .getValue() will be used. - - getRepeatManager().refreshLayout(); - } - - function parseDimensionAttr(attrValue, dimensionData) { - if (!attrValue) return; - - var parsedValue; - // Try to just parse the plain attr value - try { - parsedValue = $parse(attrValue); - } catch (e) { - // If the parse fails and the value has `px` or `%` in it, surround the attr in - // quotes, to attempt to let the user provide a simple `attr="100%"` or `attr="100px"` - if (attrValue.trim().match(/\d+(px|%)$/)) { - attrValue = '"' + attrValue + '"'; - } - parsedValue = $parse(attrValue); - } - - var constantAttrValue = attrValue.replace(/(\'|\"|px|%)/g, '').trim(); - var isConstant = constantAttrValue.length && !/([a-zA-Z]|\$|:|\?)/.test(constantAttrValue); - dimensionData.attrValue = attrValue; - - // If it's a constant, it's either a percent or just a constant pixel number. - if (isConstant) { - // For percents, store the percent getter on .getValue() - if (attrValue.indexOf('%') > -1) { - var decimalValue = parseFloat(parsedValue()) / 100; - dimensionData.getValue = dimensionData === heightData ? - function() { return Math.floor(decimalValue * scrollView.__clientHeight); } : - function() { return Math.floor(decimalValue * scrollView.__clientWidth); }; - } else { - // For static constants, just store the static constant. - dimensionData.value = parseInt(parsedValue()); - } - - } else { - dimensionData.dynamic = true; - dimensionData.getValue = dimensionData === heightData ? - function heightGetter(scope, locals) { - var result = parsedValue(scope, locals); - if (result.charAt && result.charAt(result.length - 1) === '%') { - return Math.floor(parseFloat(result) / 100 * scrollView.__clientHeight); - } - return parseInt(result); - } : - function widthGetter(scope, locals) { - var result = parsedValue(scope, locals); - if (result.charAt && result.charAt(result.length - 1) === '%') { - return Math.floor(parseFloat(result) / 100 * scrollView.__clientWidth); - } - return parseInt(result); - }; - } - } - - var computedStyleNode; - var computedStyleScope; - function computeStyleDimensions() { - if (!computedStyleNode) { - transclude(computedStyleScope = scope.$new(), function(clone) { - clone[0].removeAttribute('collection-repeat'); // remove absolute position styling - computedStyleNode = clone[0]; - }); - } - - computedStyleScope[keyExpr] = (listGetter(scope) || [])[0]; - if (!$rootScope.$$phase) computedStyleScope.$digest(); - containerNode.appendChild(computedStyleNode); - - var style = $window.getComputedStyle(computedStyleNode); - computedStyleDimensions.width = parseInt(style.width); - computedStyleDimensions.height = parseInt(style.height); - - containerNode.removeChild(computedStyleNode); - } - - } - -} - -RepeatManagerFactory.$inject = ['$rootScope', '$window', '$$rAF']; -function RepeatManagerFactory($rootScope, $window, $$rAF) { - var EMPTY_DIMENSION = { primaryPos: 0, secondaryPos: 0, primarySize: 0, secondarySize: 0, rowPrimarySize: 0 }; - - return function RepeatController(options) { - var afterItemsNode = options.afterItemsNode; - var containerNode = options.containerNode; - var forceRefreshImages = options.forceRefreshImages; - var heightData = options.heightData; - var widthData = options.widthData; - var keyExpression = options.keyExpression; - var renderBuffer = options.renderBuffer; - var scope = options.scope; - var scrollView = options.scrollView; - var transclude = options.transclude; - - var data = []; - - var getterLocals = {}; - var heightFn = heightData.getValue || function() { return heightData.value; }; - var heightGetter = function(index, value) { - getterLocals[keyExpression] = value; - getterLocals.$index = index; - return heightFn(scope, getterLocals); - }; - - var widthFn = widthData.getValue || function() { return widthData.value; }; - var widthGetter = function(index, value) { - getterLocals[keyExpression] = value; - getterLocals.$index = index; - return widthFn(scope, getterLocals); - }; - - var isVertical = !!scrollView.options.scrollingY; - - // We say it's a grid view if we're either dynamic or not 100% width - var isGridView = isVertical ? - (widthData.dynamic || widthData.value !== scrollView.__clientWidth) : - (heightData.dynamic || heightData.value !== scrollView.__clientHeight); - - var isStaticView = !heightData.dynamic && !widthData.dynamic; - - var PRIMARY = 'PRIMARY'; - var SECONDARY = 'SECONDARY'; - var TRANSLATE_TEMPLATE_STR = isVertical ? - 'translate3d(SECONDARYpx,PRIMARYpx,0)' : - 'translate3d(PRIMARYpx,SECONDARYpx,0)'; - var WIDTH_HEIGHT_TEMPLATE_STR = isVertical ? - 'height: PRIMARYpx; width: SECONDARYpx;' : - 'height: SECONDARYpx; width: PRIMARYpx;'; - - var estimatedHeight; - var estimatedWidth; - - var repeaterBeforeSize = 0; - var repeaterAfterSize = 0; - - var renderStartIndex = -1; - var renderEndIndex = -1; - var renderAfterBoundary = -1; - var renderBeforeBoundary = -1; - - var itemsPool = []; - var itemsLeaving = []; - var itemsEntering = []; - var itemsShownMap = {}; - var nextItemId = 0; - - var scrollViewSetDimensions = isVertical ? - function() { scrollView.setDimensions(null, null, null, view.getContentSize(), true); } : - function() { scrollView.setDimensions(null, null, view.getContentSize(), null, true); }; - - // view is a mix of list/grid methods + static/dynamic methods. - // See bottom for implementations. Available methods: - // - // getEstimatedPrimaryPos(i), getEstimatedSecondaryPos(i), getEstimatedIndex(scrollTop), - // calculateDimensions(toIndex), getDimensions(index), - // updateRenderRange(scrollTop, scrollValueEnd), onRefreshLayout(), onRefreshData() - var view = isVertical ? new VerticalViewType() : new HorizontalViewType(); - (isGridView ? GridViewType : ListViewType).call(view); - (isStaticView ? StaticViewType : DynamicViewType).call(view); - - var contentSizeStr = isVertical ? 'getContentHeight' : 'getContentWidth'; - var originalGetContentSize = scrollView.options[contentSizeStr]; - scrollView.options[contentSizeStr] = angular.bind(view, view.getContentSize); - - scrollView.__$callback = scrollView.__callback; - scrollView.__callback = function(transformLeft, transformTop, zoom, wasResize) { - var scrollValue = view.getScrollValue(); - if (renderStartIndex === -1 || - scrollValue + view.scrollPrimarySize > renderAfterBoundary || - scrollValue < renderBeforeBoundary) { - render(); - } - scrollView.__$callback(transformLeft, transformTop, zoom, wasResize); - }; - - var isLayoutReady = false; - var isDataReady = false; - this.refreshLayout = function() { - if (data.length) { - estimatedHeight = heightGetter(0, data[0]); - estimatedWidth = widthGetter(0, data[0]); - } else { - // If we don't have any data in our array, just guess. - estimatedHeight = 100; - estimatedWidth = 100; - } - - // Get the size of every element AFTER the repeater. We have to get the margin before and - // after the first/last element to fix a browser bug with getComputedStyle() not counting - // the first/last child's margins into height. - var style = getComputedStyle(afterItemsNode) || {}; - var firstStyle = afterItemsNode.firstElementChild && getComputedStyle(afterItemsNode.firstElementChild) || {}; - var lastStyle = afterItemsNode.lastElementChild && getComputedStyle(afterItemsNode.lastElementChild) || {}; - repeaterAfterSize = (parseInt(style[isVertical ? 'height' : 'width']) || 0) + - (firstStyle && parseInt(firstStyle[isVertical ? 'marginTop' : 'marginLeft']) || 0) + - (lastStyle && parseInt(lastStyle[isVertical ? 'marginBottom' : 'marginRight']) || 0); - - // Get the offsetTop of the repeater. - repeaterBeforeSize = 0; - var current = containerNode; - do { - repeaterBeforeSize += current[isVertical ? 'offsetTop' : 'offsetLeft']; - } while ( ionic.DomUtil.contains(scrollView.__content, current = current.offsetParent) ); - - var containerPrevNode = containerNode.previousElementSibling; - var beforeStyle = containerPrevNode ? $window.getComputedStyle(containerPrevNode) : {}; - var beforeMargin = parseInt(beforeStyle[isVertical ? 'marginBottom' : 'marginRight'] || 0); - - // Because we position the collection container with position: relative, it doesn't take - // into account where to position itself relative to the previous element's marginBottom. - // To compensate, we translate the container up by the previous element's margin. - containerNode.style[ionic.CSS.TRANSFORM] = TRANSLATE_TEMPLATE_STR - .replace(PRIMARY, -beforeMargin) - .replace(SECONDARY, 0); - repeaterBeforeSize -= beforeMargin; - - if (!scrollView.__clientHeight || !scrollView.__clientWidth) { - scrollView.__clientWidth = scrollView.__container.clientWidth; - scrollView.__clientHeight = scrollView.__container.clientHeight; - } - - (view.onRefreshLayout || angular.noop)(); - view.refreshDirection(); - scrollViewSetDimensions(); - - // Create the pool of items for reuse, setting the size to (estimatedItemsOnScreen) * 2, - // plus the size of the renderBuffer. - if (!isLayoutReady) { - var poolSize = Math.max(20, renderBuffer * 3); - for (var i = 0; i < poolSize; i++) { - itemsPool.push(new RepeatItem()); - } - } - - isLayoutReady = true; - if (isLayoutReady && isDataReady) { - // If the resize or latest data change caused the scrollValue to - // now be out of bounds, resize the scrollView. - if (scrollView.__scrollLeft > scrollView.__maxScrollLeft || - scrollView.__scrollTop > scrollView.__maxScrollTop) { - scrollView.resize(); - } - forceRerender(true); - } - }; - - this.setData = function(newData) { - data = newData; - (view.onRefreshData || angular.noop)(); - isDataReady = true; - }; - - this.destroy = function() { - render.destroyed = true; - - itemsPool.forEach(function(item) { - item.scope.$destroy(); - item.scope = item.element = item.node = item.images = null; - }); - itemsPool.length = itemsEntering.length = itemsLeaving.length = 0; - itemsShownMap = {}; - - //Restore the scrollView's normal behavior and resize it to normal size. - scrollView.options[contentSizeStr] = originalGetContentSize; - scrollView.__callback = scrollView.__$callback; - scrollView.resize(); - - (view.onDestroy || angular.noop)(); - }; - - function forceRerender() { - return render(true); - } - function render(forceRerender) { - if (render.destroyed) return; - var i; - var ii; - var item; - var dim; - var scope; - var scrollValue = view.getScrollValue(); - var scrollValueEnd = scrollValue + view.scrollPrimarySize; - - view.updateRenderRange(scrollValue, scrollValueEnd); - - renderStartIndex = Math.max(0, renderStartIndex - renderBuffer); - renderEndIndex = Math.min(data.length - 1, renderEndIndex + renderBuffer); - - for (i in itemsShownMap) { - if (i < renderStartIndex || i > renderEndIndex) { - item = itemsShownMap[i]; - delete itemsShownMap[i]; - itemsLeaving.push(item); - item.isShown = false; - } - } - - // Render indicies that aren't shown yet - // - // NOTE(ajoslin): this may sound crazy, but calling any other functions during this render - // loop will often push the render time over the edge from less than one frame to over - // one frame, causing visible jank. - // DON'T call any other functions inside this loop unless it's vital. - for (i = renderStartIndex; i <= renderEndIndex; i++) { - // We only go forward with render if the index is in data, the item isn't already shown, - // or forceRerender is on. - if (i >= data.length || (itemsShownMap[i] && !forceRerender)) continue; - - item = itemsShownMap[i] || (itemsShownMap[i] = itemsLeaving.length ? itemsLeaving.pop() : - itemsPool.length ? itemsPool.shift() : - new RepeatItem()); - itemsEntering.push(item); - item.isShown = true; - - scope = item.scope; - scope.$index = i; - scope[keyExpression] = data[i]; - scope.$first = (i === 0); - scope.$last = (i === (data.length - 1)); - scope.$middle = !(scope.$first || scope.$last); - scope.$odd = !(scope.$even = (i & 1) === 0); - - if (scope.$$disconnected) ionic.Utils.reconnectScope(item.scope); - - dim = view.getDimensions(i); - if (item.secondaryPos !== dim.secondaryPos || item.primaryPos !== dim.primaryPos) { - item.node.style[ionic.CSS.TRANSFORM] = TRANSLATE_TEMPLATE_STR - .replace(PRIMARY, (item.primaryPos = dim.primaryPos)) - .replace(SECONDARY, (item.secondaryPos = dim.secondaryPos)); - } - if (item.secondarySize !== dim.secondarySize || item.primarySize !== dim.primarySize) { - item.node.style.cssText = item.node.style.cssText - .replace(WIDTH_HEIGHT_REGEX, WIDTH_HEIGHT_TEMPLATE_STR - //TODO fix item.primarySize + 1 hack - .replace(PRIMARY, (item.primarySize = dim.primarySize) + 1) - .replace(SECONDARY, (item.secondarySize = dim.secondarySize)) - ); - } - - } - - // If we reach the end of the list, render the afterItemsNode - this contains all the - // elements the developer placed after the collection-repeat - if (renderEndIndex === data.length - 1) { - dim = view.getDimensions(data.length - 1) || EMPTY_DIMENSION; - afterItemsNode.style[ionic.CSS.TRANSFORM] = TRANSLATE_TEMPLATE_STR - .replace(PRIMARY, dim.primaryPos + dim.primarySize) - .replace(SECONDARY, 0); - } - - while (itemsLeaving.length) { - item = itemsLeaving.pop(); - item.scope.$broadcast('$collectionRepeatLeave'); - ionic.Utils.disconnectScope(item.scope); - itemsPool.push(item); - item.node.style[ionic.CSS.TRANSFORM] = 'translate3d(-9999px,-9999px,0)'; - item.primaryPos = item.secondaryPos = null; - } - - if (forceRefreshImages) { - for (i = 0, ii = itemsEntering.length; i < ii && (item = itemsEntering[i]); i++) { - if (!item.images) continue; - for (var j = 0, jj = item.images.length, img; j < jj && (img = item.images[j]); j++) { - var src = img.src; - img.src = ONE_PX_TRANSPARENT_IMG_SRC; - img.src = src; - } - } - } - if (forceRerender) { - var rootScopePhase = $rootScope.$$phase; - while (itemsEntering.length) { - item = itemsEntering.pop(); - if (!rootScopePhase) item.scope.$digest(); - } - } else { - digestEnteringItems(); - } - } - - function digestEnteringItems() { - var item; - if (digestEnteringItems.running) return; - digestEnteringItems.running = true; - - $$rAF(function process() { - var rootScopePhase = $rootScope.$$phase; - while (itemsEntering.length) { - item = itemsEntering.pop(); - if (item.isShown) { - if (!rootScopePhase) item.scope.$digest(); - } - } - digestEnteringItems.running = false; - }); - } - - function RepeatItem() { - var self = this; - this.scope = scope.$new(); - this.id = 'item' + (nextItemId++); - transclude(this.scope, function(clone) { - self.element = clone; - self.element.data('$$collectionRepeatItem', self); - // TODO destroy - self.node = clone[0]; - // Batch style setting to lower repaints - self.node.style[ionic.CSS.TRANSFORM] = 'translate3d(-9999px,-9999px,0)'; - self.node.style.cssText += ' height: 0px; width: 0px;'; - ionic.Utils.disconnectScope(self.scope); - containerNode.appendChild(self.node); - self.images = clone[0].getElementsByTagName('img'); - }); - } - - function VerticalViewType() { - this.getItemPrimarySize = heightGetter; - this.getItemSecondarySize = widthGetter; - - this.getScrollValue = function() { - return Math.max(0, Math.min(scrollView.__scrollTop - repeaterBeforeSize, - scrollView.__maxScrollTop - repeaterBeforeSize - repeaterAfterSize)); - }; - - this.refreshDirection = function() { - this.scrollPrimarySize = scrollView.__clientHeight; - this.scrollSecondarySize = scrollView.__clientWidth; - - this.estimatedPrimarySize = estimatedHeight; - this.estimatedSecondarySize = estimatedWidth; - this.estimatedItemsAcross = isGridView && - Math.floor(scrollView.__clientWidth / estimatedWidth) || - 1; - }; - } - function HorizontalViewType() { - this.getItemPrimarySize = widthGetter; - this.getItemSecondarySize = heightGetter; - - this.getScrollValue = function() { - return Math.max(0, Math.min(scrollView.__scrollLeft - repeaterBeforeSize, - scrollView.__maxScrollLeft - repeaterBeforeSize - repeaterAfterSize)); - }; - - this.refreshDirection = function() { - this.scrollPrimarySize = scrollView.__clientWidth; - this.scrollSecondarySize = scrollView.__clientHeight; - - this.estimatedPrimarySize = estimatedWidth; - this.estimatedSecondarySize = estimatedHeight; - this.estimatedItemsAcross = isGridView && - Math.floor(scrollView.__clientHeight / estimatedHeight) || - 1; - }; - } - - function GridViewType() { - this.getEstimatedSecondaryPos = function(index) { - return (index % this.estimatedItemsAcross) * this.estimatedSecondarySize; - }; - this.getEstimatedPrimaryPos = function(index) { - return Math.floor(index / this.estimatedItemsAcross) * this.estimatedPrimarySize; - }; - this.getEstimatedIndex = function(scrollValue) { - return Math.floor(scrollValue / this.estimatedPrimarySize) * - this.estimatedItemsAcross; - }; - } - - function ListViewType() { - this.getEstimatedSecondaryPos = function() { - return 0; - }; - this.getEstimatedPrimaryPos = function(index) { - return index * this.estimatedPrimarySize; - }; - this.getEstimatedIndex = function(scrollValue) { - return Math.floor((scrollValue) / this.estimatedPrimarySize); - }; - } - - function StaticViewType() { - this.getContentSize = function() { - return this.getEstimatedPrimaryPos(data.length - 1) + this.estimatedPrimarySize + - repeaterBeforeSize + repeaterAfterSize; - }; - // static view always returns the same object for getDimensions, to avoid memory allocation - // while scrolling. This could be dangerous if this was a public function, but it's not. - // Only we use it. - var dim = {}; - this.getDimensions = function(index) { - dim.primaryPos = this.getEstimatedPrimaryPos(index); - dim.secondaryPos = this.getEstimatedSecondaryPos(index); - dim.primarySize = this.estimatedPrimarySize; - dim.secondarySize = this.estimatedSecondarySize; - return dim; - }; - this.updateRenderRange = function(scrollValue, scrollValueEnd) { - renderStartIndex = Math.max(0, this.getEstimatedIndex(scrollValue)); - - // Make sure the renderEndIndex takes into account all the items on the row - renderEndIndex = Math.min(data.length - 1, - this.getEstimatedIndex(scrollValueEnd) + this.estimatedItemsAcross - 1); - - renderBeforeBoundary = Math.max(0, - this.getEstimatedPrimaryPos(renderStartIndex)); - renderAfterBoundary = this.getEstimatedPrimaryPos(renderEndIndex) + - this.estimatedPrimarySize; - }; - } - - function DynamicViewType() { - var self = this; - var debouncedScrollViewSetDimensions = ionic.debounce(scrollViewSetDimensions, 25, true); - var calculateDimensions = isGridView ? calculateDimensionsGrid : calculateDimensionsList; - var dimensionsIndex; - var dimensions = []; - - - // Get the dimensions at index. {width, height, left, top}. - // We start with no dimensions calculated, then any time dimensions are asked for at an - // index we calculate dimensions up to there. - function calculateDimensionsList(toIndex) { - var i, prevDimension, dim; - for (i = Math.max(0, dimensionsIndex); i <= toIndex && (dim = dimensions[i]); i++) { - prevDimension = dimensions[i - 1] || EMPTY_DIMENSION; - dim.primarySize = self.getItemPrimarySize(i, data[i]); - dim.secondarySize = self.scrollSecondarySize; - dim.primaryPos = prevDimension.primaryPos + prevDimension.primarySize; - dim.secondaryPos = 0; - } - } - function calculateDimensionsGrid(toIndex) { - var i, prevDimension, dim; - for (i = Math.max(dimensionsIndex, 0); i <= toIndex && (dim = dimensions[i]); i++) { - prevDimension = dimensions[i - 1] || EMPTY_DIMENSION; - dim.secondarySize = Math.min( - self.getItemSecondarySize(i, data[i]), - self.scrollSecondarySize - ); - dim.secondaryPos = prevDimension.secondaryPos + prevDimension.secondarySize; - - if (i === 0 || dim.secondaryPos + dim.secondarySize > self.scrollSecondarySize) { - dim.secondaryPos = 0; - dim.primarySize = self.getItemPrimarySize(i, data[i]); - dim.primaryPos = prevDimension.primaryPos + prevDimension.rowPrimarySize; - - dim.rowStartIndex = i; - dim.rowPrimarySize = dim.primarySize; - } else { - dim.primarySize = self.getItemPrimarySize(i, data[i]); - dim.primaryPos = prevDimension.primaryPos; - dim.rowStartIndex = prevDimension.rowStartIndex; - - dimensions[dim.rowStartIndex].rowPrimarySize = dim.rowPrimarySize = Math.max( - dimensions[dim.rowStartIndex].rowPrimarySize, - dim.primarySize - ); - dim.rowPrimarySize = Math.max(dim.primarySize, dim.rowPrimarySize); - } - } - } - - this.getContentSize = function() { - var dim = dimensions[dimensionsIndex] || EMPTY_DIMENSION; - return ((dim.primaryPos + dim.primarySize) || 0) + - this.getEstimatedPrimaryPos(data.length - dimensionsIndex - 1) + - repeaterBeforeSize + repeaterAfterSize; - }; - this.onDestroy = function() { - dimensions.length = 0; - }; - - this.onRefreshData = function() { - var i; - var ii; - // Make sure dimensions has as many items as data.length. - // This is to be sure we don't have to allocate objects while scrolling. - for (i = dimensions.length, ii = data.length; i < ii; i++) { - dimensions.push({}); - } - dimensionsIndex = -1; - }; - this.onRefreshLayout = function() { - dimensionsIndex = -1; - }; - this.getDimensions = function(index) { - index = Math.min(index, data.length - 1); - - if (dimensionsIndex < index) { - // Once we start asking for dimensions near the end of the list, go ahead and calculate - // everything. This is to make sure when the user gets to the end of the list, the - // scroll height of the list is 100% accurate (not estimated anymore). - if (index > data.length * 0.9) { - calculateDimensions(data.length - 1); - dimensionsIndex = data.length - 1; - scrollViewSetDimensions(); - } else { - calculateDimensions(index); - dimensionsIndex = index; - debouncedScrollViewSetDimensions(); - } - - } - return dimensions[index]; - }; - - var oldRenderStartIndex = -1; - var oldScrollValue = -1; - this.updateRenderRange = function(scrollValue, scrollValueEnd) { - var i; - var len; - var dim; - - // Calculate more dimensions than we estimate we'll need, to be sure. - this.getDimensions( this.getEstimatedIndex(scrollValueEnd) * 2 ); - - // -- Calculate renderStartIndex - // base case: start at 0 - if (oldRenderStartIndex === -1 || scrollValue === 0) { - i = 0; - // scrolling down - } else if (scrollValue >= oldScrollValue) { - for (i = oldRenderStartIndex, len = data.length; i < len; i++) { - if ((dim = this.getDimensions(i)) && dim.primaryPos + dim.rowPrimarySize >= scrollValue) { - break; - } - } - // scrolling up - } else { - for (i = oldRenderStartIndex; i >= 0; i--) { - if ((dim = this.getDimensions(i)) && dim.primaryPos <= scrollValue) { - // when grid view, make sure the render starts at the beginning of a row. - i = isGridView ? dim.rowStartIndex : i; - break; - } - } - } - - renderStartIndex = Math.min(Math.max(0, i), data.length - 1); - renderBeforeBoundary = renderStartIndex !== -1 ? this.getDimensions(renderStartIndex).primaryPos : -1; - - // -- Calculate renderEndIndex - var lastRowDim; - for (i = renderStartIndex + 1, len = data.length; i < len; i++) { - if ((dim = this.getDimensions(i)) && dim.primaryPos + dim.rowPrimarySize > scrollValueEnd) { - - // Go all the way to the end of the row if we're in a grid - if (isGridView) { - lastRowDim = dim; - while (i < len - 1 && - (dim = this.getDimensions(i + 1)).primaryPos === lastRowDim.primaryPos) { - i++; - } - } - break; - } - } - - renderEndIndex = Math.min(i, data.length - 1); - renderAfterBoundary = renderEndIndex !== -1 ? - ((dim = this.getDimensions(renderEndIndex)).primaryPos + (dim.rowPrimarySize || dim.primarySize)) : - -1; - - oldScrollValue = scrollValue; - oldRenderStartIndex = renderStartIndex; - }; - } - - - }; - -} - -/** - * @ngdoc directive - * @name ionContent - * @module ionic - * @delegate ionic.service:$ionicScrollDelegate - * @restrict E - * - * @description - * The ionContent directive provides an easy to use content area that can be configured - * to use Ionic's custom Scroll View, or the built in overflow scrolling of the browser. - * - * While we recommend using the custom Scroll features in Ionic in most cases, sometimes - * (for performance reasons) only the browser's native overflow scrolling will suffice, - * and so we've made it easy to toggle between the Ionic scroll implementation and - * overflow scrolling. - * - * You can implement pull-to-refresh with the {@link ionic.directive:ionRefresher} - * directive, and infinite scrolling with the {@link ionic.directive:ionInfiniteScroll} - * directive. - * - * If there is any dynamic content inside the ion-content, be sure to call `.resize()` with {@link ionic.service:$ionicScrollDelegate} - * after the content has been added. - * - * Be aware that this directive gets its own child scope. If you do not understand why this - * is important, you can read [https://docs.angularjs.org/guide/scope](https://docs.angularjs.org/guide/scope). - * - * @param {string=} delegate-handle The handle used to identify this scrollView - * with {@link ionic.service:$ionicScrollDelegate}. - * @param {string=} direction Which way to scroll. 'x' or 'y' or 'xy'. Default 'y'. - * @param {boolean=} locking Whether to lock scrolling in one direction at a time. Useful to set to false when zoomed in or scrolling in two directions. Default true. - * @param {boolean=} padding Whether to add padding to the content. - * Defaults to true on iOS, false on Android. - * @param {boolean=} scroll Whether to allow scrolling of content. Defaults to true. - * @param {boolean=} overflow-scroll Whether to use overflow-scrolling instead of - * Ionic scroll. See {@link ionic.provider:$ionicConfigProvider} to set this as the global default. - * @param {boolean=} scrollbar-x Whether to show the horizontal scrollbar. Default true. - * @param {boolean=} scrollbar-y Whether to show the vertical scrollbar. Default true. - * @param {string=} start-x Initial horizontal scroll position. Default 0. - * @param {string=} start-y Initial vertical scroll position. Default 0. - * @param {expression=} on-scroll Expression to evaluate when the content is scrolled. - * @param {expression=} on-scroll-complete Expression to evaluate when a scroll action completes. Has access to 'scrollLeft' and 'scrollTop' locals. - * @param {boolean=} has-bouncing Whether to allow scrolling to bounce past the edges - * of the content. Defaults to true on iOS, false on Android. - * @param {number=} scroll-event-interval Number of milliseconds between each firing of the 'on-scroll' expression. Default 10. - */ -IonicModule -.directive('ionContent', [ - '$timeout', - '$controller', - '$ionicBind', - '$ionicConfig', -function($timeout, $controller, $ionicBind, $ionicConfig) { - return { - restrict: 'E', - require: '^?ionNavView', - scope: true, - priority: 800, - compile: function(element, attr) { - var innerElement; - var scrollCtrl; - - element.addClass('scroll-content ionic-scroll'); - - if (attr.scroll != 'false') { - //We cannot use normal transclude here because it breaks element.data() - //inheritance on compile - innerElement = jqLite('
'); - innerElement.append(element.contents()); - element.append(innerElement); - } else { - element.addClass('scroll-content-false'); - } - - var nativeScrolling = attr.overflowScroll !== "false" && (attr.overflowScroll === "true" || !$ionicConfig.scrolling.jsScrolling()); - - // collection-repeat requires JS scrolling - if (nativeScrolling) { - nativeScrolling = !element[0].querySelector('[collection-repeat]'); - } - return { pre: prelink }; - function prelink($scope, $element, $attr) { - var parentScope = $scope.$parent; - $scope.$watch(function() { - return (parentScope.$hasHeader ? ' has-header' : '') + - (parentScope.$hasSubheader ? ' has-subheader' : '') + - (parentScope.$hasFooter ? ' has-footer' : '') + - (parentScope.$hasSubfooter ? ' has-subfooter' : '') + - (parentScope.$hasTabs ? ' has-tabs' : '') + - (parentScope.$hasTabsTop ? ' has-tabs-top' : ''); - }, function(className, oldClassName) { - $element.removeClass(oldClassName); - $element.addClass(className); - }); - - //Only this ionContent should use these variables from parent scopes - $scope.$hasHeader = $scope.$hasSubheader = - $scope.$hasFooter = $scope.$hasSubfooter = - $scope.$hasTabs = $scope.$hasTabsTop = - false; - $ionicBind($scope, $attr, { - $onScroll: '&onScroll', - $onScrollComplete: '&onScrollComplete', - hasBouncing: '@', - padding: '@', - direction: '@', - scrollbarX: '@', - scrollbarY: '@', - startX: '@', - startY: '@', - scrollEventInterval: '@' - }); - $scope.direction = $scope.direction || 'y'; - - if (isDefined($attr.padding)) { - $scope.$watch($attr.padding, function(newVal) { - (innerElement || $element).toggleClass('padding', !!newVal); - }); - } - - if ($attr.scroll === "false") { - //do nothing - } else { - var scrollViewOptions = {}; - - // determined in compile phase above - if (nativeScrolling) { - // use native scrolling - $element.addClass('overflow-scroll'); - - scrollViewOptions = { - el: $element[0], - delegateHandle: attr.delegateHandle, - startX: $scope.$eval($scope.startX) || 0, - startY: $scope.$eval($scope.startY) || 0, - nativeScrolling: true - }; - - } else { - // Use JS scrolling - scrollViewOptions = { - el: $element[0], - delegateHandle: attr.delegateHandle, - locking: (attr.locking || 'true') === 'true', - bouncing: $scope.$eval($scope.hasBouncing), - startX: $scope.$eval($scope.startX) || 0, - startY: $scope.$eval($scope.startY) || 0, - scrollbarX: $scope.$eval($scope.scrollbarX) !== false, - scrollbarY: $scope.$eval($scope.scrollbarY) !== false, - scrollingX: $scope.direction.indexOf('x') >= 0, - scrollingY: $scope.direction.indexOf('y') >= 0, - scrollEventInterval: parseInt($scope.scrollEventInterval, 10) || 10, - scrollingComplete: onScrollComplete - }; - } - - // init scroll controller with appropriate options - scrollCtrl = $controller('$ionicScroll', { - $scope: $scope, - scrollViewOptions: scrollViewOptions - }); - - $scope.scrollCtrl = scrollCtrl; - - $scope.$on('$destroy', function() { - if (scrollViewOptions) { - scrollViewOptions.scrollingComplete = noop; - delete scrollViewOptions.el; - } - innerElement = null; - $element = null; - attr.$$element = null; - }); - } - - function onScrollComplete() { - $scope.$onScrollComplete({ - scrollTop: scrollCtrl.scrollView.__scrollTop, - scrollLeft: scrollCtrl.scrollView.__scrollLeft - }); - } - - } - } - }; -}]); - -/** - * @ngdoc directive - * @name exposeAsideWhen - * @module ionic - * @restrict A - * @parent ionic.directive:ionSideMenus - * - * @description - * It is common for a tablet application to hide a menu when in portrait mode, but to show the - * same menu on the left side when the tablet is in landscape mode. The `exposeAsideWhen` attribute - * directive can be used to accomplish a similar interface. - * - * By default, side menus are hidden underneath its side menu content, and can be opened by either - * swiping the content left or right, or toggling a button to show the side menu. However, by adding the - * `exposeAsideWhen` attribute directive to an {@link ionic.directive:ionSideMenu} element directive, - * a side menu can be given instructions on "when" the menu should be exposed (always viewable). For - * example, the `expose-aside-when="large"` attribute will keep the side menu hidden when the viewport's - * width is less than `768px`, but when the viewport's width is `768px` or greater, the menu will then - * always be shown and can no longer be opened or closed like it could when it was hidden for smaller - * viewports. - * - * Using `large` as the attribute's value is a shortcut value to `(min-width:768px)` since it is - * the most common use-case. However, for added flexibility, any valid media query could be added - * as the value, such as `(min-width:600px)` or even multiple queries such as - * `(min-width:750px) and (max-width:1200px)`. - * @usage - * ```html - * - * - * - * - * - * - * - * - * - * ``` - * For a complete side menu example, see the - * {@link ionic.directive:ionSideMenus} documentation. - */ - -IonicModule.directive('exposeAsideWhen', ['$window', function($window) { - return { - restrict: 'A', - require: '^ionSideMenus', - link: function($scope, $element, $attr, sideMenuCtrl) { - - var prevInnerWidth = $window.innerWidth; - var prevInnerHeight = $window.innerHeight; - - ionic.on('resize', function() { - if (prevInnerWidth === $window.innerWidth && prevInnerHeight === $window.innerHeight) { - return; - } - prevInnerWidth = $window.innerWidth; - prevInnerHeight = $window.innerHeight; - onResize(); - }, $window); - - function checkAsideExpose() { - var mq = $attr.exposeAsideWhen == 'large' ? '(min-width:768px)' : $attr.exposeAsideWhen; - sideMenuCtrl.exposeAside($window.matchMedia(mq).matches); - sideMenuCtrl.activeAsideResizing(false); - } - - function onResize() { - sideMenuCtrl.activeAsideResizing(true); - debouncedCheck(); - } - - var debouncedCheck = ionic.debounce(function() { - $scope.$apply(checkAsideExpose); - }, 300, false); - - $scope.$evalAsync(checkAsideExpose); - } - }; -}]); - -var GESTURE_DIRECTIVES = 'onHold onTap onDoubleTap onTouch onRelease onDragStart onDrag onDragEnd onDragUp onDragRight onDragDown onDragLeft onSwipe onSwipeUp onSwipeRight onSwipeDown onSwipeLeft'.split(' '); - -GESTURE_DIRECTIVES.forEach(function(name) { - IonicModule.directive(name, gestureDirective(name)); -}); - - -/** - * @ngdoc directive - * @name onHold - * @module ionic - * @restrict A - * - * @description - * Touch stays at the same location for 500ms. Similar to long touch events available for AngularJS and jQuery. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onTap - * @module ionic - * @restrict A - * - * @description - * Quick touch at a location. If the duration of the touch goes - * longer than 250ms it is no longer a tap gesture. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onDoubleTap - * @module ionic - * @restrict A - * - * @description - * Double tap touch at a location. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onTouch - * @module ionic - * @restrict A - * - * @description - * Called immediately when the user first begins a touch. This - * gesture does not wait for a touchend/mouseup. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onRelease - * @module ionic - * @restrict A - * - * @description - * Called when the user ends a touch. - * - * @usage - * ```html - * - * ``` - */ - -/** - * @ngdoc directive - * @name onDragStart - * @module ionic - * @restrict A - * - * @description - * Called when a drag gesture has started. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onDrag - * @module ionic - * @restrict A - * - * @description - * Move with one touch around on the page. Blocking the scrolling when - * moving left and right is a good practice. When all the drag events are - * blocking you disable scrolling on that area. - * - * @usage - * ```html - * - * ``` - */ - -/** - * @ngdoc directive - * @name onDragEnd - * @module ionic - * @restrict A - * - * @description - * Called when a drag gesture has ended. - * - * @usage - * ```html - * - * ``` - */ - -/** - * @ngdoc directive - * @name onDragUp - * @module ionic - * @restrict A - * - * @description - * Called when the element is dragged up. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onDragRight - * @module ionic - * @restrict A - * - * @description - * Called when the element is dragged to the right. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onDragDown - * @module ionic - * @restrict A - * - * @description - * Called when the element is dragged down. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onDragLeft - * @module ionic - * @restrict A - * - * @description - * Called when the element is dragged to the left. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onSwipe - * @module ionic - * @restrict A - * - * @description - * Called when a moving touch has a high velocity in any direction. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onSwipeUp - * @module ionic - * @restrict A - * - * @description - * Called when a moving touch has a high velocity moving up. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onSwipeRight - * @module ionic - * @restrict A - * - * @description - * Called when a moving touch has a high velocity moving to the right. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onSwipeDown - * @module ionic - * @restrict A - * - * @description - * Called when a moving touch has a high velocity moving down. - * - * @usage - * ```html - * - * ``` - */ - - -/** - * @ngdoc directive - * @name onSwipeLeft - * @module ionic - * @restrict A - * - * @description - * Called when a moving touch has a high velocity moving to the left. - * - * @usage - * ```html - * - * ``` - */ - - -function gestureDirective(directiveName) { - return ['$ionicGesture', '$parse', function($ionicGesture, $parse) { - var eventType = directiveName.substr(2).toLowerCase(); - - return function(scope, element, attr) { - var fn = $parse( attr[directiveName] ); - - var listener = function(ev) { - scope.$apply(function() { - fn(scope, { - $event: ev - }); - }); - }; - - var gesture = $ionicGesture.on(eventType, listener, element); - - scope.$on('$destroy', function() { - $ionicGesture.off(gesture, eventType, listener); - }); - }; - }]; -} - - -IonicModule -//.directive('ionHeaderBar', tapScrollToTopDirective()) - -/** - * @ngdoc directive - * @name ionHeaderBar - * @module ionic - * @restrict E - * - * @description - * Adds a fixed header bar above some content. - * - * Can also be a subheader (lower down) if the 'bar-subheader' class is applied. - * See [the header CSS docs](/docs/components/#subheader). - * - * @param {string=} align-title How to align the title. By default the title - * will be aligned the same as how the platform aligns its titles (iOS centers - * titles, Android aligns them left). - * Available: 'left', 'right', or 'center'. Defaults to the same as the platform. - * @param {boolean=} no-tap-scroll By default, the header bar will scroll the - * content to the top when tapped. Set no-tap-scroll to true to disable this - * behavior. - * Available: true or false. Defaults to false. - * - * @usage - * ```html - * - *
- * - *
- *

Title!

- *
- * - *
- * - * - * Some content! - * - * ``` - */ -.directive('ionHeaderBar', headerFooterBarDirective(true)) - -/** - * @ngdoc directive - * @name ionFooterBar - * @module ionic - * @restrict E - * - * @description - * Adds a fixed footer bar below some content. - * - * Can also be a subfooter (higher up) if the 'bar-subfooter' class is applied. - * See [the footer CSS docs](/docs/components/#footer). - * - * Note: If you use ionFooterBar in combination with ng-if, the surrounding content - * will not align correctly. This will be fixed soon. - * - * @param {string=} align-title Where to align the title. - * Available: 'left', 'right', or 'center'. Defaults to 'center'. - * - * @usage - * ```html - * - * Some content! - * - * - *
- * - *
- *

Title!

- *
- * - *
- * - * ``` - */ -.directive('ionFooterBar', headerFooterBarDirective(false)); - -function tapScrollToTopDirective() { //eslint-disable-line no-unused-vars - return ['$ionicScrollDelegate', function($ionicScrollDelegate) { - return { - restrict: 'E', - link: function($scope, $element, $attr) { - if ($attr.noTapScroll == 'true') { - return; - } - ionic.on('tap', onTap, $element[0]); - $scope.$on('$destroy', function() { - ionic.off('tap', onTap, $element[0]); - }); - - function onTap(e) { - var depth = 3; - var current = e.target; - //Don't scroll to top in certain cases - while (depth-- && current) { - if (current.classList.contains('button') || - current.tagName.match(/input|textarea|select/i) || - current.isContentEditable) { - return; - } - current = current.parentNode; - } - var touch = e.gesture && e.gesture.touches[0] || e.detail.touches[0]; - var bounds = $element[0].getBoundingClientRect(); - if (ionic.DomUtil.rectContains( - touch.pageX, touch.pageY, - bounds.left, bounds.top - 20, - bounds.left + bounds.width, bounds.top + bounds.height - )) { - $ionicScrollDelegate.scrollTop(true); - } - } - } - }; - }]; -} - -function headerFooterBarDirective(isHeader) { - return ['$document', '$timeout', function($document, $timeout) { - return { - restrict: 'E', - controller: '$ionicHeaderBar', - compile: function(tElement) { - tElement.addClass(isHeader ? 'bar bar-header' : 'bar bar-footer'); - // top style tabs? if so, remove bottom border for seamless display - $timeout(function() { - if (isHeader && $document[0].getElementsByClassName('tabs-top').length) tElement.addClass('has-tabs-top'); - }); - - return { pre: prelink }; - function prelink($scope, $element, $attr, ctrl) { - if (isHeader) { - $scope.$watch(function() { return $element[0].className; }, function(value) { - var isShown = value.indexOf('ng-hide') === -1; - var isSubheader = value.indexOf('bar-subheader') !== -1; - $scope.$hasHeader = isShown && !isSubheader; - $scope.$hasSubheader = isShown && isSubheader; - $scope.$emit('$ionicSubheader', $scope.$hasSubheader); - }); - $scope.$on('$destroy', function() { - delete $scope.$hasHeader; - delete $scope.$hasSubheader; - }); - ctrl.align(); - $scope.$on('$ionicHeader.align', function() { - ionic.requestAnimationFrame(function() { - ctrl.align(); - }); - }); - - } else { - $scope.$watch(function() { return $element[0].className; }, function(value) { - var isShown = value.indexOf('ng-hide') === -1; - var isSubfooter = value.indexOf('bar-subfooter') !== -1; - $scope.$hasFooter = isShown && !isSubfooter; - $scope.$hasSubfooter = isShown && isSubfooter; - }); - $scope.$on('$destroy', function() { - delete $scope.$hasFooter; - delete $scope.$hasSubfooter; - }); - $scope.$watch('$hasTabs', function(val) { - $element.toggleClass('has-tabs', !!val); - }); - ctrl.align(); - $scope.$on('$ionicFooter.align', function() { - ionic.requestAnimationFrame(function() { - ctrl.align(); - }); - }); - } - } - } - }; - }]; -} - -/** - * @ngdoc directive - * @name ionInfiniteScroll - * @module ionic - * @parent ionic.directive:ionContent, ionic.directive:ionScroll - * @restrict E - * - * @description - * The ionInfiniteScroll directive allows you to call a function whenever - * the user gets to the bottom of the page or near the bottom of the page. - * - * The expression you pass in for `on-infinite` is called when the user scrolls - * greater than `distance` away from the bottom of the content. Once `on-infinite` - * is done loading new data, it should broadcast the `scroll.infiniteScrollComplete` - * event from your controller (see below example). - * - * @param {expression} on-infinite What to call when the scroller reaches the - * bottom. - * @param {string=} distance The distance from the bottom that the scroll must - * reach to trigger the on-infinite expression. Default: 1%. - * @param {string=} spinner The {@link ionic.directive:ionSpinner} to show while loading. The SVG - * {@link ionic.directive:ionSpinner} is now the default, replacing rotating font icons. - * @param {string=} icon The icon to show while loading. Default: 'ion-load-d'. This is depreciated - * in favor of the SVG {@link ionic.directive:ionSpinner}. - * @param {boolean=} immediate-check Whether to check the infinite scroll bounds immediately on load. - * - * @usage - * ```html - * - * - * .... - * .... - * - * - * - * - * - * ``` - * ```js - * function MyController($scope, $http) { - * $scope.items = []; - * $scope.loadMore = function() { - * $http.get('/more-items').success(function(items) { - * useItems(items); - * $scope.$broadcast('scroll.infiniteScrollComplete'); - * }); - * }; - * - * $scope.$on('$stateChangeSuccess', function() { - * $scope.loadMore(); - * }); - * } - * ``` - * - * An easy to way to stop infinite scroll once there is no more data to load - * is to use angular's `ng-if` directive: - * - * ```html - * - * - * ``` - */ -IonicModule -.directive('ionInfiniteScroll', ['$timeout', function($timeout) { - return { - restrict: 'E', - require: ['?^$ionicScroll', 'ionInfiniteScroll'], - template: function($element, $attrs) { - if ($attrs.icon) return ''; - return ''; - }, - scope: true, - controller: '$ionInfiniteScroll', - link: function($scope, $element, $attrs, ctrls) { - var infiniteScrollCtrl = ctrls[1]; - var scrollCtrl = infiniteScrollCtrl.scrollCtrl = ctrls[0]; - var jsScrolling = infiniteScrollCtrl.jsScrolling = !scrollCtrl.isNative(); - - // if this view is not beneath a scrollCtrl, it can't be injected, proceed w/ native scrolling - if (jsScrolling) { - infiniteScrollCtrl.scrollView = scrollCtrl.scrollView; - $scope.scrollingType = 'js-scrolling'; - //bind to JS scroll events - scrollCtrl.$element.on('scroll', infiniteScrollCtrl.checkBounds); - } else { - // grabbing the scrollable element, to determine dimensions, and current scroll pos - var scrollEl = ionic.DomUtil.getParentOrSelfWithClass($element[0].parentNode, 'overflow-scroll'); - infiniteScrollCtrl.scrollEl = scrollEl; - // if there's no scroll controller, and no overflow scroll div, infinite scroll wont work - if (!scrollEl) { - throw 'Infinite scroll must be used inside a scrollable div'; - } - //bind to native scroll events - infiniteScrollCtrl.scrollEl.addEventListener('scroll', infiniteScrollCtrl.checkBounds); - } - - // Optionally check bounds on start after scrollView is fully rendered - var doImmediateCheck = isDefined($attrs.immediateCheck) ? $scope.$eval($attrs.immediateCheck) : true; - if (doImmediateCheck) { - $timeout(function() { infiniteScrollCtrl.checkBounds(); }); - } - } - }; -}]); - -/** -* @ngdoc directive -* @name ionInput -* @parent ionic.directive:ionList -* @module ionic -* @restrict E -* Creates a text input group that can easily be focused -* -* @usage -* -* ```html -* -* -* -* -* -* -* Username -* -* -* -* ``` -*/ - -var labelIds = -1; - -IonicModule -.directive('ionInput', [function() { - return { - restrict: 'E', - controller: ['$scope', '$element', function($scope, $element) { - this.$scope = $scope; - this.$element = $element; - - this.setInputAriaLabeledBy = function(id) { - var inputs = $element[0].querySelectorAll('input,textarea'); - inputs.length && inputs[0].setAttribute('aria-labelledby', id); - }; - - this.focus = function() { - var inputs = $element[0].querySelectorAll('input,textarea'); - inputs.length && inputs[0].focus(); - }; - }] - }; -}]); - -/** -* @ngdoc directive -* @name ionLabel -* @parent ionic.directive:ionList -* @module ionic -* @restrict E -* -* New in Ionic 1.2. It is strongly recommended that you use `` in place -* of any `