diff --git a/docs/index.html b/docs/index.html index 07f00f2..87a62f0 100644 --- a/docs/index.html +++ b/docs/index.html @@ -29,7 +29,7 @@ - +
diff --git a/docs/src/components/ApiTable.vue b/docs/src/components/ApiTable.vue new file mode 100644 index 0000000..4d37d98 --- /dev/null +++ b/docs/src/components/ApiTable.vue @@ -0,0 +1,37 @@ + + + + + diff --git a/docs/src/components/DocsComponent.vue b/docs/src/components/DocsComponent.vue new file mode 100644 index 0000000..42b5138 --- /dev/null +++ b/docs/src/components/DocsComponent.vue @@ -0,0 +1,62 @@ + + + diff --git a/docs/src/components/ExampleBox.vue b/docs/src/components/ExampleBox.vue new file mode 100644 index 0000000..5d16569 --- /dev/null +++ b/docs/src/components/ExampleBox.vue @@ -0,0 +1,44 @@ + + + + + diff --git a/docs/src/components/PageContent.vue b/docs/src/components/PageContent.vue new file mode 100644 index 0000000..b50898a --- /dev/null +++ b/docs/src/components/PageContent.vue @@ -0,0 +1,62 @@ + + + + + diff --git a/docs/src/index.js b/docs/src/index.js index 06550a9..bae44ca 100644 --- a/docs/src/index.js +++ b/docs/src/index.js @@ -14,6 +14,12 @@ highlight.registerLanguage('javascript', highlightJS); import './config.js'; import routes from './routes.js'; import App from './App'; + +import PageContent from './components/PageContent'; +import DocsComponent from './components/DocsComponent'; +import ExampleBox from './components/ExampleBox'; +import ApiTable from './components/ApiTable'; + import SinglePage from './components/single-page'; import SinglePageBanner from './components/single-page-banner'; import SinglePageSection from './components/single-page-section'; @@ -22,6 +28,11 @@ import DemoExample from './components/demo-example'; import CodeBlock from './components/code-block'; +Vue.component('page-content', PageContent); +Vue.component('docs-component', DocsComponent); +Vue.component('example-box', ExampleBox); +Vue.component('api-table', ApiTable); + Vue.component('single-page', SinglePage); Vue.component('single-page-banner', SinglePageBanner); Vue.component('single-page-section', SinglePageSection); @@ -43,7 +54,7 @@ let handleSectionTheme = (currentRoute) => { } else if (currentRoute.name.indexOf('components') >= 0) { Docs.theme = 'indigo'; } else if (currentRoute.name.indexOf('themes') >= 0) { - Docs.theme = 'teal'; + Docs.theme = 'blue'; } else if (currentRoute.name.indexOf('ui-elements') >= 0) { Docs.theme = 'blue-grey'; } else if (currentRoute.name.indexOf('changelog') >= 0) { diff --git a/docs/src/pages/themes/Configuration.vue b/docs/src/pages/themes/Configuration.vue index e0442e4..c233bf5 100644 --- a/docs/src/pages/themes/Configuration.vue +++ b/docs/src/pages/themes/Configuration.vue @@ -1,5 +1,311 @@ + + diff --git a/package.json b/package.json index fb9551c..ce3f434 100644 --- a/package.json +++ b/package.json @@ -45,7 +45,7 @@ "autosize": "^3.0.18", "element.scrollintoviewifneeded-polyfill": "^1.0.1", "scopedQuerySelectorShim": "lazd/scopedQuerySelectorShim", - "vue": "^2.0.8" + "vue": "^2.1.0" }, "devDependencies": { "autoprefixer": "^6.5.3", @@ -78,10 +78,10 @@ "sass-loader": "^4.0.2", "vue-hot-reload-api": "^2.0.6", "vue-html-loader": "^1.2.3", - "vue-loader": "^9.9.5", + "vue-loader": "^10.0.0", "vue-router": "^2.0.3", "vue-style-loader": "^1.0.0", - "vue-template-compiler": "^2.0.8", + "vue-template-compiler": "^2.1.0", "webpack": "^1.13.3", "webpack-dev-middleware": "^1.8.4", "webpack-hot-middleware": "^2.13.2", diff --git a/src/components/mdTabs/mdTabs.scss b/src/components/mdTabs/mdTabs.scss index abfe0bc..4d5dc3b 100644 --- a/src/components/mdTabs/mdTabs.scss +++ b/src/components/mdTabs/mdTabs.scss @@ -25,6 +25,12 @@ $tab-max-width: 264px; } } + &.md-right { + .md-tabs-navigation { + justify-content: flex-end; + } + } + &.md-fixed { .md-tab-header { flex: 1; @@ -135,3 +141,9 @@ $tab-max-width: 264px; } } } + +.md-tabs.md-no-transition { + .md-tabs-content { + transition: none !important; + } +} diff --git a/src/components/mdTabs/mdTabs.vue b/src/components/mdTabs/mdTabs.vue index 75222c6..5a65672 100644 --- a/src/components/mdTabs/mdTabs.vue +++ b/src/components/mdTabs/mdTabs.vue @@ -37,6 +37,11 @@ props: { mdFixed: Boolean, mdCentered: Boolean, + mdRight: Boolean, + mdDynamicHeight: { + type: Boolean, + default: true + }, mdElevation: [String, Number] }, data() { @@ -62,7 +67,7 @@ if (transitionCounter > 200) { window.clearInterval(transitionInterval); } - }, 1); + }, 10); this.recalculateAllTabsPos(); }, @@ -77,7 +82,9 @@ tabClasses() { return { 'md-fixed': this.mdFixed, + 'md-right': !this.mdCentered && this.mdRight, 'md-centered': this.mdCentered || this.mdFixed, + 'md-no-transition': !this.mdDynamicHeight, 'md-has-icon': this.hasIcons, 'md-has-label': this.hasLabel }; @@ -141,13 +148,13 @@ this.activeTab = id; this.activeTabNumber = index; - this.$nextTick(() => { + this.$emit('change', index); + + window.setTimeout(() => { this.calculateIndicatorPos(); this.calculateTabPos(this.tabs[id].ref, index); this.setVisibleTab(this.tabs[id].ref); }); - - this.$emit('change', index); }, handleTabData(data) { let idList = Object.keys(this.tabs); @@ -156,10 +163,8 @@ this.hasIcons = !!data.icon; this.hasLabel = !!data.label; - if (!data.disabled) { - if (data.active) { - this.changeTab(data.id); - } + if (!data.disabled && data.active) { + this.changeTab(data.id); } else { this.changeTab(idList[index + 1]); } @@ -167,13 +172,12 @@ registerTab(data) { this.tabs[data.id] = data; this.handleTabData(data); - this.calculateTabPos(this.tabs[data.id].ref, Object.keys(this.tabs).length - 1); }, updateTabData(data) { this.tabs[data.id] = data; this.handleTabData(data); - this.$forceUpdate(); this.recalculateAllTabsPos(); + this.$forceUpdate(); }, recalculateAllTabsPos(transitionOff) { if (typeof transitionOff === 'undefined') { @@ -194,6 +198,7 @@ this.changeTab(); } + window.addEventListener('resize', this.recalculateAllTabsPos); }, beforeDestroy() { diff --git a/yarn.lock b/yarn.lock index 2a9063c..ee2a690 100644 --- a/yarn.lock +++ b/yarn.lock @@ -174,8 +174,8 @@ async@^1.3.0, async@^1.5.0: resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a" async@^2.0.1: - version "2.1.2" - resolved "https://registry.yarnpkg.com/async/-/async-2.1.2.tgz#612a4ab45ef42a70cde806bad86ee6db047e8385" + version "2.1.4" + resolved "https://registry.yarnpkg.com/async/-/async-2.1.4.tgz#2d2160c7788032e4dd6cbe2502f1f9a2c8f6cde4" dependencies: lodash "^4.14.0" @@ -1008,8 +1008,8 @@ camelcase@^3.0.0: resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-3.0.0.tgz#32fc4b9fcdaf845fcdf7e73bb97cac2261f0ab0a" caniuse-db@^1.0.30000539, caniuse-db@^1.0.30000578: - version "1.0.30000584" - resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000584.tgz#cfbce897a48145fa73f96d893025581e838648c4" + version "1.0.30000585" + resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000585.tgz#9509aeb2bd1df72155cc7d80074f2ad79560ae28" caseless@~0.11.0: version "0.11.0" @@ -1416,8 +1416,8 @@ d@^0.1.1, d@~0.1.1: es5-ext "~0.10.2" dashdash@^1.12.0: - version "1.14.0" - resolved "https://registry.yarnpkg.com/dashdash/-/dashdash-1.14.0.tgz#29e486c5418bf0f356034a993d51686a33e84141" + version "1.14.1" + resolved "https://registry.yarnpkg.com/dashdash/-/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0" dependencies: assert-plus "^1.0.0" @@ -2152,8 +2152,8 @@ globule@^1.0.0: minimatch "~3.0.2" graceful-fs@^4.1.2, graceful-fs@^4.1.4, graceful-fs@^4.1.6, graceful-fs@^4.1.9: - version "4.1.10" - resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.10.tgz#f2d720c22092f743228775c75e3612632501f131" + version "4.1.11" + resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.11.tgz#0e8bdfe4d1ddb8854d64e04ea7c00e2a026e5658" "graceful-readlink@>= 1.0.0": version "1.0.1" @@ -2536,7 +2536,7 @@ is-plain-obj@^1.0.0: is-posix-bracket@^0.1.0: version "0.1.1" - resolved "http://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz#3334dc79774368e92f016e6fbc0a88f5cd6e6bc4" + resolved "https://registry.yarnpkg.com/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz#3334dc79774368e92f016e6fbc0a88f5cd6e6bc4" is-primitive@^2.0.0: version "2.0.0" @@ -3506,8 +3506,8 @@ postcss-discard-overridden@^0.1.1: postcss "^5.0.16" postcss-discard-unused@^2.2.1: - version "2.2.2" - resolved "https://registry.yarnpkg.com/postcss-discard-unused/-/postcss-discard-unused-2.2.2.tgz#5d72f7d05d11de0a9589e001958067ccae1b4931" + version "2.2.3" + resolved "https://registry.yarnpkg.com/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz#bce30b2cc591ffc634322b5fb3464b6d934f4433" dependencies: postcss "^5.0.14" uniqs "^2.0.0" @@ -3684,8 +3684,8 @@ postcss-zindex@^2.0.1: uniqs "^2.0.0" postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0.14, postcss@^5.0.16, postcss@^5.0.2, postcss@^5.0.4, postcss@^5.0.5, postcss@^5.0.6, postcss@^5.0.8, postcss@^5.2.5: - version "5.2.5" - resolved "https://registry.yarnpkg.com/postcss/-/postcss-5.2.5.tgz#ec428c27dffc7fac65961340a9b022fa4af5f056" + version "5.2.6" + resolved "https://registry.yarnpkg.com/postcss/-/postcss-5.2.6.tgz#a252cd67cd52585035f17e9ad12b35137a7bdd9e" dependencies: chalk "^1.1.3" js-base64 "^2.1.9" @@ -4581,8 +4581,8 @@ vm-browserify@0.0.4: indexof "0.0.1" vue: - version "2.0.5" - resolved "https://registry.yarnpkg.com/vue/-/vue-2.0.5.tgz#b99dc7180a802d1148a508db3d84b52c09b5ca8e" + version "2.1.0" + resolved "https://registry.yarnpkg.com/vue/-/vue-2.1.0.tgz#293ba3efaaca846aa6bcbfac45cf8524cc597e3d" vue-hot-reload-api, vue-hot-reload-api@^2.0.1: version "2.0.6" @@ -4599,8 +4599,8 @@ vue-html-loader: object-assign "^4.1.0" vue-loader: - version "9.9.5" - resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-9.9.5.tgz#0893e3093e90c8fbe852053b2b0f4854a3bf4651" + version "10.0.0" + resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-10.0.0.tgz#4adc4b911367c8b68f635d99158ed8ef5739a52b" dependencies: consolidate "^0.14.0" hash-sum "^1.0.2" @@ -4613,7 +4613,6 @@ vue-loader: source-map "^0.5.6" vue-hot-reload-api "^2.0.1" vue-style-loader "^1.0.0" - vue-template-compiler "^2.0.5" vue-template-es2015-compiler "^1.2.2" vue-router: @@ -4626,16 +4625,16 @@ vue-style-loader, vue-style-loader@^1.0.0: dependencies: loader-utils "^0.2.7" -vue-template-compiler, vue-template-compiler@^2.0.5: - version "2.0.8" - resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.0.8.tgz#e91e1ed6b9b7404f8394166cfeb53eb8b620329a" +vue-template-compiler: + version "2.1.0" + resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.1.0.tgz#b920111b239b2c4234a5ffd78ca42cb664f06559" dependencies: de-indent "^1.0.2" he "^1.1.0" vue-template-es2015-compiler@^1.2.2: - version "1.2.4" - resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.2.4.tgz#f8068d805bd93b0b47afb9dc9f47976f77c8282a" + version "1.3.0" + resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.3.0.tgz#4a0f2a0bbef8b5731f78add8263cd86fe4f643ca" watchpack@^0.2.1: version "0.2.9"