Skip to content

Commit

Permalink
fix(gnoweb): template and md style (gnolang#2223)
Browse files Browse the repository at this point in the history
This PR is a hotfix to markdown style.

fixes: gnolang#1967 
fixes: gnolang#2166

Maybe not the best way to handle it, but as we are gonna refactor gnoweb
and pages are rendered as blog, what is not very clean, this is a quick
fix before a better refactor.

It create a `Kind` variable for rendered pages in `gnoweb`, that is used
as CSS classname to wrap the body content. This is made to separate
`Section` and `Page` contents: while first ones are created with a
detailed architecture of sub-sections (invisible list, columns etc), the
second kind is made for generic content.

This separation allow to create different styles for the two kinds of
structure we have on gno.land website:
"page" one will have bullet lists, centered images etc by default and
"section" one will be more transparent regarding the style.

To achieve this, the PR creates a dedicated package for "events" instead
of a blog rendered page (because this page is a `section`) and adds a
default `page` CSS classname in blog content.

In the future, we should use dedicated md / web components to display
elements whatever the page type.

---------

Co-authored-by: Morgan Bazalgette <[email protected]>
  • Loading branch information
alexiscolin and thehowl authored May 28, 2024
1 parent 3cc4952 commit 77071e4
Show file tree
Hide file tree
Showing 11 changed files with 414 additions and 152 deletions.
4 changes: 4 additions & 0 deletions examples/gno.land/p/demo/blog/blog.gno
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,8 @@ func (b Blog) RenderPost(res *mux.ResponseWriter, req *mux.Request) {
}
p := post.(*Post)

res.Write("<main class='gno-tmpl-page'>" + "\n\n")

res.Write("# " + p.Title + "\n\n")
res.Write(p.Body + "\n\n")
res.Write("---\n\n")
Expand All @@ -86,6 +88,8 @@ func (b Blog) RenderPost(res *mux.ResponseWriter, req *mux.Request) {
})

res.Write("</details>\n")
res.Write("</main>")

}

