parent
							
								
									b94acb6143
								
							
						
					
					
						commit
						eb18a88fbf
					
				
				 37 changed files with 464 additions and 203 deletions
			
			
		| After Width: | Height: | Size: 2.4 KiB | 
| After Width: | Height: | Size: 659 KiB | 
| After Width: | Height: | Size: 207 KiB | 
| After Width: | Height: | Size: 81 KiB | 
| After Width: | Height: | Size: 101 KiB | 
| After Width: | Height: | Size: 366 KiB | 
| @ -1,40 +1,57 @@ | ||||
| import React, { Component } from 'react'; | ||||
| import { Link } from 'react-router-dom'; | ||||
| import moment from 'jalali-moment'; | ||||
| import Avatar from '@material-ui/core/Avatar'; | ||||
| import React, { Component } from "react"; | ||||
| import { Link } from "react-router-dom"; | ||||
| import moment from "jalali-moment"; | ||||
| import Avatar from "@material-ui/core/Avatar"; | ||||
| 
 | ||||
| import './index.scss'; | ||||
| import "./index.scss"; | ||||
| export default class Chat extends Component { | ||||
|   render() { | ||||
|     const { data } = this.props; | ||||
|     const { data, selectedUser } = this.props; | ||||
|     return ( | ||||
|       <> | ||||
|         { | ||||
|           window.innerWidth < 1000 ? | ||||
|         {window.innerWidth < 1000 ? ( | ||||
|           <Link to={`/chatroom/${data.id}`} className="chat d-flex"> | ||||
|             <Avatar src={data.imageUrl} alt={data.name} className={'avatar fontLight'} /> | ||||
|             <Avatar | ||||
|               src={data.imageUrl} | ||||
|               alt={data.name} | ||||
|               className={"avatar fontLight"} | ||||
|             /> | ||||
|             <div className="chat__data d-flex flex-column"> | ||||
|               <h1 className="chat__data--name">{data.name}</h1> | ||||
|               <p className="chat__data--lastMessage">{data.lastMessage.slice(0, 40) + '...'}</p> | ||||
|               <p className="chat__data--lastMessage"> | ||||
|                 {data.lastMessage.slice(0, 40) + "..."} | ||||
|               </p> | ||||
|               <span>{data.badge}</span> | ||||
|               <div>{moment(data.date || new Date()).format('jD/jM hh:mm')}</div> | ||||
|               <div>{moment(data.date || new Date()).format("jD/jM hh:mm")}</div> | ||||
|             </div> | ||||
|           </Link> : null | ||||
|         } | ||||
|         { | ||||
|           window.innerWidth > 1000 ? | ||||
|           <div className="chat d-flex" onClick={() => this.props.parent.setState({ selectedUser : data.id })}> | ||||
|             <Avatar src={data.imageUrl} alt={data.name} className={'avatar fontLight'} /> | ||||
|           </Link> | ||||
|         ) : null} | ||||
|         {window.innerWidth > 1000 ? ( | ||||
|           <div | ||||
|             className="chat d-flex" | ||||
|             onClick={() => | ||||
|               this.props.parent.setState({ selectedUser: data.id }) | ||||
|             } | ||||
|             style={{ | ||||
|               backgroundColor: selectedUser === data.id ? "#eee" : "white", | ||||
|             }} | ||||
|           > | ||||
|             <Avatar | ||||
|               src={data.imageUrl} | ||||
|               alt={data.name} | ||||
|               className={"avatar fontLight"} | ||||
|             /> | ||||
|             <div className="chat__data d-flex flex-column"> | ||||
|               <h1 className="chat__data--name">{data.name}</h1> | ||||
|               <p className="chat__data--lastMessage">{data.lastMessage.slice(0, 40) + '...'}</p> | ||||
|               <p className="chat__data--lastMessage"> | ||||
|                 {data.lastMessage.slice(0, 40) + "..."} | ||||
|               </p> | ||||
|               <span>{data.badge}</span> | ||||
|               <div>{moment(data.date || new Date()).format('jD/jM hh:mm')}</div> | ||||
|               <div>{moment(data.date || new Date()).format("jD/jM hh:mm")}</div> | ||||
|             </div> | ||||
|           </div> : null | ||||
|         } | ||||
|           </div> | ||||
|         ) : null} | ||||
|       </> | ||||
|       
 | ||||
|     ); | ||||
|   } | ||||
| } | ||||
|  | ||||
| @ -0,0 +1,15 @@ | ||||
| import React, { Component } from 'react'; | ||||
| 
 | ||||
