Django-LiveView/docs
1
0
Fork 0
mirror of https://github.com/Django-LiveView/docs.git synced 2024-12-23 03:15:36 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix layout

Browse Source
This commit is contained in:
Andros Fenollosa 2024-02-29 13:03:14 +01:00
parent 15f4908c27
commit 7e50167ab5
3 changed files with 89 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
assets/css/main.css
View File

@ -35,7 +35,7 @@ body {
text-align: center; text-align: center;
} }
.link { a, .link {
display: inline-block; display: inline-block;
color: var(--color-brown); color: var(--color-brown);
text-decoration: none; text-decoration: none;

36
one.org
View File

@ -6,15 +6,8 @@
:DESCRIPTION: Framework for creating Realtime SPAs using HTML over the Wire technology. :DESCRIPTION: Framework for creating Realtime SPAs using HTML over the Wire technology.
:END: :END:
* Get started
:PROPERTIES:
:ONE: one-custom-default-doc
:CUSTOM_ID: /docs/get-started/
:END:
** What is Django LiveView? ** What is Django LiveView?
Django LiveView is a framework for creating Realtime SPAs using HTML over the Wire technology. It is inspired by Phoenix LiveView and it is built on top of Django Channels. Django LiveView is a framework for creating Realtime SPAs using HTML over the Wire technology. It is inspired by Phoenix LiveView and it is built on top of Django Channels.
It allows you to create interactive web applications using only HTML, CSS and Python. JavaScript ONLY is used to capture events, send and receive strings over a WebSockets channel. It allows you to create interactive web applications using only HTML, CSS and Python. JavaScript ONLY is used to capture events, send and receive strings over a WebSockets channel.
@ -28,3 +21,32 @@ It allows you to create interactive web applications using only HTML, CSS and Py
- Everything is asynchronous by default. - Everything is asynchronous by default.
- Don't learn anything new. If you know Python, you know how to use Django LiveView. - Don't learn anything new. If you know Python, you know how to use Django LiveView.
- All in real time. - All in real time.
Now you can create SPAs without using APIs, without JavaScript, and without learning anything new. If you know Python, you know how to use Django LiveView.
Are you ready to create your first Realtime SPA? Let's go to the [[#/docs/quickstart/][Quickstart]].
* Quickstart
:PROPERTIES:
:ONE: one-custom-default-doc
:CUSTOM_ID: /docs/quickstart/
:TITLE: Quickstart
:DESCRIPTION: Get started with Django LiveView the easy way.
:END:
* Source code
:PROPERTIES:
:ONE: one-custom-default-doc
:CUSTOM_ID: /docs/source-code/
:TITLE: Source code
:DESCRIPTION: List of all related source code.
:END:
- [[https://github.com/Django-LiveView/liveview][LiveView]]: Source code of the Django framework and app published in pip.
- [[https://github.com/Django-LiveView/docs][Website and Docs]]: All documentation, including this same page.
- Templates
- [[https://github.com/Django-LiveView/starter-template][Starter]]
- [[https://github.com/Django-LiveView/minimal-template][Minimal]]
- [[https://github.com/Django-LiveView/assets][Assets]]
- Demos
- [[https://github.com/Django-LiveView/demo-snake][Snake]]

81
onerc.el
View File

@ -1,24 +1,17 @@
(defun one-custom-default-home (page-tree pages _global) (defun make-title (title)
"Default render function by home page." (concat (when (not (string-empty-p title)) (concat title " | ")) "Django LiveView"))
(let* ((title (org-element-property :TITLE page-tree))
(full-title (concat (when (not (string-empty-p title)) (concat title " | ")) "Django LiveView"))
(path (org-element-property :CUSTOM_ID page-tree))
(description (org-element-property :DESCRIPTION page-tree))
(content (org-export-data-with-backend
(org-element-contents page-tree)
'one-ox nil))
(website-name (one-default-website-name pages))
(nav (one-default-nav path pages)))
(jack-html (defun render-layout-html (title description tree-content)
(let ((full-title (make-title title))) (jack-html
"<!DOCTYPE html>" "<!DOCTYPE html>"
`(:html (@ :lang "en") `(:html (@ :lang "en")
(:head (:head
;; Generals ;; Generals
(:meta (@ :charset "utf-8")) (:meta (@ :charset "utf-8"))
(:link (@ :rel "icon" :type "image/png" :href "img/favicon.png")) (:link (@ :rel "icon" :type "image/png" :href "/img/favicon.png"))
(:meta (@ :name "viewport" :content "width=device-width,initial-scale=1.0, shrink-to-fit=no")) (:meta (@ :name "viewport" :content "width=device-width,initial-scale=1.0, shrink-to-fit=no"))
(:meta (@ :name "author" :content "Andros Fenollosa")) (:meta (@ :name "author" :content "Andros Fenollosa"))
(:meta (@ :name "generator" :content "One.el"))
;; SEO ;; SEO
(:title ,full-title) (:title ,full-title)
(:meta (@ :name "description" :content ,description)) (:meta (@ :name "description" :content ,description))
@ -29,54 +22,58 @@
(:link (@ :rel "stylesheet" :href "https://fonts.googleapis.com/css2?family=Fira+Code&family=Open+Sans:wght@400;700&display=swap")) (:link (@ :rel "stylesheet" :href "https://fonts.googleapis.com/css2?family=Fira+Code&family=Open+Sans:wght@400;700&display=swap"))
;; CSS ;; CSS
(:link (@ :rel "stylesheet" :type "text/css" :href "https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css")) (:link (@ :rel "stylesheet" :type "text/css" :href "https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css"))
(:link (@ :rel "stylesheet" :type "text/css" :href "css/main.css"))) (:link (@ :rel "stylesheet" :type "text/css" :href "/css/main.css")))
(:body (:body
,tree-content
(:footer.footer
(:p "Created with ❤️ by " (:a.link (@ :href "https://andros.dev/" :target "_blank") "Andros Fenollosa"))
(:p "🐍 " ,(format-time-string "%Y"))))))))
(defun one-custom-default-home (page-tree pages _global)
"Default render function by home page."
(let* ((title (org-element-property :TITLE page-tree))
(path (org-element-property :CUSTOM_ID page-tree))
(description (org-element-property :DESCRIPTION page-tree))
(content (org-export-data-with-backend
(org-element-contents page-tree)
'one-ox nil))
(website-name (one-default-website-name pages))
(nav (one-default-nav path pages)))
(render-layout-html
title
description
(jack-html `(:main.main
(:section.hero (:section.hero
(:div.container (:div.container
(:hgroup.hero__hgroup (:hgroup.hero__hgroup
(:h1.hero__title "Django LiveView") (:h1.hero__title "Django LiveView")
(:h2.hero__subtitle "Framework for creating Realtime SPAs using HTML over the Wire technology") (:h2.hero__subtitle "Framework for creating Realtime SPAs using HTML over the Wire technology")
(:img.image.hero__logo (@ :alt "pet" :src "img/pet.webp"))))) (:img.image.hero__logo (@ :alt "pet" :src "img/pet.webp")))))
(:main.main
(:nav.nav-home (:nav.nav-home
(:div.container
(:ul.nav__list.nav-home__list (:ul.nav__list.nav-home__list
(:li.nav-home__item (:li.nav-home__item
(:a.button.nav-home__link (@ :href "/docs/get-started/") "Get started")) (:a.button.nav-home__link (@ :href "/docs/quickstart/") "Docs"))
(:li.nav-home__item (:li.nav-home__item
(:a.button.nav-home__link (@ :href "/docs/install/") "Install")) (:a.button.nav-home__link (@ :href "/school/make-a-blog/") "Tutorials"))
(:li.nav-home__item (:li.nav-home__item
(:a.button.nav-home__link (@ :href "https://django-liveview-demo.andros.dev/" :target "_blank") "Demo")))))))))) (:a.button.nav-home__link (@ :href "https://django-liveview-demo.andros.dev/" :target "_blank") "Demo")))))
(:section
(:div.container ,content)))))))
(defun one-custom-default-doc (page-tree pages _global) (defun one-custom-default-doc (page-tree pages _global)
"Default render function by home page." "Default render function by home page."
(let* ((title (org-element-property :raw-value page-tree)) (let* ((title (org-element-property :raw-value page-tree))
(description (org-element-property :DESCRIPTION page-tree))
(path (org-element-property :CUSTOM_ID page-tree)) (path (org-element-property :CUSTOM_ID page-tree))
(content (org-export-data-with-backend (content (org-export-data-with-backend
(org-element-contents page-tree) (org-element-contents page-tree)
'one-ox nil)) 'one-ox nil))
(website-name (one-default-website-name pages)) (website-name (one-default-website-name pages))
(nav (one-default-nav path pages))) (nav (one-default-nav path pages)))
(render-layout-html
(jack-html title
"<!DOCTYPE html>" description
`(:html (@ :lang "en") (jack-html `(:main.main
(:head (:section
;; Generals (:div.container ,content)))))))
(:meta (@ :charset "utf-8"))
(:link (@ :rel "icon" :type "image/png" :href "img/favicon.png"))
(:meta (@ :name "viewport" :content "width=device-width,initial-scale=1.0, shrink-to-fit=no"))
(:meta (@ :name "author" :content "Andros Fenollosa"))
;; SEO
(:title (concat ,title " | Django LiveView"))
(:meta (@ :name "description" :content "Framework for creating Realtime SPAs using HTML over the Wire technology."))
(:meta (@ :name "og:image" :content "https://django-liveview.andros.dev/img/og-image.webp"))
;; Fonts
(:link (@ :rel "preconnect" :href "https://fonts.googleapis.com"))
(:link (@ :rel "preconnect" :href "https://fonts.gstatic.com" :crossorigin t))
(:link (@ :rel "stylesheet" :href "https://fonts.googleapis.com/css2?family=Fira+Code&family=Open+Sans:wght@400;700&display=swap"))
;; CSS
(:link (@ :rel "stylesheet" :type "text/css" :href "https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css"))
(:link (@ :rel "stylesheet" :type "text/css" :href "css/main.css")))
(:body
(:main.main
(:div.container .content)))))))