From b9f37b4d1578f4e66ab63caa033700e90db1c63c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Owsiak?= Date: Wed, 7 Feb 2024 16:17:39 +0200 Subject: [PATCH] Added key features to the landing page (#971) * Added key features to the landing page * added lazy attr to clipboard controller * added new flow svg with inline styles --- web/landing/assets/app.js | 2 - .../controllers/clipboard_controller.js | 1 + .../syntax_highlight_controller.js | 6 +- web/landing/assets/images/icons/flow.svg | 11 ++ web/landing/assets/images/icons/tools.svg | 4 + web/landing/assets/styles/app.css | 2 +- .../Website/Controller/DefaultController.php | 12 +- web/landing/templates/base.html.twig | 75 ++++++++++-- web/landing/templates/example/index.html.twig | 49 ++++++++ web/landing/templates/main/index.html.twig | 107 +++--------------- 10 files changed, 165 insertions(+), 104 deletions(-) create mode 100644 web/landing/assets/images/icons/flow.svg create mode 100644 web/landing/assets/images/icons/tools.svg create mode 100644 web/landing/templates/example/index.html.twig diff --git a/web/landing/assets/app.js b/web/landing/assets/app.js index f1de28be0..63d203b2f 100644 --- a/web/landing/assets/app.js +++ b/web/landing/assets/app.js @@ -1,6 +1,4 @@ import '@fontsource-variable/cabin/index.min.css'; -import 'highlight.js/styles/github-dark.min.css'; import '@oddbird/popover-polyfill'; import './bootstrap.js'; import 'htmx.org' -import 'clipboard' diff --git a/web/landing/assets/controllers/clipboard_controller.js b/web/landing/assets/controllers/clipboard_controller.js index 7474526fa..a0ff3b10b 100644 --- a/web/landing/assets/controllers/clipboard_controller.js +++ b/web/landing/assets/controllers/clipboard_controller.js @@ -1,6 +1,7 @@ import {Controller} from '@hotwired/stimulus'; import ClipboardJS from 'clipboard'; +/* stimulusFetch: 'lazy' */ export default class extends Controller { connect() diff --git a/web/landing/assets/controllers/syntax_highlight_controller.js b/web/landing/assets/controllers/syntax_highlight_controller.js index ff536a238..470733f4b 100644 --- a/web/landing/assets/controllers/syntax_highlight_controller.js +++ b/web/landing/assets/controllers/syntax_highlight_controller.js @@ -1,10 +1,12 @@ import {Controller} from '@hotwired/stimulus'; -import hljs from 'highlight.js/lib/core'; +import 'highlight.js/styles/github-dark.min.css'; import php from 'highlight.js/lib/languages/php'; +import hljs from 'highlight.js/lib/core'; +/* stimulusFetch: 'lazy' */ export default class extends Controller { - static afterLoad(identifier, application) + initialize() { hljs.registerLanguage('php', php); } diff --git a/web/landing/assets/images/icons/flow.svg b/web/landing/assets/images/icons/flow.svg new file mode 100644 index 000000000..292552ce7 --- /dev/null +++ b/web/landing/assets/images/icons/flow.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/web/landing/assets/images/icons/tools.svg b/web/landing/assets/images/icons/tools.svg new file mode 100644 index 000000000..614d6621a --- /dev/null +++ b/web/landing/assets/images/icons/tools.svg @@ -0,0 +1,4 @@ + + + \ No newline at end of file diff --git a/web/landing/assets/styles/app.css b/web/landing/assets/styles/app.css index e09db6850..e57188ccf 100644 --- a/web/landing/assets/styles/app.css +++ b/web/landing/assets/styles/app.css @@ -3,7 +3,7 @@ @tailwind utilities; body { - font-family: "Cabin Variable", sans-serif; + font-family: "Cabin Variable", system-ui; } .unset { diff --git a/web/landing/src/Flow/Website/Controller/DefaultController.php b/web/landing/src/Flow/Website/Controller/DefaultController.php index e1de61ce8..0aa38bb2b 100644 --- a/web/landing/src/Flow/Website/Controller/DefaultController.php +++ b/web/landing/src/Flow/Website/Controller/DefaultController.php @@ -25,7 +25,7 @@ public function example(string $topic, string $example) : Response $examples = $this->examples->examples($currentTopic); $currentExample = $example; - return $this->render('main/index.html.twig', [ + return $this->render('example/index.html.twig', [ 'contributors' => $this->github->contributors(), 'topics' => $topics, 'examples' => $examples, @@ -38,13 +38,19 @@ public function example(string $topic, string $example) : Response #[Route('/', name: 'main')] public function main() : Response { +// TODO: uncomment and remove below code when frontpage features will be available +// return $this->render('main/index.html.twig', [ +// 'contributors' => $this->github->contributors(), +// 'topics' => $this->examples->topics(), +// ]); + $topics = $this->examples->topics(); $currentTopic = \current($topics); $examples = $this->examples->examples($currentTopic); $currentExample = \current($examples); - return $this->render('main/index.html.twig', [ + return $this->render('example/index.html.twig', [ 'contributors' => $this->github->contributors(), 'topics' => $topics, 'examples' => $examples, @@ -63,7 +69,7 @@ public function topic(string $topic) : Response $examples = $this->examples->examples($currentTopic); $currentExample = \current($examples); - return $this->render('main/index.html.twig', [ + return $this->render('example/index.html.twig', [ 'contributors' => $this->github->contributors(), 'topics' => $topics, 'examples' => $examples, diff --git a/web/landing/templates/base.html.twig b/web/landing/templates/base.html.twig index 719797c6b..21f245335 100644 --- a/web/landing/templates/base.html.twig +++ b/web/landing/templates/base.html.twig @@ -12,6 +12,8 @@ + + {% block stylesheets %} {% endblock %} @@ -30,38 +32,38 @@
-
+
+

UNIFIED DATA PROCESSING FRAMEWORK

+ {% apply spaceless %} + + composer require flow-php/etl + + + {% endapply %} + elephant +
+ +
+
+
+ extract +

Extracts

+

Read from various data sources.

+
+ + arrow right + +
+ transform +

Transforms

+

Shape and optimize for your needs

+
+ + arrow right + +
+ load +

Loads

+

Store and secure in one of many available data sinks.

+
+
+
+ {% block main %}{% endblock %} + +
+
+
+

Contributors

+ + Join us on GitHub + external resource + +
+ +
+ {% for contributor in contributors %} + + {{ contributor.login }} + + {% endfor %} +
+
+