TImourka/Internet_Programming_PIbd-21_Kouvshinoff_T_A
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

GG 4 lab

Browse Source
This commit is contained in:
Timourka 2023-11-23 22:42:19 +04:00
parent 152628b775
commit 2a4d54ea96
45 changed files with 4780 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
laba3/~$отчёт.docx
View File

Binary file not shown.

BIN
laba4/Color Hunt Palette 252b484450695b9a8bf7e987.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 479 B

BIN
laba4/Color Hunt Palette 57375dff3fa4ff9b82ffc8c8.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 479 B

BIN
laba4/Icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.1 KiB

BIN
laba4/checkBox.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 184 B

BIN
laba4/createtest.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 113 KiB

BIN
laba4/createtest.psd Normal file
View File

Binary file not shown.

BIN
laba4/icon.psd Normal file
View File

Binary file not shown.

BIN
laba4/logIn.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 108 KiB

BIN
laba4/logIn.psd Normal file
View File

Binary file not shown.

BIN
laba4/mainPage.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 500 KiB

BIN
laba4/mainPage.psd Normal file
View File

Binary file not shown.

BIN
laba4/profile.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 75 KiB

BIN
laba4/profile.psd Normal file
View File

Binary file not shown.

BIN
laba4/signIn.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 144 KiB

BIN
laba4/signIn.psd Normal file
View File

Binary file not shown.

2
laba4/site/.editorconfig Normal file
View File

@ -0,0 +1,2 @@
[*]
end_of_line = lf

26
laba4/site/.eslintrc.cjs Normal file
View File

@ -0,0 +1,26 @@
module.exports = {
root: true,
env: { browser: true, es2020: true },
extends: [
'airbnb-base',
'plugin:react/recommended',
'plugin:react/jsx-runtime',
'plugin:react-hooks/recommended',
],
ignorePatterns: ['dist', '.eslintrc.cjs'],
parserOptions: { ecmaVersion: 12, sourceType: 'module' },
settings: { react: { version: '18.2' } },
plugins: ['react-refresh'],
rules: {
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
'indent': 'off',
'no-console': 'off',
'arrow-body-style': 'off',
'implicit-arrow-linebreak': 'off',
'linebreak-style': 'off',
'object-curly-newline': 'off',
},
}

24
laba4/site/.gitignore vendored Normal file
View File

@ -0,0 +1,24 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

29
laba4/site/README.md Normal file
View File

@ -0,0 +1,29 @@
#### Окружение:
- nodejs 18;
- VSCode;
- ESLint плагин для VSCode;
- для отладки необходимы бразузеры Chrome или Edge.
#### Создание пустого проекта:
```commandline
npm create vite@latest ./ -- --template react
```
#### Установка зависимостей:
```commandline
npm install
```
#### Запуск проекта:
```commandline
npm run dev
```
#### Сборка проекта:
```commandline
npm run build
```

BIN
laba4/site/image.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 115 KiB

15
laba4/site/index.html Normal file
View File

@ -0,0 +1,15 @@
<html lang="ru">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>unreal tests</title>
</head>
<body class="d-flex flex-column" style="height: auto; min-height: 100%">
<div id="root" class="d-flex flex-column" style="height: auto; min-height: 100%" ></div>
<script type="module" src="/src/main.jsx"></script>
</body>
</html>

14
laba4/site/jsconfig.json Normal file
View File

@ -0,0 +1,14 @@
{
"compilerOptions": {
"module": "ESNext",
"moduleResolution": "Node",
"target": "ES2020",
"jsx": "react",
"strictNullChecks": true,
"strictFunctionTypes": true
},
"exclude": [
"node_modules",
"**/node_modules/*"
]
}

4344
laba4/site/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

32
laba4/site/package.json Normal file
View File

@ -0,0 +1,32 @@
{
"name": "lec4",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
"preview": "vite preview"
},
"dependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.18.0",
"bootstrap": "^5.3.2",
"react-bootstrap": "^2.9.1",
"react-bootstrap-icons": "^1.10.3",
"prop-types": "^15.8.1"
},
"devDependencies": {
"@types/react": "^18.2.15",
"@types/react-dom": "^18.2.7",
"@vitejs/plugin-react": "^4.0.3",
"eslint": "^8.45.0",
"eslint-config-airbnb-base": "^15.0.0",
"eslint-plugin-react": "^7.32.2",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.4.3",
"vite": "^4.4.5"
}
}

3
laba4/site/public/favicon.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-cart2" viewBox="0 0 16 16">
<path d="M0 2.5A.5.5 0 0 1 .5 2H2a.5.5 0 0 1 .485.379L2.89 4H14.5a.5.5 0 0 1 .485.621l-1.5 6A.5.5 0 0 1 13 11H4a.5.5 0 0 1-.485-.379L1.61 3H.5a.5.5 0 0 1-.5-.5zM3.14 5l1.25 5h8.22l1.25-5H3.14zM5 13a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm-2 1a2 2 0 1 1 4 0 2 2 0 0 1-4 0zm9-1a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm-2 1a2 2 0 1 1 4 0 2 2 0 0 1-4 0z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 463 B

