From 69a74ac3fb4ceff3ce79fdc8cc2036d17c4a3c23 Mon Sep 17 00:00:00 2001 From: Lucas Brown Date: Mon, 5 Aug 2019 14:33:20 -0800 Subject: [PATCH] Enhanced formatting for project pages. --- cmd/web-app/static/assets/css/custom.css | 16 ++++ .../templates/content/account-view.gohtml | 4 +- .../templates/content/examples-images.gohtml | 24 +++-- .../templates/content/projects-create.gohtml | 31 +++++-- .../templates/content/projects-index.gohtml | 13 ++- .../templates/content/projects-update.gohtml | 24 ++++- .../templates/content/projects-view.gohtml | 91 ++++++++++--------- .../templates/content/users-create.gohtml | 19 +++- .../templates/content/users-update.gohtml | 1 + cmd/web-app/templates/layouts/base.gohtml | 2 +- 10 files changed, 158 insertions(+), 67 deletions(-) diff --git a/cmd/web-app/static/assets/css/custom.css b/cmd/web-app/static/assets/css/custom.css index a387a4b..4086a26 100644 --- a/cmd/web-app/static/assets/css/custom.css +++ b/cmd/web-app/static/assets/css/custom.css @@ -23,6 +23,18 @@ div.dataTables_wrapper div.dataTables_filter label { margin-bottom: 0px; } + +div.dataTables_wrapper div.dataTables_filter input { + font-size: .8rem; + font-weight: 400; + border-radius: 0.35rem; + font-weight: normal; + border: 1px solid rgb(166, 166, 166); + color: #858796; +} + + + div.dataTables_wrapper div.dataTables_info { flex: 0 0 50%; max-width: 50%; @@ -93,3 +105,7 @@ div.dataTable_card a.paginate_button.current { background-color: #007bff; } + +.alert p:last-child { + margin-bottom: 0; +} diff --git a/cmd/web-app/templates/content/account-view.gohtml b/cmd/web-app/templates/content/account-view.gohtml index 31ed6f9..a627afa 100644 --- a/cmd/web-app/templates/content/account-view.gohtml +++ b/cmd/web-app/templates/content/account-view.gohtml @@ -56,9 +56,9 @@ Status
{{ if eq .account.Status.Value "active" }} - {{ .account.Status.Title }} + {{ .account.Status.Title }} {{else}} - {{.account.Status.Title }} + {{.account.Status.Title }} {{end}}

diff --git a/cmd/web-app/templates/content/examples-images.gohtml b/cmd/web-app/templates/content/examples-images.gohtml index 783b192..4fec005 100644 --- a/cmd/web-app/templates/content/examples-images.gohtml +++ b/cmd/web-app/templates/content/examples-images.gohtml @@ -5,20 +5,32 @@ {{define "content"}} {{ if .imgResizeDisabled }} -

Image Resize Not enabled

- AWS credentials must be set and then the following configs be set as well. +

Image Resize Not enabled

+ +

AWS credentials must be set and then the following configs be set as well.

             export WEB_APP_SERVICE_S3_BUCKET_PUBLIC=example-bucket-public
             export WEB_APP_SERVICE_STATICFILES_IMG_RESIZE_ENABLED=1
{{ else }} -

S3ImgSrcLarge

-

320, 480, 800

+ +
+

Responsive Images

+ +
+ +

This SaaS Starter Kit includes functions to resize images automatically and render the src of an image tag with an array of source URLs. The functions are custom functions that are rendered with the GO templates.

+ + 
{{ FUNCTION_NAME $._ctx "RELATIVE_PATH_TO_IMAGE_HERE" }}
+ +
S3ImgSrcLarge
+

Generates an array of three images from the source file with widths of 320, 480 and 800.


- HTML: 
<img {{ S3ImgSrcLarge $._ctx "/images/example-image-resize-galaxy-3000x1600.png" }}>
- Result: 
<img {{ S3ImgSrcLarge $._ctx "/images/example-image-resize-galaxy-3000x1600.png" }}>
+ +

HTML:

<img {{ S3ImgSrcLarge $._ctx "/images/example-image-resize-galaxy-3000x1600.png" }}>
+

Result:

<img {{ S3ImgSrcLarge $._ctx "/images/example-image-resize-galaxy-3000x1600.png" }}>

S3ImgThumbSrcLarge

320, 480, 800

diff --git a/cmd/web-app/templates/content/projects-create.gohtml b/cmd/web-app/templates/content/projects-create.gohtml index f089585..333a222 100644 --- a/cmd/web-app/templates/content/projects-create.gohtml +++ b/cmd/web-app/templates/content/projects-create.gohtml @@ -3,23 +3,36 @@ {{end}} {{define "content"}} + +
+

Create Project

+
+
-
-
-
- - - {{template "invalid-feedback" dict "validationDefaults" $.validationDefaults "validationErrors" $.validationErrors "fieldName" "Name" }} + +
+
+ +
+
+
+ + + {{template "invalid-feedback" dict "validationDefaults" $.validationDefaults "validationErrors" $.validationErrors "fieldName" "Name" }} +
+
-
-
+ +
+ Cancel
+ {{end}} {{define "js"}} diff --git a/cmd/web-app/templates/content/projects-index.gohtml b/cmd/web-app/templates/content/projects-index.gohtml index 899bd4b..0c8cb76 100644 --- a/cmd/web-app/templates/content/projects-index.gohtml +++ b/cmd/web-app/templates/content/projects-index.gohtml @@ -1,12 +1,17 @@ {{define "title"}}Projects{{end}} {{define "content"}} - {{ if HasRole $._Ctx "admin" }} - Create Project - {{ end }} + +
+

Projects

+ {{ if HasRole $._Ctx "admin" }} + Create Project + {{ end }} +
+
-
+
{{ template "partials/datatable/html" . }}
diff --git a/cmd/web-app/templates/content/projects-update.gohtml b/cmd/web-app/templates/content/projects-update.gohtml index 0a2325f..7c8c921 100644 --- a/cmd/web-app/templates/content/projects-update.gohtml +++ b/cmd/web-app/templates/content/projects-update.gohtml @@ -3,8 +3,25 @@ {{end}} {{define "content"}} + +
+

Update Project

+
+ -
+ +
+
+ +
+
+ +

Project Details

+
+
+ + +
@@ -24,7 +41,10 @@
-
+ +
+
+
diff --git a/cmd/web-app/templates/content/projects-view.gohtml b/cmd/web-app/templates/content/projects-view.gohtml index d24be75..f1ba213 100644 --- a/cmd/web-app/templates/content/projects-view.gohtml +++ b/cmd/web-app/templates/content/projects-view.gohtml @@ -3,54 +3,61 @@ {{end}} {{define "content"}} -
-
-
-
-

Name

-

- {{ .project.Name }} -

+ +
+

{{ .project.Name }}

+ +
+ +
+
+
Project Details
+
+ + + +
+
Actions
+ Update Details + {{ if HasRole $._Ctx "admin" }} + + {{ end }}
-
- Edit Details - {{ if HasRole $._Ctx "admin" }} -
- {{ end }} +
+ +
+
+

+ Name
+ {{ .project.Name }} +

+

+ Status
+ {{ if .project }} + + {{ if eq .project.Status.Value "active" }} + {{ .project.Status.Title }} + {{else}} + {{.project.Status.Title }} + {{end}} + + {{ end }} +

+
+
+ +

+ ID
+ {{ .project.ID }} +

+
+
+
-
- -
-
-

- Name
- {{ .project.Name }} -

-
-
-
-

- Status
- {{ if .project }} - - {{ if eq .project.Status.Value "active" }} - {{ .project.Status.Title }} - {{else}} - {{.project.Status.Title }} - {{end}} - - {{ end }} -

-

- ID
- {{ .project.ID }} -

-
-
{{end}} {{define "js"}} diff --git a/cmd/web-app/templates/content/users-create.gohtml b/cmd/web-app/templates/content/users-create.gohtml index 9ceb2f9..298866b 100644 --- a/cmd/web-app/templates/content/users-create.gohtml +++ b/cmd/web-app/templates/content/users-create.gohtml @@ -13,7 +13,6 @@
-
@@ -55,6 +54,24 @@
+ - Select at least one role. + + {{ range $r := .roles.Options }} + {{ $selectRole := false }} + {{ range $fr := $.form.Roles }} + {{ if eq $r.Value $fr }}{{ $selectRole = true }}{{ end }} + {{ end }} + +
+ + +
+ {{ end }} + + + {{template "invalid-feedback" dict "validationDefaults" $.validationDefaults "validationErrors" $.validationErrors "fieldName" "Timezone" }}
+
diff --git a/cmd/web-app/templates/layouts/base.gohtml b/cmd/web-app/templates/layouts/base.gohtml index bc0a0be..1f2607f 100644 --- a/cmd/web-app/templates/layouts/base.gohtml +++ b/cmd/web-app/templates/layouts/base.gohtml @@ -3,7 +3,7 @@ - {{block "title" .}}{{end}} Web App + {{block "title" .}}{{end}} - SaaS Web App