import React from "react";
import Layout from "../Partials/Layout";
import { InputCom } from "../AddJob/settings";

const YourPage = () => {
  return (
    <Layout>
      <div className="notification-page w-full mb-10">
        <div className="notification-wrapper w-full">
          <div className="update-table w-full h-full p-4 bg-white dark:bg-dark-white overflow-y-auto rounded-2xl section-shadow min-h-[520px]">
            <h1 className="text-26 font-bold text-dark-gray dark:text-white tracking-wide mb-2">
              My page
            </h1>
            <hr />
            <div className="ml-4">
              <div className="field w-full">
                <InputCom
                  fieldClass="px-4 transfer-field"
                  parentClass="flex items-center gap-1 justify-between"
                  labelClass="flex-[0.2] mb-0"
                  inputClass="flex-[0.8] transfer-field"
                  label="Introduction: "
                  type="text"
                  name="fee"
                  value=""
                />
              </div>

              <div className="field w-full mb-6 flex gap-1 justify-between">
                <label className="text-[#181c32] dark:text-white text-base font-semibold flex flex-[0.2] mt-2.5">
                  Brief Details:
                </label>
                <textarea
                  style={{ resize: "none" }}
                  className="text-base px-4 py-2 rounded-md min-h-[100px] text-dark-gray dark:text-white w-full bg-slate-100 dark:bg-[#11131F]  focus:ring-0 focus:outline-none flex-[0.8]"
                  name="comment"
                  cols="30"
                  rows="2"
                />
              </div>
              <div className="w-full flex justify-end mb-2">
                <button
                  type="submit"
                  // disabled={props.isSubmitting}
                  className="text-lg text-white bg-sky-blue px-4 py-2 hover:opacity-90 rounded-full"
                >
                  Continue
                </button>
              </div>
            </div>
            <hr />
          </div>
        </div>
      </div>
    </Layout>
  );
};

export default YourPage;