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

Fixing links and other small tweaks

Browse Source
This commit is contained in:
Mosab Ibrahim
2020-05-08 16:54:57 +02:00
parent ca10ec1b74
commit bf27cbe581
13 changed files with 45 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/UI/Alert/NotificationPop.vue
View File

@@ -6,8 +6,8 @@
<img class="w-12 h-12 object-cover rounded-full" src="https://images.unsplash.com/photo-1477118476589-bff2c5c4cfbb?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=200&q=200">
<div class="mx-3">
<h2 class="text-xl font-semibold text-gray-800">Jane Doe</h2>
<p class="text-gray-600">Sara was replied on the <a class="text-blue-500 hover:text-blue-400 hover:underline">Upload Image</a>.</p>
<h2 class="text-xl font-semibold text-gray-800 cur">Jane Doe</h2>
<p class="text-gray-600">Sara was replied on the <a href="#" class="text-blue-500 hover:text-blue-400 hover:underline">Upload Image</a>.</p>
</div>
</div>
</div>

14
src/components/UI/Cards/ArticleCard.vue
View File

@@ -3,11 +3,11 @@
<div class="max-w-2xl mx-auto px-8 py-4 bg-white rounded-lg shadow-md">
<div class="flex justify-between items-center">
<span class="font-light text-gray-600">Mar 10, 2019</span>
<a class="px-2 py-1 bg-gray-600 text-gray-100 font-bold rounded hover:bg-gray-500">Design</a>
<a href="#" class="px-2 py-1 bg-gray-600 text-gray-100 font-bold rounded hover:bg-gray-500">Design</a>
</div>
<div class="mt-2">
<a class="text-2xl text-gray-700 font-bold hover:text-gray-600 hover:underline">Accessibility tools for
<a href="#" class="text-2xl text-gray-700 font-bold hover:text-gray-600 hover:underline">Accessibility tools for
designers and developers</a>
<p class="mt-2 text-gray-600">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Tempora expedita
dicta totam aspernatur doloremque. Excepturi iste iusto eos enim reprehenderit nisi, accusamus
@@ -15,15 +15,13 @@
</div>
<div class="flex justify-between items-center mt-4">
<a class="text-blue-600 hover:underline">Read more</a>
<div>
<a class="flex items-center">
<a href="#" class="text-blue-600 hover:underline">Read more</a>
<div class="flex items-center">
<img class="mx-4 w-10 h-10 object-cover rounded-full hidden sm:block"
src="https://images.unsplash.com/photo-1502980426475-b83966705988?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=40&q=80"
alt="avatar">
<h1 class="text-gray-700 font-bold">Khatab wedaa</h1>
</a>
</div>
<a class="text-gray-700 font-bold cursor-pointer">Khatab wedaa</a>
</div>
</div>
</div>
</div>

9
src/components/UI/Cards/ArticleCardWithImage.vue
View File

@@ -9,18 +9,17 @@
<div class="p-6">
<div>
<span class="text-blue-600 text-xs font-medium uppercase">Product</span>
<a class="block text-gray-800 font-semibold text-2xl mt-2 hover:text-gray-600 hover:underline">I Built A Successful Blog In One Year</a>
<a href="#" class="block text-gray-800 font-semibold text-2xl mt-2 hover:text-gray-600 hover:underline">I Built A Successful Blog In One Year</a>
<p class="text-sm text-gray-600 mt-2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Molestie parturient et sem ipsum volutpat vel. Natoque sem et aliquam mauris egestas quam volutpat viverra. In pretium nec senectus erat. Et malesuada lobortis.</p>
</div>
<div class="mt-4">
<div class="flex items-center">
<a class="flex items-center">
<div class="flex items-center">
<img class="h-10 h-10 object-cover rounded-full" src="https://images.unsplash.com/photo-1586287011575-a23134f797f9?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=48&q=60"
alt="Avatar">
<span class="mx-2 text-gray-700 font-semibold">Jone Doe</span>
</a>
<a href="#" class="mx-2 text-gray-700 font-semibold">Jone Doe</a>
</div>
<span class="mx-1 text-gray-600 text-xs">21 SEP 2015</span>
</div>
</div>

4
src/components/UI/Cards/TestimonialCard.vue
View File