func (b Blog) RenderTag(res *mux.ResponseWriter, req *mux.Request) {
Expand Down
11 changes: 11 additions & 0 deletions examples/gno.land/p/demo/ui/ui.gno
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ type DOM struct {
Prefix string
Title string
WithComments bool
Classes []string

// elements
Header Element
Expand All @@ -18,8 +19,14 @@ type DOM struct {
}

func (dom DOM) String() string {
classes := strings.Join(dom.Classes, " ")

output := ""

if classes != "" {
output += "<main class='" + classes + "'>" + "\n\n"
}

if dom.Title != "" {
output += H1(dom.Title).String(dom) + "\n"
}
Expand Down Expand Up @@ -54,6 +61,10 @@ func (dom DOM) String() string {
}
}

if classes != "" {
output += "</main>"
}

// TODO: cleanup double new-lines.

return output
Expand Down
11 changes: 9 additions & 2 deletions examples/gno.land/r/gnoland/blog/gnoblog_test.gno
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,8 @@ No posts.
{
got := Render("p/slug2")
expected := `
<main class='gno-tmpl-page'>
# title2
body2
Expand All @@ -63,6 +65,7 @@ Published by g1u7y667z64x2h7vc6fmpcprgey4ck233jaww9zq to Gnoland's Blog
<details><summary>Comment section</summary>
</details>
</main>
`
assertMDEquals(t, got, expected)
Expand Down Expand Up @@ -95,7 +98,8 @@ Published by g1u7y667z64x2h7vc6fmpcprgey4ck233jaww9zq to Gnoland's Blog
AddComment("slug2", "comment4")
AddComment("slug1", "comment5")
got := Render("p/slug2")
expected := `
expected := `<main class='gno-tmpl-page'>
# title2
body2
Expand Down Expand Up @@ -124,6 +128,7 @@ Published by g1u7y667z64x2h7vc6fmpcprgey4ck233jaww9zq to Gnoland's Blog
---
</details>
</main>
`
assertMDEquals(t, got, expected)
}
Expand All @@ -132,7 +137,8 @@ Published by g1u7y667z64x2h7vc6fmpcprgey4ck233jaww9zq to Gnoland's Blog
{
ModEditPost("slug2", "title2++", "body2++", "2009-11-10T23:00:00Z", "manfred", "tag1,tag4")
got := Render("p/slug2")
expected := `
expected := `<main class='gno-tmpl-page'>
# title2++
body2++
Expand Down Expand Up @@ -161,6 +167,7 @@ Published by g1u7y667z64x2h7vc6fmpcprgey4ck233jaww9zq to Gnoland's Blog
---
</details>
</main>
`
assertMDEquals(t, got, expected)
}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,20 +1,38 @@
package gnopages
package events

func init() {
var (
path = "events"
title = "Gno.land Core Team Attends Industry Events & Meetups"
// XXX: description = "If you’re interested in learning more about Gno.land, you can join us at major blockchain industry events throughout the year either in person or virtually."
body = `
If you’re interested in building web3 with us, catch up with Gno.land in person at one of our industry events.
We’re looking to connect with developers and like-minded thinkers who can contribute to the growth of our platform.
import (
"gno.land/p/demo/ui"
)

---
// XXX: p/demo/ui API is crappy, we need to make it more idiomatic
// XXX: use an updatable block system to update content from a DAO
// XXX: var blocks avl.Tree

## Upcoming Events
func Render(_ string) string {
dom := ui.DOM{Prefix: "r/gnoland/events:"}
dom.Title = "Gno.land Core Team Attends Industry Events & Meetups"
dom.Classes = []string{"gno-tmpl-section"}

<div class="columns-3">
// body
dom.Body.Append(introSection()...)
dom.Body.Append(ui.HR{})
dom.Body.Append(upcomingEvents()...)
dom.Body.Append(ui.HR{})
dom.Body.Append(pastEvents()...)

return dom.String()
}

func introSection() ui.Element {
return ui.Element{
ui.Paragraph("If you’re interested in building web3 with us, catch up with Gno.land in person at one of our industry events. We’re looking to connect with developers and like-minded thinkers who can contribute to the growth of our platform."),
}
}

func upcomingEvents() ui.Element {
return ui.Element{
ui.H2("Upcoming Events"),
ui.Text(`<div class="columns-3">
<div class="column">
### Gno @ Golang Serbia
Expand Down Expand Up @@ -60,13 +78,13 @@ We’re looking to connect with developers and like-minded thinkers who can cont
<div class="column">
</div><!-- end column-->
</div><!-- end columns-3-->
---
## Past Events
</div><!-- end columns-3-->`)}
}

<div class="columns-3">
func pastEvents() ui.Element {
return ui.Element{
ui.H2("Past Events"),
ui.Text(`<div class="columns-3">
<div class="column">
### GopherCon US
Expand Down Expand Up @@ -193,7 +211,5 @@ We’re looking to connect with developers and like-minded thinkers who can cont
[Watch the talk](https://www.youtube.com/watch?v=hCLErPgnavI)
</div><!-- end column-->
</div><!-- end columns-3-->`
)
_ = b.NewPost("", path, title, body, "2022-05-20T13:17:24Z", nil, nil)
</div><!-- end columns-3-->`)}
}
203 changes: 203 additions & 0 deletions examples/gno.land/r/gnoland/events/events_filetest.gno
Original file line number Diff line number Diff line change
@@ -0,0 +1,203 @@
package main

import "gno.land/r/gnoland/events"

func main() {
println(events.Render(""))
}

// Output:
// <main class='gno-tmpl-section'>
//
// # Gno.land Core Team Attends Industry Events & Meetups
//
//
// If you’re interested in building web3 with us, catch up with Gno.land in person at one of our industry events. We’re looking to connect with developers and like-minded thinkers who can contribute to the growth of our platform.
//
//
// ---
//
// ## Upcoming Events
//
// <div class="columns-3">
// <div class="column">
//
// ### Gno @ Golang Serbia
//
// - Join the meetup
// - Belgrade, May 23, 2024
//
// [Learn more](https://www.meetup.com/golang-serbia/events/300975006/)
//
// </div><!-- end column-->
//
// <div class="column">
//
// ### GopherCon EU
// - Come Meet Us at our Booth
// - Berlin, June 17 - 20, 2024
//
// [Learn More](https://gophercon.eu/)
// </div><!-- end column-->
//
// <div class="column">
//
// ### GopherCon US
// - Come Meet Us at our Booth
// - Chicago, July 7 - 10, 2024
//
// [Learn More](https://www.gophercon.com/)
//
// </div><!-- end column-->
//
// <div class="column">
//
// ### Nebular Summit
// - Join our workshop
// - Brussels, July 12 - 13, 2024
//
// [Learn More](https://nebular.builders/)
// </div><!-- end column-->
//
// <div class="column">
//
// </div><!-- end column-->
// <div class="column">
//
// </div><!-- end column-->
// </div><!-- end columns-3-->
//
// ---
//
// ## Past Events
//
// <div class="columns-3">
// <div class="column">
//
// ### GopherCon US
//
// - **Come Meet Us at our Booth**
// - San Diego, September 26 - 29, 2023
//
// [Learn more](https://www.gophercon.com/)
//
// </div><!-- end column-->
//
// <div class="column">
//
// ### GopherCon EU
//
// - **Come Meet Us at our Booth**
// - Berlin, July 26 - 29, 2023
//
// [Learn more](https://gophercon.eu/)
//
// </div><!-- end column-->
//
// <div class="column">
//
// ### Nebular Summit Gno.land for Developers
//
// - Paris, July 24 - 25, 2023
// - Manfred Touron
//
// [Learn more](https://www.nebular.builders/)
//
// </div><!-- end column-->
//
// <div class="column">
//
// ### EthCC
//
// - **Come Meet Us at our Booth**
// - Paris, July 17 - 20, 2023
// - Manfred Touron
//
// [Learn more](https://www.ethcc.io/)
//
// </div><!-- end column-->
//
// <div class="column">
//
// ### Eth Seoul
//
// - **The Evolution of Smart Contracts: A Journey into Gno.land**
// - Seoul, June 3, 2023
// - Manfred Touron
//
// [Learn more](https://2023.ethseoul.org/)
//
// </div><!-- end column-->
// <div class="column">
//
// ### BUIDL Asia
//
// - **Proof of Contribution in Gno.land**
// - Seoul, June 6, 2023
// - Manfred Touron
//
// [Learn more](https://www.buidl.asia/)
//
// </div><!-- end column-->
// <div class="column">
//
// ### Game Developer Conference
//
// - **Side Event: Web3 Gaming Apps Powered by Gno**
// - San Francisco, Mach 23, 2023
// - Jae Kwon
//
// [Watch the talk](https://www.youtube.com/watch?v=IJ0xel8lr4c)
//
// </div><!-- end column-->
// <div class="column">
//
// ### EthDenver
//
// - **Side Event: Discover Gno.land**
// - Denver, Feb 24 - Mar 5, 2023
// - Jae Kwon
//
// [Watch the talk](https://www.youtube.com/watch?v=IJ0xel8lr4c)
//
// </div><!-- end column-->
// <div class="column">
//
// ### Istanbul Blockchain Week
//
// - Istanbul, Nov 14 - 17, 2022
// - Manfred Touron
//
// [Watch the talk](https://www.youtube.com/watch?v=JX0gdWT0Cg4)
//
// </div><!-- end column-->
// <div class="column">
//
// ### Web Summit Buckle Up and Build with Cosmos
//
// - Lisbon, Nov 1 - 4, 2022
// - Manfred Touron
//
// </div><!-- end column-->
// <div class="column">
//
// ### Cosmoverse
//
// - Medallin, Sept 26 - 28, 2022
// - Manfred Touron
//
// [Watch the talk](https://www.youtube.com/watch?v=6s1zG7hgxMk)
//
// </div><!-- end column-->
// <div class="column">
//
// ### Berlin Blockchain Week Buckle Up and Build with Cosmos
//
// - Berlin, Sept 11 - 18, 2022
//
// [Watch the talk](https://www.youtube.com/watch?v=hCLErPgnavI)
//
// </div><!-- end column-->
// </div><!-- end columns-3-->
//
// </main>
3 changes: 3 additions & 0 deletions examples/gno.land/r/gnoland/events/gno.mod
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
module gno.land/r/gnoland/events

require gno.land/p/demo/ui v0.0.0-latest
Loading

0 comments on commit 77071e4

Please sign in to comment.