chore: demo

Author: farfromrefug

demo-snippets/vue/Mixins.vue

@@ -4,11 +4,11 @@
             <NavigationButton text="Back" android.systemIcon="ic_menu_back" @tap="onNavigationButtonTap"></NavigationButton>
         </ActionBar>
         <StackLayout>
-            <StackLayout backgroundColor="yellow" elevation="10" dynamicElevationOffset="3">
-                <Button margin="10" elevation="5" rippleColor="red" backgroundColor="green" borderRadius="10" fontSize="20" text="elevated button" @tap="onButtonTap" />
+            <StackLayout backgroundColor="pink" elevation="10" dynamicElevationOffset="3">
+                <Button margin="10" elevation="5" rippleColor="red" backgroundColor="green" borderRadius="50%" fontSize="20" text="elevated button" @tap="onButtonTap" id="button" />
                 <Button margin="10" rippleColor="red" fontSize="20" text="elevated button" />
-                <Label margin="10" horizontalAlignment="center" backgroundColor="yellow" padding="10" elevation="1" borderRadius="20" rippleColor="red" text="elevated text" />
-                <Label margin="10" horizontalAlignment="center" padding="10" backgroundColor="yellow" dynamicElevationOffset="3" elevation="1" rippleColor="red" text="elevated text" />
+                <Label margin="10" horizontalAlignment="center" backgroundColor="yellow" padding="10" elevation="1" dynamicElevationOffset="3" rippleColor="red" text="elevated text"  borderRadius="50% 10% 4 0" borderWidth="1" borderColor="blue" id="label"/>
+                <Label margin="10" horizontalAlignment="center" padding="10" backgroundColor="yellow" dynamicElevationOffset="3" elevation="1" rippleColor="red" text="elevated text" borderRadius="20"/>
                 <StackLayout class="cardView" height="100" orientation="horizontal">
                     <Label width="100%" textAlignment="center" verticalAlignment="center" text="elevated text" />
                 </StackLayout>

demo-snippets/vue/Ripples.vue

@@ -4,8 +4,8 @@
             <NavigationButton text="Back" android.systemIcon="ic_menu_back" @tap="onNavigationButtonTap"></NavigationButton>
         </ActionBar>
         <StackLayout>
-            <MDRipple backgroundColor="gray" rippleColor="green" width="100" height="100" @tap="onTap"/>
-            <MDRipple width="100" height="100" rippleColor="green" borderRadius="50%"  @tap="onTap"/>
+            <MDRipple backgroundColor="gray" rippleColor="green" width="100" height="100" @tap="onTap" horizontalAlignment="left"/>
+            <MDRipple width="100" height="100" rippleColor="green" borderRadius="50%"  @tap="onTap" horizontalAlignment="left"/>
         </StackLayout>
     </Page>
 </template>

demo-snippets/vue/install.ts

@@ -75,6 +75,7 @@ export function installPlugin() {
 }
 
 export const demos = [
+    { name: 'Mixins', path: 'Mixins', component: Mixins },
     { name: 'ActivityIndicators', path: 'ActivityIndicators', component: ActivityIndicators },
     { name: 'BottomNavigationBar', path: 'BottomNavigationBar', component: BottomNavigationBar },
     { name: 'BottomNavigation', path: 'BottomNavigation', component: BottomNavigation },
@@ -89,6 +90,5 @@ export const demos = [
     { name: 'TextViews', path: 'TextViews', component: TextViews },
     { name: 'BottomSheet', path: 'BottomSheet', component: BottomSheet },
     { name: 'SpeedDial', path: 'SpeedDial', component: SpeedDial },
-    { name: 'Tabs', path: 'Tabs', component: Tabs },
-    { name: 'Mixins', path: 'Mixins', component: Mixins }
+    { name: 'Tabs', path: 'Tabs', component: Tabs }
 ];