diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..942ab1b --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +**/public +**/_gen \ No newline at end of file diff --git a/assets/scss/base/sections.scss b/assets/scss/base/sections.scss index cf2b160..fab6a03 100644 --- a/assets/scss/base/sections.scss +++ b/assets/scss/base/sections.scss @@ -3,13 +3,16 @@ html { scroll-behavior: smooth; } body { - width: 100vw; + display: flex; + flex-flow: column; + min-height: 100vh; position: relative; } +main {flex-grow: 1;} .section { - padding: 1em 0; - @media (min-width: 480px) {padding: 2em 0;} - @media (min-width: 960px) {padding: 4em 0;} + padding: 2em 0; + @media (min-width: 600px) {padding: 3em 0} + @media (min-width: 62em) {padding: 4em 0} } .container { width: 100%; diff --git a/assets/scss/partials/site-footer.scss b/assets/scss/partials/site-footer.scss index 7dcbfe3..4959a5e 100644 --- a/assets/scss/partials/site-footer.scss +++ b/assets/scss/partials/site-footer.scss @@ -1,3 +1,9 @@ .site-footer { + background: #333; + color: white; hr {display: none;} + .container {padding: 2em 1em;} + dt {font-weight: 700;} + dd {margin-bottom: 0.5em;} + a {color: inherit;} } \ No newline at end of file diff --git a/assets/scss/partials/site-header.scss b/assets/scss/partials/site-header.scss index 5c36c11..a66a631 100644 --- a/assets/scss/partials/site-header.scss +++ b/assets/scss/partials/site-header.scss @@ -1,109 +1,8 @@ -.site-header {background: #ddd; filter: drop-shadow(0px -1px 2px rgba(0,0,0,0.2))} -.site-header a {text-decoration: none; color: inherit;} -.site-title {font-weight: 700; font-size: 22px; line-height: 2em;} -.site-header .container {display: flex; flex-flow: row wrap;} -.site-nav {flex-basis: 100%; display: flex; flex-flow: column;} -.site-nav a {display: block; padding: 1em 0;} - - -.site-nav { - display: none; - @media (min-width: 600px) { - display: flex; - flex-basis: unset; - flex-flow: row; - ul { - display: flex; - } - a { - margin-left: 1em; - box-sizing: border-box; - } - } -} .site-header { - position: fixed; bottom: 0; width: 100%; - z-index: 2; - @media (min-width: 600px) { - position: sticky; - bottom: unset; - top: 0; - a {height: 44px;} - a:hover {border-bottom: 2px solid #00a3ff;} - .container {justify-content: space-between; flex-flow: row wrap; height: 64px; align-items: center;} - } + a {text-decoration: none; color: inherit;} + .container {} } -body { - margin-bottom: 44px; - @media (min-width: 600px) {margin-bottom: unset;} -} -.hamburger-label::before {content:"Menu"; position: absolute; left: -3em; } -#hamburger:checked ~ .site-nav { - display: flex; -} -#hamburger { - transition: all 0.5s; - box-sizing: border-box; - display: none; -} -.hamburger-label { - transition: all 0.5s; - box-sizing: border-box; - cursor: pointer; - position: absolute; - z-index: 99; - height: 100%; - width: 100%; - top: 16px; - right: 15px; - height: 22px; - width: 22px; -} -.spinner { - transition: all 0.5s; - box-sizing: border-box; - position: absolute; - height: 3px; - width: 100%; - background-color: black; -} -.horizontal { - transition: all 0.5s; - box-sizing: border-box; - position: relative; - float: left; - margin-top: 3px; -} -.diagonal.part-1 { - position: relative; - transition: all 0.5s; - box-sizing: border-box; - float: left; -} -.diagonal.part-2 { - transition: all 0.5s; - box-sizing: border-box; - position: relative; - float: left; - margin-top: 3px; -} -#hamburger:checked ~ .hamburger-label > .horizontal { - transition: all 0.5s; - box-sizing: border-box; - opacity: 0; -} -#hamburger:checked ~ .hamburger-label > .diagonal.part-1 { - transition: all 0.5s; - box-sizing: border-box; - transform: rotate(135deg); - margin-top: 8px; -} -#hamburger:checked ~ .hamburger-label > .diagonal.part-2 { - transition: all 0.5s; - box-sizing: border-box; - transform: rotate(-135deg); - margin-top: -9px; -} -@media (min-width: 600px) { - #hamburger, .hamburger-label {display: none;} -} \ No newline at end of file + +.site-masthead {display: flex; gap: 1em; align-items: center;} +.site-icon {width: 44px; height: 44px; border-radius: 100em;} +.site-title {} diff --git a/config.toml b/config.toml index 0e415a1..f2aa254 100644 --- a/config.toml +++ b/config.toml @@ -3,4 +3,28 @@ languageCode = "en-us" title = "abdullah tarawneh" [markup.goldmark.renderer] -unsafe= true \ No newline at end of file +unsafe= true + +[menu] + +[[menu.main]] +identifier = "home" +pre = "" +name = "Home" +url = "/" +weight = 10 + +[[menu.main]] +identifier = "blog" +pre = "" +name = "Blog" +url = "/blog/" +weight = 20 + +[[menu.main]] +identifier = "contact" +pre = "" +name = "Contact" +url = "/contact/" +weight = 30 + diff --git a/content/blog/_index.md b/content/blog/_index.md new file mode 100644 index 0000000..e69de29 diff --git a/content/contact/_index.md b/content/contact/_index.md new file mode 100644 index 0000000..80ee983 --- /dev/null +++ b/content/contact/_index.md @@ -0,0 +1,4 @@ +--- +title: "Contact" +--- + diff --git a/layouts/index.html b/layouts/index.html index 21fc245..3276300 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -108,5 +108,12 @@ +
+
+

let's talk.

+

if you'd like me to do something for you, then the best way to get in touch with me is to email a@trwnh.com with your proposal. i am currently open for hiring as well.

+ view resume +
+
{{ end }} diff --git a/layouts/partials/site-footer.html b/layouts/partials/site-footer.html index 526d28c..be3e9b1 100644 --- a/layouts/partials/site-footer.html +++ b/layouts/partials/site-footer.html @@ -1,6 +1,13 @@ \ No newline at end of file diff --git a/layouts/partials/site-header.html b/layouts/partials/site-header.html index 9fd37d6..1603bc7 100644 --- a/layouts/partials/site-header.html +++ b/layouts/partials/site-header.html @@ -1,22 +1,25 @@ \ No newline at end of file diff --git a/resources/_gen/assets/scss/scss/main.scss_48b060fe05b0a273d182ef83c0605941.content b/resources/_gen/assets/scss/scss/main.scss_48b060fe05b0a273d182ef83c0605941.content index 1e7ef8e..32cf558 100644 --- a/resources/_gen/assets/scss/scss/main.scss_48b060fe05b0a273d182ef83c0605941.content +++ b/resources/_gen/assets/scss/scss/main.scss_48b060fe05b0a273d182ef83c0605941.content @@ -1 +1 @@ -html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;box-sizing:border-box}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}html{font-family:-apple-system,BlinkMacSystemFont,segoe ui,Roboto,Oxygen,Ubuntu,Cantarell,open sans,helvetica neue,sans-serif;scroll-behavior:smooth}body{width:100vw;position:relative}.section{padding:1em 0}@media(min-width:480px){.section{padding:2em 0}}@media(min-width:960px){.section{padding:4em 0}}.container{width:100%;max-width:960px;margin:0 auto;padding:0 1em}.section-heading{font-size:1.2em;font-weight:400;line-height:1.2;text-align:center;max-width:18ch;margin:0 auto;margin-bottom:4em;padding-bottom:1em;border-bottom:2px solid rgba(0,0,0,.25)}h1,h2,h3,h4,h5,h6{line-height:1.2}p{line-height:1.4}.hero .container{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:1em}.hero img{width:100%;grid-row:1/3}.headline{font-size:clamp(1.4em,7vw,3em);max-width:11ch;line-height:1.2;align-self:end}.button{background:#0060ff;color:#fff;width:max-content;font-size:clamp(0.75em,2vw,1em);padding:.75em;display:flex;justify-content:center;text-decoration:none;border-radius:100em;font-weight:700}.cta{grid-column:1;grid-row:2;align-self:start}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(15em,1fr));gap:1em}.card{background:#fff}.card img{width:100%;height:auto}#process .card img{height:200px}.card h3{margin:1em 0;font-weight:700}.card p{margin-bottom:1em}.testimonials{display:flex;flex-flow:row wrap;gap:1em;justify-content:center}.testimonial{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;grid-gap:1em;margin-bottom:1em;flex-basis:18em}.avatar{margin-left:1em;width:2em;height:2em;border-radius:1em;background:#212121}.name{align-self:center}.bubble{background-color:#212121;color:#fff;padding:.5em;border-radius:.5em;position:relative;grid-column:span 2;height:80px;display:flex;justify-content:center;align-items:center;text-align:center}.bubble:after{content:'';position:absolute;top:0;left:2em;width:0;height:0;border:.5em solid transparent;border-bottom-color:#212121;border-top:0;margin-left:-.5em;margin-top:-.5em}.site-header{background:#ddd;filter:drop-shadow(0px -1px 2px rgba(0,0,0,0.2))}.site-header a{text-decoration:none;color:inherit}.site-title{font-weight:700;font-size:22px;line-height:2em}.site-header .container{display:flex;flex-flow:row wrap}.site-nav{flex-basis:100%;display:flex;flex-flow:column}.site-nav a{display:block;padding:1em 0}.site-nav{display:none}@media(min-width:600px){.site-nav{display:flex;flex-basis:unset;flex-flow:row}.site-nav ul{display:flex}.site-nav a{margin-left:1em;box-sizing:border-box}}.site-header{position:fixed;bottom:0;width:100%;z-index:2}@media(min-width:600px){.site-header{position:sticky;bottom:unset;top:0}.site-header a{height:44px}.site-header a:hover{border-bottom:2px solid #00a3ff}.site-header .container{justify-content:space-between;flex-flow:row wrap;height:64px;align-items:center}}body{margin-bottom:44px}@media(min-width:600px){body{margin-bottom:unset}}.hamburger-label::before{content:"Menu";position:absolute;left:-3em}#hamburger:checked~.site-nav{display:flex}#hamburger{transition:all .5s;box-sizing:border-box;display:none}.hamburger-label{transition:all .5s;box-sizing:border-box;cursor:pointer;position:absolute;z-index:99;height:100%;width:100%;top:16px;right:15px;height:22px;width:22px}.spinner{transition:all .5s;box-sizing:border-box;position:absolute;height:3px;width:100%;background-color:#000}.horizontal{transition:all .5s;box-sizing:border-box;position:relative;float:left;margin-top:3px}.diagonal.part-1{position:relative;transition:all .5s;box-sizing:border-box;float:left}.diagonal.part-2{transition:all .5s;box-sizing:border-box;position:relative;float:left;margin-top:3px}#hamburger:checked~.hamburger-label>.horizontal{transition:all .5s;box-sizing:border-box;opacity:0}#hamburger:checked~.hamburger-label>.diagonal.part-1{transition:all .5s;box-sizing:border-box;transform:rotate(135deg);margin-top:8px}#hamburger:checked~.hamburger-label>.diagonal.part-2{transition:all .5s;box-sizing:border-box;transform:rotate(-135deg);margin-top:-9px}@media(min-width:600px){#hamburger,.hamburger-label{display:none}}.site-footer hr{display:none} \ No newline at end of file +html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;box-sizing:border-box}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}html{font-family:-apple-system,BlinkMacSystemFont,segoe ui,Roboto,Oxygen,Ubuntu,Cantarell,open sans,helvetica neue,sans-serif;scroll-behavior:smooth}body{display:flex;flex-flow:column;min-height:100vh;position:relative}main{flex-grow:1}.section{padding:2em 0}@media(min-width:600px){.section{padding:3em 0}}@media(min-width:62em){.section{padding:4em 0}}.container{width:100%;max-width:960px;margin:0 auto;padding:0 1em}.section-heading{font-size:1.2em;font-weight:400;line-height:1.2;text-align:center;max-width:18ch;margin:0 auto;margin-bottom:4em;padding-bottom:1em;border-bottom:2px solid rgba(0,0,0,.25)}h1,h2,h3,h4,h5,h6{line-height:1.2}p{line-height:1.4}.hero .container{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:1em}.hero img{width:100%;grid-row:1/3}.headline{font-size:clamp(1.4em,7vw,3em);max-width:11ch;line-height:1.2;align-self:end}.button{background:#0060ff;color:#fff;width:max-content;font-size:clamp(0.75em,2vw,1em);padding:.75em;display:flex;justify-content:center;text-decoration:none;border-radius:100em;font-weight:700}.cta{grid-column:1;grid-row:2;align-self:start}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(15em,1fr));gap:1em}.card{background:#fff}.card img{width:100%;height:auto}#process .card img{height:200px}.card h3{margin:1em 0;font-weight:700}.card p{margin-bottom:1em}.testimonials{display:flex;flex-flow:row wrap;gap:1em;justify-content:center}.testimonial{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;grid-gap:1em;margin-bottom:1em;flex-basis:18em}.avatar{margin-left:1em;width:2em;height:2em;border-radius:1em;background:#212121}.name{align-self:center}.bubble{background-color:#212121;color:#fff;padding:.5em;border-radius:.5em;position:relative;grid-column:span 2;height:80px;display:flex;justify-content:center;align-items:center;text-align:center}.bubble:after{content:'';position:absolute;top:0;left:2em;width:0;height:0;border:.5em solid transparent;border-bottom-color:#212121;border-top:0;margin-left:-.5em;margin-top:-.5em}.site-header a{text-decoration:none;color:inherit}.site-masthead{display:flex;gap:1em;align-items:center}.site-icon{width:44px;height:44px;border-radius:100em}.site-footer{background:#333;color:#fff}.site-footer hr{display:none}.site-footer .container{padding:2em 1em}.site-footer dt{font-weight:700}.site-footer dd{margin-bottom:.5em}.site-footer a{color:inherit} \ No newline at end of file diff --git a/resources/_gen/assets/scss/scss/main.scss_48b060fe05b0a273d182ef83c0605941.json b/resources/_gen/assets/scss/scss/main.scss_48b060fe05b0a273d182ef83c0605941.json index b68ab04..5607eab 100644 --- a/resources/_gen/assets/scss/scss/main.scss_48b060fe05b0a273d182ef83c0605941.json +++ b/resources/_gen/assets/scss/scss/main.scss_48b060fe05b0a273d182ef83c0605941.json @@ -1 +1 @@ -{"Target":"scss/main.min.432c5720f6da561756119efb67db5c1d2c32e4aafb655f93d83c5b3b0aab7ecb.css","MediaType":"text/css","Data":{"Integrity":"sha256-QyxXIPbaVhdWEZ77Z9tcHSwy5Kr7ZV+T2DxbOwqrfss="}} \ No newline at end of file +{"Target":"scss/main.min.95089ef85e19636fd55cb64500712284e5a674f127ae539030f77b9e8d70aca1.css","MediaType":"text/css","Data":{"Integrity":"sha256-lQie+F4ZY2/VXLZFAHEihOWmdPEnrlOQMPd7no1wrKE="}} \ No newline at end of file