fix scss and remove un nesasery code
This commit is contained in:
karimaldeen
parent
f949c5eeb8
commit
c21796cfc1
|
|
@ -9,11 +9,8 @@
|
|||
"bootstrap": "^5.3.3",
|
||||
"dayjs": "^1.11.11",
|
||||
"formik": "^2.4.6",
|
||||
"html-to-image": "^1.11.11",
|
||||
"i18next": "^23.11.5",
|
||||
"lottie-react": "^2.4.0",
|
||||
"path-to-regexp": "^6.2.2",
|
||||
"pdf-lib": "^1.17.1",
|
||||
"react": "^18.3.1",
|
||||
"react-beautiful-dnd": "^13.1.1",
|
||||
"react-dom": "^18.3.1",
|
||||
|
|
@ -24,8 +21,6 @@
|
|||
"react-toastify": "^9.1.3",
|
||||
"reactstrap": "^9.2.2",
|
||||
"sass": "^1.77.4",
|
||||
"ts-node": "^10.9.2",
|
||||
"vite-plugin-env-compatible": "^2.0.1",
|
||||
"yup": "^1.4.0",
|
||||
"zustand": "^4.5.2"
|
||||
},
|
||||
|
|
|
|||
109
pnpm-lock.yaml
109
pnpm-lock.yaml
|
|
@ -26,21 +26,12 @@ importers:
|
|||
formik:
|
||||
specifier: ^2.4.6
|
||||
version: 2.4.6(react@18.3.1)
|
||||
html-to-image:
|
||||
specifier: ^1.11.11
|
||||
version: 1.11.11
|
||||
i18next:
|
||||
specifier: ^23.11.5
|
||||
version: 23.11.5
|
||||
lottie-react:
|
||||
specifier: ^2.4.0
|
||||
version: 2.4.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
|
||||
path-to-regexp:
|
||||
specifier: ^6.2.2
|
||||
version: 6.2.2
|
||||
pdf-lib:
|
||||
specifier: ^1.17.1
|
||||
version: 1.17.1
|
||||
react:
|
||||
specifier: ^18.3.1
|
||||
version: 18.3.1
|
||||
|
|
@ -71,12 +62,6 @@ importers:
|
|||
sass:
|
||||
specifier: ^1.77.4
|
||||
version: 1.77.4
|
||||
ts-node:
|
||||
specifier: ^10.9.2
|
||||
version: 10.9.2(@types/node@20.14.0)(typescript@4.9.5)
|
||||
vite-plugin-env-compatible:
|
||||
specifier: ^2.0.1
|
||||
version: 2.0.1
|
||||
yup:
|
||||
specifier: ^1.4.0
|
||||
version: 1.4.0
|
||||
|
|
@ -1122,12 +1107,6 @@ packages:
|
|||
'@jridgewell/trace-mapping@0.3.9':
|
||||
resolution: {integrity: sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==}
|
||||
|
||||
'@pdf-lib/standard-fonts@1.0.0':
|
||||
resolution: {integrity: sha512-hU30BK9IUN/su0Mn9VdlVKsWBS6GyhVfqjwl1FjZN4TxP6cCw0jP2w7V3Hf5uX7M0AZJ16vey9yE0ny7Sa59ZA==}
|
||||
|
||||
'@pdf-lib/upng@1.0.1':
|
||||
resolution: {integrity: sha512-dQK2FUMQtowVP00mtIksrlZhdFXQZPC+taih1q4CvPZ5vqdxR/LKBaFg0oAfzd1GlHZXXSPdQfzQnt+ViGvEIQ==}
|
||||
|
||||
'@popperjs/core@2.11.8':
|
||||
resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}
|
||||
|
||||
|
|
@ -1883,13 +1862,6 @@ packages:
|
|||
dom-helpers@5.2.1:
|
||||
resolution: {integrity: sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==}
|
||||
|
||||
dotenv-expand@5.1.0:
|
||||
resolution: {integrity: sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA==}
|
||||
|
||||
dotenv@8.2.0:
|
||||
resolution: {integrity: sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw==}
|
||||
engines: {node: '>=8'}
|
||||
|
||||
electron-to-chromium@1.4.788:
|
||||
resolution: {integrity: sha512-ubp5+Ev/VV8KuRoWnfP2QF2Bg+O2ZFdb49DiiNbz2VmgkIqrnyYaqIOqj8A6K/3p1xV0QcU5hBQ1+BmB6ot1OA==}
|
||||
|
||||
|
|
@ -2139,9 +2111,6 @@ packages:
|
|||
html-parse-stringify@3.0.1:
|
||||
resolution: {integrity: sha512-KknJ50kTInJ7qIScF3jeaFRpMpE8/lfiTdzf/twXyPBLAGrLRTmkz3AdTnKeh40X8k9L2fdYwEp/42WGXIRGcg==}
|
||||
|
||||
html-to-image@1.11.11:
|
||||
resolution: {integrity: sha512-9gux8QhvjRO/erSnDPv28noDZcPZmYE7e1vFsBLKLlRlKDSqNJYebj6Qz1TGd5lsRV+X+xYyjCKjuZdABinWjA==}
|
||||
|
||||
http-proxy-agent@7.0.2:
|
||||
resolution: {integrity: sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==}
|
||||
engines: {node: '>= 14'}
|
||||
|
|
@ -2720,9 +2689,6 @@ packages:
|
|||
resolution: {integrity: sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==}
|
||||
engines: {node: '>=6'}
|
||||
|
||||
pako@1.0.11:
|
||||
resolution: {integrity: sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==}
|
||||
|
||||
parent-module@1.0.1:
|
||||
resolution: {integrity: sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==}
|
||||
engines: {node: '>=6'}
|
||||
|
|
@ -2749,16 +2715,10 @@ packages:
|
|||
path-parse@1.0.7:
|
||||
resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
|
||||
|
||||
path-to-regexp@6.2.2:
|
||||
resolution: {integrity: sha512-GQX3SSMokngb36+whdpRXE+3f9V8UzyAorlYvOGx87ufGHehNTn5lCxrKtLyZ4Yl/wEKnNnr98ZzOwwDZV5ogw==}
|
||||
|
||||
path-type@4.0.0:
|
||||
resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==}
|
||||
engines: {node: '>=8'}
|
||||
|
||||
pdf-lib@1.17.1:
|
||||
resolution: {integrity: sha512-V/mpyJAoTsN4cnP31vc0wfNA1+p20evqqnap0KLoRUN0Yk/p3wN52DOEsL4oBFcLdb76hlpKPtzJIgo67j/XLw==}
|
||||
|
||||
picocolors@1.0.1:
|
||||
resolution: {integrity: sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==}
|
||||
|
||||
|
|
@ -3541,9 +3501,6 @@ packages:
|
|||
'@swc/wasm':
|
||||
optional: true
|
||||
|
||||
tslib@1.14.1:
|
||||
resolution: {integrity: sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==}
|
||||
|
||||
tslib@2.6.2:
|
||||
resolution: {integrity: sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==}
|
||||
|
||||
|
|
@ -3634,9 +3591,6 @@ packages:
|
|||
peerDependencies:
|
||||
vite: '>=2.0.0'
|
||||
|
||||
vite-plugin-env-compatible@2.0.1:
|
||||
resolution: {integrity: sha512-DRrOZTg/W44ojVQQfGSMPEgYQGzp5TeIpt9cpaK35hTOC/b2D7Ffl8/RIgK8vQ0mlnDIUgETcA173bnMEkyzdw==}
|
||||
|
||||
vite@5.2.12:
|
||||
resolution: {integrity: sha512-/gC8GxzxMK5ntBwb48pR32GGhENnjtY30G4A0jemunsBkiEZFw60s8InGpN8gkhHEkjnRK1aSAxeQgwvFhUHAA==}
|
||||
engines: {node: ^18.0.0 || >=20.0.0}
|
||||
|
|
@ -4765,6 +4719,7 @@ snapshots:
|
|||
'@cspotcode/source-map-support@0.8.1':
|
||||
dependencies:
|
||||
'@jridgewell/trace-mapping': 0.3.9
|
||||
optional: true
|
||||
|
||||
'@ctrl/tinycolor@3.6.1': {}
|
||||
|
||||
|
|
@ -5043,14 +4998,7 @@ snapshots:
|
|||
dependencies:
|
||||
'@jridgewell/resolve-uri': 3.1.2
|
||||
'@jridgewell/sourcemap-codec': 1.4.15
|
||||
|
||||
'@pdf-lib/standard-fonts@1.0.0':
|
||||
dependencies:
|
||||
pako: 1.0.11
|
||||
|
||||
'@pdf-lib/upng@1.0.1':
|
||||
dependencies:
|
||||
pako: 1.0.11
|
||||
optional: true
|
||||
|
||||
'@popperjs/core@2.11.8': {}
|
||||
|
||||
|
|
@ -5222,13 +5170,17 @@ snapshots:
|
|||
'@babel/runtime': 7.24.6
|
||||
'@testing-library/dom': 9.3.3
|
||||
|
||||
'@tsconfig/node10@1.0.11': {}
|
||||
'@tsconfig/node10@1.0.11':
|
||||
optional: true
|
||||
|
||||
'@tsconfig/node12@1.0.11': {}
|
||||
'@tsconfig/node12@1.0.11':
|
||||
optional: true
|
||||
|
||||
'@tsconfig/node14@1.0.3': {}
|
||||
'@tsconfig/node14@1.0.3':
|
||||
optional: true
|
||||
|
||||
'@tsconfig/node16@1.0.4': {}
|
||||
'@tsconfig/node16@1.0.4':
|
||||
optional: true
|
||||
|
||||
'@types/aria-query@5.0.4': {}
|
||||
|
||||
|
|
@ -5460,6 +5412,7 @@ snapshots:
|
|||
acorn-walk@8.3.3:
|
||||
dependencies:
|
||||
acorn: 8.12.1
|
||||
optional: true
|
||||
|
||||
acorn@8.12.1: {}
|
||||
|
||||
|
|
@ -5558,7 +5511,8 @@ snapshots:
|
|||
normalize-path: 3.0.0
|
||||
picomatch: 2.3.1
|
||||
|
||||
arg@4.1.3: {}
|
||||
arg@4.1.3:
|
||||
optional: true
|
||||
|
||||
argparse@1.0.10:
|
||||
dependencies:
|
||||
|
|
@ -5867,7 +5821,8 @@ snapshots:
|
|||
- supports-color
|
||||
- ts-node
|
||||
|
||||
create-require@1.1.1: {}
|
||||
create-require@1.1.1:
|
||||
optional: true
|
||||
|
||||
cross-spawn@7.0.3:
|
||||
dependencies:
|
||||
|
|
@ -5954,7 +5909,8 @@ snapshots:
|
|||
|
||||
diff-sequences@29.6.3: {}
|
||||
|
||||
diff@4.0.2: {}
|
||||
diff@4.0.2:
|
||||
optional: true
|
||||
|
||||
dom-accessibility-api@0.5.16: {}
|
||||
|
||||
|
|
@ -5963,10 +5919,6 @@ snapshots:
|
|||
'@babel/runtime': 7.24.6
|
||||
csstype: 3.1.3
|
||||
|
||||
dotenv-expand@5.1.0: {}
|
||||
|
||||
dotenv@8.2.0: {}
|
||||
|
||||
electron-to-chromium@1.4.788: {}
|
||||
|
||||
electron-to-chromium@1.5.5: {}
|
||||
|
|
@ -6216,8 +6168,6 @@ snapshots:
|
|||
dependencies:
|
||||
void-elements: 3.1.0
|
||||
|
||||
html-to-image@1.11.11: {}
|
||||
|
||||
http-proxy-agent@7.0.2:
|
||||
dependencies:
|
||||
agent-base: 7.1.1
|
||||
|
|
@ -6955,8 +6905,6 @@ snapshots:
|
|||
|
||||
p-try@2.2.0: {}
|
||||
|
||||
pako@1.0.11: {}
|
||||
|
||||
parent-module@1.0.1:
|
||||
dependencies:
|
||||
callsites: 3.1.0
|
||||
|
|
@ -6981,18 +6929,9 @@ snapshots:
|
|||
|
||||
path-parse@1.0.7: {}
|
||||
|
||||
path-to-regexp@6.2.2: {}
|
||||
|
||||
path-type@4.0.0:
|
||||
optional: true
|
||||
|
||||
pdf-lib@1.17.1:
|
||||
dependencies:
|
||||
'@pdf-lib/standard-fonts': 1.0.0
|
||||
'@pdf-lib/upng': 1.0.1
|
||||
pako: 1.0.11
|
||||
tslib: 1.14.1
|
||||
|
||||
picocolors@1.0.1: {}
|
||||
|
||||
picomatch@2.3.1: {}
|
||||
|
|
@ -7857,8 +7796,7 @@ snapshots:
|
|||
typescript: 4.9.5
|
||||
v8-compile-cache-lib: 3.0.1
|
||||
yn: 3.1.1
|
||||
|
||||
tslib@1.14.1: {}
|
||||
optional: true
|
||||
|
||||
tslib@2.6.2: {}
|
||||
|
||||
|
|
@ -7921,7 +7859,8 @@ snapshots:
|
|||
dependencies:
|
||||
react: 18.3.1
|
||||
|
||||
v8-compile-cache-lib@3.0.1: {}
|
||||
v8-compile-cache-lib@3.0.1:
|
||||
optional: true
|
||||
|
||||
v8-to-istanbul@9.2.0:
|
||||
dependencies:
|
||||
|
|
@ -7938,11 +7877,6 @@ snapshots:
|
|||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
|
||||
vite-plugin-env-compatible@2.0.1:
|
||||
dependencies:
|
||||
dotenv: 8.2.0
|
||||
dotenv-expand: 5.1.0
|
||||
|
||||
vite@5.2.12(@types/node@20.14.0)(sass@1.77.4)(terser@5.31.4):
|
||||
dependencies:
|
||||
esbuild: 0.20.2
|
||||
|
|
@ -8111,7 +8045,8 @@ snapshots:
|
|||
y18n: 5.0.8
|
||||
yargs-parser: 21.1.1
|
||||
|
||||
yn@3.1.1: {}
|
||||
yn@3.1.1:
|
||||
optional: true
|
||||
|
||||
yocto-queue@0.1.0: {}
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 698 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 66 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.4 KiB |
|
|
@ -1,19 +0,0 @@
|
|||
import React from "react";
|
||||
import Image from "../Ui/Image";
|
||||
|
||||
const AddedSuccessfully = () => {
|
||||
return (
|
||||
<div className="AddedSuccessfully">
|
||||
<Image src="/DataState/successfully.png" />
|
||||
<h1>تمّت إضافة الطالب بنجاح!</h1>
|
||||
<p>تمّت إضافة الطالب،هل تريد إضافة طالب آخر ؟</p>
|
||||
|
||||
<div className="TowButton">
|
||||
<button>إضافة طالب جديد</button>
|
||||
<button>تخطّي</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default AddedSuccessfully;
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import React from "react";
|
||||
import Image from "../Ui/Image";
|
||||
|
||||
const EmptyData = ({
|
||||
header,
|
||||
info,
|
||||
loading,
|
||||
}: {
|
||||
info: string;
|
||||
header: string;
|
||||
loading: boolean;
|
||||
}) => {
|
||||
if (loading) {
|
||||
return <></>;
|
||||
}
|
||||
return (
|
||||
<div className="EmptyData">
|
||||
<Image src="/DataState/EmptyData.gif" />
|
||||
<h1>{header}</h1>
|
||||
<p>{info}</p>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default EmptyData;
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import React from "react";
|
||||
import Image from "../Ui/Image";
|
||||
|
||||
const Loading = () => {
|
||||
return (
|
||||
<div className="Loading">
|
||||
<Image src="/DataState/loading.gif" />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Loading;
|
||||
|
|
@ -17,20 +17,24 @@ const CheckboxField = ({
|
|||
};
|
||||
|
||||
return (
|
||||
<div className={Group ? "d-inline mt-3 Checkboxs" : ``}>
|
||||
<div className={ `ValidationField ValidationFieldCheckbox`}>
|
||||
<Form.Item
|
||||
hasFeedback
|
||||
validateStatus={isError ? "error" : ""}
|
||||
help={isError ? errorMsg : ""}
|
||||
>
|
||||
<div>
|
||||
{t(`input.${label ? label : name}`)}
|
||||
</div>
|
||||
<Checkbox
|
||||
onChange={onChange || CheckboxhandleChange}
|
||||
disabled={isDisabled}
|
||||
checked={formik.values?.[name] ?? false}
|
||||
className={className}
|
||||
>
|
||||
{t(`input.${label ? label : name}`)}
|
||||
|
||||
</Checkbox>
|
||||
|
||||
</Form.Item>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ const TextAreaField = ({
|
|||
};
|
||||
|
||||
return (
|
||||
<div className="ValidationField w-100">
|
||||
<div className="ValidationField w-100 ValidationFieldTextArea">
|
||||
<label htmlFor={name} className="text">
|
||||
{t(`input.${label ? label : name}`)}
|
||||
</label>
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ const TextField = ({
|
|||
formik.setFieldValue(name, e.target.value);
|
||||
};
|
||||
return (
|
||||
<div className={`ValidationField w-100 ${className ?? ""} `}>
|
||||
<div className={`ValidationField w-100 ${className ?? ""} ValidationFieldTextArea`}>
|
||||
{no_label ? (
|
||||
<label htmlFor={name} className="text">
|
||||
<span>empty</span>
|
||||
|
|
@ -57,7 +57,7 @@ const TextField = ({
|
|||
showCount
|
||||
maxLength={1000}
|
||||
onChange={onChange || TextFilehandleChange}
|
||||
style={{ height: 120 }}
|
||||
|
||||
/>
|
||||
</Form.Item>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,12 @@
|
|||
justify-content: space-between;
|
||||
}
|
||||
.ValidationField {
|
||||
margin-bottom: 1.3vw;
|
||||
margin-bottom: 10px;
|
||||
position: relative;
|
||||
min-height: 80px;
|
||||
> * {
|
||||
width: 100%;
|
||||
width: 100% !important;
|
||||
min-width: 200px;
|
||||
}
|
||||
.text,
|
||||
.ant-form-item {
|
||||
|
|
@ -16,213 +18,55 @@
|
|||
color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-select-outlined:not(.ant-select-customize-input) .ant-select-selector {
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.Select_error {
|
||||
.ant-select-selector {
|
||||
border: 1px solid red !important;
|
||||
}
|
||||
}
|
||||
|
||||
// .ValidationField{
|
||||
// .ant-select-selector{
|
||||
// border: 1px solid var(--border-color) ;
|
||||
|
||||
// }
|
||||
// }
|
||||
> span {
|
||||
margin-bottom: 0px !important;
|
||||
&:focus-within {
|
||||
border-color: var(--primary);
|
||||
box-shadow: 0 0 0 1px var(--primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
&:has(.is-invalid) {
|
||||
border-color: red !important ;
|
||||
}
|
||||
input {
|
||||
color: var(--text);
|
||||
background: var(--bg);
|
||||
}
|
||||
|
||||
input:-webkit-autofill,
|
||||
input:-webkit-autofill:hover,
|
||||
input:-webkit-autofill:focus,
|
||||
input:-webkit-autofill:active {
|
||||
-webkit-box-shadow: 0 0 0 30px white inset !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//// upload
|
||||
.ant-upload-select {
|
||||
width: 100%;
|
||||
}
|
||||
.Checkboxs {
|
||||
padding: 4%;
|
||||
}
|
||||
.ant-checkbox-wrapper {
|
||||
min-width: 100px;
|
||||
}
|
||||
.SearchField {
|
||||
button {
|
||||
background: var(--primary);
|
||||
}
|
||||
}
|
||||
.text {
|
||||
color: var(--text);
|
||||
margin-bottom: 15px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
input:disabled {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.isError {
|
||||
outline: red 1px solid;
|
||||
color: red;
|
||||
}
|
||||
.Error_color {
|
||||
color: red;
|
||||
}
|
||||
input:-webkit-autofill {
|
||||
-webkit-box-shadow: 0 0 0 1000px white inset !important; /* Change the color to your desired background color */
|
||||
}
|
||||
input:-webkit-autofill:focus {
|
||||
-webkit-box-shadow: 0 0 0 1000px white inset !important; /* Change the color to your desired background color */
|
||||
}
|
||||
|
||||
/* Remove autofill background color on hover */
|
||||
input:-webkit-autofill:hover {
|
||||
-webkit-box-shadow: 0 0 0 1000px white inset !important; /* Change the color to your desired background color */
|
||||
}
|
||||
.upload_image_button {
|
||||
.ant-btn {
|
||||
min-height: 3vw !important;
|
||||
border: 0.1vw solid var(--border-color);
|
||||
|
||||
.ant-btn-default{
|
||||
padding: 7px 11px;
|
||||
height: var(--fieldHeight);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.ant-select-outlined:not(.ant-select-customize-input) .ant-select-selector {
|
||||
min-height: 3vw !important;
|
||||
}
|
||||
.ant-select-multiple.ant-select-lg .ant-select-selection-overflow {
|
||||
min-height: 3vw !important;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.ant-upload-list .ant-upload-list-item {
|
||||
// height:3vw !important;
|
||||
border: 1px solid var(--border-color) !important;
|
||||
}
|
||||
|
||||
.TowValidationItems {
|
||||
display: flex;
|
||||
gap: 3%;
|
||||
> label {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-select .ant-select-arrow {
|
||||
inset-inline-end: 1vw;
|
||||
}
|
||||
.ant-input-affix-wrapper-lg {
|
||||
padding: 0.5vw 1vw;
|
||||
font-size: 1vw;
|
||||
min-height: 3vw;
|
||||
border-radius: 0.6vw;
|
||||
border: 1.5px solid var(--opacity);
|
||||
}
|
||||
|
||||
.ant-picker-outlined {
|
||||
padding: 0.5vw 1vw;
|
||||
font-size: 1vw;
|
||||
min-height: 3vw;
|
||||
border-radius: 0.6vw;
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.ant-select-single.ant-select-lg .ant-select-selector {
|
||||
min-height: 3vw;
|
||||
border-radius: 0.6vw;
|
||||
}
|
||||
.ant-select-single .ant-select-selector .ant-select-selection-search-input {
|
||||
min-height: 3vw;
|
||||
}
|
||||
|
||||
.ant-select-outlined .ant-select-selector {
|
||||
min-height: 3vw !important;
|
||||
border-radius: 0.6vw !important;
|
||||
}
|
||||
.ant-select-single.ant-select-lg {
|
||||
min-height: 3vw;
|
||||
}
|
||||
|
||||
.ant-upload-wrapper .ant-upload-list .ant-upload-list-item {
|
||||
width: 21.5vw;
|
||||
}
|
||||
|
||||
.ant-input-number-outlined {
|
||||
//// number input
|
||||
///
|
||||
.ant-input-number-affix-wrapper-lg{
|
||||
width: 100%;
|
||||
height: 3vw;
|
||||
}
|
||||
.ant-input-number-lg input.ant-input-number-input {
|
||||
width: 100%;
|
||||
height: 3vw;
|
||||
.ValidationFieldCheckbox{
|
||||
// background-color: red;
|
||||
}
|
||||
|
||||
.bigRow {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
> *.w-100 {
|
||||
width: 48% !important;
|
||||
/// input hight
|
||||
.ant-form-item-control-input-content{
|
||||
height: var(--fieldHeight);
|
||||
}
|
||||
|
||||
|
||||
//// date picker
|
||||
.ant-picker-large{
|
||||
height: var(--fieldHeight);
|
||||
}
|
||||
|
||||
|
||||
/// text area
|
||||
///
|
||||
|
||||
.ValidationFieldTextArea{
|
||||
.ant-form-item-control-input-content{
|
||||
min-height: 120px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.ant-input-number-affix-wrapper-lg {
|
||||
width: 100%;
|
||||
height: 3vw;
|
||||
border-radius: 0.6vw;
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
.ant-input-textarea-affix-wrapper.ant-input-affix-wrapper {
|
||||
|
||||
.TwoSelectGroup {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.TwoSelectGroupbutton {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.ant-checkbox-wrapper {
|
||||
margin-top: 25px !important;
|
||||
}
|
||||
|
||||
.add_new_button {
|
||||
margin-bottom: 20px;
|
||||
svg {
|
||||
color: var(--primary);
|
||||
}
|
||||
}
|
||||
.ValidationField:has(.input_number) {
|
||||
max-width: 100px;
|
||||
|
||||
.input_number {
|
||||
max-width: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
gap: 30px;
|
||||
max-width: 80% !important;
|
||||
height: 120px;
|
||||
}
|
||||
|
|
@ -1,6 +1,5 @@
|
|||
import { Formik, Form, useFormikContext } from "formik";
|
||||
import React, { ReactNode, useEffect } from "react";
|
||||
import { useValidationState } from "../../Components/ValidationField/utils/ValidationState";
|
||||
import { useModalState } from "../../zustand/Modal";
|
||||
|
||||
interface FormValues {
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ const LayoutModel = ({
|
|||
modelTitle,
|
||||
ModelEnum,
|
||||
ModelClassName,
|
||||
width = "45vw",
|
||||
width = "800px",
|
||||
isLoading = false,
|
||||
}: LayoutModalProps) => {
|
||||
const { isOpen, setIsOpen } = useModalState((state) => state);
|
||||
|
|
|
|||
|
|
@ -1,15 +1,13 @@
|
|||
import React from "react";
|
||||
import React, { lazy, Suspense } from "react";
|
||||
import {
|
||||
useAddKeyToData,
|
||||
Table,
|
||||
useTranslation,
|
||||
usePagination,
|
||||
Loading,
|
||||
EmptyData,
|
||||
} from ".";
|
||||
import { DataTableProps } from "../../../types/Table";
|
||||
import NotFoundLottie from "../../../Components/Lottie/NotFound/NotFoundLottie";
|
||||
import LoadingLottie from "../../../Components/Lottie/Loading/LoadingLottie";
|
||||
const NotFoundLottie = React.lazy(() => import("../../../Components/Lottie/NotFound/NotFoundLottie"));
|
||||
const LoadingLottie = React.lazy(() => import("../../../Components/Lottie/Loading/LoadingLottie"));
|
||||
|
||||
const DataTable: React.FC<DataTableProps> = ({
|
||||
response,
|
||||
|
|
@ -36,7 +34,9 @@ const DataTable: React.FC<DataTableProps> = ({
|
|||
className="DataTable"
|
||||
loading={{
|
||||
spinning: isLoading || isRefetching,
|
||||
indicator: <LoadingLottie />,
|
||||
indicator:<Suspense fallback={<></>}>
|
||||
<LoadingLottie />
|
||||
</Suspense> ,
|
||||
size: "large",
|
||||
}}
|
||||
locale={{
|
||||
|
|
@ -44,9 +44,12 @@ const DataTable: React.FC<DataTableProps> = ({
|
|||
isLoading || isRefetching ?
|
||||
<></>
|
||||
:
|
||||
|
||||
<Suspense fallback={<></>}>
|
||||
<NotFoundLottie
|
||||
|
||||
/>
|
||||
</Suspense>
|
||||
),
|
||||
}}
|
||||
pagination={{
|
||||
|
|
|
|||
|
|
@ -1,15 +1,11 @@
|
|||
import { Table } from "antd";
|
||||
import { useAddKeyToData } from "../../../Hooks/useAddKeyToData";
|
||||
import Loading from "../../../Components/DataState/Loading";
|
||||
import EmptyData from "../../../Components/DataState/EmptyData";
|
||||
import usePagination from "../usePagination";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
export {
|
||||
Table,
|
||||
useAddKeyToData,
|
||||
Loading,
|
||||
EmptyData,
|
||||
usePagination,
|
||||
useTranslation,
|
||||
};
|
||||
|
|
|
|||
|
|
@ -5,8 +5,10 @@ const Form = () => {
|
|||
return (
|
||||
<Row className="w-100">
|
||||
<Col>
|
||||
<ValidationField placeholder="name" label="name" name="name" />
|
||||
<ValidationField placeholder="name" label="name" name="name" type="Number" />
|
||||
|
||||
</Col>
|
||||
|
||||
</Row>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,9 +1,7 @@
|
|||
import React from "react";
|
||||
import Image from "../../Components/Ui/Image";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { ABILITIES_ENUM } from "../../enums/abilities";
|
||||
import useSetPageTitle from "../../Hooks/useSetPageTitle";
|
||||
import NotFoundLottie from "../../Components/Lottie/NotFound/NotFoundLottie";
|
||||
|
||||
const Dummy = () => {
|
||||
const [t] = useTranslation();
|
||||
|
|
@ -11,7 +9,7 @@ const Dummy = () => {
|
|||
|
||||
return (
|
||||
<div className="DummyHomePage">
|
||||
<NotFoundLottie/>
|
||||
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,133 +1,133 @@
|
|||
/* Ant picker outlined */
|
||||
.AuthForm .AuthSelect .ant-picker-outlined {
|
||||
border-radius: 1vw;
|
||||
}
|
||||
|
||||
/* Username */
|
||||
#username {
|
||||
border-radius: 1vw;
|
||||
}
|
||||
|
||||
/* Ant input affix wrapper */
|
||||
.AuthForm .AuthInput .ant-input-affix-wrapper {
|
||||
border-radius: 1vw;
|
||||
}
|
||||
|
||||
.remamberMe {
|
||||
display: flex;
|
||||
gap: 1vw;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
h6 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.SwitchRemamberMe {
|
||||
color: var(--white);
|
||||
background: #3182ce;
|
||||
}
|
||||
}
|
||||
|
||||
///// select
|
||||
.ant-select-outlined:not(.ant-select-customize-input) .ant-select-selector {
|
||||
border: none;
|
||||
}
|
||||
.ant-select-single.ant-select-show-arrow .ant-select-selection-item,
|
||||
.ant-select-single.ant-select-show-arrow .ant-select-selection-placeholder {
|
||||
padding-inline-end: 4vw;
|
||||
}
|
||||
.ant-select-single.ant-select-lg:not(.ant-select-customize-input)
|
||||
.ant-select-selector {
|
||||
// height: 3vw;
|
||||
}
|
||||
|
||||
////////////// file
|
||||
|
||||
.ValidationField
|
||||
.ant-upload-wrapper.ant-upload-picture-card-wrapper
|
||||
.ant-upload.ant-upload-select,
|
||||
.ant-upload-wrapper.ant-upload-picture-circle-wrapper
|
||||
.ant-upload.ant-upload-select {
|
||||
background: transparent;
|
||||
border: 0.3vw dashed var(--field);
|
||||
}
|
||||
|
||||
.uploader_error {
|
||||
.ant-upload.ant-upload-select {
|
||||
border: 0.3vw dashed red !important;
|
||||
}
|
||||
}
|
||||
.ValidationField.have_value
|
||||
.ant-upload-wrapper.ant-upload-picture-card-wrapper
|
||||
.ant-upload.ant-upload-select,
|
||||
.ant-upload-wrapper.ant-upload-picture-circle-wrapper
|
||||
.ant-upload.ant-upload-select {
|
||||
background: transparent;
|
||||
border: 0.3vw dashed transparent;
|
||||
}
|
||||
|
||||
.CustomFile {
|
||||
color: var(--subtext);
|
||||
font-size: 0.7vw !important;
|
||||
width: 80%;
|
||||
margin-inline: auto;
|
||||
}
|
||||
|
||||
.ImageCol {
|
||||
max-width: 50%;
|
||||
flex: 0;
|
||||
}
|
||||
.ant-upload-wrapper.ant-upload-picture-card-wrapper
|
||||
.ant-upload.ant-upload-select,
|
||||
.ant-upload-wrapper.ant-upload-picture-circle-wrapper
|
||||
.ant-upload.ant-upload-select {
|
||||
width: 11vw;
|
||||
height: 11vw;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.uploadIcon {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 3vw;
|
||||
height: 3vw;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: #f4f4f4;
|
||||
border: 1px solid black;
|
||||
svg {
|
||||
color: black;
|
||||
font-size: 1.5vw;
|
||||
}
|
||||
}
|
||||
|
||||
////////// INput
|
||||
|
||||
label {
|
||||
color: var(--label);
|
||||
}
|
||||
|
||||
// .ant-select-dropdown{
|
||||
// border: 1px solid var(--primary);
|
||||
// border-top: none;
|
||||
// z-index: 2;
|
||||
// transform: translateY(-10px);
|
||||
// background: var(--bg2);
|
||||
// /* Ant picker outlined */
|
||||
// .AuthForm .AuthSelect .ant-picker-outlined {
|
||||
// border-radius: 1vw;
|
||||
// }
|
||||
|
||||
.Auth_Select {
|
||||
height: 3vw !important;
|
||||
// /* Username */
|
||||
// #username {
|
||||
// border-radius: 1vw;
|
||||
// }
|
||||
|
||||
.ant-select-selector {
|
||||
border: 1px solid #d9d9d9 !important;
|
||||
height: 3vw !important;
|
||||
font-size: 1vw;
|
||||
border-radius: 1vw;
|
||||
}
|
||||
.ant-select-selection-item {
|
||||
height: 28px;
|
||||
}
|
||||
}
|
||||
// /* Ant input affix wrapper */
|
||||
// .AuthForm .AuthInput .ant-input-affix-wrapper {
|
||||
// border-radius: 1vw;
|
||||
// }
|
||||
|
||||
// .remamberMe {
|
||||
// display: flex;
|
||||
// gap: 1vw;
|
||||
// align-items: center;
|
||||
// justify-content: flex-start;
|
||||
// width: 100%;
|
||||
// h6 {
|
||||
// margin-bottom: 0;
|
||||
// }
|
||||
// .SwitchRemamberMe {
|
||||
// color: var(--white);
|
||||
// background: #3182ce;
|
||||
// }
|
||||
// }
|
||||
|
||||
// ///// select
|
||||
// .ant-select-outlined:not(.ant-select-customize-input) .ant-select-selector {
|
||||
// border: none;
|
||||
// }
|
||||
// .ant-select-single.ant-select-show-arrow .ant-select-selection-item,
|
||||
// .ant-select-single.ant-select-show-arrow .ant-select-selection-placeholder {
|
||||
// padding-inline-end: 4vw;
|
||||
// }
|
||||
// .ant-select-single.ant-select-lg:not(.ant-select-customize-input)
|
||||
// .ant-select-selector {
|
||||
// // height: 3vw;
|
||||
// }
|
||||
|
||||
// ////////////// file
|
||||
|
||||
// .ValidationField
|
||||
// .ant-upload-wrapper.ant-upload-picture-card-wrapper
|
||||
// .ant-upload.ant-upload-select,
|
||||
// .ant-upload-wrapper.ant-upload-picture-circle-wrapper
|
||||
// .ant-upload.ant-upload-select {
|
||||
// background: transparent;
|
||||
// border: 0.3vw dashed var(--field);
|
||||
// }
|
||||
|
||||
// .uploader_error {
|
||||
// .ant-upload.ant-upload-select {
|
||||
// border: 0.3vw dashed red !important;
|
||||
// }
|
||||
// }
|
||||
// .ValidationField.have_value
|
||||
// .ant-upload-wrapper.ant-upload-picture-card-wrapper
|
||||
// .ant-upload.ant-upload-select,
|
||||
// .ant-upload-wrapper.ant-upload-picture-circle-wrapper
|
||||
// .ant-upload.ant-upload-select {
|
||||
// background: transparent;
|
||||
// border: 0.3vw dashed transparent;
|
||||
// }
|
||||
|
||||
// .CustomFile {
|
||||
// color: var(--subtext);
|
||||
// font-size: 0.7vw !important;
|
||||
// width: 80%;
|
||||
// margin-inline: auto;
|
||||
// }
|
||||
|
||||
// .ImageCol {
|
||||
// max-width: 50%;
|
||||
// flex: 0;
|
||||
// }
|
||||
// .ant-upload-wrapper.ant-upload-picture-card-wrapper
|
||||
// .ant-upload.ant-upload-select,
|
||||
// .ant-upload-wrapper.ant-upload-picture-circle-wrapper
|
||||
// .ant-upload.ant-upload-select {
|
||||
// width: 11vw;
|
||||
// height: 11vw;
|
||||
// padding: 10px;
|
||||
// }
|
||||
|
||||
// .uploadIcon {
|
||||
// position: absolute;
|
||||
// bottom: 0;
|
||||
// left: 0;
|
||||
// width: 3vw;
|
||||
// height: 3vw;
|
||||
// border-radius: 50%;
|
||||
// display: flex;
|
||||
// justify-content: center;
|
||||
// align-items: center;
|
||||
// background: #f4f4f4;
|
||||
// border: 1px solid black;
|
||||
// svg {
|
||||
// color: black;
|
||||
// font-size: 1.5vw;
|
||||
// }
|
||||
// }
|
||||
|
||||
// ////////// INput
|
||||
|
||||
// label {
|
||||
// color: var(--label);
|
||||
// }
|
||||
|
||||
// // .ant-select-dropdown{
|
||||
// // border: 1px solid var(--primary);
|
||||
// // border-top: none;
|
||||
// // z-index: 2;
|
||||
// // transform: translateY(-10px);
|
||||
// // background: var(--bg2);
|
||||
// // }
|
||||
|
||||
// .Auth_Select {
|
||||
// height: 3vw !important;
|
||||
|
||||
// .ant-select-selector {
|
||||
// border: 1px solid #d9d9d9 !important;
|
||||
// height: 3vw !important;
|
||||
// font-size: 1vw;
|
||||
// border-radius: 1vw;
|
||||
// }
|
||||
// .ant-select-selection-item {
|
||||
// height: 28px;
|
||||
// }
|
||||
// }
|
||||
|
|
|
|||
|
|
@ -18,37 +18,30 @@
|
|||
}
|
||||
header {
|
||||
display: flex; justify-content: space-between;align-items: center;
|
||||
height: 4vw;
|
||||
padding: 1vw 1vw;
|
||||
height: 60px;
|
||||
padding: 16px ;
|
||||
z-index: 10;
|
||||
color: var(--black);
|
||||
border-top-left-radius: 10px;
|
||||
border-top-right-radius: 10px;
|
||||
span{
|
||||
font-size: 1.4vw;
|
||||
font-size: 25px;
|
||||
}
|
||||
svg{
|
||||
font-size: 30px;
|
||||
color: #6A7287;
|
||||
}
|
||||
}
|
||||
.time_main_modal {
|
||||
padding: 0vw 7vw;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.main_modal {
|
||||
padding: .7vw 0vw !important;
|
||||
padding: 15px 0vw !important;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
}
|
||||
main {
|
||||
.buttons {
|
||||
padding-inline: 0 1vw;
|
||||
padding-inline: 0 10px;
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
align-items: end;
|
||||
|
|
@ -58,9 +51,9 @@
|
|||
position: relative;
|
||||
outline: none;
|
||||
border: none;
|
||||
width: 10vw;
|
||||
width: 120px;
|
||||
border-radius: 10px;
|
||||
padding: 0.7vw;
|
||||
padding: 10px;
|
||||
font-weight: bold;
|
||||
background: var(--primary);
|
||||
color: var(--white);
|
||||
|
|
@ -79,9 +72,7 @@
|
|||
label {
|
||||
color: var(--secondary) !important;
|
||||
}
|
||||
.ant-select-outlined:not(.ant-select-customize-input) .ant-select-selector {
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
}
|
||||
.ant-modal-root .ant-modal-centered .ant-modal{
|
||||
width: 45vw ;
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ body {
|
|||
padding: 0;
|
||||
margin: 0;
|
||||
font-weight: 600;
|
||||
font-size: 0.9vw;
|
||||
font-size: 16px;
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
|
|
@ -73,10 +73,7 @@ svg {
|
|||
}
|
||||
}
|
||||
}
|
||||
/* Input */
|
||||
.ant-picker-outlined .ant-picker-input input {
|
||||
font-size: 1vw;
|
||||
}
|
||||
|
||||
|
||||
/* Username */
|
||||
#username {
|
||||
|
|
|
|||
|
|
@ -35,6 +35,7 @@
|
|||
--bg4: #e6e5e5;
|
||||
--borderColor: #ffffff91;
|
||||
--opacity: #bcbcbc;
|
||||
--fieldHeight:40px;
|
||||
}
|
||||
|
||||
:root:has(.dark) {
|
||||
|
|
|
|||
|
|
@ -48,24 +48,10 @@
|
|||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.ant-picker-outlined {
|
||||
border-color: var(--border-color) !important;
|
||||
}
|
||||
.ant-select-outlined:not(.ant-select-customize-input) .ant-select-selector {
|
||||
border: 1px solid var(--border-color) !important;
|
||||
}
|
||||
.ant-input-outlined {
|
||||
border-color: var(--border-color);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.ant-input-outlined {
|
||||
border-color: var(--border-color);
|
||||
padding: 0.5vw 1vw;
|
||||
font-size: 0.8vw;
|
||||
height: 3vw;
|
||||
border-radius: 0.6vw;
|
||||
}
|
||||
|
||||
|
||||
.FormCard {
|
||||
// background: var(--bg);
|
||||
|
|
@ -115,45 +101,45 @@
|
|||
width: 12vw;
|
||||
}
|
||||
}
|
||||
.Buttons_over_width {
|
||||
display: flex;
|
||||
gap: 4%;
|
||||
align-items: center;
|
||||
> button,
|
||||
> div {
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: 50px;
|
||||
padding: 0.8vw 2vw;
|
||||
background: var(--primary);
|
||||
color: var(--white);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 5px;
|
||||
font-size: 1vw;
|
||||
}
|
||||
}
|
||||
.Buttons {
|
||||
display: flex;
|
||||
gap: 4%;
|
||||
align-items: center;
|
||||
> button,
|
||||
> div {
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: 50px;
|
||||
padding: 0.8vw 0.4vw;
|
||||
background: var(--primary);
|
||||
color: var(--white);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 5px;
|
||||
font-size: 1vw;
|
||||
width: 12vw;
|
||||
}
|
||||
}
|
||||
// .Buttons_over_width {
|
||||
// display: flex;
|
||||
// gap: 4%;
|
||||
// align-items: center;
|
||||
// > button,
|
||||
// > div {
|
||||
// outline: none;
|
||||
// border: none;
|
||||
// border-radius: 50px;
|
||||
// padding: 0.8vw 2vw;
|
||||
// background: var(--primary);
|
||||
// color: var(--white);
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
// justify-content: center;
|
||||
// gap: 5px;
|
||||
// font-size: 1vw;
|
||||
// }
|
||||
// }
|
||||
// .Buttons {
|
||||
// display: flex;
|
||||
// gap: 4%;
|
||||
// align-items: center;
|
||||
// > button,
|
||||
// > div {
|
||||
// outline: none;
|
||||
// border: none;
|
||||
// border-radius: 50px;
|
||||
// padding: 0.8vw 0.4vw;
|
||||
// background: var(--primary);
|
||||
// color: var(--white);
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
// justify-content: center;
|
||||
// gap: 5px;
|
||||
// font-size: 1vw;
|
||||
// width: 12vw;
|
||||
// }
|
||||
// }
|
||||
|
||||
.TowButton {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -14,7 +14,6 @@
|
|||
|
||||
@import "../Antd/index.scss";
|
||||
|
||||
@import "../Home/index.scss";
|
||||
|
||||
@import "../DataTable/index.scss";
|
||||
|
||||
|
|
|
|||
|
|
@ -1,58 +0,0 @@
|
|||
.ActivitySection {
|
||||
background: var(--bg);
|
||||
padding: 30px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
|
||||
header {
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
h4 {
|
||||
color: var(--secondary);
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.ActivityScrollerChanger {
|
||||
background: #f4f7fe;
|
||||
padding: 20px 10px;
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
.Activitys {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
padding: 0px 20px;
|
||||
max-height: 200px;
|
||||
overflow-y: scroll;
|
||||
@include Scrollbar;
|
||||
direction: ltr; /* Right-to-left direction */
|
||||
gap: 1vw;
|
||||
|
||||
article {
|
||||
direction: rtl; /* Right-to-left direction */
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 1vw;
|
||||
width: 100%;
|
||||
img {
|
||||
width: 3vw;
|
||||
height: 3vw;
|
||||
}
|
||||
h5 {
|
||||
margin-bottom: 0;
|
||||
font-size: 0.8vw;
|
||||
color: #505050;
|
||||
@include Font_Poppins_Bold;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
p {
|
||||
font-size: 0.6vw;
|
||||
text-wrap: nowrap;
|
||||
color: #d16e57;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
.CountSection {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
background: var(--bg);
|
||||
border-radius: var(--border-radius);
|
||||
padding: 10px;
|
||||
.CountCards {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
|
||||
.CountCard {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
width: 16%;
|
||||
|
||||
h6 {
|
||||
color: var(--secondary);
|
||||
font-size: 1vw;
|
||||
font-weight: bold;
|
||||
}
|
||||
h4 {
|
||||
font-size: 1vw;
|
||||
font-weight: 400;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
i {
|
||||
width: 3.6vw;
|
||||
height: 3.6vw;
|
||||
border-radius: 50%;
|
||||
background: var(--primary);
|
||||
@include Flex;
|
||||
margin-bottom: 4px;
|
||||
svg {
|
||||
color: var(--white);
|
||||
font-size: 2vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
img {
|
||||
width: 14%;
|
||||
mix-blend-mode: multiply;
|
||||
margin-inline: 2vw;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,224 +0,0 @@
|
|||
.HomePage {
|
||||
height: 100%;
|
||||
}
|
||||
.ChartSection {
|
||||
width: 70%;
|
||||
padding: 30px 40px 30px 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
}
|
||||
.TowItem {
|
||||
display: flex;
|
||||
gap: 4%;
|
||||
|
||||
> * {
|
||||
width: 48%;
|
||||
height: 30vw;
|
||||
}
|
||||
}
|
||||
.ant-picker-calendar-mini .ant-picker-content {
|
||||
height: 21vw;
|
||||
}
|
||||
|
||||
.ColumnChart {
|
||||
background: var(--bg);
|
||||
@include Shadow;
|
||||
border-radius: var(--border-radius);
|
||||
|
||||
.ColumnChart_header {
|
||||
padding: 20px;
|
||||
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
// flex-wrap: wrap;
|
||||
|
||||
.ant-select-outlined:not(.ant-select-customize-input) .ant-select-selector {
|
||||
border: none;
|
||||
}
|
||||
|
||||
> span {
|
||||
align-self: center;
|
||||
}
|
||||
}
|
||||
|
||||
.Legend {
|
||||
display: flex;
|
||||
gap: 25px;
|
||||
align-items: center;
|
||||
color: var(--subtext);
|
||||
padding-inline: 20px;
|
||||
|
||||
div {
|
||||
position: relative;
|
||||
font-weight: 400;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: -25px;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 14px;
|
||||
/* Adjust size as needed */
|
||||
height: 14px;
|
||||
/* Adjust size as needed */
|
||||
border: 4px solid var(--utils_color_one);
|
||||
/* Set border properties */
|
||||
border-radius: 50%;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
&:nth-child(2) {
|
||||
&::after {
|
||||
border: 4px solid var(--utils_color_tow);
|
||||
/* Set border properties */
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ColumnChartWrapper {
|
||||
height: 23vw;
|
||||
}
|
||||
|
||||
.CalendarSection {
|
||||
.Calendar {
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
background: var(--bg);
|
||||
@include Shadow;
|
||||
border-radius: var(--border-radius);
|
||||
|
||||
.ant-picker-outlined {
|
||||
border-color: var(--bg);
|
||||
direction: ltr;
|
||||
// width: 140px;
|
||||
}
|
||||
|
||||
.CalendarHeader {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1vw 1.5vw;
|
||||
width: 100%;
|
||||
|
||||
h4 {
|
||||
color: var(--secondary);
|
||||
font-weight: bold;
|
||||
font-size: 1.4vw;
|
||||
}
|
||||
}
|
||||
|
||||
.Calendar_Div {
|
||||
// border: 1px solid red;
|
||||
// aspect-ratio: 1 / 1;
|
||||
}
|
||||
|
||||
.Calendar_ActiveDiv:nth-child(odd) {
|
||||
background-color: var(--utils_color_one);
|
||||
|
||||
color: var(--white);
|
||||
height: 90%;
|
||||
// aspect-ratio: 1 / 1;
|
||||
width: 70%;
|
||||
margin-inline: auto;
|
||||
border-radius: 50%;
|
||||
@include Flex;
|
||||
/* Include your Flex mixin here */
|
||||
}
|
||||
|
||||
.Calendar_ActiveDiv:nth-child(even) {
|
||||
background-color: var(--utils_color_tow);
|
||||
color: var(--white);
|
||||
height: 90%;
|
||||
width: 70%;
|
||||
margin-inline: auto;
|
||||
border-radius: 50%;
|
||||
// aspect-ratio: 1 / 1;
|
||||
|
||||
@include Flex;
|
||||
/* Include your Flex mixin here */
|
||||
}
|
||||
}
|
||||
|
||||
.AreaChart {
|
||||
background: var(--bg);
|
||||
@include Shadow;
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
// <DatePicker
|
||||
// suffixIcon={<IoMdArrowDropdown size={30} />}
|
||||
// onChange={onChangeDatePicker}
|
||||
// picker="month"
|
||||
// />
|
||||
|
||||
.CalenderPop {
|
||||
}
|
||||
.Calendar_Popover {
|
||||
background: var(--primary);
|
||||
color: var(--white);
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
h5 {
|
||||
font-size: 0.9vw;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 0.5vw;
|
||||
font-weight: normal;
|
||||
}
|
||||
.Actions {
|
||||
position: absolute;
|
||||
right: -30px;
|
||||
top: 0;
|
||||
width: 35px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: var(--border-radius);
|
||||
border: 1px solid var(--primary);
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
background: var(--bg);
|
||||
}
|
||||
}
|
||||
.ant-popover .ant-popover-inner:has(.Actions) {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
.CalenderPop .ant-popover-inner {
|
||||
background: var(--primary) !important;
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
.ant-popover .ant-popover-arrow::after {
|
||||
background: var(--primary) !important;
|
||||
}
|
||||
|
||||
.NoteSections {
|
||||
width: 30%;
|
||||
background: var(--bg);
|
||||
}
|
||||
|
||||
.DummyHomePage {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 70vh;
|
||||
img {
|
||||
width: 20vw;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,78 +0,0 @@
|
|||
.NoteSection {
|
||||
background: var(--bg);
|
||||
padding: 30px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
|
||||
header {
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
h4 {
|
||||
color: var(--secondary);
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.NoteScrollerChanger {
|
||||
background: #f4f7fe;
|
||||
padding: 20px 10px;
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
.Notes {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
padding: 0px 20px;
|
||||
max-height: 500px;
|
||||
overflow-y: scroll;
|
||||
@include Scrollbar;
|
||||
direction: ltr; /* Right-to-left direction */
|
||||
|
||||
article {
|
||||
direction: rtl; /* Right-to-left direction */
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
> div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
margin-bottom: 10px;
|
||||
i {
|
||||
width: 1.7vw;
|
||||
height: 1.7vw;
|
||||
background: var(--primary);
|
||||
color: var(--white);
|
||||
border-radius: 50%;
|
||||
@include Flex;
|
||||
}
|
||||
h5 {
|
||||
margin-bottom: 0;
|
||||
font-size: 1.2vw;
|
||||
color: #606165;
|
||||
font-family: "Jost-SemiBold", sans-serif; /* Use ABeeZee font for body text */
|
||||
}
|
||||
}
|
||||
span {
|
||||
margin-right: 50px;
|
||||
font-size: 0.8vw;
|
||||
width: 90%;
|
||||
position: relative;
|
||||
font-weight: 400;
|
||||
margin-bottom: 10px;
|
||||
&::before {
|
||||
content: ""; /* Required for ::before pseudo-element */
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: -20px;
|
||||
width: 8px; /* Set width and height to cover the entire parent */
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background: #606060;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,47 +0,0 @@
|
|||
.StudentSubjects {
|
||||
padding: 20px;
|
||||
@include Shadow;
|
||||
background: var(--bg);
|
||||
border-radius: var(--border-radius);
|
||||
|
||||
header {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
padding: 5px;
|
||||
h6 {
|
||||
color: var(--secondary);
|
||||
}
|
||||
}
|
||||
main {
|
||||
width: 100%;
|
||||
overflow-y: scroll;
|
||||
max-height: 20vw;
|
||||
@include Scrollbar;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
direction: ltr;
|
||||
gap: 20px;
|
||||
padding: 20px;
|
||||
|
||||
> div {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-radius: var(--border-radius);
|
||||
background: #f0f7ff;
|
||||
padding: 1vw 2vw;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 3vw;
|
||||
height: 3vw;
|
||||
}
|
||||
h6 {
|
||||
color: var(--text);
|
||||
font-weight: bold;
|
||||
font-size: 1.2vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
@import "./Home.scss";
|
||||
@import "./Activity.scss";
|
||||
@import "./CountSection.scss";
|
||||
@import "./Note.scss";
|
||||
@import "./StudentSubjects.scss";
|
||||
|
|
@ -42,3 +42,26 @@
|
|||
.ant-table-wrapper .ant-table-container table>thead>tr:first-child >*:first-child{
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
|
||||
.TableWithHeader {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 2vw;
|
||||
background: var(--bg);
|
||||
// gap: 1vw;
|
||||
border-radius: var(--border-radius);
|
||||
transition: 1s ease-in-out;
|
||||
animation: fadeInRight 1s ease-in-out;
|
||||
|
||||
> header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 95%;
|
||||
h6 {
|
||||
color: var(--primary);
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,7 +10,8 @@
|
|||
.filter_button{
|
||||
display: flex;justify-content: space-between;align-items: center;
|
||||
width: 190px;
|
||||
padding: 11px 20px 11px 20px;
|
||||
padding-inline: 20px;
|
||||
height: 40px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid var(--opacity) !important;
|
||||
transition: ease-in-out .4s;
|
||||
|
|
@ -31,7 +32,7 @@
|
|||
.filter_modal_select{
|
||||
border: 1px solid var(--opacity);
|
||||
border-radius: 10px;
|
||||
padding-bottom: 46.5px;
|
||||
// padding-bottom: 46.5px;
|
||||
.addition_select_icon{
|
||||
font-size: 25px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,150 +0,0 @@
|
|||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.ShowMoreButton {
|
||||
position: absolute;
|
||||
bottom: 1vw;
|
||||
right: 0.5vw;
|
||||
background-color: var(--primary);
|
||||
color: var(--white);
|
||||
border-radius: 50%;
|
||||
height: 1.7vw;
|
||||
width: 1.7vw;
|
||||
@include Flex;
|
||||
|
||||
svg {
|
||||
font-size: 1.5vw;
|
||||
}
|
||||
}
|
||||
|
||||
.ModelBody {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ModelBodyTabs {
|
||||
width: 27%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2vw;
|
||||
background: var(--primary);
|
||||
border-radius: var(--border-radius);
|
||||
padding: 2vw;
|
||||
min-height: 85vh;
|
||||
position: relative;
|
||||
|
||||
.ModelBodyTab {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2vw;
|
||||
z-index: 4;
|
||||
|
||||
> div {
|
||||
width: 3vw;
|
||||
height: 3vw;
|
||||
// background: var(--primary);
|
||||
color: var(--white);
|
||||
border: 1px solid var(--white);
|
||||
border-radius: 50%;
|
||||
@include Flex;
|
||||
font-size: 1vw;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
h6 {
|
||||
color: #d4d4d4;
|
||||
margin-bottom: 0.4vw;
|
||||
font-size: 0.7vw;
|
||||
}
|
||||
|
||||
h4 {
|
||||
color: var(--white);
|
||||
font-size: 1vw;
|
||||
}
|
||||
}
|
||||
|
||||
.activeModelTab {
|
||||
> div {
|
||||
background: #bfe2fd;
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
.ModelBodyForm {
|
||||
padding: 2vw;
|
||||
width: 73%;
|
||||
> header {
|
||||
font-size: 2vw;
|
||||
color: var(--secondary);
|
||||
margin-bottom: 1vw;
|
||||
}
|
||||
.ant-picker-outlined {
|
||||
border-color: var(--border-color);
|
||||
}
|
||||
|
||||
.ant-input-outlined {
|
||||
border-color: var(--border-color);
|
||||
}
|
||||
label {
|
||||
color: var(--secondary);
|
||||
}
|
||||
}
|
||||
.ant-input-outlined {
|
||||
border-color: var(--border-color);
|
||||
}
|
||||
|
||||
.SubmitButton {
|
||||
width: 100%;
|
||||
padding-right: 30%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
cursor: pointer;
|
||||
> button,
|
||||
> span {
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: var(--border-radius);
|
||||
padding: 0.7vw 1vw;
|
||||
background: var(--primary);
|
||||
color: var(--white);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 5px;
|
||||
font-size: 1.2vw;
|
||||
width: 11vw;
|
||||
}
|
||||
> div {
|
||||
color: var(--secondary);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.TableWithHeader {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 2vw;
|
||||
background: var(--bg);
|
||||
// gap: 1vw;
|
||||
border-radius: var(--border-radius);
|
||||
transition: 1s ease-in-out;
|
||||
animation: fadeInRight 1s ease-in-out;
|
||||
|
||||
> header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 95%;
|
||||
h6 {
|
||||
color: var(--primary);
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.Selects {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8%;
|
||||
}
|
||||
|
|
@ -2,7 +2,6 @@
|
|||
@import "./activity.scss";
|
||||
@import "./Student.scss";
|
||||
@import "./Classes.scss";
|
||||
@import "./Division.scss";
|
||||
@import "./Course.scss";
|
||||
@import "./EduClass.scss";
|
||||
@import "./programme.scss";
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@ function AntdProvider({ children }: { children: React.ReactNode }) {
|
|||
headerBg: bgColor,
|
||||
headerColor: primaryColor,
|
||||
},
|
||||
|
||||
},
|
||||
}}
|
||||
>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user