https://imgur.com/Bu5Qoo5
My .jsx:
Code: Select all
import "./SignUp.css";
import { React, useRef } from "react";
import Button from "../../components/Button/Button";
import "primeicons/primeicons.css";
import { Toast } from "primereact/toast";
function Test() {
const toast = useRef(null);
const showMessage = (label, ref, severity) => {
ref.current.show({
severity: severity,
summary: "Oops!",
detail: label,
life: 3000,
});
};
const notChecked = () => {
showMessage("You haven't agreed to the terms.", toast, "warn");
};
return (
<div className="flex min-h-screen flex-col justify-center items-center w-full pt-10 bg-stdblue">
<Toast ref={toast} />
<Button text={"NEXT"} func={notChecked} />
</div>
);
}
export default Test;
Code: Select all
@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";
* {
-webkit-tap-highlight-color: transparent;
}