From d549c9649267cf028f5ba61aa55a008831769ef9 Mon Sep 17 00:00:00 2001 From: cyber-dream Date: Sun, 30 Apr 2023 14:32:35 +0300 Subject: [PATCH] css refactoring --- pure-html/base.html | 2 +- pure-html/basic-window.html | 6 +- resources/base.css | 128 +-------- resources/sys/wde/file-view.css | 59 ++++ resources/sys/wde/wde-scrollbar.css | 89 ++++++ resources/wde.js | 66 +---- resources/wdeUI.css | 315 ++++++---------------- templates/about-me/app.tmpl | 20 -- templates/base/index.tmpl | 4 +- templates/base/mobile-desktop.tmpl | 6 +- templates/blog-viewer/app.tmpl | 10 +- templates/finder/app.tmpl | 10 +- templates/img-viewer/app.tmpl | 6 +- templates/personal-properties/app.tmpl | 102 ++++--- templates/wde-widgets/file-tile-view.tmpl | 6 +- templates/wde-widgets/file-tile.tmpl | 2 +- 16 files changed, 324 insertions(+), 507 deletions(-) create mode 100644 resources/sys/wde/file-view.css create mode 100644 resources/sys/wde/wde-scrollbar.css delete mode 100644 templates/about-me/app.tmpl diff --git a/pure-html/base.html b/pure-html/base.html index 6f59604..800f80a 100644 --- a/pure-html/base.html +++ b/pure-html/base.html @@ -13,7 +13,7 @@
diff --git a/pure-html/basic-window.html b/pure-html/basic-window.html index 78d213b..b3bae90 100644 --- a/pure-html/basic-window.html +++ b/pure-html/basic-window.html @@ -3,11 +3,11 @@
-
-
+
+
Test Title
-
+
diff --git a/resources/base.css b/resources/base.css index 84028c8..5fdb459 100644 --- a/resources/base.css +++ b/resources/base.css @@ -16,7 +16,7 @@ .NoClick { pointer-events: none; - } +} .Click { pointer-events: all; } @@ -27,6 +27,11 @@ font-weight:initial; } +*::-webkit-scrollbar { /* WebKit */ + width: 0; + height: 0; +} + body{ zoom: var(--zoom); position: absolute; @@ -45,123 +50,16 @@ body{ touch-action: manipulation; } -/* @font-face { - font-family: "EspySansRegular"; - src: url("res/EspySansRegular.ttf"); - font-weight: normal; - font-style: normal; -} */ - -#WindowsLayer { - width: 100%; - height: 100%; +#windows-layer { + width: 0px; + height: 0px; /* position: fixed; */ position: relative; } -.Frame{ - width: 100%; - min-height: 200px; - height: auto; - background-color: #CCCCCC; - border: 1px solid #000000; - box-shadow: 1px 1px 0px #000,inset -1px -1px 0px rgba(0, 0, 0, 0.27), inset 1px 1px 0px #FFFFFF; - - display: flex; - flex-direction: column; - align-items: flex-start; - padding: 4px; - gap:4px; -} - -/* .WindowFrameTopBar{ - width: 100%; - height: 13px; - - display: flex; - flex-direction: row; - align-items: center; - justify-content: space-between; - gap: 5px; - padding: 0px; -} */ - - - -.WindowFrameTitle{ - pointer-events: none; - white-space: nowrap -} - -.VisualFrame{ +#desktop-layer{ + position: absolute; width: 100%; height: 100%; - position: relative; - /* overflow: scroll; */ - /* overflow-x: hidden; */ - - - /* Inside auto layout */ - - flex: none; - order: 1; - align-self: stretch; - flex-grow: 1; - - background: #DDDDDD; - border: 1px solid #000000; - box-shadow: 0.5px 0.5px 0px 0.5px #FFFFFF, -0.5px -0.5px 0px 0.5px rgba(0, 0, 0, 0.25), inset 1px 1px 0px #FFFFFF; - - /* Auto layout */ - - display: flex; - flex-direction: column; - align-items: center; - justify-content: start; - align-items: flex-start; - gap: 0px; - padding: 0px; -} - -.ContentFrame{ - width: 100%; - height: auto; - /* background-color: aquamarine; */ - - /* Auto layout */ - display: flex; - flex-direction: column; - align-items: center; - padding: 12px; - padding-bottom: 0px; - gap:16px; - -} - - - -.Old { - box-sizing: border-box; - position: relative; - padding: 10px; - /* Auto layout */ - display: flex; - flex-direction: column; - align-items: center; - padding: 12px; - gap:16px; - - width: 100%; - height: auto; - - - - - /* Inside auto layout */ - flex: none; - order: 0; - align-self: stretch; - flex-grow: 1; - - overflow: scroll; -} + background-color: #9999CC; +} \ No newline at end of file diff --git a/resources/sys/wde/file-view.css b/resources/sys/wde/file-view.css new file mode 100644 index 0000000..293210f --- /dev/null +++ b/resources/sys/wde/file-view.css @@ -0,0 +1,59 @@ +.FileTileView{ + width: 100%; + height: auto; + + /* Auto layout */ + display: flex; + flex-direction: row; + align-items: flex-start; + justify-content: flex-start; + gap: 50px; + row-gap: 20px; + /* padding: 15px; Shit fix TODO: */ + margin: 15px; + flex-wrap: wrap; + align-content: flex-start; + + /* overflow: scroll; */ + /* overflow-x: hidden; */ + scrollbar-width: none; /* Firefox */ + -ms-overflow-style: none; /* Internet Explorer 10+ */ + +} + +.FileTileView::-webkit-scrollbar { /* WebKit */ + width: 0; + height: 0; +} + +.FileTileView .Tile{ + width: 50px; + height: 50px; + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: center; + justify-content: flex-start; + gap: 2px; + padding: 0px; + flex-wrap: nowrap; +} + +.FileTileView .Icon{ + width: 32px; + height: 32px; + background-image: url("./icons/folder.png"); + background-size: cover; + + image-rendering: optimizeSpeed; /* STOP SMOOTHING, GIVE ME SPEED */ + image-rendering: -moz-crisp-edges; /* Firefox */ + image-rendering: -o-crisp-edges; /* Opera */ + image-rendering: -webkit-optimize-contrast; /* Chrome (and eventually Safari) */ + image-rendering: pixelated; /* Universal support since 2021 */ + image-rendering: optimize-contrast; /* CSS3 Proposed */ + -ms-interpolation-mode: nearest-neighbor; /* IE8+ */ +} + +.FileTileView .Lable{ + white-space: nowrap; +} diff --git a/resources/sys/wde/wde-scrollbar.css b/resources/sys/wde/wde-scrollbar.css new file mode 100644 index 0000000..3ede80c --- /dev/null +++ b/resources/sys/wde/wde-scrollbar.css @@ -0,0 +1,89 @@ +.scroller { + overflow-y: scroll; + scrollbar-color: #0A4C95 #C2D2E4; + border-radius: 0px; + } + +.scroll_content { + position: relative; + width: 400px; + height: 414px; + top: -17px; + padding: 20px 10px 20px 10px; + overflow-y: auto; +} + +.ScrollbarPlace{ + overflow: hidden; + + border-left: 1px solid #000000; + width: 14px; + height: 100%; + + bottom: 0px; + right: 0px; + width: 14px; + height: 100%; + + background-color: #AAAAAA; + box-shadow: inset -1px 0px 0px rgba(255, 255, 255, 0.29), inset -2px 0px 0px rgba(255, 255, 255, 0.19), inset 1px 1px 0px rgba(0, 0, 0, 0.14), inset 2px 2px 0px rgba(0, 0, 0, 0.19); + + /* Inside auto layout */ + flex: none; + order: 0; + align-self: stretch; + flex-grow: 1; +} + + +.ScrollBarScrollElement{ + position: relative; + + width: 14px; + height: 31px; + background: #9999FF; + + box-shadow: 0px -1px 0px #000000, 0px 1px 0px #000000, 0px 2px 0px rgba(0, 0, 0, 0.13), 0px 3px 0px rgba(0, 0, 0, 0.19), inset 0px 1px 0px rgba(255, 255, 255, 0.5), inset 1px 0px 0px rgba(255, 255, 255, 0.5), inset -1px -1px 0px rgba(102, 102, 204, 0.91); + + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-around; + gap: 5px; + padding: 0px; +} + +.ScrollBarScrollElementDrag{ + pointer-events: none; + /* background-color: #0A4C95; */ + width: 7px; + height: 7px; + margin-left: -1px; + + background: linear-gradient(transparent 0%,#CCCCFF 0%, #CCCCFF 50%, transparent 50%); + background-size: 2px 2px; + + /* TODO white pixels in rows start */ + filter: drop-shadow(1px 1px 0px #333399); +} + +.ScrollContent { + width: 100%; + height: 100%; + overflow: scroll; + overflow-x: hidden; + scrollbar-width: none; /* Firefox */ + -ms-overflow-style: none; /* Internet Explorer 10+ */ + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: flex-start; + padding: 0px; +} + +.ScrollContent::-webkit-scrollbar { /* WebKit */ + width: 0; + height: 0; +} \ No newline at end of file diff --git a/resources/wde.js b/resources/wde.js index 3c96825..5357bbd 100644 --- a/resources/wde.js +++ b/resources/wde.js @@ -6,7 +6,7 @@ document.addEventListener('DOMContentLoaded', function() { if (!WebDesktopEnvironment.isMobile){ // WebDesktopEnvironment.Open("finder", ["/home/user"]) // WebDesktopEnvironment.Open("blog-viewer", ["/home/user/blog/test-1.blog"]) - // WebDesktopEnvironment.Open("personal-properties", ["kek"]) + WebDesktopEnvironment.Open("personal-properties", ["kek"]) } else { WebDesktopEnvironment.Open("blog-viewer", ["/home/user/blog/test-1.blog"]) } @@ -62,7 +62,6 @@ class WebDesktopEnvironment{ let desktopLayer = document.createElement("div") desktopLayer.setAttribute('id', 'desktop-layer') - desktopLayer.setAttribute('class', 'DesktopBackground') document.body.appendChild(desktopLayer) WebDesktopEnvironment.Open("finder", ["/home/user", "desktop", desktopLayer]) @@ -144,7 +143,7 @@ class WebDesktopEnvironment{ document.body.querySelector('#windows-layer').appendChild(newWindow) return newWindow } else { - newWindow.setAttribute("class", "StandartApplicationWindow") + newWindow.setAttribute("class", "WindowFrame") newWindow.setAttribute("windowId", "SuperUniqUUID") //TODO: newWindow.style.width = width.toString() + "px" @@ -213,8 +212,6 @@ var getJSON = function(url, callback) { class WindowsCompositor{ windowLayer = undefined movingElement = null - // xPosInit = 0 - // yPosInit = 0 //TODO refactor this to dynamic add/remove listeners constructor(){ @@ -228,12 +225,14 @@ class WindowsCompositor{ // if (event.target.event.target.className != "DragArea"){} let xPosInit = event.offsetX let yPosInit = event.offsetY - let window = event.target.closest('.StandartApplicationWindow') + let window = event.target.closest('.WindowFrame') let dragWindow = function(event){ // console.log(window) // console.log(event.clientX) // console.log(event.clientX - xPosInit, event.clientY - yPosInit) - WindowsCompositor.dragElement(window,event.clientX - xPosInit, event.clientY - yPosInit) + window.style.left = `${event.clientX - xPosInit}px` + window.style.top = `${event.clientY - yPosInit}px` + // WindowsCompositor.dragElement(window,event.clientX - xPosInit, event.clientY - yPosInit) } let stopDrag = function(){ removeEventListener('mousemove', dragWindow) @@ -247,65 +246,14 @@ class WindowsCompositor{ this.windowLayer.addEventListener('mousedown', startDrag) } - - if (false) { //FIXME - addEventListener("mousedown", (event) => { - this.xPosInit = event.offsetX - this.yPosInit = event.offsetY - - this.bringWindowToFront(event.target.closest('.StandartApplicationWindow')) - - this.catchClick(event) - - }) - addEventListener("mouseup", (event) => { - this.movingElement = null - this.xPosInit = 0 - }) - addEventListener("mousemove", (event) => { - - if (this.movingElement != null) { - this.dragElement(this.movingElement, event.clientX - this.xPosInit, event.clientY - this.yPosInit) - } else { - - } - }) - } } /** * @param {HTMLElement} window */ - bringWindowToFront(window){ + bringWindowToFront(window){ //FIXME this.windowLayer.insertBefore(this.windowLayer.lastChild, window) } - /** - * @param {MouseEvent} event - */ - catchClick(event){ - switch (true) { - case event.target.className == "WindowFrameTopBar": - this.movingElement = event.target.parentElement - break; - default: - break; - } - } - /** - * @param {HTMLDivElement} element - * @param {number} posX - * @param {number} posY - */ - static dragElement(element, posX, posY) { //TODO - element.style.left = `${posX}px` - element.style.top = `${posY}px` - } - - startDrag(){ - this.windowLayer.addEventListener('mousemove', () => { - console.log("move") - }) - } } diff --git a/resources/wdeUI.css b/resources/wdeUI.css index f555449..38bd1ce 100644 --- a/resources/wdeUI.css +++ b/resources/wdeUI.css @@ -1,4 +1,4 @@ -.StandartApplicationWindow{ +.WindowFrame{ /* Auto layout */ display: flex; flex-direction: column; @@ -21,20 +21,6 @@ flex-grow: 1; } -.MobileApplicationWindow{ - width: 100%; - height: 100%; - /* Auto layout */ - display: flex; - flex-direction: column; - align-items: flex-start; - gap: 4px; - - position: absolute; - top: 0px; - left: 0px; -} - .ContentBorder { width: 100%; height: 100%; @@ -57,6 +43,74 @@ padding: 0px; } +.WindowFrame .TitleBar{ + width: 100%; + height: 13px; + + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; + gap: 5px; + padding: 0px; + + + /* Inside auto layout */ + flex: none; + order: 0; + align-self: stretch; + flex-grow: 0; +} + + +.WindowFrame .TitleBar .Lable{ + position: relative; + top:1px; + /* font-size: 13px; */ + + pointer-events: none; + white-space: nowrap; + + font-family: "Virtue"; + letter-spacing: 0.35px; +} + + +.WindowFrame .TitleBar .Button{ + width: 11px; + height: 11px; + padding: 0%; + position: relative; + top: 1px; + + background: linear-gradient(135deg, #999999 18.18%, #FFFFFF 81.82%); + border: 1px solid #222222; + box-shadow: 0.5px 0.5px 0px 0.5px #FFFFFF, + -0.5px -0.5px 0px 0.5px rgba(0, 0, 0, 0.25), + inset 1px 1px 0px rgba(255, 255, 255, 0.5), + inset -1px -1px 0px rgba(0, 0, 0, 0.27); + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; +} + +.WindowFrame .TitleBar .Button:active { + background-color: rgba(0, 0, 0, 0.4); /* Green */ + box-shadow: 0.5px 0.5px 0px 0.5px #FFFFFF, + -0.5px -0.5px 0px 0.5px rgba(0, 0, 0, 0.25); +} + +.WindowFrame .TitleBar .VisualDragArea{ + pointer-events: none; + width: 100%; + height: 11px; + background: linear-gradient(transparent 0%,white 0%, white 50%, transparent 50%); + background-size: 2px 2px; + filter: drop-shadow(1px 1px 0px #777777); +} + .MobileContentBorder { width: 100%; height: 100%; @@ -79,43 +133,18 @@ padding: 0px; } -.WindowFrameTopBarButton{ - width: 11px; - height: 11px; - padding: 0%; - position: relative; - top: 1px; - - background: linear-gradient(135deg, #999999 18.18%, #FFFFFF 81.82%); - border: 1px solid #222222; - box-shadow: 0.5px 0.5px 0px 0.5px #FFFFFF, - -0.5px -0.5px 0px 0.5px rgba(0, 0, 0, 0.25), - inset 1px 1px 0px rgba(255, 255, 255, 0.5), - inset -1px -1px 0px rgba(0, 0, 0, 0.27); - - /* Inside auto layout */ - flex: none; - order: 0; - flex-grow: 0; -} - -.WindowFrameTopBar{ +.MobileApplicationWindow{ width: 100%; - height: 13px; - + height: 100%; + /* Auto layout */ display: flex; - flex-direction: row; - align-items: center; - justify-content: space-between; - gap: 5px; - padding: 0px; + flex-direction: column; + align-items: flex-start; + gap: 4px; - - /* Inside auto layout */ - flex: none; - order: 0; - align-self: stretch; - flex-grow: 0; + position: absolute; + top: 0px; + left: 0px; } .MobileWindowFrameBottomBar{ @@ -157,7 +186,7 @@ flex-grow: 0; } -.MobileWindowFrameBottomBar .MobileWindowFrameTitle{ +.MobileWindowFrameBottomBar .MobileLable{ position: absolute; /* top:1px; */ /* font-size: 13px; */ @@ -169,190 +198,4 @@ letter-spacing: 0.35px; } -.WindowFrameTopBar .WindowFrameTitle{ - position: relative; - top:1px; - /* font-size: 13px; */ - pointer-events: none; - white-space: nowrap; - - font-family: "Virtue"; - letter-spacing: 0.35px; - -} - - -.WindowFrameTopBarButton:active { - background-color: rgba(0, 0, 0, 0.4); /* Green */ - box-shadow: 0.5px 0.5px 0px 0.5px #FFFFFF, - -0.5px -0.5px 0px 0.5px rgba(0, 0, 0, 0.25); -} - - -.WindowDragArea{ - pointer-events: none; - width: 100%; - height: 11px; - background: linear-gradient(transparent 0%,white 0%, white 50%, transparent 50%); - background-size: 2px 2px; - filter: drop-shadow(1px 1px 0px #777777); -} - -.scroller { - overflow-y: scroll; - scrollbar-color: #0A4C95 #C2D2E4; - border-radius: 0px; - } - - .scroll_content { - position: relative; - width: 400px; - height: 414px; - top: -17px; - padding: 20px 10px 20px 10px; - overflow-y: auto; -} - -.ScrollbarPlace{ - overflow: hidden; - - border-left: 1px solid #000000; - width: 14px; - height: 100%; - - bottom: 0px; - right: 0px; - width: 14px; - height: 100%; - - background-color: #AAAAAA; - box-shadow: inset -1px 0px 0px rgba(255, 255, 255, 0.29), inset -2px 0px 0px rgba(255, 255, 255, 0.19), inset 1px 1px 0px rgba(0, 0, 0, 0.14), inset 2px 2px 0px rgba(0, 0, 0, 0.19); - - /* Inside auto layout */ - flex: none; - order: 0; - align-self: stretch; - flex-grow: 1; -} - - -.ScrollBarScrollElement{ - position: relative; - - width: 14px; - height: 31px; - background: #9999FF; - - box-shadow: 0px -1px 0px #000000, 0px 1px 0px #000000, 0px 2px 0px rgba(0, 0, 0, 0.13), 0px 3px 0px rgba(0, 0, 0, 0.19), inset 0px 1px 0px rgba(255, 255, 255, 0.5), inset 1px 0px 0px rgba(255, 255, 255, 0.5), inset -1px -1px 0px rgba(102, 102, 204, 0.91); - - display: flex; - flex-direction: row; - align-items: center; - justify-content: space-around; - gap: 5px; - padding: 0px; -} - -.ScrollBarScrollElementDrag{ - pointer-events: none; - /* background-color: #0A4C95; */ - width: 7px; - height: 7px; - margin-left: -1px; - - background: linear-gradient(transparent 0%,#CCCCFF 0%, #CCCCFF 50%, transparent 50%); - background-size: 2px 2px; - - /* TODO white pixels in rows start */ - filter: drop-shadow(1px 1px 0px #333399); -} - - -.FileTileView{ - width: 100%; - height: auto; - - /* Auto layout */ - display: flex; - flex-direction: row; - align-items: flex-start; - justify-content: flex-start; - gap: 50px; - row-gap: 20px; - /* padding: 15px; Shit fix TODO: */ - margin: 15px; - flex-wrap: wrap; - align-content: flex-start; - - overflow: scroll; - /* overflow-x: hidden; */ - scrollbar-width: none; /* Firefox */ - -ms-overflow-style: none; /* Internet Explorer 10+ */ - -} - -.FileTileView::-webkit-scrollbar { /* WebKit */ - width: 0; - height: 0; -} - -.FileTile{ - width: 50px; - height: 50px; - /* Auto layout */ - display: flex; - flex-direction: column; - align-items: center; - justify-content: flex-start; - gap: 2px; - padding: 0px; - flex-wrap: nowrap; -} - -.FileTileIcon{ - width: 32px; - height: 32px; - background-image: url("sys/wde/icons/folder.png"); - background-size: cover; - - image-rendering: optimizeSpeed; /* STOP SMOOTHING, GIVE ME SPEED */ - image-rendering: -moz-crisp-edges; /* Firefox */ - image-rendering: -o-crisp-edges; /* Opera */ - image-rendering: -webkit-optimize-contrast; /* Chrome (and eventually Safari) */ - image-rendering: pixelated; /* Universal support since 2021 */ - image-rendering: optimize-contrast; /* CSS3 Proposed */ - -ms-interpolation-mode: nearest-neighbor; /* IE8+ */ -} - -.FileTileTitle{ - white-space: nowrap; -} - -.ScrollContent { - width: 100%; - height: 100%; - overflow: scroll; - overflow-x: hidden; - scrollbar-width: none; /* Firefox */ - -ms-overflow-style: none; /* Internet Explorer 10+ */ - - /* Auto layout */ - display: flex; - flex-direction: row; - justify-content: center; - align-items: flex-start; - padding: 0px; -} - -.ScrollContent::-webkit-scrollbar { /* WebKit */ - width: 0; - height: 0; -} - -.DesktopBackground{ - position: absolute; - width: 100%; - height: 100%; - background-color: #9999CC; -} \ No newline at end of file diff --git a/templates/about-me/app.tmpl b/templates/about-me/app.tmpl deleted file mode 100644 index 62c52a2..0000000 --- a/templates/about-me/app.tmpl +++ /dev/null @@ -1,20 +0,0 @@ -{{ define "about-me/app.tmpl" }} - -
-
-
- -
-
- About me -
-
-
-
-
- TEST CONTENT -
- {{template "wde-widgets/scrollbar.tmpl" .}} -
-
-{{ end }} \ No newline at end of file diff --git a/templates/base/index.tmpl b/templates/base/index.tmpl index 9017153..1f583bc 100644 --- a/templates/base/index.tmpl +++ b/templates/base/index.tmpl @@ -4,6 +4,8 @@ + + @@ -21,7 +23,7 @@ diff --git a/templates/base/mobile-desktop.tmpl b/templates/base/mobile-desktop.tmpl index 6c637df..7a288eb 100644 --- a/templates/base/mobile-desktop.tmpl +++ b/templates/base/mobile-desktop.tmpl @@ -8,15 +8,15 @@
-
+
About Me
-
+
Blog
-
+
Close
diff --git a/templates/blog-viewer/app.tmpl b/templates/blog-viewer/app.tmpl index 7c0e244..99be9e9 100644 --- a/templates/blog-viewer/app.tmpl +++ b/templates/blog-viewer/app.tmpl @@ -1,11 +1,11 @@ {{ define "blog-viewer/app.tmpl" }} -
- -
-
+
+ +
+
{{.header}}
-
+
diff --git a/templates/finder/app.tmpl b/templates/finder/app.tmpl index 880e052..dabc9ee 100644 --- a/templates/finder/app.tmpl +++ b/templates/finder/app.tmpl @@ -1,11 +1,11 @@ {{ define "finder/app.tmpl" }} -
- -
-
+
+ +
+
Files
-
+
diff --git a/templates/img-viewer/app.tmpl b/templates/img-viewer/app.tmpl index ded7fd1..e74126b 100644 --- a/templates/img-viewer/app.tmpl +++ b/templates/img-viewer/app.tmpl @@ -1,11 +1,11 @@ {{ define "img-viewer/app.tmpl" }}
-
-
+
+
About me
-
+
-
- -
-
- About me -
-
-
- -
-
-
-
- My Photo -
-
{{ .headerProps.Name }}
-
{{ .headerProps.Info1 }}
-
{{ .headerProps.Info2 }}
-
-
- {{ range $propIsland := .allprops }} -
-
- {{$propIsland.Header}}: -
-
- {{range $prop := $propIsland.Props}} -
-
- {{$prop.Key}}: - {{ range $value := $prop.KeyComments }} -
- {{ $value }} -
- {{ end }} -
-
- {{ range $value := $prop.Values }} -
- {{ $value }} -
- {{ end }} -
-
- {{ end }} -
-
- {{ end }} -
-
- {{template "wde-widgets/scrollbar.tmpl" .}} +
+ +
+
+ About me
+
+
+
+
+
+
+ My Photo +
+
{{ .headerProps.Name }}
+
{{ .headerProps.Info1 }}
+
{{ .headerProps.Info2 }}
+
+
+ {{ range $propIsland := .allprops }} +
+
+ {{$propIsland.Header}}: +
+
+ {{range $prop := $propIsland.Props}} +
+
+ {{$prop.Key}}: + {{ range $value := $prop.KeyComments }} +
+ {{ $value }} +
+ {{ end }} +
+
+ {{ range $value := $prop.Values }} +
+ {{ $value }} +
+ {{ end }} +
+
+ {{ end }} +
+
+ {{ end }} +
+
+ {{template "wde-widgets/scrollbar.tmpl" .}} +
{{ end }} \ No newline at end of file diff --git a/templates/wde-widgets/file-tile-view.tmpl b/templates/wde-widgets/file-tile-view.tmpl index 3e3ce22..af81399 100644 --- a/templates/wde-widgets/file-tile-view.tmpl +++ b/templates/wde-widgets/file-tile-view.tmpl @@ -1,8 +1,8 @@ {{ define "wde-widgets/file-tile-view.tmpl" }} {{ range $fileTile := .Files }} -
-
-
{{ $fileTile.Name }}
+
+
+
{{ $fileTile.Name }}
{{ end }} {{ end }} \ No newline at end of file diff --git a/templates/wde-widgets/file-tile.tmpl b/templates/wde-widgets/file-tile.tmpl index 5a3f188..5642d5c 100644 --- a/templates/wde-widgets/file-tile.tmpl +++ b/templates/wde-widgets/file-tile.tmpl @@ -1,6 +1,6 @@ {{ define "wde-widgets/file-tile.tmpl" }}
-
+
{{ .Name }}
{{ end }} \ No newline at end of file