@@ -7,14 +7,14 @@
</div>
<div>
<h2 class="text-gray-800 text-3xl font-semibold">Design Tools</h2>
<h2 class="text-gray-800 text-2xl mt-2 md:mt-0 md:text-3xl font-semibold">Design Tools</h2>
<p class="mt-2 text-gray-600">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quae dolores
deserunt ea doloremque natus error, rerum quas odio quaerat nam ex commodi hic, suscipit in a
veritatis pariatur minus consequuntur!</p>
</div>
<div class="flex justify-end mt-4">
<a class="text-xl font-medium text-indigo-500">John Doe</a>
<a href="#" class="text-xl font-medium text-indigo-500">John Doe</a>
</div>
</div>
</div>

2
src/components/UI/Cards/UserCard.vue
View File

@@ -4,7 +4,7 @@
<img class="w-full h-56 object-cover" src="https://images.unsplash.com/photo-1542156822-6924d1a71ace?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=60" alt="avatar">
<div class="py-5 text-center">
<a class="block text-2xl text-gray-800 font-bold">John Doe</a>
<a href="#" class="block text-2xl text-gray-800 font-bold">John Doe</a>
<span class="text-sm text-gray-700">Software Engineer</span>
</div>
</div>

4
src/components/UI/Forms/SignInForm.vue
View File

