diff --git a/labs/lab6/README.md b/labs/lab6/README.md index 7dbf7eb..c3c21da 100644 --- a/labs/lab6/README.md +++ b/labs/lab6/README.md @@ -9,7 +9,9 @@ Currently, two official plugins are available: ## React Compiler -The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation). +The React Compiler is enabled on this template. See [this documentation](https://react.dev/learn/react-compiler) for more information. + +Note: This will impact Vite dev & build performances. ## Expanding the ESLint configuration diff --git a/labs/lab6/package-lock.json b/labs/lab6/package-lock.json index 74482a4..4241f50 100644 --- a/labs/lab6/package-lock.json +++ b/labs/lab6/package-lock.json @@ -16,11 +16,15 @@ "react-dom": "^19.2.4" }, "devDependencies": { + "@babel/core": "^7.29.0", "@eslint/js": "^9.39.4", + "@rolldown/plugin-babel": "^0.2.2", + "@types/babel__core": "^7.20.5", "@types/node": "^24.12.2", "@types/react": "^19.2.14", "@types/react-dom": "^19.2.3", "@vitejs/plugin-react": "^6.0.1", + "babel-plugin-react-compiler": "^1.0.0", "eslint": "^9.39.4", "eslint-plugin-react-hooks": "^7.0.1", "eslint-plugin-react-refresh": "^0.5.2", @@ -1257,6 +1261,37 @@ "node": "^20.19.0 || >=22.12.0" } }, + "node_modules/@rolldown/plugin-babel": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/@rolldown/plugin-babel/-/plugin-babel-0.2.2.tgz", + "integrity": "sha512-q9pE8+47bQNHb5eWVcE6oXppA+JTSwvnrhH53m0ZuHuK5MLvwsLoWrWzBTFQqQ06BVxz1gp0HblLsch8o6pvZw==", + "dev": true, + "license": "MIT", + "dependencies": { + "picomatch": "^4.0.3" + }, + "engines": { + "node": ">=22.12.0 || ^24.0.0" + }, + "peerDependencies": { + "@babel/core": "^7.29.0 || ^8.0.0-rc.1", + "@babel/plugin-transform-runtime": "^7.29.0 || ^8.0.0-rc.1", + "@babel/runtime": "^7.27.0 || ^8.0.0-rc.1", + "rolldown": "^1.0.0-rc.5", + "vite": "^8.0.0" + }, + "peerDependenciesMeta": { + "@babel/plugin-transform-runtime": { + "optional": true + }, + "@babel/runtime": { + "optional": true + }, + "vite": { + "optional": true + } + } + }, "node_modules/@rolldown/pluginutils": { "version": "1.0.0-rc.7", "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-rc.7.tgz", @@ -1275,6 +1310,51 @@ "tslib": "^2.4.0" } }, + "node_modules/@types/babel__core": { + "version": "7.20.5", + "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz", + "integrity": "sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/parser": "^7.20.7", + "@babel/types": "^7.20.7", + "@types/babel__generator": "*", + "@types/babel__template": "*", + "@types/babel__traverse": "*" + } + }, + "node_modules/@types/babel__generator": { + "version": "7.27.0", + "resolved": "https://registry.npmjs.org/@types/babel__generator/-/babel__generator-7.27.0.tgz", + "integrity": "sha512-ufFd2Xi92OAVPYsy+P4n7/U7e68fex0+Ee8gSG9KX7eo084CWiQ4sdxktvdl0bOPupXtVJPY19zk6EwWqUQ8lg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/types": "^7.0.0" + } + }, + "node_modules/@types/babel__template": { + "version": "7.4.4", + "resolved": "https://registry.npmjs.org/@types/babel__template/-/babel__template-7.4.4.tgz", + "integrity": "sha512-h/NUaSyG5EyxBIp8YRxo4RMe2/qQgvyowRwVMzhYhBCONbW8PUsg4lkFMrhgZhUe5z3L3MiLDuvyJ/CaPa2A8A==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/parser": "^7.1.0", + "@babel/types": "^7.0.0" + } + }, + "node_modules/@types/babel__traverse": { + "version": "7.28.0", + "resolved": "https://registry.npmjs.org/@types/babel__traverse/-/babel__traverse-7.28.0.tgz", + "integrity": "sha512-8PvcXf70gTDZBgt9ptxJ8elBeBjcLOAcOtoO/mPJjtji1+CdGbHgm77om1GrsPxsiE+uXIpNSK64UYaIwQXd4Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/types": "^7.28.2" + } + }, "node_modules/@types/estree": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz", @@ -1738,6 +1818,16 @@ "npm": ">=6" } }, + "node_modules/babel-plugin-react-compiler": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/babel-plugin-react-compiler/-/babel-plugin-react-compiler-1.0.0.tgz", + "integrity": "sha512-Ixm8tFfoKKIPYdCCKYTsqv+Fd4IJ0DQqMyEimo+pxUOMUR9cVPlwTrFt9Avu+3cb6Zp3mAzl+t1MrG2fxxKsxw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/types": "^7.26.0" + } + }, "node_modules/balanced-match": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", @@ -1746,9 +1836,9 @@ "license": "MIT" }, "node_modules/baseline-browser-mapping": { - "version": "2.10.17", - "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.17.tgz", - "integrity": "sha512-HdrkN8eVG2CXxeifv/VdJ4A4RSra1DTW8dc/hdxzhGHN8QePs6gKaWM9pHPcpCoxYZJuOZ8drHmbdpLHjCYjLA==", + "version": "2.10.18", + "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.18.tgz", + "integrity": "sha512-VSnGQAOLtP5mib/DPyg2/t+Tlv65NTBz83BJBJvmLVHHuKJVaDOBvJJykiT5TR++em5nfAySPccDZDa4oSrn8A==", "dev": true, "license": "Apache-2.0", "bin": { @@ -1759,9 +1849,9 @@ } }, "node_modules/brace-expansion": { - "version": "1.1.13", - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.13.tgz", - "integrity": "sha512-9ZLprWS6EENmhEOpjCYW2c8VkmOvckIJZfkr7rBW6dObmfgJ/L1GpSYW5Hpo9lDz4D1+n0Ckz8rU7FwHDQiG/w==", + "version": "1.1.14", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.14.tgz", + "integrity": "sha512-MWPGfDxnyzKU7rNOW9SP/c50vi3xrmrua/+6hfPbCS2ABNWfx24vPidzvC7krjU/RTo235sV776ymlsMtGKj8g==", "dev": true, "license": "MIT", "dependencies": { @@ -1984,9 +2074,9 @@ } }, "node_modules/electron-to-chromium": { - "version": "1.5.334", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.334.tgz", - "integrity": "sha512-mgjZAz7Jyx1SRCwEpy9wefDS7GvNPazLthHg8eQMJ76wBdGQQDW33TCrUTvQ4wzpmOrv2zrFoD3oNufMdyMpog==", + "version": "1.5.335", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.335.tgz", + "integrity": "sha512-q9n5T4BR4Xwa2cwbrwcsDJtHD/enpQ5S1xF1IAtdqf5AAgqDFmR/aakqH3ChFdqd/QXJhS3rnnXFtexU7rax6Q==", "dev": true, "license": "ISC" }, @@ -1999,6 +2089,15 @@ "is-arrayish": "^0.2.1" } }, + "node_modules/es-errors": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz", + "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==", + "license": "MIT", + "engines": { + "node": ">= 0.4" + } + }, "node_modules/escalade": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz", @@ -2349,9 +2448,9 @@ } }, "node_modules/globals": { - "version": "17.4.0", - "resolved": "https://registry.npmjs.org/globals/-/globals-17.4.0.tgz", - "integrity": "sha512-hjrNztw/VajQwOLsMNT1cbJiH2muO3OROCHnbehc8eY5JyD2gqz4AcMHPqgaOR59DjgUjYAYLeH699g/eWi2jw==", + "version": "17.5.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-17.5.0.tgz", + "integrity": "sha512-qoV+HK2yFl/366t2/Cb3+xxPUo5BuMynomoDmiaZBIdbs+0pYbjfZU+twLhGKp4uCZ/+NbtpVepH5bGCxRyy2g==", "dev": true, "license": "MIT", "engines": { @@ -3226,11 +3325,12 @@ } }, "node_modules/resolve": { - "version": "1.22.11", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.11.tgz", - "integrity": "sha512-RfqAvLnMl313r7c9oclB1HhUEAezcpLjz95wFH4LVuhk9JF/r22qmVP9AMmOU4vMX7Q8pN8jwNg/CSpdFnMjTQ==", + "version": "1.22.12", + "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.12.tgz", + "integrity": "sha512-TyeJ1zif53BPfHootBGwPRYT1RUt6oGWsaQr8UyZW/eAm9bKoijtvruSDEmZHm92CwS9nj7/fWttqPCgzep8CA==", "license": "MIT", "dependencies": { + "es-errors": "^1.3.0", "is-core-module": "^2.16.1", "path-parse": "^1.0.7", "supports-preserve-symlinks-flag": "^1.0.0" diff --git a/labs/lab6/package.json b/labs/lab6/package.json index b856a2b..4623aa0 100644 --- a/labs/lab6/package.json +++ b/labs/lab6/package.json @@ -18,11 +18,15 @@ "react-dom": "^19.2.4" }, "devDependencies": { + "@babel/core": "^7.29.0", "@eslint/js": "^9.39.4", + "@rolldown/plugin-babel": "^0.2.2", + "@types/babel__core": "^7.20.5", "@types/node": "^24.12.2", "@types/react": "^19.2.14", "@types/react-dom": "^19.2.3", "@vitejs/plugin-react": "^6.0.1", + "babel-plugin-react-compiler": "^1.0.0", "eslint": "^9.39.4", "eslint-plugin-react-hooks": "^7.0.1", "eslint-plugin-react-refresh": "^0.5.2", diff --git a/labs/lab6/src/App.tsx b/labs/lab6/src/App.tsx index 02311e9..e4509de 100644 --- a/labs/lab6/src/App.tsx +++ b/labs/lab6/src/App.tsx @@ -1,12 +1,18 @@ -import { useState } from 'react' -import logo from './images/logo.svg' -import NavBar from './components/Navbar.jsx' +import NavBar from './components/Navbar' +import Gallery from "./components/Gallery"; +import Content from "./components/Content"; +import CustomFooter from "./components/CustomFooter"; + + import './styles/App.css' function App() { return ( <> - + + + + ) } diff --git a/labs/lab6/src/components/BuildCard.tsx b/labs/lab6/src/components/BuildCard.tsx new file mode 100644 index 0000000..61c1afa --- /dev/null +++ b/labs/lab6/src/components/BuildCard.tsx @@ -0,0 +1,53 @@ +import Card from '@mui/material/Card'; +import CardActions from '@mui/material/CardActions'; +import CardContent from '@mui/material/CardContent'; +import CardMedia from '@mui/material/CardMedia'; +import Button from '@mui/material/Button'; +import Typography from '@mui/material/Typography'; +import Box from '@mui/material/Box'; +import { styled } from '@mui/material/styles'; +interface ComponentProps { + building: { + img: string, + title: string, + description: string[] + }, + cardNum: number; + } + + + const StyledTypography = styled(Typography)(({ theme }) => ({ + color: theme.palette.text.secondary, + textAlign: 'justify', + marginBottom: '1em', + })); + + +function BuildCard({ building,cardNum} : ComponentProps) { + return ( + + + + + + { building.title } + + { building.description.map((item, ind) => ( + + { item } + + ))} + + + + + + + ) +} + +export default BuildCard; \ No newline at end of file diff --git a/labs/lab6/src/components/Content.tsx b/labs/lab6/src/components/Content.tsx new file mode 100644 index 0000000..2d8c277 --- /dev/null +++ b/labs/lab6/src/components/Content.tsx @@ -0,0 +1,21 @@ +import Container from '@mui/material/Container'; +import Grid from '@mui/material/Grid'; +import structures from "../data"; +import BuildCard from "./BuildCard" +const cardData = [structures[3], structures[6], structures[9], structures[7]] + +function Content() { + return ( + + + {cardData.map((item, index) => ( + + + + ))} + + + ); +} + +export default Content; \ No newline at end of file diff --git a/labs/lab6/src/components/CustomFooter.tsx b/labs/lab6/src/components/CustomFooter.tsx new file mode 100644 index 0000000..1b51991 --- /dev/null +++ b/labs/lab6/src/components/CustomFooter.tsx @@ -0,0 +1,26 @@ +import Container from '@mui/material/Container'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; +import { styled } from '@mui/material/styles'; + +const StyledContainer = styled(Container)(({ theme }) => ({ + backgroundColor: theme.palette.action.hover, + borderRadius: `calc(${theme.shape.borderRadius}px + 8px)`, + marginTop: "50px", + padding: "20px", + color: theme.palette.text.secondary +})); + +function CustomFooter() { + return ( + + + OkunElya + 2026 + FEFU + + + ); +} + +export default CustomFooter; \ No newline at end of file diff --git a/labs/lab6/src/components/Gallery.tsx b/labs/lab6/src/components/Gallery.tsx new file mode 100644 index 0000000..23c44ac --- /dev/null +++ b/labs/lab6/src/components/Gallery.tsx @@ -0,0 +1,41 @@ +import ImageList from '@mui/material/ImageList'; +import ImageListItem from '@mui/material/ImageListItem'; +import structures from "../data"; +import Box from '@mui/material/Box'; +import Container from '@mui/material/Container'; +import ImageListItemBar from '@mui/material/ImageListItemBar'; +const imgData = structures.slice(0, -1); + +function Gallery() { + return ( + + + + {imgData.map((item) => ( + + {item.title} + + + ))} + + + + ); +} + +export default Gallery; \ No newline at end of file diff --git a/labs/lab6/src/components/Navbar.jsx b/labs/lab6/src/components/Navbar.jsx deleted file mode 100644 index 6ff9902..0000000 --- a/labs/lab6/src/components/Navbar.jsx +++ /dev/null @@ -1,35 +0,0 @@ -import AppBar from '@mui/material/AppBar'; -import Toolbar from '@mui/material/Toolbar'; -import { styled } from '@mui/material/styles'; -import Container from '@mui/material/Container'; - -const StyledToolbar = styled(Toolbar)(({ theme }) => ({ - display: 'flex', - alignItems: 'center', - justifyContent: 'space-between', - flexShrink: 0, - borderRadius: `calc(${theme.shape.borderRadius}px + 8px)`, - border: '1px solid', - borderColor: theme.palette.divider, - padding: '8px 12px', -})); - -function NavBar() { - return ( - - - - - - - - ); -} -export default NavBar; \ No newline at end of file diff --git a/labs/lab6/src/components/Navbar.tsx b/labs/lab6/src/components/Navbar.tsx new file mode 100644 index 0000000..8498b22 --- /dev/null +++ b/labs/lab6/src/components/Navbar.tsx @@ -0,0 +1,105 @@ +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import { styled } from '@mui/material/styles'; +import Container from '@mui/material/Container'; +import Typography from '@mui/material/Typography'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import CloseRoundedIcon from '@mui/icons-material/CloseRounded'; +import MenuItem from '@mui/material/MenuItem'; +import Drawer from '@mui/material/Drawer'; +import MenuIcon from '@mui/icons-material/Menu'; +import MenuList from '@mui/material/MenuList'; + +import { useState } from 'react'; + + +const StyledToolbar = styled(Toolbar)(({ theme }) => ({ + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderRadius: `calc(${theme.shape.borderRadius}px + 8px)`, + border: '1px solid', + borderColor: theme.palette.divider, + padding: '8px 12px', +})); + + +const StyledMenuItem =styled(MenuItem)(({}) => ({ + '&.Mui-selected': { + backgroundColor: '#1976d2', + color: "white", + }, + '&.Mui-selected:hover': { + backgroundColor: '#11579c', + color: "white", + }, + '&:hover': { + backgroundColor: 'rgba(69, 146, 223, 0.45)', + }, + +})); +interface ComponentProps { + active: string; +} + +function NavBar({ active }: ComponentProps) { + const [open, setOpen] = useState(false); + + const toggleDrawer = (newOpen: boolean) => () => { + setOpen(newOpen); + }; + return ( + + + + + Самые высокие здания и сооружения + + + + + + + + + + + + + + + + + + Главная + Список зданий + Контакты + + + + + + + ); +} +export default NavBar; \ No newline at end of file diff --git a/labs/lab6/src/data.tsx b/labs/lab6/src/data.tsx new file mode 100644 index 0000000..a3cd105 --- /dev/null +++ b/labs/lab6/src/data.tsx @@ -0,0 +1,118 @@ +import Image1 from './images/image1.jpg'; +import Image2 from './images/image2.jpg'; +import Image3 from './images/image3.jpg'; +import Image4 from './images/image4.jpg'; +import Image5 from './images/image5.jpg'; +import Image6 from './images/image6.jpg'; +import Image7 from './images/image7.jpg'; +import Image8 from './images/image8.jpg'; +import Image9 from './images/image9.jpg'; +import Image10 from './images/image10.jpg'; + +const structures = [ + { + img: Image1, + title: "Раффлз-Сити, Китай", + description: [ + `Раффлз-Сити — комплекс небоскрёбов, расположенный в китайском городе Чунцин, в деловом районе Юйчжун. Построен в 2019 году. Архитекторами комплекса выступили Моше Сафди и Чунцинский архитектурный институт, владельцем является сингапурская группа CapitaLand.`, + `В состав многофункционального комплекса Раффлз-Сити входят восемь высотных башен и обширный подиум, в котором располагаются продуктовый супермаркет, магазины, автосалоны, рестораны, выставочные залы и паркинг. Общая площадь комплекса — свыше 1,1 млн м², + в том числе пятиэтажный торговый центр — 230 тыс. м², офисы — 160 тыс. м² и мультиплекс сети CGV — 5,6 тыс. м². В одной из 350-метровых башен Раффлз-Сити расположен пятизвёздочный отель InterContinental, + также в комплексе насчитывается 1,4 тыс. жилых апартаментов сети Ascott и 26,4 тыс. парковочных мест.` + ], + }, + { + img: Image2, + title: "Авичи-Арена, Швеция", + description: [ + `Авичи-Арена - 85-метровая многоцелевая арена в Стокгольме. Второе по величине сферическое сооружение в мире. Место проведения концертов и спортивных мероприятий. + Арена находится в микрорайоне Глобен-Сити, созданном специально для неё. Имеет вместимость 16 000 человек во время концертов и 13 850 во время хоккейных матчей.`, + `Арена была построена специально к чемпионату мира по хоккею 1989 года и открыта 19 февраля 1989 года. Олицетворяет собой Солнце в Шведской Солнечной системе, крупнейшей в мире модели Солнечной системы.` + ] + }, + { + img: Image3, + title: "Труба ГРЭС-2, Казахстан", + description: [ + `Железобетонная дымовая труба, построенная в 1987 году, имея высоту 420 м, является самой высокой в мире и занесена в Книгу рекордов Гиннесса. + Суммарная масса трубы составляет 60 тысяч тонн, её диаметр у основания составляет 44 м, диаметр устья — 14,2 м.`, + `ГРЭС-2 вырабатывает электроэнергию из высокозольного экибастузского угля двумя энергоблоками по 500 МВт, имеет установленную мощность 1000 МВт. Два её энергоблока вырабатывают около 12 % всей электроэнергии, + производимой в республике. Энергия ГРЭС-2 предназначена для обеспечения севера Казахстана. Потребителями являются десятки предприятий не только Казахстана, но и России.` + ] + }, + { + img: Image4, + title: 'Бурдж-Халифа, Дубай, ОАЭ', + description: [ + `Небоскрёб высотой 828 метров, самое высокое сооружение в мире. Форма здания напоминает сталагмит.`, + `Строительство небоскрёба началось в 2004 году и шло со скоростью 1—2 этажа в неделю. Ежедневно на строительстве работало до 12 000 рабочих. + На его создание ушло около 320 тыс. м³ бетона и более 60 тыс. тонн стальной арматуры. + Бетонные работы были завершены после возведения 160 этажа, далее шла сборка 180-метрового шпиля из металлических конструкций.` + ] + }, + { + img: Image5, + title: "Интинская радиомачта, Инта, Россия", + description: [ + `На подъезде к железнодорожной станции Инта 1, кроме величественных вершин Урала, бросается в глаза металлическая вышка-мачта высотой 462,8 метра. + Она больше чем знаменитая Эйфелева башня, но меньше на 77 метров, чем телевизионная Останкинская в Москве. Антенна навигационной системы «Чайка» предназначена + для определения координат самолётов и кораблей с погрешностью 50–100 метров. Вышка-мачта находится на территории действующей военной части.`, + `По конструкции это классическая GP антенна. Длинна волны передачи - приёма кратна высоте. Планировалось, чтотакие антенны должны были быть построены в нескольких + точках по Полярному кругу.` + ] + }, + { + img: Image6, + title: "Ворота Запада, США", + description: [ + `Арка в Сент-Луисе, также известная под именем «Врата на запад» — мемориал, являющийся частью Джефферсоновского национального экспансиального мемориала, а также визитной карточкой Сент-Луиса, штат Миссури, США.`, + `Арка была спроектирована финско-американским архитектором Ээро Саариненом в 1947 году. Её высота 192 метра в самой высокой точке, ширина её основания также 192 метра. + Таким образом арка является самым высоким памятником на территории США. Её строительство началось 12 февраля 1963 года и было закончено 28 октября 1965 года. Памятник открылся для посетителей 24 июля 1967 года.` + ] + }, + { + img: Image7, + title: 'CN Tower, Торонто, Канада', + description: [ + `553.3-метровая телевизионная башня. Была самым высоким свободно стоящим сооружением в мире с 1976 по 2007 год, до сих пор остаётся + таковым в Западном полушарии. Является символом Торонто. На высоте 447 м находится астрономическая обсерватория.`, + `Земляные работы для сооружения железобетонной конструкции с последующим натяжением арматуры весом 130 000т начались 12 февраля 1973 г., + а уже 2 апреля 1975 г. возведение башни было завершено.` + ] + }, + { + img: Image8, + title: 'Небесное дерево, Токио, Япония', + description: [ + `Телевизионная башня в районе Сумида самая высокая среди телебашен мира. Высота телебашни вместе с антенной составляет 634 метра. + Высота башни была выбрана так, чтобы цифры: 6 (на старом японском «му»), 3 («са»), 4 («си») были созвучны «Мусаси» — названию исторической области, + где находится современный Токио.`, + `Здание напоминает пятиярусную пагоду, что хорошо сочетается с историческим районом Асакуса на другом берегу реки. + Основание башни напоминает штатив; с высоты примерно 350 м она имеет цилиндрическую форму, позволяющую наслаждаться панорамными видами реки и города.` + ] + }, + { + img: Image9, + title: 'The Clock Towers, Мекка, Саудовская Аравия', + description: [ + `Отель «Королевская часовая башня» имеет высоту 601 м. Его строительство которого завершилось в 2012 году. Внешне здание отдалённо напоминает Биг-Бен в Лондоне, + при этом выше последнего в 6 раз.`, + `На Королевской башне установлены часы диаметром 43 метра (длина часовой стрелки составляет 17 метров, минутной — 22), + расположенные на высоте более 400 метров над землёй. Четыре их циферблата установлены по четырём сторонам света. Часы видны из любого места города, + и являются самыми большими и самыми высотными часами в мире` + ] + }, + { + img: Image10, + title: 'Merdeka 118, Куала-Лумпур, Малайзия', + description: [ + `Общая высота здания составляет 678.9 м, причём более 160 м приходится на шпиль. Строительство Merdeka 118 началось в 2014 году.`, + `Название «Merdeka» означает «независимость», оно отсылает к наименованию расположенного рядом с башней стадиона, + который известен как место официального провозглашения независимости.`, + `Здание находится в центре Куала-Лумпура. В небоскрёбе откроется первый отель Park Hyatt в Малайзии. + Также в здании будут расположены самая высокая смотровая площадка в Юго-Восточной Азии, торговый центр, музей, мечеть, офисы и квартиры.` + ] + }, + +]; + +export default structures; \ No newline at end of file diff --git a/labs/lab6/vite.config.ts b/labs/lab6/vite.config.ts index 8b0f57b..d1203cd 100644 --- a/labs/lab6/vite.config.ts +++ b/labs/lab6/vite.config.ts @@ -1,7 +1,11 @@ import { defineConfig } from 'vite' -import react from '@vitejs/plugin-react' +import react, { reactCompilerPreset } from '@vitejs/plugin-react' +import babel from '@rolldown/plugin-babel' // https://vite.dev/config/ export default defineConfig({ - plugins: [react()], + plugins: [ + react(), + babel({ presets: [reactCompilerPreset()] }) + ], })