agorata
/
frontend
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

first commit

main
Llavrov 2 years ago
parent
90a4f143c3
commit
f937e07fac
13 changed files with 243 additions and 25 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      .idea/vcs.xml
  2. 56
      .idea/workspace.xml
  3. 10
      public/index.html
  4. 6
      src/App.css
  5. 19
      src/App.tsx
  6. BIN
      src/assets/logo.png
  7. 9
      src/components/Button/button.module.css
  8. 18
      src/components/Button/index.tsx
  9. 28
      src/components/Header/header.module.css
  10. 22
      src/components/Header/index.tsx
  11. 28
      src/components/Preview/index.tsx
  12. 48
      src/components/Preview/preview.module.css
  13. 18
      src/pages/main.tsx

6
.idea/vcs.xml
Unescape View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="$PROJECT_DIR$" vcs="Git" />
</component>
</project>

56
.idea/workspace.xml
Unescape View File

@ -1,8 +1,64 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<project version="4"> <project version="4">
<component name="ChangeListManager">
<list default="true" id="697fb6df-d905-400a-8b28-aa6fb4ab2dd2" name="Changes" comment="">
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/public/index.html" beforeDir="false" afterPath="$PROJECT_DIR$/public/index.html" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/App.css" beforeDir="false" afterPath="$PROJECT_DIR$/src/App.css" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/App.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/App.tsx" afterDir="false" />
</list>
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
<option name="LAST_RESOLUTION" value="IGNORE" />
</component>
<component name="Git.Settings">
<option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$" />
</component>
<component name="MarkdownSettingsMigration">
<option name="stateVersion" value="1" />
</component>
<component name="ProjectId" id="2HrsD8siGBzwftkpwuTkBesxHO2" />
<component name="ProjectLevelVcsManager" settingsEditedManually="true" />
<component name="ProjectViewState">
<option name="hideEmptyMiddlePackages" value="true" />
<option name="showLibraryContents" value="true" />
</component>
<component name="PropertiesComponent"><![CDATA[{
"keyToString": {
"RunOnceActivity.OpenProjectViewOnStart": "true",
"RunOnceActivity.ShowReadmeOnStart": "true",
"WebServerToolWindowFactoryState": "false",
"last_opened_file_path": "/Users/lionarr/WebstormProjects/agorata/src/assets",
"nodejs_interpreter_path": "node",
"nodejs_package_manager_path": "npm",
"ts.external.directory.path": "/Users/lionarr/WebstormProjects/agorata/node_modules/typescript/lib",
"vue.rearranger.settings.migration": "true"
}
}]]></component>
<component name="RecentsManager">
<key name="CopyFile.RECENT_KEYS">
<recent name="$PROJECT_DIR$/src/assets" />
</key>
</component>
<component name="RunManager"> <component name="RunManager">
<configuration name="Debug Application" type="JavascriptDebugType" uri="http://localhost:3000"> <configuration name="Debug Application" type="JavascriptDebugType" uri="http://localhost:3000">
<method v="2" /> <method v="2" />
</configuration> </configuration>
</component> </component>
<component name="SpellCheckerSettings" RuntimeDictionaries="0" Folders="0" CustomDictionaries="0" DefaultDictionary="application-level" UseSingleDictionary="true" transferred="true" />
<component name="TaskManager">
<task active="true" id="Default" summary="Default task">
<changelist id="697fb6df-d905-400a-8b28-aa6fb4ab2dd2" name="Changes" comment="" />
<created>1669054415332</created>
<option name="number" value="Default" />
<option name="presentableId" value="Default" />
<updated>1669054415332</updated>
<workItem from="1669054416534" duration="4979000" />
</task>
<servers />
</component>
<component name="TypeScriptGeneratedFilesManager">
<option name="version" value="3" />
</component>
</project> </project>

10
public/index.html
Unescape View File

@ -29,15 +29,5 @@
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div> <div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body> </body>
</html> </html>

6
src/App.css
Unescape View File