0
laba4/site/src/App.css Normal file
View File

23
laba4/site/src/App.jsx Normal file
View File

@ -0,0 +1,23 @@
import PropTypes from 'prop-types';
import { Outlet } from 'react-router-dom';
import './App.css';
import Footer from './components/footer/Footer.jsx';
import Header from './components/navigation/Header.jsx';
const App = ({ routes }) => {
return (
<>
<Header routes={routes}></Header>
<main>
<Outlet />
</main>
<Footer />
</>
);
};
App.propTypes = {
routes: PropTypes.array,
};
export default App;

BIN
laba4/site/src/assets/icon-994c7fa6.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.1 KiB

BIN
laba4/site/src/assets/image-cd5bd8e6.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 115 KiB

5
laba4/site/src/components/footer/Footer.css Normal file
View File

@ -0,0 +1,5 @@
footer {
background-color: #f7e987;
height: 32px;
color: #5b9a8b;
}

11
laba4/site/src/components/footer/Footer.jsx Normal file
View File

@ -0,0 +1,11 @@
import './Footer.css';
const Footer = () => {
return (
<footer className="footer d-flex flex-shrink-0 justify-content-center align-items-center">
Timour, 2023
</footer>
);
};
export default Footer;

26
laba4/site/src/components/navigation/Header.css Normal file
View File

@ -0,0 +1,26 @@
header nav {
background-color: #f7e987;
color: #5b9a8b !important;
}
@media (min-width: 768px) {
header nav {
height: 64px;
}
}
header nav a:hover {
text-decoration: underline;
}
header nav a {
text-decoration: underline;
color: #5b9a8b !important;
font-size: 1.5rem !important;
}
header nav name {
color: #5b9a8b !important;
font-size: 2rem !important;
}
header nav img{
height: 3rem !important;
}

32
laba4/site/src/components/navigation/Header.jsx Normal file
View File

@ -0,0 +1,32 @@
import './Header.css';
import { Link } from 'react-router-dom';
import icon from '../../assets/icon-994c7fa6.png';
const Header = () => {
return (
<header>
<nav className="navbar navbar-expand-md navbar-dark">
<div className="container-fluid">
<Link className="navbar-brand" to="/">
<name>
<img src={icon} className="img-fluid" alt={'...'}/>
Нереальные тесты
</name>
</Link>
<button className="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span className="navbar-toggler-icon"></span>
</button>
<div className="navbar-collapse collapse justify-content-end" id="navbarNav">
<div className="navbar-nav">
<Link className="nav-link active" to="/logIn.html">Вход</Link>
<Link className="nav-link" to="/signIn.html">Регистрация</Link>
<Link className="nav-link" to="/profile.html">Профиль</Link>
</div>
</div>
</div>
</nav>
</header>
);
};
export default Header;

51
laba4/site/src/index.css Normal file
View File