@@ -14,7 +14,7 @@
<input class="w-full mt-2 py-2 px-4 bg-gray-100 text-gray-700 border border-gray-300 rounded block appearance-none placeholder-gray-500 focus:outline-none focus:bg-white" type="password" placeholder="Password">
</div>
<div class="flex justify-between items-center mt-6">
<a class="text-gray-600 text-sm hover:text-gray-500">Forget Password?</a>
<a href="#" class="text-gray-600 text-sm hover:text-gray-500">Forget Password?</a>
<button class="py-2 px-4 bg-gray-700 text-white rounded hover:bg-gray-600 focus:outline-none" type="button">
Login
</button>
@@ -24,7 +24,7 @@
<div class="flex items-center justify-center py-4 bg-gray-100 text-center">
<h1 class="text-gray-600 text-sm">Dont`t have an account? </h1>
<a class="text-blue-600 font-bold mx-2 text-sm hover:text-blue-500">Register</a>
<a href="#" class="text-blue-600 font-bold mx-2 text-sm hover:text-blue-500">Register</a>
</div>
</div>
</div>

8
src/components/UI/Forms/SignInFormWithImage.vue
View File

@@ -6,7 +6,7 @@
<div class="w-full p-8 lg:w-1/2">
<h2 class="text-2xl font-semibold text-gray-700 text-center">Brand</h2>
<p class="text-xl text-gray-600 text-center">Welcome back!</p>
<a class="flex items-center justify-center mt-4 text-white rounded-lg shadow-md hover:bg-gray-100">
<a href="#" class="flex items-center justify-center mt-4 text-white rounded-lg shadow-md hover:bg-gray-100">
<div class="px-4 py-3">
<svg class="h-6 w-6" viewBox="0 0 40 40">
<path d="M36.3425 16.7358H35V16.6667H20V23.3333H29.4192C28.045 27.2142 24.3525 30 20 30C14.4775 30 10 25.5225 10 20C10 14.4775 14.4775 9.99999 20 9.99999C22.5492 9.99999 24.8683 10.9617 26.6342 12.5325L31.3483 7.81833C28.3717 5.04416 24.39 3.33333 20 3.33333C10.7958 3.33333 3.33335 10.7958 3.33335 20C3.33335 29.2042 10.7958 36.6667 20 36.6667C29.2042 36.6667 36.6667 29.2042 36.6667 20C36.6667 18.8825 36.5517 17.7917 36.3425 16.7358Z"
@@ -24,7 +24,7 @@
<div class="mt-4 flex items-center justify-between">
<span class="border-b w-1/5 lg:w-1/4"></span>
<a class="text-xs text-center text-gray-500 uppercase hover:underline">or login with email</a>
<a href="#" class="text-xs text-center text-gray-500 uppercase hover:underline">or login with email</a>
<span class="border-b w-1/5 lg:w-1/4"></span>
</div>
@@ -37,7 +37,7 @@
<div class="mt-4">
<div class="flex justify-between">
<label class="block text-gray-700 text-sm font-bold mb-2">Password</label>
<a class="text-xs text-gray-500 hover:underline">Forget Password?</a>
<a href="#" class="text-xs text-gray-500 hover:underline">Forget Password?</a>
</div>
<input class="bg-gray-200 text-gray-700 border border-gray-300 rounded py-2 px-4 block w-full appearance-none focus:outline-none focus:bg-white"
type="password">
@@ -50,7 +50,7 @@
<div class="mt-4 flex items-center justify-between">
<span class="border-b w-1/5 md:w-1/4"></span>
<a class="text-xs text-gray-500 uppercase hover:underline">or sign up</a>
<a href="#" class="text-xs text-gray-500 uppercase hover:underline">or sign up</a>
<span class="border-b w-1/5 md:w-1/4"></span>
</div>
</div>

12
src/components/UI/Header/HeaderWithImage.vue
View File

@@ -6,7 +6,7 @@
<div class="md:flex items-center justify-between">
<div class="flex justify-between items-center">
<div>
<a class="text-xl font-bold text-gray-800 hover:text-gray-700 md:text-2xl">Brand</a>
<a href="#" class="text-xl font-bold text-gray-800 hover:text-gray-700 md:text-2xl">Brand</a>
</div>
<div class="md:hidden">
@@ -25,9 +25,9 @@
</div>
<div :class="!isOpen ? 'hidden' : ''" class="flex flex-col -mx-2 mt-2 md:mt-0 md:flex-row md:block">
<a class="py-2 px-2 text-sm text-gray-800 rounded hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">Home</a>
<a class="py-2 px-2 text-sm text-gray-800 rounded hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">About</a>
<a class="py-2 px-2 text-sm text-gray-800 rounded hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">Contact</a>
<a href="#" class="py-2 px-2 text-sm text-gray-800 rounded hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">Home</a>
<a href="#" class="py-2 px-2 text-sm text-gray-800 rounded hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">About</a>
<a href="#" class="py-2 px-2 text-sm text-gray-800 rounded hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">Contact</a>
</div>
</div>
</div>
@@ -47,11 +47,11 @@
</p>
<div class="flex mt-6">
<a class="px-3 py-2 block bg-gray-900 text-gray-200 text-xs font-semibold rounded hover:bg-gray-800">
<a href="#" class="px-3 py-2 block bg-gray-900 text-gray-200 text-xs font-semibold rounded hover:bg-gray-800">
Get Started
</a>
<a class="mx-4 px-3 py-2 block bg-gray-300 text-gray-900 text-xs font-semibold rounded hover:bg-gray-400">
<a href="#" class="mx-4 px-3 py-2 block bg-gray-300 text-gray-900 text-xs font-semibold rounded hover:bg-gray-400">
Learn More
</a>
</div>

8
src/components/UI/Header/HeaderWithPattern.vue
View File

@@ -4,12 +4,12 @@
<div class="container mx-auto px-6">
<nav class="flex flex-col py-2 sm:flex-row sm:justify-between sm:items-center">
<div>
<a class="text-2xl font-semibold text-white hover:text-gray-300">Brand</a>
<a href="#" class="text-2xl font-semibold text-white hover:text-gray-300">Brand</a>
</div>
<div class="flex items-center -mx-2 mt-2 sm:mt-0">
<a class="px-3 py-1 border-2 font-semibold rounded text-sm text-white hover:bg-gray-700">Sign In</a>
<a class="mx-2 px-3 py-2 font-semibold bg-black rounded text-sm text-white hover:bg-gray-800">Sign Up</a>
<a href="#" class="px-3 py-1 border-2 font-semibold rounded text-sm text-white hover:bg-gray-700">Sign In</a>
<a href="#" class="mx-2 px-3 py-2 font-semibold bg-black rounded text-sm text-white hover:bg-gray-800">Sign Up</a>
</div>
</nav>
@@ -34,7 +34,7 @@
</div>
<div class="mt-4 flex items-center justify-between">
<a class="text-gray-600 text-sm hover:underline">Forget Password?</a>
<a href="#" class="text-gray-600 text-sm hover:underline">Forget Password?</a>
<button class="px-4 py-2 font-semibold bg-gray-900 rounded text-white hover:bg-gray-800">Login</button>
</div>

8
src/components/UI/Navbars/Navbar.vue
View File

@@ -5,7 +5,7 @@
<div class="md:flex justify-between items-center">
<div class="flex justify-between items-center">
<div>
<a class="text-gray-800 text-xl font-bold hover:text-gray-700 md:text-2xl">Brand</a>
<a href="#" class="text-gray-800 text-xl font-bold hover:text-gray-700 md:text-2xl">Brand</a>
</div>
<div class="md:hidden">
@@ -18,9 +18,9 @@
</div>
<div :class="!isOpen ? 'hidden' : ''" class="flex flex-col mt-3 md:flex-row md:mt-0 md:block">
<a class="text-gray-800 text-sm hover:font-medium md:mx-4">Home</a>
<a class="text-gray-800 text-sm hover:font-medium md:mx-4">Contact</a>
<a class="text-gray-800 text-sm hover:font-medium md:mx-4">About Us</a>
<a href="#" class="text-gray-800 text-sm hover:font-medium md:mx-4">Home</a>
<a href="#" class="text-gray-800 text-sm hover:font-medium md:mx-4">Contact</a>
<a href="#" class="text-gray-800 text-sm hover:font-medium md:mx-4">About Us</a>
</div>
</div>
</div>

8
src/components/UI/Navbars/NavbarWithSearch.vue
View File

@@ -4,7 +4,7 @@
<div class="container mx-auto px-6 py-3 md:flex">
<div class="flex justify-between items-center">
<div>
<a class="text-gray-800 text-xl font-bold hover:text-gray-700 md:text-2xl">Brand</a>
<a href="#" class="text-gray-800 text-xl font-bold hover:text-gray-700 md:text-2xl">Brand</a>
</div>
<div class="md:hidden">
@@ -18,9 +18,9 @@
<div :class="!isOpen ? 'hidden' : ''" class="w-full md:flex md:items-center md:justify-between md:block">
<div class="flex flex-col -mx-4 px-2 py-3 md:flex-row md:mx-0 md:py-0">
<a class="py-1 px-2 text-gray-800 rounded text-sm hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">Home</a>
<a class="py-1 px-2 text-gray-800 rounded text-sm hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">About</a>
<a class="py-1 px-2 text-gray-800 rounded text-sm hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">Contact</a>
<a href="#" class="py-1 px-2 text-gray-800 rounded text-sm hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">Home</a>
<a href="#" class="py-1 px-2 text-gray-800 rounded text-sm hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">About</a>
<a href="#" class="py-1 px-2 text-gray-800 rounded text-sm hover:bg-gray-900 hover:text-gray-100 hover:font-medium md:mx-2">Contact</a>
</div>
<div>

10
src/components/UI/Paginations/Pagination.vue
View File

@@ -3,21 +3,21 @@
<div :id="name | toId">
<ul class="flex">
<li class="mx-1 px-3 py-2 bg-gray-200 text-gray-500 rounded-lg">
<a class="flex items-center font-bold">
<a href="#" class="flex items-center font-bold cursor-not-allowed">
<span class="mx-1">previous</span>
</a>
</li>
<li class="mx-1 px-3 py-2 bg-gray-200 text-gray-700 hover:bg-gray-700 hover:text-gray-200 rounded-lg">
<a class="font-bold">1</a>
<a href="#" class="font-bold">1</a>
</li>
<li class="mx-1 px-3 py-2 bg-gray-200 text-gray-700 hover:bg-gray-700 hover:text-gray-200 rounded-lg">
<a class="font-bold">2</a>
<a href="#" class="font-bold">2</a>
</li>
<li class="mx-1 px-3 py-2 bg-gray-200 text-gray-700 hover:bg-gray-700 hover:text-gray-200 rounded-lg">
<a class="font-bold">3</a>
<a href="#" class="font-bold">3</a>
</li>
<li class="mx-1 px-3 py-2 bg-gray-200 text-gray-700 hover:bg-gray-700 hover:text-gray-200 rounded-lg">
<a class="flex items-center font-bold">
<a href="#" class="flex items-center font-bold">
<span class="mx-1">Next</span>
</a>
</li>

2
src/components/UI/Sections/ParagraphWithImage.vue
View File

@@ -10,7 +10,7 @@
<h2 class="text-3xl text-gray-800 font-bold">Build Your New <span class="text-indigo-600">Idea</span></h2>
<p class="mt-4 text-gray-600">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quidem modi reprehenderit vitae exercitationem aliquid dolores ullam temporibus enim expedita aperiam mollitia iure consectetur dicta tenetur, porro consequuntur saepe accusantium consequatur.</p>
<div class="mt-8">
<a class="bg-gray-900 text-gray-100 px-5 py-3 font-semibold rounded">Start Now</a>
<a href="#" class="bg-gray-900 text-gray-100 px-5 py-3 font-semibold rounded">Start Now</a>
</div>
</div>
</div>