@ -28,6 +28,12 @@
color: #61dafb; color: #61dafb;
} }
p {
font-family: "Inter", sans-serif;
padding: 0;
margin: 0;
}
@keyframes App-logo-spin { @keyframes App-logo-spin {
from { from {
transform: rotate(0deg); transform: rotate(0deg);

19
src/App.tsx
Unescape View File

@ -1,24 +1,13 @@
import React from 'react'; import React from 'react';
import logo from './logo.svg';
import './App.css'; import './App.css';
import Preview from "./components/Preview";
import Header from "./components/Header";
function App() { function App() {
return ( return (
<div className="App"> <div className="App">
<header className="App-header"> <Header></Header>
<img src={logo} className="App-logo" alt="logo" /> <Preview></Preview>
<p>
Edit <code>src/App.tsx</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
</header>
</div> </div>
); );
} }

BIN
src/assets/logo.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

9
src/components/Button/button.module.css
Unescape View File

@ -0,0 +1,9 @@
.container {
padding: 15px 30px;
background: white;
filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.2));
}
.container p {
font-size: 32px;
}

18
src/components/Button/index.tsx
Unescape View File

@ -0,0 +1,18 @@
import React from 'react';
import style from './button.module.css';
type TButton = {
onClick: () => void;
text: string;
};
function Button({text, onClick}: TButton) {
return (
<div className={style.container} onClick={onClick}>
<p>{text}</p>
</div>
)
}
export default Button;

28
src/components/Header/header.module.css
Unescape View File

@ -0,0 +1,28 @@
.container {
width: 100%;
height: 100px;
display: flex;
align-items: center;
}
.logo {
flex-grow: 1;
display: flex;
align-items: center;
}
.logo p {
font-size: 32px;
font-weight: 600;
}
.menu {
flex-grow: 2;
display: flex;
list-style: none;
}
.menu p {
font-size: 24px;
font-width: 400;
}

22
src/components/Header/index.tsx
Unescape View File

@ -0,0 +1,22 @@
import React from 'react';
import style from './header.module.css';
import logo from '../../assets/logo.png';
function Header() {
return (
<div className={style.container}>
<div className={style.logo}>
<img src={logo} alt="logotype"/>
<p>Agorata</p>
</div>
<ul className={style.menu}>
<li><p>how it work?</p></li>
<li><p>Community</p></li>
<li><p>Contacts</p></li>
</ul>
</div>
)
}
export default Header;

28
src/components/Preview/index.tsx
Unescape View File

@ -0,0 +1,28 @@
import React from 'react';
import style from './preview.module.css';
import Button from "../Button";
function Preview() {
return (
<div className={style.container}>
<h1>The World Of <br/> Web3 Domains</h1>
<div className={style.buttons}>
<Button
text='I have a domain'
onClick={() => ''}
></Button>
<Button
text='I want a domain'
onClick={() => ''}
></Button>
</div>
<div className={style.domainButton}>
<div className={style.question}><p>i</p></div>
<p>What domain?</p>
</div>
</div>
)
}
export default Preview;

48
src/components/Preview/preview.module.css
Unescape View File

@ -0,0 +1,48 @@
.container {
width: 100vw;
height: calc(100vh - 100px);
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.container h1 {
padding: 0;
margin: 0;
font-size: 100px;
font-family: "Inter", sans-serif;
text-align: center;
font-weight: 500;
}
.buttons {
display: flex;
width: 620px;
justify-content: space-between;
margin: 50px 0;
}
.domainButton {
display: flex;
align-items: center;
}
.domainButton p {
font-size: 24px;
}
.question {
margin-right: 10px;
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid black;
display: flex;
justify-content: center;
align-items: center;
}
.question p {
font-size: 24px;
}

18
src/pages/main.tsx
Unescape View File

@ -0,0 +1,18 @@
import React from 'react';
import style from './button.module.css';
type TButton = {
onClick: () => void;
text: string;
};
function Button({text, onClick}: TButton) {
return (
<div className={style.container} onClick={onClick}>
<p>{text}</p>
</div>
)
}
export default Button;
Write Preview
Loading…
Cancel
Save