github/directus
1
0
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-02-16 05:35:19 -05:00
Code Issues Packages Projects Releases Wiki Activity

Add progress circular (#32)

Browse Source 
* made spinner more fancy

* rebuild spinner to progress circular

* update readme

* cleaned code and style

* clean readme

* made spinner more fancy

* rebuild spinner to progress circular

* update readme

* cleaned code and style

* clean readme

* Register circular progress

* Fix broken import

* Fix stylelint problems in v-progress-circular

* Add some useful tests for circular progress

* Delete package-lock.json

* Update readme

* Ignore package-lock

Co-authored-by: Rijk van Zanten <rijkvanzanten@me.com>
This commit is contained in:
Nitwel
2020-02-17 20:28:16 +01:00
committed by GitHub
parent 62bc8663a0
commit 9fcf702b4f
16 changed files with 412 additions and 258 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/v-button/v-button.test.ts
View File

@@ -1,12 +1,11 @@
import { mount, createLocalVue } from '@vue/test-utils';
import VueCompositionAPI from '@vue/composition-api';
import VButton from './v-button.vue';
import VProgressCircular from '../v-progress/circular/';
const localVue = createLocalVue();
localVue.use(VueCompositionAPI);
localVue.component('v-spinner', VSpinner);
import VButton from './v-button.vue';
import VSpinner from '../v-spinner/';
localVue.component('v-progress-circular', VProgressCircular);
describe('Button', () => {
it('Renders the provided markup in the default slow', () => {

7
src/components/v-button/v-button.vue
View File

@@ -9,7 +9,7 @@
<span class="content" :class="{ invisible: loading }"><slot /></span>
<div class="spinner">
<slot v-if="loading" name="loading">
<v-spinner :x-small="xSmall" :small="small" />
<v-progress-circular :x-small="xSmall" :small="small" indeterminate />
</slot>
</div>
</button>
@@ -191,6 +191,11 @@ export default createComponent({
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
.v-progress-circular {
--v-progress-circular-color: var(--v-button-color);
--v-progress-circular-background-color: transparent;
}
}
}
</style>