From 4a884387474c265a89caae3bbcbc43c1d317259a Mon Sep 17 00:00:00 2001 From: orion Date: Sun, 22 Oct 2023 22:12:33 +0300 Subject: [PATCH] Add simple front-end --- public/index.html | 38 +++++++++++++++ public/main.css | 120 ++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 158 insertions(+) create mode 100644 public/index.html create mode 100644 public/main.css diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..3103bc5 --- /dev/null +++ b/public/index.html @@ -0,0 +1,38 @@ + + + + + + Dach + + +
+
+ + +
+
+
+
+
+
+

What is Dash

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Hic, suscipit perferendis. Aut neque tenetur sunt nostrum ratione ullam voluptatem nemo, eum quaerat inventore molestias dolor. Id, quibusdam reiciendis? Nisi, omnis!

+
+
+
+
+
+

Борды

+
    +
  • /b/ бред
  • +
  • /p/ политика
  • +
  • /gg/ good girls
  • +
+
+
+
+ + + \ No newline at end of file diff --git a/public/main.css b/public/main.css new file mode 100644 index 0000000..60a9fc9 --- /dev/null +++ b/public/main.css @@ -0,0 +1,120 @@ +@import url('https://fonts.googleapis.com/css2?family=Lato&family=Tilt+Neon&display=swap'); + +* { + box-sizing: border-box; + font-family: 'Lato', sans-serif; +} + +a { + font-weight: bold; + color: whitesmoke; + font-style: normal; + text-decoration: none +} + +body, html { + width: 100%; + height: 100%; + min-height: 100px; + color: whitesmoke; + margin: 0 auto; + padding: 0; + /* background: #4b6cb7; fallback for old browsers */ + /* background: -webkit-linear-gradient(to right, #182848, #4b6cb7); Chrome 10-25, Safari 5.1-6 */ + /* background: linear-gradient(to right, #182848, #4b6cb7); W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ + background: #3399ff; +} + + + +header { + display: flex; + padding: 1% 10% ; + flex: 0 0 100%; +} + +.headerIneer{ + display: flex; + width: 100%; + border-radius: 1em; + background: #62519C; /* fallback for old browsers */ + background: -webkit-linear-gradient(to right, #0B1E4F, #62519C); /* Chrome 10-25, Safari 5.1-6 */ + background: linear-gradient(to right, #0B1E4F, #62519C); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ +} + +.headerLogo{ + height: 100%; + margin: 0 5%; +} +.headerLogoTitle{ + font-family: 'Tilt Neon', sans-serif; + font-size: 2.5em; + color: whitesmoke; +} + +.headerFaq{ + margin: 2%; + min-height: 2em; + margin-left: auto; + margin-right: 5em; +} + +.headerFaqTitle{ + font-size: 1.5em; + +} + + +main { + +} + +.welcome { + display: flex; + padding: 1% 20%; + width: 100%; +} + +.welcomeInner { + background: #62519C; /* fallback for old browsers */ + background: -webkit-linear-gradient(to right, #0B1E4F, #62519C); /* Chrome 10-25, Safari 5.1-6 */ + background: linear-gradient(to right, #0B1E4F, #62519C); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ + border-radius: 2em; +} + +.welcomeStart{ + margin: 0 5%; +} + +.welcomeStartTitle{ + text-align: center; + font-weight: bold; +} + +.welcomeStartAnswer{ + text-align: center; +} + + +.broad { + display: flex; + padding: 0 10%; +} +.broadInner { + background: #62519C; /* fallback for old browsers */ + background: -webkit-linear-gradient(to right, #0B1E4F, #62519C); /* Chrome 10-25, Safari 5.1-6 */ + background: linear-gradient(to right, #0B1E4F, #62519C); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ + width: 100%; + border-radius: 2em; +} +.boardTitle { + font-size: 200%; + color: whitesmoke; + text-align: center; +} +.broadTable { + font-size: 130%; + color: whitesmoke; + text-align: center; +} +