Skip to content

Commit

Permalink
Merge pull request #14 from nhattpn/nhat
Browse files Browse the repository at this point in the history
Nhat
  • Loading branch information
nhattpn authored Apr 19, 2024
2 parents 0350296 + a871d44 commit ea20a2f
Show file tree
Hide file tree
Showing 14 changed files with 230 additions and 117 deletions.
10 changes: 0 additions & 10 deletions login-frontend/pack

This file was deleted.

11 changes: 7 additions & 4 deletions login-frontend/src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,11 @@ import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
import './App.css';
import '../node_modules/bootstrap/dist/css/bootstrap.min.css';

import FirstPage from './pages/pages/FirstPage';
import AuthPage from './pages/pages/authPage';
import StudentDashBoard from './components/DashBoard/StudentDashboard';
import { Login } from '@mui/icons-material';
import FirstPage from './pages/FirstPage';
import AuthPage from './pages/authPage';
import StudentDashBoard from './pages/StudentDashboard';
import Course from './components/coursePage/Course';
import Course1 from './components/coursePage/Course1';

function App() {
const [username, setUsername] = useState('');
Expand Down Expand Up @@ -37,6 +38,8 @@ function App() {
<Route path='/teacher/dashboard' element={< StudentDashBoard/>} />
<Route path='/student/dashboard' element={< StudentDashBoard/>} />
<Route path='/admin/dashboard' element={< StudentDashBoard/>} />
<Route path='/course' element={<Course />} />
<Route path='/course1' element={<Course1 />} />
</Routes>
</Router>
);
Expand Down
4 changes: 2 additions & 2 deletions login-frontend/src/components/DashBoard/studentInfo.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React from 'react'; // Use React for functional components

import '../../../node_modules/bootstrap/dist/css/bootstrap.min.css';
function StudentInfo(props) {
return (
<div className="student-info"> {/* Use a more specific class name */}
Expand All @@ -15,7 +15,7 @@ function StudentInfo(props) {
Last profile photo update time: ___
</p>
</div>
<div className="data-box">
<div className="data-box col-3x">
<p style={{ fontWeight: 'bold' }}>#Full Name</p>
<p>SV000000</p>
<p style={{ fontWeight: 'bold' }}>#Student ID</p>
Expand Down
29 changes: 29 additions & 0 deletions login-frontend/src/components/coursePage/Course.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import React, { useState, useEffect } from 'react';
import axios from 'axios';
import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
import Container from 'react-bootstrap/Container';
import Nav from 'react-bootstrap/Nav';
import Navbar from 'react-bootstrap/Navbar';
import NavDropdown from 'react-bootstrap/NavDropdown';
import { Button } from 'react-bootstrap';

import Header from './../header_footer/Header';
import Footer from './../header_footer/Footer';

function Course() {
const course_bg = 'http://i.ibb.co/GVRnWJC/course-bg.jpg';

return (
<>
<Header />
<div style={{ height: '80vh', backgroundImage: `url(${course_bg})`, backgroundSize: 'cover', backgroundPositionX: 'center', backgroundRepeat: 'noRepeat', border: '1px solid' }}>
<div style={{ marginTop: '0%', marginRight: 'auto', marginBottom: '0%', marginLeft: '15%', width: '50%', paddingTop: '2%', border: 'none' }}>
<h1>CHĂM CHỈ DỄ DÀNG THÀNH CÔNG</h1>
</div>
</div>
<Footer />
</>
);
}

export default Course;
47 changes: 47 additions & 0 deletions login-frontend/src/components/coursePage/Course1.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
import React, { useState, useEffect } from 'react';
import axios from 'axios';
import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
import Container from 'react-bootstrap/Container';
import Nav from 'react-bootstrap/Nav';
import Navbar from 'react-bootstrap/Navbar';
import NavDropdown from 'react-bootstrap/NavDropdown';
import { Button } from 'react-bootstrap';
import Card from 'react-bootstrap/Card';
import Col from 'react-bootstrap/Col';
import Row from 'react-bootstrap/Row';

import Header from './../header_footer/Header';
import Footer from './../header_footer/Footer';

function Course1() {
return (
<>
<Header />
<div style={{ margin: '5% 10%' }}>
<div style={{ marginBottom: '2%' }}>
<h2 style={{ color: '#eba234' }}>Khóa học của tôi</h2>
</div>
<Row xs={1} md={3} className="g-4">
{Array.from({ length: 7 }).map((_, idx) => (
<Col key={idx}>
<Card>
<Card.Img variant="top" src="holder.js/100px160" />
<Card.Body>
<Card.Title>Card title</Card.Title>
<Card.Text>
This is a longer card with supporting text below as a natural
lead-in to additional content. This content is a little bit
longer.
</Card.Text>
</Card.Body>
</Card>
</Col>
))}
</Row>
</div>
<Footer />
</>
);
}

export default Course1;
12 changes: 6 additions & 6 deletions login-frontend/src/components/header_footer/FirstFooter.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@ import '../../../node_modules/bootstrap/dist/css/bootstrap.min.css';
function FirstFooter() {
return (
<>
<div style={{ marginTop: '5%', height: '100%', backgroundColor: '#0b3942', display: 'flex', textAlign: 'center' }}>
<div style={{ marginTop: '0%', height: '100%', backgroundColor: '#0b3942', display: 'flex', textAlign: 'center' }}>
<div style={{ marginLeft: '8%', width: '12%' }}>
<div style={{ marginTop: '30%', marginRight: '30%', marginLeft: '30%', width: '40%', height: '40%', backgroundColor: 'blueviolet', borderRadius: '50%' }}>
<i class="fas fa-solid fa-phone fa-3x"></i>
<i class="fas fa-solid fa-phone fa-2x" style={{ marginTop: '25%', color: 'white' }}></i>
</div>
<div>
<p style={{ color: 'white ', marginTop: '1rem' }}>
Expand All @@ -19,7 +19,7 @@ function FirstFooter() {
</div>
<div style={{ marginLeft: '3%', width: '12%' }}>
<div style={{ marginTop: '30%', marginRight: '30%', marginLeft: '30%', width: '40%', height: '40%', backgroundColor: 'blueviolet', borderRadius: '50%' }}>
<i class="fas fa-regular fa-envelope fa-3x"></i>
<i class="fas fa-regular fa-envelope fa-2x" style={{ marginTop: '25%', color: 'white' }}></i>
</div>
<div>
<p style={{ color: 'white ', marginTop: '1rem' }}>
Expand All @@ -29,7 +29,7 @@ function FirstFooter() {
</div>
<div style={{ marginLeft: '3%', width: '12%' }}>
<div style={{ marginTop: '30%', marginRight: '30%', marginLeft: '30%', width: '40%', height: '40%', backgroundColor: 'blueviolet', borderRadius: '50%' }}>
<i class="fas fa-solid fa-location-dot fa-3x"></i>
<i class="fas fa-solid fa-location-dot fa-2x" style={{ marginTop: '25%', color: 'white' }}></i>
</div>
<div>
<p style={{ color: 'white ', marginTop: '1rem' }}>
Expand All @@ -40,7 +40,7 @@ function FirstFooter() {

<div style={{ marginLeft: '4%', width: '12%' }}>
<div style={{ marginTop: '30%', marginRight: '30%', marginLeft: '30%', width: '40%', height: '40%', backgroundColor: 'white', borderRadius: '50%' }}>
<i class="fas fa-solid fa-paper-plane fa-3x"></i>
<i class="fas fa-solid fa-paper-plane fa-2x" style={{ marginTop: '25%', color: 'blueviolet' }}></i>
</div>
<div>
<p style={{ color: 'white ', marginTop: '1rem' }}>
Expand All @@ -61,7 +61,7 @@ function FirstFooter() {
</div>
</div>
</>
)
);
}

export default FirstFooter;
22 changes: 14 additions & 8 deletions login-frontend/src/components/header_footer/FirstHeader.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { styled } from "@mui/material/styles";
import Badge from "@mui/material/Badge";
import NotificationsIcon from "@mui/icons-material/Notifications";

function Header() {
function FirstHeader() {
const [notifications, setNotifications] = useState([]);

const StyledBadge = styled(Badge)(() => ({
Expand All @@ -21,8 +21,17 @@ function Header() {
return (
<>
<Navbar style={{ display: 'flex' }}>
<img style={{ width: '15%' }} src={'https://i.ibb.co/CMwkBmw/lSgDz8N.png'} alt="logo" />
<div style={{ marginLeft: '62%', width: '10%' }}>
<img style={{ width: '20vh', marginLeft: '3vh' }} src={'https://i.ibb.co/CMwkBmw/lSgDz8N.png'} alt="logo" />
<Link to={'/teacher'} style={{ marginLeft: '5vh', color: 'black', textDecorationLine: 'none' }}>
<h4 style={{width:'15vh'}}>GIẢNG VIÊN</h4>
</Link>
<Link to={'/student'} style={{ color: 'black', textDecorationLine: 'none' }}>
<h4 style={{width:'15vh'}}>SINH VIÊN</h4>
</Link>
<Link to={'/admin'} style={{ color: 'black', textDecorationLine: 'none' }}>
<h4 style={{width:'15vh'}}>QUẢN LÝ</h4>
</Link>
<div style={{ marginLeft: '40vh', width: '10%' }}>
<Dropdown className="ms-2 me-2">
<Dropdown.Toggle
variant="light"
Expand Down Expand Up @@ -61,12 +70,9 @@ function Header() {
</Dropdown.Menu>
</Dropdown>
</div>
<div style={{ marginLeft: '2%', width: '10%', backgroundColor: 'gainsboro', borderRadius: '50%', textAlign: 'center' }}>
<p style={{ padding: '15% 0%', marginTop: '1rem' }}>TÊN VIẾT TẮT</p>
</div>
</Navbar>
</>
)
);
}

export default Header;
export default FirstHeader;
20 changes: 20 additions & 0 deletions login-frontend/src/components/header_footer/Footer.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import React, { useState, useEffect } from 'react';
import axios from 'axios';
import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';

function Footer() {
return (
<>
<div className="text-center foot">
<p style={{ paddingTop: '2vh', margin: 0 }}>
Copyright &copy; 2024 | All rights reserved
</p>
<p style={{ padding: '1vh', margin: 0 }}>
Mọi thắc mắc vui lòng liên hệ email: [email protected]
</p>
</div>
</>
);
}

export default Footer;
37 changes: 37 additions & 0 deletions login-frontend/src/components/header_footer/Header.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
import React, { useState, useEffect } from 'react';
import axios from 'axios';
import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
import { Navbar, Nav, Form, Button, Row, Col } from "react-bootstrap";
import NavDropdown from 'react-bootstrap/NavDropdown';

function Header() {
return (
<>
<Navbar expand="lg">
<img style={{ width: '15%' }} src={'https://i.ibb.co/CMwkBmw/lSgDz8N.png'} alt="logo" />
{/*<Navbar.Toggle aria-controls="basic-navbar-nav" />*/}
<Navbar.Collapse id="basic-navbar-nav" style={{ marginLeft: '5%' }}>
<Nav className="me-auto">
<NavDropdown title="Các khóa học" id="basic-nav-dropdown" style={{ fontSize: '1.5em' }}>
<NavDropdown.Item href="/course1">Khóa học của tôi</NavDropdown.Item>
</NavDropdown>
<Nav.Link href="/course3" style={{ fontSize: '1.5em' }}>Đăng ký môn học</Nav.Link>
</Nav>
</Navbar.Collapse>
<div>
<h4 style={{ marginTop: '0.5rem' }}>NGUYEN VAN A - MSSV</h4>
</div>
<Button style={{ marginLeft: '3%', color: 'black', backgroundColor: 'white', border: 'none' }}>
<div style={{ marginLeft: '30%', marginRight: '30%', backgroundColor: 'blue', borderRadius: '50%' }}>
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14 5L12.59 6.41L14.17 8H6V10H14.17L12.59 11.58L14 13L18 9L14 5ZM2 2H9V0H2C0.9 0 0 0.9 0 2V16C0 17.1 0.9 18 2 18H9V16H2V2Z" fill="white" />
</svg>
</div>
<h6>Đăng xuất</h6>
</Button>
</Navbar>
</>
);
}

export default Header;
33 changes: 33 additions & 0 deletions login-frontend/src/pages/FirstPage.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import React, { useState, useEffect } from 'react';
import '../../node_modules/bootstrap/dist/css/bootstrap.min.css';
import '../../node_modules/@fortawesome/fontawesome-free/css/all.css';
import axios from 'axios';
import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
import FirstHeader from './../components/header_footer/FirstHeader';
import FirstFooter from './../components/header_footer/FirstFooter';
//import './FirstPage.css';

const slide1 = 'https://i.ibb.co/RbNBFv1/8ktXyJ-n.jpg';

function FirstPage() {
return (
<>
<FirstHeader />
<div style={{ height: '75vh', backgroundImage: `url(${slide1})`, backgroundSize: 'cover', backgroundPositionX: 'center', backgroundRepeat: 'noRepeat' }}>
<div style={{ marginTop: '0%', marginRight: '50%', marginBottom: '0%', marginLeft: '22%', width: '28%', padding: '0%', border: 'none', }}>
<h2 style={{ color: '#fff', fontSize: '1.5em' }}>
CHƯƠNG TRÌNH CHẤT LƯỢNG VỚI ĐA DẠNG NGÀNH
</h2>
<div style={{ marginTop: '1%', marginRight: '35%', marginBottom: '1%', marginLeft: '10%', width: '55%', padding: '0%', borderColor: '#ebff00', borderStyle: 'solid', borderWidth: '1px', borderRadius: '20px' }}>
<h3 style={{ color: '#ebff00', textAlign: 'center', marginBlockStart: '3px', marginBlockEnd: '3px', fontSize: '1.17em' }}>
Training Program
</h3>
</div>
</div>
</div>
<FirstFooter/>
</>
);
}

export default FirstPage;
Original file line number Diff line number Diff line change
Expand Up @@ -28,22 +28,21 @@
background-color: wheat;
height: 8%;
}
.navigation a{
a{
color: #020202;
padding: 2vh 10vh;
text-decoration: none;
}
.active{
border-top: 3px solid blue;
}
.smallbox {
background-color: rgb(204, 203, 203);
font-weight: bold;
width: 95%;
margin: auto;
}
.smallbox p {
box-shadow: 2px 2px 10px rgb(104, 103, 103);
}
.data_box {
margin-left: 1vh;
.data-box{
width: 35vh;
border-right: 1px solid rgb(204, 203, 203);
}
Loading

0 comments on commit ea20a2f

Please sign in to comment.