reza added basic2 profile

master
RezaAshrafi77 3 years ago
parent f2cebef2bf
commit b92aa90c4f
  1. 2
      src/components/PrivateRouter/index.js
  2. 3
      src/components/Select/index.tsx
  3. 166
      src/custom.scss
  4. 332
      src/views/Auth/Login/index.scss
  5. 11
      src/views/Auth/Profile/Birthdate/index.js
  6. 59
      src/views/Auth/Profile/Birthdate/index.scss
  7. 111
      src/views/Auth/Profile/Document/index.js
  8. 38
      src/views/Auth/Profile/Document/index.tsx
  9. 1
      src/views/Auth/Profile/Upload/index.scss
  10. 302
      src/views/Auth/Profile/index.scss
  11. 30
      src/views/Auth/Profile/index.tsx
  12. 290
      src/views/Contact/index.scss
  13. 1
      src/views/Subscription/SubscribeRadio/index.scss
  14. 2
      src/views/Subscription/SubscribeRadio/index.tsx

@ -24,7 +24,7 @@ const PrivateRouter = ({
export default connect( export default connect(
(state) => ({ (state) => ({
status: state.publicApi.status, status: state.user.status,
}), }),
{} {}
)(PrivateRouter); )(PrivateRouter);

@ -46,7 +46,8 @@ export default function CustomizedSelects({
style={{ style={{
position: "absolute", position: "absolute",
left: 5, left: 5,
top: 19, top: '50%',
transform: "translateY(-50%)",
fontSize: 30, fontSize: 30,
color: "#a5a5a5", color: "#a5a5a5",
}} }}

@ -1,24 +1,25 @@
.submit{ .submit {
background-color: #4DD35B; background-color: #4dd35b;
color: white; color: white;
border-radius: 10px; border-radius: 10px;
border: 0px; border: 0px;
} }
.mobile, .desktop{ .mobile,
.desktop {
display: flex; display: flex;
} }
.submit-large{ .submit-large {
padding: 12px 24px; padding: 12px 24px;
} }
.submit-medium{ .submit-medium {
padding : 10px 20px; padding: 10px 20px;
} }
.submit-small{ .submit-small {
padding : 8px 16px; padding: 8px 16px;
} }
.rec-arrow-left { .rec-arrow-left {
@ -122,10 +123,83 @@
} }
.MuiMenu-list { .MuiMenu-list {
} }
.MuiMenuItem-root{ //INPUT
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
label {
background: black !important;
width: fit-content;
text-align: center;
color: #b5b5b5;
}
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 15px 14px !important;
font-family: numeralLight;
color: #84de56 !important;
&:focus {
border: 1px solid #84de56 !important;
border-radius: 10px;
transform: translateY(0px);
border-radius: 10px !important;
z-index: 120;
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px !important;
top: 50% !important;
padding: 0px !important;
transform: translate(0px, -50%) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px !important;
top: -8px !important;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
z-index: 130 !important;
background-color: black !important;
color: #84de56 !important;
}
.Mui-focused {
color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
//SELECT
.MuiMenuItem-root {
background: #272727 !important; background: #272727 !important;
border-bottom: 1px solid #707070 !important; border-bottom: 1px solid #707070 !important;
color: white !important; color: white !important;
@ -139,62 +213,98 @@
color: white !important; color: white !important;
} }
.MuiOutlinedInput-notchedOutline legend{ .MuiOutlinedInput-notchedOutline legend {
display: none !important; display: none !important;
} }
@media screen and (min-width: 1441px) { @media screen and (min-width: 1441px) {
.submit{ .submit {
font-size: 20px; font-size: 20px;
} }
.main{ .main {
main { main {
max-width: 1350px; max-width: 1350px;
} }
} }
.mobile{ .mobile {
display: none !important; display: none !important;
} }
.MuiFormControl-root {
label {
font-size: 14px;
}
}
.MuiOutlinedInput-input {
font-size: 20px;
}
} }
@media screen and (min-width: 1008px) and (max-width: 1440px){ @media screen and (min-width: 1008px) and (max-width: 1440px) {
.submit{ .submit {
font-size : calc(100vw / 80); font-size: calc(100vw / 80);
} }
.main{ .main {
main { main {
max-width: 1250px; max-width: 1250px;
} }
} }
.mobile{ .mobile {
display: none !important; display: none !important;
} }
.MuiFormControl-root {
label {
font-size: calc(100vw / 110) !important;
}
}
.MuiOutlinedInput-input {
font-size: calc(100vw / 80) !important;
}
} }
@media screen and (min-width: 641px) and (max-width: 1007px) { @media screen and (min-width: 641px) and (max-width: 1007px) {
.main{ .main {
main { main {
max-width: 900px; max-width: 900px;
} }
} }
.desktop{ .desktop {
display: none !important; display: none !important;
} }
.submit-large{ .submit-large {
font-size: calc(100vw / 38); font-size: calc(100vw / 38) !important;
}
.MuiFormControl-root {
label {
font-size: calc(100vw / 40) !important;
}
}
.MuiOutlinedInput-input {
font-size: calc(100vw / 45) !important;
} }
} }
@media screen and (max-width: 640px) { @media screen and (max-width: 640px) {
.main{ .main {
main { main {
max-width: 500px; max-width: 500px;
} }
} }
.desktop{ .desktop {
display: none !important; display: none !important;
} }
.submit{ .submit {
font-size: calc(100vw / 25); font-size: calc(100vw / 25) !important;
} }
} .MuiFormControl-root {
label {
font-size: calc(100vw / 30) !important;
}
}
.MuiOutlinedInput-input {
font-size: calc(100vw / 30) !important;
}
.MuiSelect-select {
line-height: 1.5 !important;
}
}

@ -3,8 +3,8 @@
height: 100vh; height: 100vh;
position: relative; position: relative;
font-family: numeralLight; font-family: numeralLight;
&__options{ &__options {
color: #B5B5B5; color: #b5b5b5;
a { a {
color: #84de56; color: #84de56;
} }
@ -12,7 +12,7 @@
img { img {
// transform: rotate(-90deg); // transform: rotate(-90deg);
} }
.MuiButtonBase-root{ .MuiButtonBase-root {
padding: 0px !important; padding: 0px !important;
} }
background: linear-gradient( background: linear-gradient(
@ -73,7 +73,7 @@
} }
&__back { &__back {
margin-bottom: 60px; margin-bottom: 60px;
img{ img {
transform: rotate(-90deg); transform: rotate(-90deg);
} }
a { a {
@ -81,83 +81,14 @@
font-size: 13px; font-size: 13px;
} }
} }
&__options{ &__options {
div{ div {
font-size: 13px; font-size: 13px;
} }
a{ a {
font-size: 15px; font-size: 15px;
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 15px 14px !important;
font-family: numeralLight;
font-size: 20px;
&:focus{
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform : translateY(0.5px);
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px;
top: 22px;
padding: 0px !important;
transform: translate(0px, 0px) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px;
top: -8px;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
}
label {
background-color: #2F2F2F;
width: fit-content;
text-align: center;
color: #B5B5B5 !important;
letter-spacing: -1px;
font-size: 16px;
}
.Mui-focused {
color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
} }
@ -195,7 +126,7 @@
} }
&__back { &__back {
margin-bottom: 40px; margin-bottom: 40px;
img{ img {
transform: rotate(-90deg); transform: rotate(-90deg);
} }
a { a {
@ -203,92 +134,21 @@
font-size: calc(100vw / 110); font-size: calc(100vw / 110);
} }
} }
&__options{ &__options {
div{ div {
font-size: calc(100vw / 110); font-size: calc(100vw / 110);
} }
a{ a {
font-size: calc(100vw / 110); font-size: calc(100vw / 110);
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 10px 14px !important;
font-family: numeralLight;
font-size: calc(100vw / 80);
&:focus{
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform : translateY(0px);
z-index: 100;
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px;
top: calc(50%);
padding: 0px !important;
transform: translate(0px, -50%) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px;
top: -8px;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
}
label {
background-color: #2F2F2F;
width: fit-content;
text-align: center;
color: #B5B5B5 !important;
letter-spacing: -1px;
font-size: calc(100vw / 100);
z-index: 110;
}
.Mui-focused {
color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
} }
@media screen and (min-width: 641px) and (max-width: 1007px) { @media screen and (min-width: 641px) and (max-width: 1007px) {
.login { .login {
background: black; background: black;
.footer{ .footer {
display: none !important; display: none !important;
} }
section { section {
@ -308,7 +168,7 @@
background-color: #84de56; background-color: #84de56;
color: white; color: white;
font-size: calc(100vw / 30); font-size: calc(100vw / 30);
width : 100%; width: 100%;
max-width: 400px; max-width: 400px;
margin: 50px auto 0px; margin: 50px auto 0px;
padding: 10px 0px; padding: 10px 0px;
@ -335,95 +195,22 @@
color: white; color: white;
font-size: calc(100vw / 110); font-size: calc(100vw / 110);
} }
img{ img {
width : 50px; width: 50px;
} }
} }
&__options{ &__options {
padding-top: 20px; padding-top: 20px;
div{ div {
font-size: calc(100vw / 40); font-size: calc(100vw / 40);
} }
a{ a {
font-size: calc(100vw / 45); font-size: calc(100vw / 45);
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 10px 14px !important;
font-family: numeralLight;
font-size: calc(100vw / 30);
background-color: #2A2A2A;
&:focus{
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform : translateY(0px);
z-index: 100;
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px;
top: calc(50%);
padding: 0px !important;
transform: translate(0px, -50%) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px;
top: -8px;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
}
label {
background-color: #2A2A2A;
width: fit-content;
text-align: center;
color: #B5B5B5 !important;
letter-spacing: -1px;
font-size: calc(100vw / 40);
z-index: 110;
}
.Mui-focused {
color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
} }
@media screen and (max-width: 640px) { @media screen and (max-width: 640px) {
.login { .login {
background: black; background: black;
@ -468,96 +255,23 @@
&__back { &__back {
position: fixed; position: fixed;
top: 70px; top: 70px;
left : 20px; left: 20px;
margin-bottom: 40px; margin-bottom: 40px;
a { a {
color: white; color: white;
font-size: calc(100vw / 110); font-size: calc(100vw / 110);
} }
img{ img {
// transform: scale() // transform: scale()
} }
} }
&__options{ &__options {
div{ div {
font-size: calc(100vw / 30); font-size: calc(100vw / 30);
} }
a{ a {
font-size: calc(100vw / 30); font-size: calc(100vw / 30);
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 10px 14px !important;
font-family: numeralLight;
font-size: calc(100vw / 20);
background-color: #2A2A2A;
border-radius: 10px;
&:focus{
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform : translateY(0px);
z-index: 100;
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px;
top: calc(50%);
padding: 0px !important;
transform: translate(0px, -50%) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px;
top: -8px;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
}
label {
background-color: #2A2A2A;
width: fit-content;
text-align: center;
color: #B5B5B5 !important;
letter-spacing: -1px;
font-size: calc(100vw / 30);
z-index: 110;
}
.Mui-focused {
color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
} }

@ -3,8 +3,7 @@ import onInput from "~/util/onInput";
import Input from "../../../../components/Input/index"; import Input from "../../../../components/Input/index";
import "./index.scss"; import "./index.scss";
import moment from "jalali-moment"; import moment from "jalali-moment";
export default function Birthdate(props) { export default function Birthdate({ defaultValue, name, ...props }) {
const { defaultValue, parent, name } = props;
let momentDate = moment(defaultValue[name]); let momentDate = moment(defaultValue[name]);
let isvalid = momentDate.isValid(); let isvalid = momentDate.isValid();
const day = isvalid ? momentDate.format("jDD") : null, const day = isvalid ? momentDate.format("jDD") : null,
@ -15,7 +14,7 @@ export default function Birthdate(props) {
let _state = { ...state, [_name]: value }; let _state = { ...state, [_name]: value };
setState(_state); setState(_state);
parent.onChange( props.onChange(
name, name,
moment moment
.from(`${_state.year}/${_state.month}/${_state.day}`, "fa", "YYYY/M/D") .from(`${_state.year}/${_state.month}/${_state.day}`, "fa", "YYYY/M/D")
@ -32,7 +31,7 @@ export default function Birthdate(props) {
placeholder="روز" placeholder="روز"
maxLength={2} maxLength={2}
onInput={onInput.dayHandler} onInput={onInput.dayHandler}
parent={{ onChange }} onChange={onChange}
defaultValue={state} defaultValue={state}
/> />
<span>/</span> <span>/</span>
@ -42,7 +41,7 @@ export default function Birthdate(props) {
placeholder="ماه" placeholder="ماه"
maxLength={2} maxLength={2}
onInput={onInput.monthHandler} onInput={onInput.monthHandler}
parent={{ onChange }} onChange={onChange}
defaultValue={state} defaultValue={state}
/> />
<span>/</span> <span>/</span>
@ -52,7 +51,7 @@ export default function Birthdate(props) {
placeholder="سال" placeholder="سال"
maxLength={4} maxLength={4}
onInput={onInput.yearHandler} onInput={onInput.yearHandler}
parent={{ onChange }} onChange={onChange}
defaultValue={state} defaultValue={state}
/> />
</div> </div>

@ -11,44 +11,77 @@
} }
span { span {
color: #bfbfbf; color: #bfbfbf;
margin: 0px 5px;
} }
input { input {
border: 0px; border: none !important;
background-color: rgba(204, 204, 204, 0.098); background-color: rgba(204, 204, 204, 0.098);
font-family: numeralLight;
color: #84de56; color: #84de56;
max-width: 40px; max-width: 40px;
text-align: center !important; text-align: center !important;
direction: ltr; direction: ltr;
margin: 0px 5px; margin: 0px 5px !important;
border: none; border: none;
&:focus { &:focus {
outline: 0px; outline: 0px;
border: 0px; border: 0px;
} }
&::placeholder { &::placeholder {
color: #bfbfbf; color: #383737;
} }
} }
//INPUT
.MuiOutlinedInput-notchedOutline {
border : none !important;
}
.MuiOutlinedInput-input {
padding: 5px !important;
&:focus {
border: none !important;
border-radius: 0px !important;
}
}
} }
@media screen and (max-width: 1000px) { @media screen and (min-width: 1441px) {
span { .birthdate {
font-size: 14px; label {
font-size: 14px !important;
}
span {
font-size: 16px;
}
input {
font-size: 16px;
&::placeholder {
font-size: 16px;
}
}
} }
input { }
font-size: 14px;
&::placeholder { @media screen and (min-width: 1008px) and (max-width: 1440px) {
font-size: 15px; .birthdate {
label {
font-size: calc(100vw / 120) !important;
}
span {
font-size: calc(100vw / 90);
}
input {
font-size: calc(100vw / 90);
&::placeholder {
font-size: calc(100vw / 90);
}
} }
} }
} }
@media screen and (min-width: 6401px) and (max-width: 1007px) { @media screen and (min-width: 640px) and (max-width: 1007px) {
.birthdate { .birthdate {
label { label {
font-size: calc(100vw / 40) !important; font-size: calc(100vw / 40) !important;
@ -82,4 +115,4 @@
} }
} }
} }
} }

@ -1,111 +0,0 @@
import React from "react";
import "./index.scss";
const maxDesktopSize = 1250;
const maxMobileSize = 550;
const fontSize = {
desktop: {
span: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 80,
},
mobile: {
span: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 30,
},
};
export default function Document(props) {
const { parent, name } = props;
return (
<>
{window.innerWidth < 1000 ? (
<div className="mobile-auth-profile__document d-flex justify-content-center align-items-center mb-3">
{parent.state[name] === "" ? (
<>
<input
type="file"
// parent.onChange(e.target.name, e.target.value)
name={name}
onChange={(e) =>
parent.onChange(e.target.name, e.target.files[0])
}
/>
<span style={{ fontSize: fontSize.mobile.span }}>
گواهی تدریس خود را آپلود کنید.
</span>
</>
) : (
<>
<input
type="file"
name="file"
onChange={(e) =>
parent.onChange(e.target.name, e.target.files[0])
}
/>
<span
style={{
fontSize: fontSize.mobile.span,
width: "100%",
textAlign: "center",
margin: "auto",
}}
>
{parent.state[name].name ||
"گواهی تدریس ثبت شده و درحال بررسی می باشد"}
</span>
</>
)}
</div>
) : null}
{window.innerWidth > 1000 ? (
<div className="mobile-auth-profile__document d-flex justify-content-center-align-items-center">
{parent.state[name] === "" ? (
<>
<input
type="file"
// parent.onChange(e.target.name, e.target.value)
name={name}
onChange={(e) =>
parent.onChange(e.target.name, e.target.files[0])
}
/>
<span
style={{
fontSize: fontSize.mobile.span,
width: "100%",
textAlign: "center",
margin: "auto",
}}
>
گواهی تدریس خود را آپلود کنید.
</span>
</>
) : (
<>
<input
label={props.label}
onChange={(e) =>
parent.onChange(e.target.name, e.target.files[0])
}
name={props.name}
defaultValue=""
type="file"
/>
<span
style={{
fontSize: fontSize.mobile.span,
width: "100%",
textAlign: "center",
margin: "auto",
}}
>
{parent.state[name].name ||
"گواهی تدریس ثبت شده و درحال بررسی می باشد"}
</span>
</>
)}
</div>
) : null}
</>
);
}

@ -0,0 +1,38 @@
import React from "react";
import "./index.scss";
export default function Document({ defaultValue, name, onChange } : any) {
return (
<div className="mobile-auth-profile__document d-flex justify-content-center align-items-center mb-3">
{defaultValue?.docFileIds === "" ? (
<>
<input
type="file"
// parent.onChange(e.target.name, e.target.value)
name={name}
// onChange={(e) => onChange(e.target.name, e.target.files[0])}
/>
<span>گواهی تدریس خود را آپلود کنید.</span>
</>
) : (
<>
<input
type="file"
name="file"
// onChange={(e) => onChange(e.target.name, e.target.files[0])}
/>
<span
style={{
width: "100%",
textAlign: "center",
margin: "auto",
}}
>
{defaultValue?.docFileIds.name ||
"گواهی تدریس ثبت شده و درحال بررسی می باشد"}
</span>
</>
)}
</div>
);
}

@ -5,6 +5,7 @@
margin-top: 15px auto 0px; margin-top: 15px auto 0px;
// border: 2px dotted #ccc; // border: 2px dotted #ccc;
position: relative; position: relative;
cursor: pointer;
background-color: #272727; background-color: #272727;
input { input {
width: 100%; width: 100%;

@ -76,79 +76,9 @@
flex-direction: row; flex-direction: row;
justify-content: space-around; justify-content: space-around;
padding: 30px 10px; padding: 30px 10px;
margin-bottom: 50px;
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 15px 14px !important;
font-family: numeralLight;
font-size: 20px;
color: #84de56 !important;
&:focus {
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform: translateY(0.5px);
border-radius: 10px !important;
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px !important;
top: 50% !important;
padding: 0px !important;
transform: translate(0px, -50%) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px !important;
top: -8px !important;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
}
label {
background-color: black;
width: fit-content;
text-align: center;
color: #b5b5b5 !important;
letter-spacing: -1px;
font-size: 14px !important;
}
.Mui-focused {
color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
@media screen and (min-width: 1008px) and (max-width: 1440px) { @media screen and (min-width: 1008px) and (max-width: 1440px) {
@ -160,87 +90,17 @@
padding: 30px 10px; padding: 30px 10px;
flex-direction: row; flex-direction: row;
justify-content: space-around; justify-content: space-around;
margin-bottom: 50px;
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 15px 14px !important;
font-family: numeralLight;
font-size: calc(100vw / 80) !important;
color: #84de56 !important;
&:focus {
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform: translateY(0px);
z-index: 100;
border-radius: 10px !important;
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 10px !important;
top: 50% !important;
padding: 0px !important;
transform: translate(0px, -50%) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px !important;
top: -5px !important;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
z-index: 120 !important;
}
label {
background-color: black;
width: fit-content;
text-align: center;
color: #b5b5b5 !important;
letter-spacing: -1px;
font-size: calc(100vw / 110) !important;
z-index: 120;
}
.Mui-focused {
color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
@media screen and (min-width: 641px) and (max-width: 1007px) { @media screen and (min-width: 641px) and (max-width: 1007px) {
.profile { .profile {
padding: 50px 100px 10px; padding: 50px 100px 10px;
button {
font-size: calc(100vw / 40);
}
header { header {
margin: 0px; margin: 0px;
margin-top: 30px; margin-top: 30px;
@ -252,86 +112,15 @@
width: 100%; width: 100%;
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 15px 14px !important;
font-family: numeralLight;
font-size: calc(100vw / 40);
background-color: inherit;
color: #84de56;
&:focus {
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform: translateY(0px);
z-index: 100;
border-radius: 10px !important;
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px;
top: calc(50%);
padding: 0px !important;
transform: translate(0px, -50%) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px;
top: -10px;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
}
label {
background-color: black;
width: fit-content;
text-align: center;
color: #b5b5b5 !important;
letter-spacing: -1px;
font-size: calc(100vw / 40);
z-index: 110;
}
.Mui-focused {
color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
} }
@media screen and (max-width: 640px) { @media screen and (max-width: 640px) {
.profile { .profile {
padding: 0px 10px; padding: 0px 10px;
button {
font-size: calc(100vw / 30);
}
header { header {
margin: 0px; margin: 0px;
margin-top: 70px; margin-top: 70px;
@ -343,80 +132,5 @@
width: 100%; width: 100%;
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 15px 14px !important;
font-family: numeralLight;
font-size: calc(100vw / 30);
background-color: inherit;
border-radius: 10px;
color: #84de56 !important;
&:focus {
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform: translateY(0px);
z-index: 100;
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px;
top: calc(50%);
padding: 0px !important;
transform: translate(0px, -50%) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px;
top: -10px;
transform: translate(0px, 0px) scale(0.7) !important;
padding: 0px 10px !important;
}
label {
background-color: black;
width: fit-content;
text-align: center;
color: #b5b5b5 !important;
letter-spacing: -1px;
font-size: calc(100vw / 25);
z-index: 110;
}
.Mui-focused {
color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
} }

@ -20,20 +20,6 @@ function Navigate({ path }: any) {
return <>{history.push(path)}</>; return <>{history.push(path)}</>;
} }
const maxDesktopSize = 1250;
const maxMobileSize = 550;
const fontSize = {
desktop: {
h1: window.innerWidth > maxDesktopSize ? 25 : window.innerWidth / 55,
p: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 90,
},
mobile: {
h1: window.innerWidth > maxMobileSize ? 20 : window.innerWidth / 18,
p: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 28,
},
};
function Profile({ function Profile({
profile, profile,
uploads, uploads,
@ -76,10 +62,10 @@ function Profile({
getCity({ provinceId: profile.provinceId }); getCity({ provinceId: profile.provinceId });
}, []); }, []);
const grades= [ const grades = [
{ {
name : 'پیش دبستانی', name: "پیش دبستانی",
value : 0, value: 0,
}, },
{ {
name: "اول", name: "اول",
@ -138,7 +124,7 @@ function Profile({
} else if (name === "status") { } else if (name === "status") {
setFormData({ setFormData({
...formData, ...formData,
gradeIds: formData.gradeIds.slice(0, 1) || [], gradeIds: formData.gradeIds?.slice(0, 1) || [],
[name]: value, [name]: value,
}); });
} else if (name === "docFileIds") { } else if (name === "docFileIds") {
@ -399,7 +385,13 @@ function Profile({
/> />
</div> </div>
) : null} ) : null}
{formData.status == 2 ? <Document name="docFileIds" /> : null} {formData.status == 2 ? (
<Document
onChange={onChange}
defaultValue={profile}
name="docFileIds"
/>
) : null}
<div className="mb-2"> <div className="mb-2">
<Input <Input
name="postalCode" name="postalCode"

@ -78,77 +78,6 @@
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 15px 14px !important;
font-family: numeralLight;
font-size: 20px;
background-color: #272727;
line-height: 1.5;
&:focus{
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform : translateY(0.5px);
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px;
top: 18px;
padding: 0px !important;
transform: translate(0px, 0px) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px;
top: -8px;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
}
label {
background-color: #272727;
width: fit-content;
text-align: center;
color: #B5B5B5 !important;
letter-spacing: -1px;
font-size: 16px;
}
.Mui-focused {
color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
} }
@ -181,79 +110,6 @@
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 15px 14px !important;
font-family: numeralLight;
font-size: calc(100vw / 80);
background-color: #272727;
color: #84de56;
line-height: 1.5;
border-radius: 10px;
&:focus{
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform : translateY(0.5px);
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px;
top: 15px;
padding: 0px !important;
transform: translate(0px, 0px) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px;
top: -8px;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
}
label {
background-color: #272727;
width: fit-content;
text-align: center;
color: #B5B5B5 !important;
letter-spacing: -1px;
font-size: 16px;
}
.Mui-focused {
// color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
} }
@ -305,79 +161,7 @@
height: 260px; height: 260px;
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 15px 14px !important;
font-family: numeralLight;
font-size: calc(100vw / 40);
background-color: #272727;
color: #84de56;
line-height: 1.5;
border-radius: 10px;
&:focus{
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform : translateY(0.5px);
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px;
top: 15px;
padding: 0px !important;
transform: translate(0px, 0px) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px;
top: -8px;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
}
label {
background-color: #272727;
width: fit-content;
text-align: center;
color: #B5B5B5 !important;
letter-spacing: -1px;
font-size: calc(100vw / 40);
}
.Mui-focused {
// color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
} }
@ -429,77 +213,5 @@
height: 260px; height: 260px;
} }
} }
.MuiFormControl-root {
width: 100%;
margin: 10px auto !important;
.MuiSelect-iconOutlined {
display: none;
}
.MuiSelect-outlined.MuiSelect-outlined {
padding-right: 15px;
}
color: #797979 !important;
}
.MuiOutlinedInput-notchedOutline {
top: 0px !important;
}
.MuiOutlinedInput-notchedOutline {
border-color: #666666 !important;
border-width: 1px !important;
color: green !important;
border-radius: 10px !important;
}
.MuiOutlinedInput-input {
padding: 15px 14px !important;
font-family: numeralLight;
font-size: calc(100vw / 30);
background-color: #272727;
color: #84de56;
line-height: 1.5;
border-radius: 10px;
&:focus{
border: 0.2px solid #84de56 !important;
border-radius: 10px;
transform : translateY(0.5px);
}
}
.MuiInputLabel-outlined {
font-family: numeralLight !important;
display: inline !important;
position: absolute;
text-align: right !important;
right: 15px;
top: 15px;
padding: 0px !important;
transform: translate(0px, 0px) scale(1) !important;
}
.MuiInputLabel-shrink {
text-align: center !important;
display: inline;
position: absolute;
right: 0px;
top: -8px;
transform: translate(0px, 0px) scale(0.85) !important;
padding: 0px 10px !important;
}
label {
background-color: #272727;
width: fit-content;
text-align: center;
color: #B5B5B5 !important;
letter-spacing: -1px;
font-size: calc(100vw / 30);
}
.Mui-focused {
// color: rgba(0, 0, 0, 1) !important;
border-color: #84de56 !important;
// background-color: white;
color: #84de56 !important;
}
.MuiInputBase-input {
height: auto !important;
}
} }
} }

@ -57,7 +57,6 @@
&-active{ &-active{
box-shadow: 0px 0px 6px #4DD35B; box-shadow: 0px 0px 6px #4DD35B;
background-color: #4DD35B; background-color: #4DD35B;
border: none;
.subscribe-radio__name{ .subscribe-radio__name{
} }
.subscribe-radio__factor{ .subscribe-radio__factor{

@ -29,7 +29,7 @@ function SubscribeRadio({ data, selectedVOD, selectVOD }: any) {
} }
checkedIcon={ checkedIcon={
<CircleRoundedIcon <CircleRoundedIcon
style={{ color: "white", fontSize: 40, padding: 0 }} style={{ color: "white", fontSize: 37, padding: 0, margin : '6px 3px 3px' }}
/> />
} }
checked={selectedVOD?.id === data.id} checked={selectedVOD?.id === data.id}

Loading…
Cancel
Save