@ -0,0 +1,51 @@
h1 {
font-size: 1.5em;
color: #f7e987;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
h2 {
font-size: 1.25em;
color: #f7e987;
text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 3px 3px 0 #000;
}
h3 {
font-size: 1.1em;
color: #f7e987;
}
.startButton{
color: #f7e987;
font-size: 1.1em;
background-color: #252b48;
}
main{
background-color: #5b9a8b;
color: #f7e987;
height: auto;
min-height: 90%;
}
body{
height: auto;
min-height: 100%;
}
.carousel-item{
height: 30rem !important;
background-repeat: no-repeat;
background-size:cover;
background-position: center;
}
.carouselItem1{
background-image: url("image.jpg");
}
.carouselItem2{
background-image: url("image.jpg");
}
.carouselItem3{
background-image: url("image.jpg");
}

31
laba4/site/src/main.jsx Normal file
View File

@ -0,0 +1,31 @@
import 'bootstrap/dist/css/bootstrap.min.css';
import React from 'react';
import ReactDOM from 'react-dom/client';
import { RouterProvider, createBrowserRouter } from 'react-router-dom';
import App from './App.jsx';
import './index.css';
import ErrorPage from './pages/ErrorPage.jsx';
import MainPage from './pages/MainPage.jsx';
const routes = [
{
index: true,
path: '/',
element: <MainPage />,
},
];
const router = createBrowserRouter([
{
path: '/',
element: <App routes={routes} />,
children: routes,
errorElement: <ErrorPage />,
},
]);
ReactDOM.createRoot(document.getElementById('root')).render(
<React.StrictMode>
<RouterProvider router={router} />
</React.StrictMode>,
);

19
laba4/site/src/pages/ErrorPage.jsx Normal file
View File

@ -0,0 +1,19 @@
import { Alert, Button, Container } from 'react-bootstrap';
import { useNavigate } from 'react-router-dom';
const ErrorPage = () => {
const navigate = useNavigate();
return (
<Container fluid className="p-2 row justify-content-center">
<Container className='col-md-6'>
<Alert variant="danger">
Страница не найдена
</Alert>
<Button className="w-25 mt-2" variant="primary" onClick={() => navigate(-1)}>Назад</Button>
</Container>
</Container>
);
};
export default ErrorPage;

63
laba4/site/src/pages/MainPage.jsx Normal file
View File

@ -0,0 +1,63 @@
import { Link } from 'react-router-dom';
const MainPage = () => {
return (
<>
<div style={{ marginTop: '1rem', backgroundColor: '#252b48' }}>
<div id="carouselExample" style={{ maxWidth: '30rem' }} className="carousel slide w-50 mx-auto">
<div className="carousel-inner">
<div className="carousel-item active carouselItem1">
<div style={{ position: 'absolute', top: '50%', transform: 'translateY(-50%)', textAlign: 'center', width: '100%' }}>
<h2>Ваше описание</h2>
</div>
<div style={{ position: 'absolute', bottom: '2', transform: 'translateY(-50%)', textAlign: 'center', width: '100%' }}>
<Link to="/testPage.html" className="btn btn-primary startButton" >Начать</Link>
</div>
</div>
<div className="carousel-item carouselItem2">
<div style={{ position: 'absolute', top: '50%', transform: 'translateY(-50%)', textAlign: 'center', width: '100%' }}>
<h2>Ваше описание</h2>
</div>
<div style={{ position: 'absolute', bottom: '2', transform: 'translateY(-50%)', textAlign: 'center', width: '100%' }}>
<Link to="/testPage.html" className="btn btn-primary startButton" >Начать</Link>
</div>
</div>
<div className="carousel-item carouselItem3">
<div style={{ position: 'absolute', top: '50%', transform: 'translateY(-50%)', textAlign: 'center', width: '100%' }}>
<h2>Ваше описание</h2>
</div>
<div style={{ position: 'absolute', bottom: '2', transform: 'translateY(-50%)', textAlign: 'center', width: '100%' }}>
<Link to="/testPage.html" className="btn btn-primary startButton" >Начать</Link>
</div>
</div>
</div>
<button className="carousel-control-prev" type="button" data-bs-target="#carouselExample" data-bs-slide="prev">
<span className="carousel-control-prev-icon" aria-hidden="true"></span>
<span className="visually-hidden">Previous</span>
</button>
<button className="carousel-control-next" type="button" data-bs-target="#carouselExample" data-bs-slide="next">
<span className="carousel-control-next-icon" aria-hidden="true"></span>
<span className="visually-hidden">Next</span>
</button>
</div>
</div>
<div className="container mt-3 mx-auto" style={{ width: '70%' }}>
<div className="row justify-content-center align-items-center g-2 mt-3 mb-3" style={{ height: '10rem' }}>
<div className="col-3 h-100">
<img src="image.jpg" className="w-100 h-100" style={{ objectFit: 'cover' }} />
</div>
<div className="col justify-content-between h-100" style={{ position: 'relative', width: '70%' }}>
<div className="row-10 justify-content-center align-items-center g-2">
<h3 className="w-100 mx-auto text-left">описание</h3>
</div>
<div className="row-2 justify-content-left align-items-left g-2" style={{ position: 'absolute', bottom: '2', left: '2', width: '100%' }}>
<Link to="/testPage.html" className="btn btn-primary startButton">Начать</Link>
</div>
</div>
</div>
</div>
</>
);
};
export default MainPage;

13
laba4/site/vite.config.js Normal file
View File

@ -0,0 +1,13 @@
/* eslint-disable import/no-extraneous-dependencies */
import react from '@vitejs/plugin-react';
import { defineConfig } from 'vite';
// https://vitejs.dev/config/
export default defineConfig({
plugins: [react()],
build: {
sourcemap: true,
chunkSizeWarningLimit: 1024,
emptyOutDir: true,
},
});

BIN
laba4/testInProcess1.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 295 KiB

BIN
laba4/testInProcess1.psd Normal file
View File

Binary file not shown.

BIN
laba4/testPage.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 280 KiB

BIN
laba4/testPage.psd Normal file
View File

Binary file not shown.

17
laba4/Заказ.txt Normal file
View File

@ -0,0 +1,17 @@
___Дизайн для сайта с тестами___
Необходимо сделать современный дизайн + вёрстка.
Экраны:
– главная страница
– страница с кнопкой начать тест
– страница прохождения теста в двух видах(ответ картинкой, ответ текстом и прогрессс барами).
– страница создания теста(выбор картинки(как при прохождении) и формы ввода ответа(примеры покажу).
– Страница со ссылкой на этот тест(поделиться в соц тетях) и рейтинговая таблица
– Страница с результатами ответов на тест.
Дополнительно:
– Всплывающие окна подтверждения действия
– Всплывающие уведомления
Аудитория преимущественно детская, дизайн должен быть понятным.
Необходимо предусмотреть места под рекламу.
Остальные детали и ссылку на сайт, для которого нужен дизайн, пришлю в сообщениях.

BIN
laba4/отчёт.docx Normal file
View File

Binary file not shown.