Mirroring/merakiui
1
0
Fork 0
mirror of https://github.com/bakateam/merakiui.git synced 2025-12-09 07:03:24 +00:00
Code Issues Projects Releases Wiki Activity

WIP

Browse Source
This commit is contained in:
khatabwedaa
2021-09-19 15:00:43 +02:00
parent d576093315
commit b1e423298c
8 changed files with 114 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
components/ui/Authentication/LoginWithSocialMediaLinks.vue
View File

@@ -1,5 +1,5 @@
<template>
<view-component :name="name" :code="code" :playUrl="'https://play.tailwindcss.com/KiEKiGCAYc'">
<view-component :name="name" :code="code" :playUrl="'https://play.tailwindcss.com/C7LVpatIva'">
<div class="px-3 py-6" slot="component">
<div class="w-full max-w-sm p-6 m-auto bg-white rounded-md shadow-md dark:bg-gray-800">
<h1 class="text-3xl font-semibold text-center text-gray-700 dark:text-white">Brand</h1>
@@ -8,7 +8,7 @@
<div>
<label for="username" class="block text-sm text-gray-800 dark:text-gray-200">Username</label>
<input type="text"
class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-300 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring">
class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring">
</div>
<div class="mt-4">
@@ -18,7 +18,7 @@
</div>
<input type="password"
class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-300 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring">
class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring">
</div>
<div class="mt-6">
@@ -40,7 +40,7 @@
<div class="flex items-center mt-6 -mx-2">
<button type="button"
class="flex items-center justify-center w-full px-6 py-2 mx-2 text-sm font-medium text-white transition-colors duration-200 transform bg-blue-500 rounded-md hover:bg-blue-400 focus:bg-blue-400 focus:outline-none">
<svg class="w-5 h-5 mx-2 fill-current" viewBox="0 0 24 24">
<svg class="w-4 h-4 mx-2 fill-current" viewBox="0 0 24 24">
<path
d="M12.24 10.285V14.4h6.806c-.275 1.765-2.056 5.174-6.806 5.174-4.095 0-7.439-3.389-7.439-7.574s3.345-7.574 7.439-7.574c2.33 0 3.891.989 4.785 1.849l3.254-3.138C18.189 1.186 15.479 0 12.24 0c-6.635 0-12 5.365-12 12s5.365 12 12 12c6.926 0 11.52-4.869 11.52-11.726 0-.788-.085-1.39-.189-1.989H12.24z">
</path>
@@ -60,7 +60,7 @@
</div>
<p class="mt-8 text-xs font-light text-center text-gray-400"> Don't have an account? <a href="#"
class="font-medium text-gray-800 dark:text-gray-200 hover:underline">Create One</a></p>
class="font-medium text-gray-700 dark:text-gray-200 hover:underline">Create One</a></p>
</div>
</div>
</view-component>
@@ -79,7 +79,7 @@
<div>
<label for="username" class="block text-sm text-gray-800 dark:text-gray-200">Username</label>
<input type="text"
class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-300 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring">
class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring">
</div>
<div class="mt-4">
@@ -89,7 +89,7 @@
</div>
<input type="password"
class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-300 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring">
class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring">
</div>
<div class="mt-6">
@@ -131,7 +131,7 @@
</div>
<p class="mt-8 text-xs font-light text-center text-gray-400"> Don't have an account? <a href="#"
class="font-medium text-gray-800 dark:text-gray-200 hover:underline">Create One</a></p>
class="font-medium text-gray-700 dark:text-gray-200 hover:underline">Create One</a></p>
</div>`
}
}