| import './index.scss'; | ||||
| export default function AddToCart(props) { | ||||
|   return( | ||||
|     <> | ||||
|       { | ||||
|         window.innerWidth > 1000 ? 
 | ||||
|         <section className="product-addtocart d-flex flex-column"> | ||||
|           
 | ||||
|         </section> : null | ||||
|       } | ||||
|     </> | ||||
|   ); | ||||
| } | ||||
| @ -0,0 +1,5 @@ | ||||
| .product-addtocart{ | ||||
|   flex: 3.5; | ||||
|   background-color: #eee; | ||||
|   margin: 10px; | ||||
| } | ||||
| @ -1,5 +1,8 @@ | ||||
| a { | ||||
|   text-decoration: none; | ||||
|   font-family: numeralLight; | ||||
|   color: #6F7074; | ||||
| } | ||||
| .MuiBreadcrumbs-li{ | ||||
|   a { | ||||
|     text-decoration: none; | ||||
|     font-family: numeralLight; | ||||
|     color: #6F7074; | ||||
|     letter-spacing: -1px; | ||||
|   } | ||||
| } | ||||
|  | ||||
| @ -0,0 +1,22 @@ | ||||
| import React, { Component } from 'react'; | ||||
| 
 | ||||
| import './index.scss'; | ||||
| export default function Gallery(props) { | ||||
|   return( | ||||
|     <> | ||||
|       { | ||||
|         window.innerWidth > 1000 ? 
 | ||||
|         <section className="product-gallery d-flex flex-column"> | ||||
|           <div className="product-gallery__top"> | ||||
| 
 | ||||
|           </div> | ||||
|           <div className="product-gallery__list d-flex"> | ||||
|             <div></div> | ||||
|             <div></div> | ||||
|             <div></div> | ||||
|           </div> | ||||
|         </section> : null | ||||
|       } | ||||
|     </> | ||||
|   ); | ||||
| } | ||||
| @ -0,0 +1,21 @@ | ||||
| .product-gallery{ | ||||
|   flex: 5; | ||||
|   margin: 10px; | ||||
|   justify-content: space-between; | ||||
|   &__top{ | ||||
|     width: 100%; | ||||
|     height: 320px; | ||||
|     background-color: #eee; | ||||
|     border-radius: 20px; | ||||
|   } | ||||
|   &__list{ | ||||
|     width: 100%; | ||||
|     justify-content: space-between; | ||||
|     & div{ | ||||
|       min-width: 110px; | ||||
|       height: 110px; | ||||
|       background-color: #eee; | ||||
|       border-radius: 20px; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @ -0,0 +1,15 @@ | ||||
| import React, { Component } from 'react'; | ||||
| 
 | ||||
| import './index.scss'; | ||||
| export default function Info(props) { | ||||
|   return( | ||||
|     <> | ||||
|       { | ||||
|         window.innerWidth > 1000 ? 
 | ||||
|         <section className="product-info d-flex flex-column"> | ||||
|           
 | ||||
|         </section> : null | ||||
|       } | ||||
|     </> | ||||
|   ); | ||||
| } | ||||
| @ -0,0 +1,5 @@ | ||||
| .product-info{ | ||||
|   flex: 6; | ||||
|   background-color: #eee; | ||||
|   margin: 10px; | ||||
| } | ||||
					Loading…
					
					
				
		Reference in new issue