Skip to content

Commit ce8e2e0

Browse files
committed
feat: new auth comp 00
1 parent a0cb95a commit ce8e2e0

File tree

7 files changed

+202
-100
lines changed

7 files changed

+202
-100
lines changed
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import FUILoginWithGridProvider from "previewsComponents/FUILoginWithGridProvider";
2+
export default function FarmuiAuth00ExamplePage() {
3+
return <FUILoginWithGridProvider />;
4+
}
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
---
2+
title: Login With Grid Form
3+
category: Application
4+
paid: false
5+
isActive: true
6+
ltr: {"preview":"function App() {\n return (\n <div className=\"max-w-md px-4 mx-auto mt-12\">\n <label for=\"website-url\" className=\"block py-2 text-gray-500\">\n Website URL\n </label>\n <div className=\"flex items-center text-gray-400 border rounded-md\">\n <div className=\"px-3 py-2.5 rounded-l-md bg-gray-50 border-r\">\n https://\n </div>\n <input \n type=\"text\"\n placeholder=\"www.example.com\"\n id=\"website-url\"\n className=\"w-full p-2.5 ml-2 bg-transparent outline-none\"\n />\n </div>\n </div>\n )\n}","react":{"jsxTail":[{"label":"App.jsx","code":"export default () => {\n return (\n <div className=\"max-w-md px-4 mx-auto mt-12\">\n <label for=\"website-url\" className=\"block py-2 text-gray-500\">\n Website URL\n </label>\n <div className=\"flex items-center text-gray-400 border rounded-md\">\n <div className=\"px-3 py-2.5 rounded-l-md bg-gray-50 border-r\">\n https://\n </div>\n <input \n type=\"text\"\n placeholder=\"www.example.com\"\n id=\"website-url\"\n className=\"w-full p-2.5 ml-2 bg-transparent outline-none\"\n />\n </div>\n </div>\n )\n}"}],"jsxCss":[{"code":"export default () => {\n return (\n <div className=\"website-url-input\">\n <label for=\"website-url\">\n Website URL\n </label>\n <div className=\"input-container\">\n <div className=\"website-protocol\">\n https://\n </div>\n <input \n type=\"text\"\n placeholder=\"www.example.com\"\n id=\"website-url\"\n className=\"input\"\n />\n </div>\n </div>\n )\n}\n","label":"App.jsx"},{"label":"style.css","code":".website-url-input {\n max-width: 28rem;\n padding: 0px 1rem 0px 1rem;\n margin: 3rem auto 0px auto;\n}\n.website-url-input label {\n display: block;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n color: #6b7280;\n}\n.website-url-input .input-container {\n display: flex;\n align-items: center;\n color: #9ca3af;\n border: solid 1px #e5e7eb;\n border-radius: 0.375rem;\n}\n.website-url-input .input-container .website-protocol {\n padding: 0.625rem 0.75rem 0.625rem 0.75rem;\n background-color: #f9fafb;\n border-top-left-radius: 0.375rem;\n border-bottom-left-radius: 0.375rem;\n border-right: solid 1px #e5e7eb;\n}\n.website-url-input .input-container .input {\n width: 100%;\n padding: 0.625rem;\n margin-left: 0.5rem;\n background-color: transparent;\n outline: none;\n}\n"}]},"vue":{"vueTail":[{"code":"<template>\n <div class=\"max-w-md px-4 mx-auto mt-12\">\n <label for=\"website-url\" class=\"block text-left py-2 text-gray-500\">\n Website URL\n </label>\n <div class=\"flex items-center text-gray-400 border rounded-md\">\n <div class=\"px-3 py-2.5 rounded-l-md bg-gray-50 border-r\">\n https://\n </div>\n <input type=\"text\" placeholder=\"www.example.com\" id=\"website-url\"\n class=\"w-full p-2.5 ml-2 bg-transparent outline-none\" />\n </div>\n </div>\n</template>","label":"App.vue"}],"vueCss":[{"label":"App.vue","code":"<template>\n <div class=\"input-container\">\n <label for=\"website-url\" class=\"input-label\">\n Website URL\n </label>\n <div class=\"input-parent\">\n <div class=\"left-input bg-gray-50\">\n https://\n </div>\n <input type=\"text\" placeholder=\"www.example.com\" id=\"website-url\" class=\"website-url\" />\n </div>\n </div>\n</template>"},{"code":" .input-container {\n max-width: 28rem;\n padding-left: 1rem;\n padding-right: 1rem;\n margin-left: auto;\n margin-right: auto;\n margin-top: 3rem;\n }\n .input-label {\n color: #6b7280;\n text-align: left;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n display: block;\n }\n .input-parent {\n border-radius: 0.375rem;\n display: flex;\n align-items: center;\n color: #9ca3af;\n border-width: 1px;\n }\n .left-input {\n padding-top: 0.625rem;\n padding-bottom: 0.625rem;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n border-right-width: 1px;\n border-top-left-radius: 0.375rem;\n border-bottom-left-radius: 0.375rem;\n background-color: #f9fafb;\n }\n .website-url {\n padding: 0.625rem;\n outline: 2px solid transparent;\n outline-offset: 2px;\n background-color: transparent;\n width: 100%;\n margin-left: 0.5rem;\n }","label":"style.css"}]},"html":{"htmlTail":[{"label":"index.html","code":"<div class=\"max-w-md px-4 mx-auto mt-12\">\n <label for=\"website-url\" class=\"block py-2 text-gray-500\">\n Website URL\n </label>\n <div class=\"flex items-center text-gray-400 border rounded-md\">\n <div class=\"px-3 py-2.5 rounded-l-md bg-gray-50 border-r\">\n https://\n </div>\n <input \n type=\"text\"\n placeholder=\"www.example.com\"\n id=\"website-url\"\n class=\"w-full p-2.5 ml-2 bg-transparent outline-none\"\n />\n </div>\n</div>\n"}]}}
7+
slug: /auth-section
8+
id: "farmui-auth-00"
9+
created_at: 1
10+
---
11+
12+
<FUILoginWithGridProvider />

0 commit comments

Comments
 (0)