changes in index

This commit is contained in:
2022-12-15 20:24:27 -03:00
parent 3abd2ee132
commit 9bb1ab9480
5 changed files with 31 additions and 21 deletions

1
.gitignore vendored
View File

@@ -3,6 +3,7 @@
node_modules
package-lock.json
yarn.lock
.env

View File

@@ -11,6 +11,7 @@
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-scripts": "5.0.1",
"react-wavify": "^1.6.3",
"styled-components": "^5.3.5",
"web-vitals": "^2.1.4",
"wouter": "^2.8.0-alpha.2"

View File

@@ -7,7 +7,7 @@
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
content="Open Telegram to Notion Bot website"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
@@ -24,7 +24,7 @@
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>Telegram to Notion Bot</title>
<title>Open Telegram to Notion Bot</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>

View File

@@ -1,5 +1,6 @@
import background from './background.svg'
import styled from "styled-components"
import Wave from 'react-wavify'
function Index() {
@@ -13,7 +14,6 @@ function Index() {
aspect-ratio: 960/300;
background-image: url(${background});
background-repeat: no-repeat;
background-position: center;
background-size: cover;
@@ -92,19 +92,30 @@ function Index() {
]
return (
<IndexStyles className="index">
<ul className="title-list">
{
listData.map((obj, index) => (
<li key={index}>
{obj.link ? <a href={obj.link} target="_blank" children={<h2> {obj.text}</h2>} rel="noreferrer"/> : <h2> {obj.text}</h2>}
{obj.secondaryText ? <span>&nbsp;{obj.secondaryText}</span> : null}
</li>
))
}
</ul>
<a className="link-to-bot" href="https://t.me/TelegrmToNotionBot" target="_blank" children="Check it out" rel="noreferrer"/>
</IndexStyles>
<>
<IndexStyles className="index">
<ul className="title-list">
{
listData.map((obj, index) => (
<li key={index}>
{obj.link ? <a href={obj.link} target="_blank" children={<h2> {obj.text}</h2>} rel="noreferrer"/> : <h2> {obj.text}</h2>}
{obj.secondaryText ? <span>&nbsp;{obj.secondaryText}</span> : null}
</li>
))
}
</ul>
<a className="link-to-bot" href="https://t.me/OpenTelegramToNotionBot" target="_blank" children="Check it out" rel="noreferrer"/>
</IndexStyles>
<Wave fill='#4797ff'
paused={false}
options={{
height: 20,
amplitude: 40,
speed: 0.15,
points: 3
}}
/>
</>
)
}

View File

@@ -5,14 +5,11 @@ import { Link } from 'wouter'
function Header() {
const HeaderStyles = styled.header`
height: 15vh;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0px 2vw;
padding: 3vh 2vw;
border-bottom: 1px solid #eee;
@@ -67,7 +64,7 @@ function Header() {
<Link href='/'>
<div className='logotype'>
<img src={icon} alt="Page icon"></img>
<h1>Telegram to Notion Bot</h1>
<h1>Open Telegram to Notion Bot</h1>
</div>
</Link>
<div className="links">