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(
(state) => ({
status: state.publicApi.status,
status: state.user.status,
}),
{}
)(PrivateRouter);

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

@ -1,24 +1,25 @@
.submit{
background-color: #4DD35B;
.submit {
background-color: #4dd35b;
color: white;
border-radius: 10px;
border: 0px;
}
.mobile, .desktop{
.mobile,
.desktop {
display: flex;
}
.submit-large{
.submit-large {
padding: 12px 24px;
}
.submit-medium{
padding : 10px 20px;
.submit-medium {
padding: 10px 20px;
}
.submit-small{
padding : 8px 16px;
.submit-small {
padding: 8px 16px;
}
.rec-arrow-left {
@ -122,10 +123,83 @@
}
.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;
border-bottom: 1px solid #707070 !important;
color: white !important;
@ -139,62 +213,98 @@
color: white !important;
}
.MuiOutlinedInput-notchedOutline legend{
.MuiOutlinedInput-notchedOutline legend {
display: none !important;
}
@media screen and (min-width: 1441px) {
.submit{
.submit {
font-size: 20px;
}
.main{
.main {
main {
max-width: 1350px;
}
}
.mobile{
.mobile {
display: none !important;
}
.MuiFormControl-root {
label {
font-size: 14px;
}
}
.MuiOutlinedInput-input {
font-size: 20px;
}
}
@media screen and (min-width: 1008px) and (max-width: 1440px){
.submit{
font-size : calc(100vw / 80);
@media screen and (min-width: 1008px) and (max-width: 1440px) {
.submit {
font-size: calc(100vw / 80);
}
.main{
.main {
main {
max-width: 1250px;
}
}
.mobile{
.mobile {
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) {
.main{
.main {
main {
max-width: 900px;
}
}
.desktop{
.desktop {
display: none !important;
}
.submit-large{
font-size: calc(100vw / 38);
.submit-large {
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) {
.main{
.main {
main {
max-width: 500px;
}
}
.desktop{
.desktop {
display: none !important;
}
.submit{
font-size: calc(100vw / 25);
.submit {
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;
position: relative;
font-family: numeralLight;
&__options{
color: #B5B5B5;
&__options {
color: #b5b5b5;
a {
color: #84de56;
}
@ -12,7 +12,7 @@
img {
// transform: rotate(-90deg);
}
.MuiButtonBase-root{
.MuiButtonBase-root {
padding: 0px !important;
}
background: linear-gradient(
@ -73,7 +73,7 @@
}
&__back {
margin-bottom: 60px;
img{
img {
transform: rotate(-90deg);
}
a {
@ -81,83 +81,14 @@
font-size: 13px;
}
}
&__options{
div{
&__options {
div {
font-size: 13px;
}
a{
a {
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 {
margin-bottom: 40px;
img{
img {
transform: rotate(-90deg);
}
a {
@ -203,92 +134,21 @@
font-size: calc(100vw / 110);
}
}
&__options{
div{
&__options {
div {
font-size: calc(100vw / 110);
}
a{
a {
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) {
.login {
background: black;
.footer{
.footer {
display: none !important;
}
section {
@ -308,7 +168,7 @@
background-color: #84de56;
color: white;
font-size: calc(100vw / 30);
width : 100%;
width: 100%;
max-width: 400px;
margin: 50px auto 0px;
padding: 10px 0px;
@ -335,95 +195,22 @@
color: white;
font-size: calc(100vw / 110);
}
img{
width : 50px;
img {
width: 50px;
}
}
&__options{
&__options {
padding-top: 20px;
div{
div {
font-size: calc(100vw / 40);
}
a{
a {
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) {
.login {
background: black;
@ -468,96 +255,23 @@
&__back {
position: fixed;
top: 70px;
left : 20px;
left: 20px;
margin-bottom: 40px;
a {
color: white;
font-size: calc(100vw / 110);
}
img{
img {
// transform: scale()
}
}
&__options{
div{
&__options {
div {
font-size: calc(100vw / 30);
}
a{
a {
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 "./index.scss";
import moment from "jalali-moment";
export default function Birthdate(props) {
const { defaultValue, parent, name } = props;
export default function Birthdate({ defaultValue, name, ...props }) {
let momentDate = moment(defaultValue[name]);
let isvalid = momentDate.isValid();
const day = isvalid ? momentDate.format("jDD") : null,
@ -15,7 +14,7 @@ export default function Birthdate(props) {
let _state = { ...state, [_name]: value };
setState(_state);
parent.onChange(
props.onChange(
name,
moment
.from(`${_state.year}/${_state.month}/${_state.day}`, "fa", "YYYY/M/D")
@ -32,7 +31,7 @@ export default function Birthdate(props) {
placeholder="روز"
maxLength={2}
onInput={onInput.dayHandler}
parent={{ onChange }}
onChange={onChange}
defaultValue={state}
/>
<span>/</span>
@ -42,7 +41,7 @@ export default function Birthdate(props) {
placeholder="ماه"
maxLength={2}
onInput={onInput.monthHandler}
parent={{ onChange }}
onChange={onChange}
defaultValue={state}
/>
<span>/</span>
@ -52,7 +51,7 @@ export default function Birthdate(props) {
placeholder="سال"
maxLength={4}
onInput={onInput.yearHandler}
parent={{ onChange }}
onChange={onChange}
defaultValue={state}
/>
</div>

@ -11,44 +11,77 @@
}
span {
color: #bfbfbf;
margin: 0px 5px;
}
input {
border: 0px;
border: none !important;
background-color: rgba(204, 204, 204, 0.098);
font-family: numeralLight;
color: #84de56;
max-width: 40px;
text-align: center !important;
direction: ltr;
margin: 0px 5px;
margin: 0px 5px !important;
border: none;
&:focus {
outline: 0px;
border: 0px;
}
&::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) {
span {
font-size: 14px;
@media screen and (min-width: 1441px) {
.birthdate {
label {
font-size: 14px !important;
}
span {
font-size: 16px;
}
input {
font-size: 16px;
&::placeholder {
font-size: 16px;
}
}
}
input {
font-size: 14px;
}
&::placeholder {
font-size: 15px;
@media screen and (min-width: 1008px) and (max-width: 1440px) {
.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 {
label {
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;
// border: 2px dotted #ccc;
position: relative;
cursor: pointer;
background-color: #272727;
input {
width: 100%;

@ -76,79 +76,9 @@
flex-direction: row;
justify-content: space-around;
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) {
@ -160,87 +90,17 @@
padding: 30px 10px;
flex-direction: row;
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) {
.profile {
padding: 50px 100px 10px;
button {
font-size: calc(100vw / 40);
}
header {
margin: 0px;
margin-top: 30px;
@ -252,86 +112,15 @@
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) {
.profile {
padding: 0px 10px;
button {
font-size: calc(100vw / 30);
}
header {
margin: 0px;
margin-top: 70px;
@ -343,80 +132,5 @@
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)}</>;
}
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({
profile,
uploads,
@ -76,10 +62,10 @@ function Profile({
getCity({ provinceId: profile.provinceId });
}, []);
const grades= [
const grades = [
{
name : 'پیش دبستانی',
value : 0,
name: "پیش دبستانی",
value: 0,
},
{
name: "اول",
@ -138,7 +124,7 @@ function Profile({
} else if (name === "status") {
setFormData({
...formData,
gradeIds: formData.gradeIds.slice(0, 1) || [],
gradeIds: formData.gradeIds?.slice(0, 1) || [],
[name]: value,
});
} else if (name === "docFileIds") {
@ -399,7 +385,13 @@ function Profile({
/>
</div>
) : null}
{formData.status == 2 ? <Document name="docFileIds" /> : null}
{formData.status == 2 ? (
<Document
onChange={onChange}
defaultValue={profile}
name="docFileIds"
/>
) : null}
<div className="mb-2">
<Input
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;
}
}
.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;
}
}
.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{
box-shadow: 0px 0px 6px #4DD35B;
background-color: #4DD35B;
border: none;
.subscribe-radio__name{
}
.subscribe-radio__factor{

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

Loading…
Cancel
Save