namirasoft-site-react 1.4.164 → 1.4.166

package/src/components/NSBarAlert.module.css

@@ -1,80 +1,80 @@
-.ns_bar_alert_section {
-	color: #141B5C;
-	background-color: #FE9900;
-	padding: 16px 0;
-	box-shadow: 0 4px 4px 0 #00000040;
-	border-bottom: solid 1px currentColor;
-}
-
-.ns_bar_alert_container {
-	display: flex;
-	flex-wrap: wrap;
-	flex-direction: row;
-	justify-content: center;
-	align-items: center;
-	gap: 8px;
-}
-
-.ns_bar_alert_title_parent {
-	align-items: center;
-}
-
-.ns_bar_alert_title {
-	color: inherit;
-	display: flex;
-	flex-wrap: wrap;
-	flex-direction: row;
-	justify-content: center;
-	align-items: center;
-	gap: 8px;
-}
-
-.ns_bar_alert_title>h3 {
-	color: inherit;
-	font-size: 20px;
-	font-weight: 600;
-	margin: 0 16px 2px 8px;
-}
-
-.ns_bar_alert_description {
-	color: inherit;
-	font-size: 12px;
-	font-weight: 300;
-	margin-bottom: 0;
-	text-align: center;
-}
-
-.ns_bar_alert_link>button {
-	color: inherit;
-	font-size: 16px;
-	font-weight: 600;
-	text-decoration: underline;
-	border: none;
-	outline: none;
-	background: none;
-	cursor: pointer;
-}
-
-
-@media only screen and (min-width: 768px) {
-	.ns_bar_alert_container {
-		justify-content: space-between;
-		gap: 0;
-	}
-
-	.ns_bar_alert_title_parent {
-		display: flex;
-		align-items: center;
-		margin-right: auto;
-	}
-
-	.ns_bar_alert_title {
-		justify-content: space-between;
-		gap: 0;
-	}
-
-	.ns_bar_alert_description {
-		text-align: start;
-	}
-
+.ns_bar_alert_section {
+	color: #141B5C;
+	background-color: #FE9900;
+	padding: 16px 0;
+	box-shadow: 0 4px 4px 0 #00000040;
+	border-bottom: solid 1px currentColor;
+}
+
+.ns_bar_alert_container {
+	display: flex;
+	flex-wrap: wrap;
+	flex-direction: row;
+	justify-content: center;
+	align-items: center;
+	gap: 8px;
+}
+
+.ns_bar_alert_title_parent {
+	align-items: center;
+}
+
+.ns_bar_alert_title {
+	color: inherit;
+	display: flex;
+	flex-wrap: wrap;
+	flex-direction: row;
+	justify-content: center;
+	align-items: center;
+	gap: 8px;
+}
+
+.ns_bar_alert_title>h3 {
+	color: inherit;
+	font-size: 20px;
+	font-weight: 600;
+	margin: 0 16px 2px 8px;
+}
+
+.ns_bar_alert_description {
+	color: inherit;
+	font-size: 12px;
+	font-weight: 300;
+	margin-bottom: 0;
+	text-align: center;
+}
+
+.ns_bar_alert_link>button {
+	color: inherit;
+	font-size: 16px;
+	font-weight: 600;
+	text-decoration: underline;
+	border: none;
+	outline: none;
+	background: none;
+	cursor: pointer;
+}
+
+
+@media only screen and (min-width: 768px) {
+	.ns_bar_alert_container {
+		justify-content: space-between;
+		gap: 0;
+	}
+
+	.ns_bar_alert_title_parent {
+		display: flex;
+		align-items: center;
+		margin-right: auto;
+	}
+
+	.ns_bar_alert_title {
+		justify-content: space-between;
+		gap: 0;
+	}
+
+	.ns_bar_alert_description {
+		text-align: start;
+	}
+
 }

package/src/components/NSBarAlert.tsx

@@ -1,32 +1,32 @@
-import { IBaseComponentProps } from '../props/IBaseComponentProps';
-import { NSBarTitleProps } from './NSBarTitle';
-import { NSSection } from './NSSection';
-import Styles from './NSBarAlert.module.css';
-
-export interface NSBarAlertProps extends IBaseComponentProps
-{
-	title: NSBarTitleProps;
-	button_text?: string;
-	isVisible: () => boolean;
-	onClick?: () => void;
-}
-
-export function NSBarAlert(props: NSBarAlertProps)
-{
-	return (
-		<article className={Styles.ns_bar_alert_section}>
-			<NSSection style={props.style} classList={[Styles.ns_bar_alert_container]}>
-				<div className={Styles.ns_bar_alert_title_parent}>
-					<div className={Styles.ns_bar_alert_title}>
-						<img src="https://static.namirasoft.com/image/concept/alarm/blue.svg" alt="Alarm" width={24} height={24} />
-						<h3> {props.title.title} </h3>
-					</div>
-					<p className={Styles.ns_bar_alert_description}>{props.title.description}</p>
-				</div>
-				<div className={Styles.ns_bar_alert_link}>
-					<button onClick={props.onClick}>{props.button_text ?? "Continue"}</button>
-				</div>
-			</NSSection>
-		</article>
-	);
+import { IBaseComponentProps } from '../props/IBaseComponentProps';
+import { NSBarTitleProps } from './NSBarTitle';
+import { NSSection } from './NSSection';
+import Styles from './NSBarAlert.module.css';
+
+export interface NSBarAlertProps extends IBaseComponentProps
+{
+	title: NSBarTitleProps;
+	button_text?: string;
+	isVisible: () => boolean;
+	onClick?: () => void;
+}
+
+export function NSBarAlert(props: NSBarAlertProps)
+{
+	return (
+		<article className={Styles.ns_bar_alert_section}>
+			<NSSection style={props.style} classList={[Styles.ns_bar_alert_container]}>
+				<div className={Styles.ns_bar_alert_title_parent}>
+					<div className={Styles.ns_bar_alert_title}>
+						<img src="https://static.namirasoft.com/image/concept/alarm/blue.svg" alt="Alarm" width={24} height={24} />
+						<h3> {props.title.title} </h3>
+					</div>
+					<p className={Styles.ns_bar_alert_description}>{props.title.description}</p>
+				</div>
+				<div className={Styles.ns_bar_alert_link}>
+					<button onClick={props.onClick}>{props.button_text ?? "Continue"}</button>
+				</div>
+			</NSSection>
+		</article>
+	);
 }

package/src/components/NSBarNotification.module.css

@@ -1,35 +1,35 @@
-.ns_messenger {
-    background-color: #fff;
-    padding: 12px 15px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-}
-
-.ns_gray {
-    border: 3px solid gray;
-    box-shadow: 1px 1px 8px 0px gray;
-}
-
-.ns_blue {
-    border: 3px solid blue;
-    box-shadow: 1px 1px 8px 0px blue;
-}
-
-.ns_green {
-    border: 3px solid rgba(112, 224, 0, 1);
-    box-shadow: 1px 1px 8px 0px rgba(112, 224, 0, 1);
-}
-
-.ns_yellow {
-    border: 3px solid yellow;
-    box-shadow: 1px 1px 8px 0px yellow;
-}
-
-.ns_red {
-    border: 3px solid red;
-    box-shadow: 1px 1px 8px 0px red;
-}
-.ns_exit_icon{
-    cursor: pointer;
+.ns_messenger {
+    background-color: #fff;
+    padding: 12px 15px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.ns_gray {
+    border: 3px solid gray;
+    box-shadow: 1px 1px 8px 0px gray;
+}
+
+.ns_blue {
+    border: 3px solid blue;
+    box-shadow: 1px 1px 8px 0px blue;
+}
+
+.ns_green {
+    border: 3px solid rgba(112, 224, 0, 1);
+    box-shadow: 1px 1px 8px 0px rgba(112, 224, 0, 1);
+}
+
+.ns_yellow {
+    border: 3px solid yellow;
+    box-shadow: 1px 1px 8px 0px yellow;
+}
+
+.ns_red {
+    border: 3px solid red;
+    box-shadow: 1px 1px 8px 0px red;
+}
+.ns_exit_icon{
+    cursor: pointer;
 }

package/src/components/NSBarNotification.tsx

@@ -1,90 +1,90 @@
-import Styles from "./NSBarNotification.module.css";
-import { IBaseComponentProps } from "../props/IBaseComponentProps";
-import { useState } from "react"
-
-export interface NSBarNotificationProps extends IBaseComponentProps
-{
-    text: string;
-    type: NotificationType;
-    color: NSBarNotificationColor;
-    onClose: () => void;
-}
-export interface NSBarNotificationState
-{
-    show: boolean
-}
-export enum NSBarNotificationColor
-{
-    GRAY = "GRAY",
-    BLUE = "BLUE",
-    GREEN = "GREEN",
-    YELLOW = "YELLOW",
-    RED = "RED",
-}
-
-export enum NotificationType
-{
-    Information = "Information",
-    Warning = "Warning",
-    Success = "Success",
-    Error = "Error",
-}
-
-export function NSBarNotification(props: NSBarNotificationProps)
-{
-    const [state, setState] = useState<NSBarNotificationState>({ show: true });
-    let className = Styles["ns_" + props.color.toString().toLowerCase()];
-    let type = props.type;
-    let src = "";
-
-    function onClose()
-    {
-        setState({ show: false });
-        props.onClose();
-    }
-
-    switch (type)
-    {
-        case "Error":
-            src = "https://static.namirasoft.com/image/concept/close/error.svg";
-            break;
-        case "Success":
-            src = "https://static.namirasoft.com/image/concept/close/success.svg";
-            break;
-        case "Warning":
-            src = "https://static.namirasoft.com/image/concept/close/warning.svg";
-            break;
-        case "Information":
-            src = "https://static.namirasoft.com/image/concept/close/info.svg";
-    }
-
-    if (state.show)
-        setTimeout(() =>
-        {
-            onClose();
-        }, 5000);
-
-    return (
-        <>
-            {
-                state.show &&
-                <>
-                    <div id={props.id}
-                        className={`${Styles.ns_messenger} ${className}`}
-                        style={props.style}
-                    >
-                        <p className={`mb-0 ns-font-16-normal`}>{props.text}</p>
-                        <img
-                            className={Styles.ns_exit_icon}
-                            src={src}
-                            alt="exit"
-                            width={32}
-                            height={32}
-                            onClick={onClose}
-                        />
-                    </div>
-                </>
-            }
-        </>
-    )
+import Styles from "./NSBarNotification.module.css";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
+import { useState } from "react"
+
+export interface NSBarNotificationProps extends IBaseComponentProps
+{
+    text: string;
+    type: NotificationType;
+    color: NSBarNotificationColor;
+    onClose: () => void;
+}
+export interface NSBarNotificationState
+{
+    show: boolean
+}
+export enum NSBarNotificationColor
+{
+    GRAY = "GRAY",
+    BLUE = "BLUE",
+    GREEN = "GREEN",
+    YELLOW = "YELLOW",
+    RED = "RED",
+}
+
+export enum NotificationType
+{
+    Information = "Information",
+    Warning = "Warning",
+    Success = "Success",
+    Error = "Error",
+}
+
+export function NSBarNotification(props: NSBarNotificationProps)
+{
+    const [state, setState] = useState<NSBarNotificationState>({ show: true });
+    let className = Styles["ns_" + props.color.toString().toLowerCase()];
+    let type = props.type;
+    let src = "";
+
+    function onClose()
+    {
+        setState({ show: false });
+        props.onClose();
+    }
+
+    switch (type)
+    {
+        case "Error":
+            src = "https://static.namirasoft.com/image/concept/close/error.svg";
+            break;
+        case "Success":
+            src = "https://static.namirasoft.com/image/concept/close/success.svg";
+            break;
+        case "Warning":
+            src = "https://static.namirasoft.com/image/concept/close/warning.svg";
+            break;
+        case "Information":
+            src = "https://static.namirasoft.com/image/concept/close/info.svg";
+    }
+
+    if (state.show)
+        setTimeout(() =>
+        {
+            onClose();
+        }, 5000);
+
+    return (
+        <>
+            {
+                state.show &&
+                <>
+                    <div id={props.id}
+                        className={`${Styles.ns_messenger} ${className}`}
+                        style={props.style}
+                    >
+                        <p className={`mb-0 ns-font-16-normal`}>{props.text}</p>
+                        <img
+                            className={Styles.ns_exit_icon}
+                            src={src}
+                            alt="exit"
+                            width={32}
+                            height={32}
+                            onClick={onClose}
+                        />
+                    </div>
+                </>
+            }
+        </>
+    )
 }

package/src/components/NSBarTitle.module.css

@@ -1,10 +1,10 @@
-.title {
-	text-align: center;
-	color: rgba(20, 27, 92, 1);
-}
-
-.description {
-	text-align: center;
-	color: rgba(20, 27, 92, 1);
-	margin: 0px;
+.title {
+	text-align: center;
+	color: rgba(20, 27, 92, 1);
+}
+
+.description {
+	text-align: center;
+	color: rgba(20, 27, 92, 1);
+	margin: 0px;
 }

package/src/components/NSBarTitle.tsx

@@ -1,30 +1,30 @@
-import { Fragment } from 'react/jsx-runtime';
-import Styles from './NSBarTitle.module.css';
-
-export interface NSBarTitleProps 
-{
-	title: string;
-	description?: string;
-}
-
-export function NSBarTitle(props: NSBarTitleProps)
-{
-	let lines = (props.description ?? "").split(/(\n|\\n|<br>|<br\s*\/>)/gm);
-	return (
-		<div className="container">
-			<h1 className={Styles.title}>{props.title}</h1>
-			{
-				props.description && lines &&
-				<p className={Styles.description}>{
-					lines.map((line, index) =>
-					{
-						return <Fragment key={`NSBarTitle_fragment_key_${index}`}>
-							{line.trim()}
-							{index !== lines.length - 1 && <br />}
-						</Fragment>;
-					})
-				}</p>
-			}
-		</div>
-	);
+import { Fragment } from 'react/jsx-runtime';
+import Styles from './NSBarTitle.module.css';
+
+export interface NSBarTitleProps 
+{
+	title: string;
+	description?: string;
+}
+
+export function NSBarTitle(props: NSBarTitleProps)
+{
+	let lines = (props.description ?? "").split(/(\n|\\n|<br>|<br\s*\/>)/gm);
+	return (
+		<div className="container">
+			<h1 className={Styles.title}>{props.title}</h1>
+			{
+				props.description && lines &&
+				<p className={Styles.description}>{
+					lines.map((line, index) =>
+					{
+						return <Fragment key={`NSBarTitle_fragment_key_${index}`}>
+							{line.trim()}
+							{index !== lines.length - 1 && <br />}
+						</Fragment>;
+					})
+				}</p>
+			}
+		</div>
+	);
 }

package/src/components/NSBox.module.css

@@ -1,51 +1,51 @@
-.ns_box_input_parent {
-	display: flex;
-	flex-direction: column;
-	color: #141B5C;
-	justify-content: center;
-	width: 100%;
-	max-width: 100%;
-}
-
-.ns_box_input_bar {
-	display: flex;
-	justify-content: space-between !important;
-	align-items: center !important;
-	height: 28px;
-}
-
-.ns_box_input_title {
-	font-size: 16px;
-	font-weight: 400;
-	display: flex;
-	align-items: center;
-	flex-direction: row;
-	gap: 4px;
-}
-
-.ns_box_input {
-	padding: 8px 32px 8px 12px;
-	font-size: 16px;
-	font-weight: 400;
-	border: 1px solid rgba(0, 0, 0, 1) !important;
-	border-radius: 8px;
-	height: 48px !important;
-	width: 100% !important;
-	max-width: inherit;
-	background-size: 24px 24px;
-}
-
-.ns_box_input:focus-visible {
-	border-color: rgba(0, 0, 0, 1) !important;
-	outline: solid 1px #4096ff !important;
-}
-
-@media only screen and (min-width: 480px) {
-	.ns_box_input {
-		max-width: inherit;
-	}
-
-	.ns_box_input_parent {
-		width: 272px;
-	}
+.ns_box_input_parent {
+	display: flex;
+	flex-direction: column;
+	color: #141B5C;
+	justify-content: center;
+	width: 100%;
+	max-width: 100%;
+}
+
+.ns_box_input_bar {
+	display: flex;
+	justify-content: space-between !important;
+	align-items: center !important;
+	height: 28px;
+}
+
+.ns_box_input_title {
+	font-size: 16px;
+	font-weight: 400;
+	display: flex;
+	align-items: center;
+	flex-direction: row;
+	gap: 4px;
+}
+
+.ns_box_input {
+	padding: 8px 32px 8px 12px;
+	font-size: 16px;
+	font-weight: 400;
+	border: 1px solid rgba(0, 0, 0, 1) !important;
+	border-radius: 8px;
+	height: 48px !important;
+	width: 100% !important;
+	max-width: inherit;
+	background-size: 24px 24px;
+}
+
+.ns_box_input:focus-visible {
+	border-color: rgba(0, 0, 0, 1) !important;
+	outline: solid 1px #4096ff !important;
+}
+
+@media only screen and (min-width: 480px) {
+	.ns_box_input {
+		max-width: inherit;
+	}
+
+	.ns_box_input_parent {
+		width: 272px;
+	}
 }