Коммит для работы на ПК
This commit is contained in:
parent
80bf80256d
commit
3fa981bdae
@ -28,7 +28,8 @@
|
|||||||
"web-vitals": "^2.1.4"
|
"web-vitals": "^2.1.4"
|
||||||
},
|
},
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "set PORT=5000 &&react-scripts start",
|
"start": "set port=5000 && react-scripts start",
|
||||||
|
"json-server": "npx json-server data.json --port 3000",
|
||||||
"build": "react-scripts build",
|
"build": "react-scripts build",
|
||||||
"test": "react-scripts test",
|
"test": "react-scripts test",
|
||||||
"eject": "react-scripts eject",
|
"eject": "react-scripts eject",
|
||||||
|
17
src/App.css
17
src/App.css
@ -21,7 +21,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.Footer {
|
.Footer {
|
||||||
height: 200px;
|
height: 150px;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bg-slate-300 {
|
.bg-slate-300 {
|
||||||
@ -33,7 +34,6 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
||||||
width: 75%;
|
width: 75%;
|
||||||
height: 300px;
|
height: 300px;
|
||||||
}
|
}
|
||||||
@ -41,3 +41,16 @@
|
|||||||
#playlistButton {
|
#playlistButton {
|
||||||
align-self: center;
|
align-self: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#footer-text {
|
||||||
|
color: white;
|
||||||
|
font: 1em sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
#current-track {
|
||||||
|
height: 20%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
@ -47,7 +47,7 @@ function App() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
||||||
<div className="App bg-red-800">
|
<div className="App bg-slate-300">
|
||||||
<Header />
|
<Header />
|
||||||
<MenuBlock playlists={playlists} songs={songs} albums={albums} genres={genres}/>
|
<MenuBlock playlists={playlists} songs={songs} albums={albums} genres={genres}/>
|
||||||
|
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Button, Table } from 'antd';
|
import { Button, Col, Grid, Row, Table } from 'antd';
|
||||||
import { PlayCircleOutlined } from '@ant-design/icons';
|
import { PlayCircleOutlined } from '@ant-design/icons';
|
||||||
import { ISong, SongProps } from '../models/IModels';
|
import { ISong, SongProps } from '../models/IModels';
|
||||||
import styled from 'styled-components'
|
import styled from 'styled-components'
|
||||||
@ -62,15 +62,22 @@ export function CurrentTrack() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Song >
|
<Song >
|
||||||
<div className='' style={{height: '500%', width: '100%'}}>
|
<div id="current-track" className='container mx-auto' style={{width: '100%', zIndex: -1}}>
|
||||||
<Table
|
<Row className='w-full h-auto rounded bg-red-500'>
|
||||||
|
<Col>
|
||||||
|
SEX
|
||||||
|
<img src={song.cover} alt={song.cover} className='w-full h-auto rounded' /> *
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
{/* <Table
|
||||||
columns={columns}
|
columns={columns}
|
||||||
dataSource={[song]}
|
dataSource={[song]}
|
||||||
pagination={false}
|
pagination={false}
|
||||||
className='w-full h-auto rounded'
|
className='w-full h-auto rounded'
|
||||||
showHeader={false}
|
showHeader={false}
|
||||||
|
|
||||||
/>
|
/> */}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</Song>
|
</Song>
|
||||||
|
@ -5,10 +5,10 @@ import { ISong } from '../models/IModels';
|
|||||||
|
|
||||||
export function Footer() {
|
export function Footer() {
|
||||||
return (
|
return (
|
||||||
<div className="Footer bg-gray-600">
|
<div className="Footer bg-red-800">
|
||||||
|
|
||||||
<div className="container mx-auto flex justify-between">
|
<div className="container mx-auto flex justify-between">
|
||||||
<p className="text-lg"> 2022 Music Service</p>
|
<p id="footer-text" className="text-lg"> 2022 Music Service</p>
|
||||||
<ul className="flex">
|
<ul className="flex">
|
||||||
<li className="mr-4">
|
<li className="mr-4">
|
||||||
<Button href="/about">About</Button>
|
<Button href="/about">About</Button>
|
||||||
|
Loading…
Reference in New Issue
Block a user