diff --git a/backend/christine.website/main.go b/backend/christine.website/main.go
index 3100f0c..d0c6d3f 100644
--- a/backend/christine.website/main.go
+++ b/backend/christine.website/main.go
@@ -110,6 +110,7 @@ func main() {
http.Error(w, "Not Found", http.StatusNotFound)
})
http.Handle("/dist/", http.FileServer(http.Dir("./frontend/static/")))
+ http.Handle("/static/", http.FileServer(http.Dir(".")))
http.HandleFunc("/", writeIndexHTML)
log.Fatal(http.ListenAndServe(":9090", nil))
diff --git a/frontend/src/BlogIndex.purs b/frontend/src/BlogIndex.purs
index a52e6bd..6fbdc6d 100644
--- a/frontend/src/BlogIndex.purs
+++ b/frontend/src/BlogIndex.purs
@@ -61,7 +61,7 @@ post (Post state) =
div
[ className "col s6" ]
[ div
- [ className "card pink lighten-4" ]
+ [ className "card pink lighten-5" ]
[ div
[ className "card-content black-text" ]
[ span [ className "card-title" ] [ text state.title ]
@@ -70,7 +70,7 @@ post (Post state) =
, span [] [ text state.summary ]
]
, div
- [ className "card-action pink" ]
+ [ className "card-action pink lighten-5" ]
[ link state.link [] [ text "Read More" ] ]
]
]
diff --git a/frontend/src/Layout.purs b/frontend/src/Layout.purs
index f809b9c..c68cada 100644
--- a/frontend/src/Layout.purs
+++ b/frontend/src/Layout.purs
@@ -9,8 +9,9 @@ import DOM (DOM)
import Network.HTTP.Affjax (AJAX)
import Prelude (($), (#), map, pure)
import Pux (EffModel, noEffects, mapEffects, mapState)
-import Pux.Html (Html, a, code, div, h1, h3, h4, li, nav, p, pre, text, ul)
-import Pux.Html.Attributes (classID, className, id_, role, href)
+import Pux.Html as H
+import Pux.Html (style, Html, a, code, div, h1, h2, h3, h4, li, nav, p, pre, text, ul, img, span)
+import Pux.Html.Attributes (classID, className, id_, role, href, src, rel)
import Pux.Router (link)
data Action
@@ -116,9 +117,47 @@ contact =
]
]
+index :: Html Action
+index =
+ div
+ [ className "row panel" ]
+ [ H.link [ rel "stylesheet", href "/static/css/about/main.css" ] []
+ , div
+ [ className "col m4 bg_blur valign-wrapper center-align" ]
+ [ div
+ [ className "valign center-align fb_wrap" ]
+ [ link "/contact"
+ [ className "btn follow_btn" ]
+ [ text "Contact Me" ]
+ ]
+ ]
+ , div
+ [ className "col m8" ]
+ [ div
+ [ className "header" ]
+ [ h1 [] [ text "Christine Dodrill" ]
+ , h4 [] [ text "Rockstar Hacker, Freelance Programmer, Gopher, Cloud Architect" ]
+ , span [] [ text "I am a GitHub power user. I am constantly learning new languages and tools. I strongly believe in knowing many languages and ways to do things so I can pick the right tool for the job." ]
+ , h2 [] [ text "Skills" ]
+ , ul
+ []
+ [ li [] [ text "Go, Moonscript, Lua, Python, C, Nim, Haskell" ]
+ , li [] [ text "Docker deployments" ]
+ , li [] [ text "Research, Development and Experimentation" ]
+ ]
+ , h2 [] [ text "Side Projects" ]
+ , ul
+ []
+ [ li [] [ text "Real-time globally distributed chat server maintenance" ]
+ , li [] [ text "Mashups of chat, video and music" ]
+ ]
+ ]
+ ]
+ ]
+
page :: Route -> State -> Html Action
page NotFound _ = h1 [] [ text "not found" ]
-page Home state = map Child $ Counter.view state.count
+page Home _ = index
page Resume state = h1 [] [ text "Christine Dodrill" ]
page BlogIndex state = map BIChild $ BlogIndex.view state.bistate
page (BlogPost _) state = map BEChild $ BlogEntry.view state.bestate
diff --git a/frontend/support/index.html b/frontend/support/index.html
index 74e914e..f56eab7 100644
--- a/frontend/support/index.html
+++ b/frontend/support/index.html
@@ -8,6 +8,7 @@
+
diff --git a/static/css/about/main.css b/static/css/about/main.css
new file mode 100644
index 0000000..900fdd1
--- /dev/null
+++ b/static/css/about/main.css
@@ -0,0 +1,104 @@
+img.textwrap-right {
+ float: right;
+ margin: 10px;
+}
+
+.well {
+ margin-top:-20px;
+ text-align:center;
+ cursor:pointer;
+ font-size: 25px;
+ padding: 15px;
+ border-radius: 0px !important;
+}
+
+.well:hover {
+ margin-top:-20px;
+ border:2px solid black;
+ text-align:center;
+ cursor:pointer;
+ font-size: 25px;
+ padding: 15px;
+ border-radius: 0px !important;
+}
+
+.bg_blur
+{
+ background-image:url('/static/img/avatar.png');
+ height: 512px;
+ background-size: cover;
+ overflow: visible;
+}
+
+.fb_wrap {
+ margin: 0 auto;
+ padding: 10px;
+}
+
+.follow_btn {
+ text-decoration: none;
+ height: 20%;
+ padding: 10px;
+ background-color: #E5B7CE;
+ padding-top: 6px;
+ color: #fff;
+ text-align: center;
+ font-size: 20px;
+ opacity: 1.0;
+}
+
+.follow_btn:hover {
+ text-decoration: none;
+ background-color: #FE9ACD;
+ padding: 10px;
+ padding-top: 6px;
+ color: #fff;
+ text-align: center;
+ font-size: 20px;
+ border: 4px solid rgba(255, 255, 255, 0.8);
+}
+
+.header{
+ color : #808080;
+ margin-left:10%;
+ margin-top:70px;
+}
+
+.picture{
+ height:150px;
+ width:150px;
+ top: 75px;
+ left:-75px;
+ float: left;
+}
+
+.picture_mob{
+ position: absolute;
+ width: 35%;
+ left: 35%;
+ bottom: 70%;
+}
+
+.btn-style{
+ color: #fff;
+ background-color: #007FBE;
+ border-color: #adadad;
+ width: 33.3%;
+}
+
+.btn-style:hover {
+ color: #333;
+ background-color: #3D5DE0;
+ border-color: #adadad;
+ width: 33.3%;
+}
+
+@media (max-width: 767px) {
+ .header{
+ text-align : center;
+ }
+
+ .nav{
+ margin-top : 30px;
+ }
+}
diff --git a/static/css/main.css b/static/css/main.css
new file mode 100644
index 0000000..8411af4
--- /dev/null
+++ b/static/css/main.css
@@ -0,0 +1,3 @@
+body {
+ background-color: #FFCCE6;
+}
\ No newline at end of file
diff --git a/static/img/about/tower.jpg b/static/img/about/tower.jpg
new file mode 100644
index 0000000..3d9f264
Binary files /dev/null and b/static/img/about/tower.jpg differ
diff --git a/static/img/avatar.png b/static/img/avatar.png
new file mode 100644
index 0000000..f4b9014
Binary files /dev/null and b/static/img/avatar.png differ