removed components package in favor of the new git repo version
This commit is contained in:
parent
523f445c90
commit
32d1869e9b
@ -1,8 +0,0 @@
|
|||||||
package bulma
|
|
||||||
|
|
||||||
// Simple spacer that accepts children
|
|
||||||
templ Block() {
|
|
||||||
<div class="block">
|
|
||||||
{ children... }
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
@ -1,30 +0,0 @@
|
|||||||
package bulma
|
|
||||||
|
|
||||||
// This creates a button that accepts children under it.
|
|
||||||
templ Button() {
|
|
||||||
<button type="button" class={ "button" }>
|
|
||||||
{ children... }
|
|
||||||
</button>
|
|
||||||
}
|
|
||||||
|
|
||||||
// Used to create a button and lets you define the color.
|
|
||||||
// Accepts children.
|
|
||||||
templ ButtonColor(color string) {
|
|
||||||
<button type="button" class={ "button", color }>
|
|
||||||
{ children... }
|
|
||||||
</button>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ ButtonNewTab(url, text string) {
|
|
||||||
<button type="button" class="button">
|
|
||||||
<a href={ templ.SafeURL(url) } target="_blank" rel="noopener noreferrer">{ text }</a>
|
|
||||||
</button>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ ALink(url, title string) {
|
|
||||||
<a href={ templ.SafeURL(url) }>{ title }</a>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ ANewTab(url, text string) {
|
|
||||||
<a href={ templ.SafeURL(url) } target="_blank" rel="noopener noreferrer">{ text }</a>
|
|
||||||
}
|
|
||||||
@ -1,52 +0,0 @@
|
|||||||
package bulma
|
|
||||||
|
|
||||||
templ ArticleCardWithThumbnail(title, thumbnailUrl, url, datePosted, sourceName string) {
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-image">
|
|
||||||
<figure class="is-4by3">
|
|
||||||
<img src={ thumbnailUrl }/>
|
|
||||||
</figure>
|
|
||||||
</div>
|
|
||||||
<div class="card-content">
|
|
||||||
<div class="media">
|
|
||||||
<div class="media-content">
|
|
||||||
<a href={ templ.SafeURL(url) }>{ title }</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="content">
|
|
||||||
{ datePosted }
|
|
||||||
<br/>
|
|
||||||
{ sourceName }
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
// Creates a card container.
|
|
||||||
// Accepts children
|
|
||||||
templ Card() {
|
|
||||||
<div class="card">
|
|
||||||
{ children... }
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
// Creates a image card container.
|
|
||||||
// Accepts children
|
|
||||||
templ CardImage() {
|
|
||||||
<div class="card-image">
|
|
||||||
{ children... }
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
//
|
|
||||||
templ CardImageSize(size string) {
|
|
||||||
<figure class={ "image", size }>
|
|
||||||
{ children... }
|
|
||||||
</figure>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ CardContentContainer() {
|
|
||||||
<div class="card-content">
|
|
||||||
{ children... }
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
@ -1,19 +0,0 @@
|
|||||||
package example
|
|
||||||
|
|
||||||
import "git.jamestombleson.com/jtom38/newsbot-portal/components/bulma"
|
|
||||||
import "git.jamestombleson.com/jtom38/newsbot-portal/components/bulma/html"
|
|
||||||
import "git.jamestombleson.com/jtom38/newsbot-portal/components/bulma/layout"
|
|
||||||
|
|
||||||
templ example() {
|
|
||||||
@html.Doctype()
|
|
||||||
@html.New("en"){
|
|
||||||
@html.NewHeader(){
|
|
||||||
@bulma.UseBulmaCdn()
|
|
||||||
}
|
|
||||||
@html.NewBody() {
|
|
||||||
@layout.Container(bulma.BreakpointDefault) {
|
|
||||||
{ children... }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
package form
|
|
||||||
|
|
||||||
// Div container to add a input field to.
|
|
||||||
templ Control() {
|
|
||||||
<div class="control">
|
|
||||||
{ children... }
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
package form
|
|
||||||
|
|
||||||
// This creates a field that you can add a Label, Control or Input object.
|
|
||||||
templ Field() {
|
|
||||||
<div class="field">
|
|
||||||
{ children... }
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
@ -1,19 +0,0 @@
|
|||||||
package form
|
|
||||||
|
|
||||||
templ TextInput(id, fieldType, placeholder string) {
|
|
||||||
<input class={ "input" } name={ id } id={ id } type={ fieldType } placeholder={ placeholder }/>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ TextInputColor(color, id, fieldType, placeholder string) {
|
|
||||||
if color == "" {
|
|
||||||
<input class={ "input" } name={ id } id={ id } type={ fieldType } placeholder={ placeholder }/>
|
|
||||||
} else {
|
|
||||||
<input class={ "input", color } name={ id } id={ id } type={ fieldType } placeholder={ placeholder }/>
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
templ Checkbox(text, id string) {
|
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" id={ id }/> { text }
|
|
||||||
</label>
|
|
||||||
}
|
|
||||||
@ -1,6 +0,0 @@
|
|||||||
package form
|
|
||||||
|
|
||||||
// This will create a small bit of text to add context to the form.
|
|
||||||
templ Label(text string) {
|
|
||||||
<label class="label">{ text }</label>
|
|
||||||
}
|
|
||||||
@ -1,13 +0,0 @@
|
|||||||
package form
|
|
||||||
|
|
||||||
type NewParam struct {
|
|
||||||
HxPost string
|
|
||||||
}
|
|
||||||
|
|
||||||
templ New(param NewParam) {
|
|
||||||
if param.HxPost != "" {
|
|
||||||
<form hx-post={ param.HxPost }>
|
|
||||||
{ children... }
|
|
||||||
</form>
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,33 +0,0 @@
|
|||||||
package form
|
|
||||||
|
|
||||||
templ SelectOne(color string, isRound bool) {
|
|
||||||
if isRound {
|
|
||||||
<div class="select is-round">
|
|
||||||
<select>
|
|
||||||
{ children... }
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
} else {
|
|
||||||
<div class="select">
|
|
||||||
<select>
|
|
||||||
{ children... }
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
templ SelectOneItem(name string) {
|
|
||||||
<option>{ name }</option>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ SelectMany(howManySelectable int, color string, isRound bool) {
|
|
||||||
<div class="select is-multiple">
|
|
||||||
<select multiple size="{ howManySelectable }">
|
|
||||||
{ children... }
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ SelectManyItem(name string) {
|
|
||||||
<option value={ name }>{ name }</option>
|
|
||||||
}
|
|
||||||
@ -1,5 +0,0 @@
|
|||||||
package form
|
|
||||||
|
|
||||||
templ Submit(text, color string) {
|
|
||||||
<button type="submit" class={ "button", color }>{ text }</button>
|
|
||||||
}
|
|
||||||
@ -1,5 +0,0 @@
|
|||||||
package form
|
|
||||||
|
|
||||||
templ TextArea(id, placeholder, color string) {
|
|
||||||
<textarea class={ "textarea", color } id={ id } placeholder={ placeholder }/>
|
|
||||||
}
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
package form
|
|
||||||
|
|
||||||
const (
|
|
||||||
InputTypeText = "text"
|
|
||||||
InputTypePassword = "password"
|
|
||||||
InputTypeEmail = "email"
|
|
||||||
InputTypePhoneNumber = "tel"
|
|
||||||
)
|
|
||||||
@ -1,5 +0,0 @@
|
|||||||
package html
|
|
||||||
|
|
||||||
templ Br(){
|
|
||||||
<br/>
|
|
||||||
}
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
package html
|
|
||||||
|
|
||||||
templ ALink(url, title string) {
|
|
||||||
<a href={ templ.SafeURL(url) }>{ title }</a>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ ANewTab(url, text string) {
|
|
||||||
<a href={ templ.SafeURL(url) } target="_blank" rel="noopener noreferrer">{ text }</a>
|
|
||||||
}
|
|
||||||
@ -1,26 +0,0 @@
|
|||||||
package html
|
|
||||||
|
|
||||||
templ Doctype() {
|
|
||||||
<!DOCTYPE html>
|
|
||||||
}
|
|
||||||
|
|
||||||
// Creates <html> that accepts children
|
|
||||||
templ New(lang string) {
|
|
||||||
<html lang={ lang }>
|
|
||||||
{ children... }
|
|
||||||
</html>
|
|
||||||
}
|
|
||||||
|
|
||||||
// Creates <head> that accepts children
|
|
||||||
templ NewHeader() {
|
|
||||||
<head>
|
|
||||||
{ children... }
|
|
||||||
</head>
|
|
||||||
}
|
|
||||||
|
|
||||||
// Creates <body> that accepts children
|
|
||||||
templ NewBody() {
|
|
||||||
<body>
|
|
||||||
{ children... }
|
|
||||||
</body>
|
|
||||||
}
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
package html
|
|
||||||
|
|
||||||
templ Img(src string) {
|
|
||||||
<img src={ src } />
|
|
||||||
}
|
|
||||||
|
|
||||||
templ ImgAlt(src, alt string) {
|
|
||||||
<img src={ src } alt={ alt }/>
|
|
||||||
}
|
|
||||||
@ -1,10 +0,0 @@
|
|||||||
package bulma
|
|
||||||
|
|
||||||
// Creates a image wrapper.
|
|
||||||
// This accepts children.
|
|
||||||
// Use html.Img() to load a image as a child
|
|
||||||
templ Image(image string) {
|
|
||||||
<figure class={ "image", image }>
|
|
||||||
{ children... }
|
|
||||||
</figure>
|
|
||||||
}
|
|
||||||
@ -1,7 +0,0 @@
|
|||||||
package layout
|
|
||||||
|
|
||||||
templ Container(breakpoint string) {
|
|
||||||
<div class={ "container", breakpoint }>
|
|
||||||
{ children... }
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
@ -1,37 +0,0 @@
|
|||||||
package layout
|
|
||||||
|
|
||||||
templ Hero(title, subtitle string) {
|
|
||||||
<section class="hero">
|
|
||||||
<div class="hero-body">
|
|
||||||
<p class="title">{ title }</p>
|
|
||||||
<p class="subtitle">{ subtitle }</p>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ HeroSize(title, subtitle, size string) {
|
|
||||||
<section class={ "hero", size }>
|
|
||||||
<div class="hero-body">
|
|
||||||
<p class="title">{ title }</p>
|
|
||||||
<p class="subtitle">{ subtitle }</p>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ HeroColor(title, subtitle, color string) {
|
|
||||||
<section class={ "hero", color }>
|
|
||||||
<div class="hero-body">
|
|
||||||
<p class="title">{ title }</p>
|
|
||||||
<p class="subtitle">{ subtitle }</p>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ HeroColorSize(title, subtitle, color, size string) {
|
|
||||||
<section class={ "hero", color, size }>
|
|
||||||
<div class="hero-body">
|
|
||||||
<p class="title">{ title }</p>
|
|
||||||
<p class="subtitle">{ subtitle }</p>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
}
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
package layout
|
|
||||||
|
|
||||||
// Creates a <section> object thats good to break up a page of content.
|
|
||||||
templ Section(title, subtitle string) {
|
|
||||||
<section class="section">
|
|
||||||
<h1 class="title">{ title }</h1>
|
|
||||||
<h2 class="subtitle">{ subtitle }</h2>
|
|
||||||
</section>
|
|
||||||
}
|
|
||||||
@ -1,7 +0,0 @@
|
|||||||
package bulma
|
|
||||||
|
|
||||||
templ Notification(message, color string) {
|
|
||||||
<div class={ "notification", color }>
|
|
||||||
{ message }
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
@ -1,5 +0,0 @@
|
|||||||
package bulma
|
|
||||||
|
|
||||||
templ UseBulmaCdn() {
|
|
||||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@1.0.1/css/bulma.min.css"/>
|
|
||||||
}
|
|
||||||
@ -1,37 +0,0 @@
|
|||||||
package bulma
|
|
||||||
|
|
||||||
// Creates a <table> that accepts children
|
|
||||||
templ Table(){
|
|
||||||
<table class="table">
|
|
||||||
{ children... }
|
|
||||||
</table>
|
|
||||||
}
|
|
||||||
|
|
||||||
// Creates a <thead> that accepts children.
|
|
||||||
templ TableHeader() {
|
|
||||||
<thead>{ children... }</thead>
|
|
||||||
}
|
|
||||||
|
|
||||||
// Creates a <tf> that accepts children.
|
|
||||||
templ TableRow() {
|
|
||||||
<tr>{ children... }</tr>
|
|
||||||
}
|
|
||||||
|
|
||||||
// Creates a <th> and writes the given value
|
|
||||||
templ TableHeaderData(value string) {
|
|
||||||
<th>{ value }</th>
|
|
||||||
}
|
|
||||||
|
|
||||||
// Creates a <th> that allows you to also add a tooltip value
|
|
||||||
templ TableHeaderDataToolTip(value, tooltip string) {
|
|
||||||
<th><abbr title={ tooltip }>{ value }</abbr></th>
|
|
||||||
}
|
|
||||||
|
|
||||||
// Creates a <td> that accepts children.
|
|
||||||
templ TableDataChildren() {
|
|
||||||
<td>{ children... }</td>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ TableData(value string) {
|
|
||||||
<td>{ value }</td>
|
|
||||||
}
|
|
||||||
@ -1,13 +0,0 @@
|
|||||||
package bulma
|
|
||||||
|
|
||||||
templ Tag(message string) {
|
|
||||||
<span class={ "tag" }>{ message }</span>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ TagColor(message, color string) {
|
|
||||||
<span class={ "tag", color }>{ message }</span>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ TagColorSize(message, color, size string) {
|
|
||||||
<span class={ "tag", color, size }>{ message }</span>
|
|
||||||
}
|
|
||||||
@ -1,49 +0,0 @@
|
|||||||
package bulma
|
|
||||||
|
|
||||||
templ Title(message string) {
|
|
||||||
<h1 class="title">{ message }</h1>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ Subitle(message string) {
|
|
||||||
<h2 class="subtitle">{ message }</h2>
|
|
||||||
}
|
|
||||||
|
|
||||||
templ H1(message string, isSubtitle bool) {
|
|
||||||
if isSubtitle {
|
|
||||||
<h1 class="subtitle is-1">{ message }</h1>
|
|
||||||
} else {
|
|
||||||
<h1 class="title is-1">{ message }</h1>
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
templ H2(message string, isSubtitle bool) {
|
|
||||||
if isSubtitle {
|
|
||||||
<h2 class="subtitle is-2">{ message }</h2>
|
|
||||||
} else {
|
|
||||||
<h2 class="title is-2">{ message }</h2>
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
templ H3(message string, isSubtitle bool) {
|
|
||||||
if isSubtitle {
|
|
||||||
<h3 class="subtitle is-3">{ message }</h3>
|
|
||||||
} else {
|
|
||||||
<h3 class="title is-3">{ message }</h3>
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
templ H4(message string, isSubtitle bool) {
|
|
||||||
if isSubtitle {
|
|
||||||
<h4 class="subtitle is-4">{ message }</h4>
|
|
||||||
} else {
|
|
||||||
<h4 class="title is-4">{ message }</h4>
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
templ H5(message string, isSubtitle bool) {
|
|
||||||
if isSubtitle {
|
|
||||||
<h5 class="subtitle is-5">{ message }</h5>
|
|
||||||
} else {
|
|
||||||
<h5 class="title is-5">{ message }</h5>
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,20 +0,0 @@
|
|||||||
package bulma
|
|
||||||
|
|
||||||
const (
|
|
||||||
ColorPrimary = "is-primary"
|
|
||||||
ColorInfo = "is-info"
|
|
||||||
ColorLink = "is-link"
|
|
||||||
ColorWarning = "is-warning"
|
|
||||||
ColorSuccess = "is-success"
|
|
||||||
ColorError = "is-error"
|
|
||||||
|
|
||||||
SizeNormal = "is-normal"
|
|
||||||
SizeMedium = "is-medium"
|
|
||||||
SizeLarge = "is-large"
|
|
||||||
|
|
||||||
BreakpointDefault = ""
|
|
||||||
BreakpointWidescreen = "is-widescreen"
|
|
||||||
BreakpointFullHd = "is-fullhd"
|
|
||||||
BreakpointMaxDesktop = "is-max-desktop"
|
|
||||||
BreakpointMaxWidescreen = "is-max-widescreen"
|
|
||||||
)
|
|
||||||
Loading…
Reference in New Issue
Block a user