diff --git a/assets/brain.js b/assets/brain.js index 90c88c3..05d20bd 100644 --- a/assets/brain.js +++ b/assets/brain.js @@ -1,5 +1,5 @@ import './styles/brain.css'; -import './stimulus_bootstrap.js'; +//import './stimulus_bootstrap.js'; const init = () => { menu(); diff --git a/assets/styles/brain.css b/assets/styles/brain.css index f1a002a..7368933 100644 --- a/assets/styles/brain.css +++ b/assets/styles/brain.css @@ -1 +1 @@ -.actions{padding-bottom:1rem}.actions .list{display:flex;gap:2rem;list-style:none;margin:0;padding:0}.page{max-width:800px;width:100%;margin:0 auto}.page h2{margin:0}.page .row{display:block;padding:1rem 0}.page .row label{display:block}.page .row input{height:30px;width:300px}.page .row #post_published{width:30px;height:30px}.page .row #post_save{width:100px;height:30px;background-color:green;border:none;color:#fff}#brain-wrapper header .level-1{display:flex;justify-content:center;align-items:flex-start;position:relative;list-style-type:none}#brain-wrapper header .level-1--item{padding:1rem 2rem}#brain-wrapper header .level-1 .level-2{display:none;margin:0;padding:0}#brain-wrapper header .level-1 .level-2.open{display:block;position:absolute}#brain-wrapper header .level-1 .level-2--item{padding:1rem 0}#brain-wrapper a{color:#171a21}body{background-color:#d3d3d3} +.page{max-width:800px;width:100%;margin:0 auto}.page h2{margin:0}.page .row{display:block;padding:1rem 0}.page .row label{display:block}.page .row input{height:30px;width:300px}.page .row #post_published{width:30px;height:30px}.page .row #post_save{width:100px;height:30px;background-color:green;border:none;color:#fff}#brain-wrapper header .level-1{display:flex;justify-content:center;align-items:flex-start;position:relative;list-style-type:none}#brain-wrapper header .level-1--item{padding:1rem 2rem}#brain-wrapper header .level-1 .level-2{display:none;margin:0;padding:0}#brain-wrapper header .level-1 .level-2.open{display:block;position:absolute}#brain-wrapper header .level-1 .level-2--item{padding:1rem 0}body{background-color:#d3d3d3} diff --git a/assets/styles/landing.css b/assets/styles/landing.css index 24403b9..1b82576 100644 --- a/assets/styles/landing.css +++ b/assets/styles/landing.css @@ -1 +1,717 @@ -.home{display:flex;align-items:center;flex-direction:column;background-color:dimgray;margin:0}.home header{width:100%}.home header h1{margin:0}.home header h1 a{display:block;font-size:1.5rem;text-decoration:none;color:#1d1f20;background-color:#d7b94c;border:2px solid #d7b94c;padding:2px 2px}.home header h1 a:hover{color:#d7b94c;background-color:unset}.home header nav{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;overflow:hidden;position:relative}.home header nav .icon.icon-menu{position:absolute;z-index:999;display:block;right:2rem;width:30px;height:30px;transition:right 100ms ease}@media screen and (min-width: 600px){.home header nav .icon.icon-menu{display:none}}.home header nav .icon.icon-menu:before{content:"";display:block;background-image:url("/icons/menu-grid.svg");background-size:100%;position:absolute;width:30px;height:30px}.home header nav .icon.icon-menu:hover{cursor:pointer}.home header nav .icon.icon-menu.open{right:200px}.home header nav .front-menu{display:flex;flex-direction:column;gap:1rem;overflow:hidden;position:fixed;right:-100%;top:1rem;margin:0;padding:0;transition:right 200ms ease;background-color:#d7b94c}.home header nav .front-menu.open{right:0}@media screen and (min-width: 600px){.home header nav .front-menu{flex-direction:row;position:relative;top:unset;right:unset;background-color:unset}}.home header nav .front-menu{list-style:none}.home header nav .front-menu li{display:block;padding:5px 10px}.home header nav .front-menu li a{display:block;font-family:Amarante;color:#fbfcff;font-size:1.5rem;text-decoration:none;padding-bottom:2px}@media(min-width: 600px){.home header nav .front-menu li a{color:#d7b94c}}.home header nav .front-menu li a:hover{border-bottom:2px solid #d7b94c;padding-bottom:0}.home #root.v1{display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;width:100%;margin:0 auto}.home #root.v1 section{margin:0;padding:1rem 0}.home #root.v1 section .title{margin:0}.home #root.v1 .top{display:flex;min-height:100vh;justify-content:center;align-items:flex-start;width:100%}@media(min-width: 600px){.home #root.v1 .top{align-items:center}}.home #root.v1 .top .computer{display:block;max-width:800px;max-height:400px;width:100%;height:100%;background-color:#1d1f20;border:2rem solid #a6a695;padding:1rem 1rem;box-shadow:0 0 5px 10px rgba(29,31,32,.45);margin-top:5rem}@media(min-width: 600px){.home #root.v1 .top .computer{margin-top:-6rem}}.home #root.v1 .top .computer .heading{margin:0;font-size:.85rem;font-family:Montserrat-Light;color:#d7b94c;position:relative;padding-left:1rem}@media screen and (min-width: 600px){.home #root.v1 .top .computer .heading{font-size:1rem}}.home #root.v1 .top .computer .heading:before{content:">";position:absolute;left:0;width:100%}.home #root.v1 .top .computer .heading:after{content:"|";position:absolute;right:0;width:100%;background:#1d1f20;animation:typing .5s steps(16) forwards,cursor 1s infinite}@media screen and (min-width: 600px){.home #root.v1 .top .computer .heading:after{animation:typing .5s steps(16) forwards,cursor 1s infinite}}.home #root.v1 .top .computer #intro{width:fit-content}.home #root.v1 .top .computer #intro .heading{width:260px}.home #root.v1 .top .computer #body{width:fit-content}.home #root.v1 .top .computer #body .about{opacity:0;animation:showText .1s forwards;animation-delay:1s;font-size:.95rem;color:#d7b94c}@media screen and (min-width: 600px){.home #root.v1 .top .computer #body .about{font-size:1.125rem;animation:showText .1s forwards;animation-delay:1s}}.home #root.v1 .top .computer #outro{width:fit-content}.home #root.v1 .top .computer #outro .heading{width:160px}.home #root.v1 .top .computer #outro .heading:after{color:#1d1f20;animation:typing .5s steps(16) forwards,cursor 1s infinite;animation-delay:2.5s}@media screen and (min-width: 600px){.home #root.v1 .top .computer #outro .heading:after{animation:typing .5s steps(16) forwards,cursor 1s infinite;animation-delay:2.5s}}.home #root.v1 .top .computer #outro .menu{opacity:0;animation:showText .1s forwards;animation-delay:3s;display:flex;flex-wrap:wrap;gap:1rem;padding-top:2rem;padding-bottom:2rem}@media screen and (min-width: 600px){.home #root.v1 .top .computer #outro .menu{animation-delay:3.5s}}.home #root.v1 .top .computer #outro .menu a{font-size:.95rem;color:#d7b94c;cursor:pointer}@media screen and (min-width: 600px){.home #root.v1 .top .computer #outro .menu a{font-size:1.125rem}}.home #root.v1 .bottom{width:100%;height:100%}.home #root.v1 .bottom section{box-shadow:0 0 5px 4px rgba(29,31,32,.45);margin:4rem 0}.home #root.v1 .bottom #cool-stuff{display:flex;flex-direction:column;align-items:center;width:100%;height:auto;background-color:#d7b94c;padding:2rem 0}.home #root.v1 .bottom #cool-stuff .title:after{content:"";display:block;width:150px;margin:0 auto;border-bottom:5px solid #04392f}.home #root.v1 .bottom #cool-stuff .highlights{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:2rem;position:relative;height:100%;width:100%;padding-top:1rem}.home #root.v1 .bottom #cool-stuff .highlights .highlight{display:flex;flex-direction:column;justify-content:space-between;align-items:center;align-self:stretch;padding:1rem 1rem;position:relative;width:100%;height:auto;max-width:300px}@media(min-width: 600px){.home #root.v1 .bottom #cool-stuff .highlights .highlight{max-width:400px}}.home #root.v1 .bottom #cool-stuff .highlights .highlight{box-shadow:0 0 5px 0 rgba(29,31,32,.45)}.home #root.v1 .bottom #cool-stuff .highlights .highlight img{width:75%}.home #root.v1 .bottom #cool-stuff .highlights .highlight p{font-size:1.25rem;text-align:center}.home #root.v1 .bottom #cool-stuff .highlights .highlight a{display:block;font-family:Orbitron-Regular;color:#49111c;font-size:1.5rem;font-weight:bold;text-decoration:none;padding-bottom:5px}.home #root.v1 .bottom #cool-stuff .highlights .highlight a:hover{border-bottom:5px solid #49111c;padding-bottom:0}.home #root.v1 .bottom #cool-stuff .highlights .highlight .icon.icon-paperclip{position:absolute;top:0;left:0}.home #root.v1 .bottom #cool-stuff .highlights .highlight .icon.icon-paperclip:before{content:"";display:block;background-image:url("/icons/paperclip.svg");background-size:100%;position:absolute;width:50px;height:50px;top:-10px;left:-10px}.home #root.v1 .bottom #cool-stuff .highlights .highlight:hover{box-shadow:0 0 5px 5px rgba(29,31,32,.45)}.home #root.v1 .bottom #work{display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#a6a695;padding:1rem 2rem}.home #root.v1 .bottom #work>.title{color:#49111c;font-weight:bold}.home #root.v1 .bottom #work>.title:after{content:"";display:block;width:50px;margin:0 auto;border-bottom:5px solid #d7b94c}.home #root.v1 .bottom #work .jobs{display:flex;justify-content:center;flex-wrap:wrap;gap:2rem;width:100%;height:100%}@media screen and (min-width: 800px){.home #root.v1 .bottom #work .jobs{flex-wrap:nowrap}}.home #root.v1 .bottom #work .jobs .left,.home #root.v1 .bottom #work .jobs .right{width:100%;height:100%}@media screen and (min-width: 800px){.home #root.v1 .bottom #work .jobs .left,.home #root.v1 .bottom #work .jobs .right{width:50%}}.home #root.v1 .bottom #work .jobs .left .title,.home #root.v1 .bottom #work .jobs .right .title{text-align:center;color:#49111c}.home #root.v1 .bottom #work .jobs .left .wrapper{display:flex;flex-direction:column;justify-content:space-between}.home #root.v1 .bottom #work .jobs .left .job{padding:1rem 2rem;margin-top:1rem;padding:5px;position:relative;box-shadow:0 0 5px 0px rgba(29,31,32,.45)}.home #root.v1 .bottom #work .jobs .left .job .title{text-align:left;color:#49111c}.home #root.v1 .bottom #work .jobs .left .job:hover{cursor:pointer}.home #root.v1 .bottom #work .jobs .left .job.active{border-left:1rem solid #d7b94c;box-shadow:0 0 5px 5px rgba(29,31,32,.45)}.home #root.v1 .bottom #work .jobs .right .highlights{display:block;height:100%;width:100%;margin-top:1rem}.home #root.v1 .bottom #work .jobs .right .job-highlight{padding:1rem 2rem}.home #root.v1 .bottom #work .jobs .right .job-highlight ul{padding:0}.home #root.v1 .bottom #work .jobs .right .job-highlight ul li{font-size:1.125rem}.home #root.v1 .bottom #work .jobs .right .job-highlight ul li ul{padding-left:1rem}.home #root.v1 .bottom #work .jobs .right .job-highlight ul li ul li{padding:2px 0}.home #root.v1 .bottom #work .jobs .right .job-highlight.show{display:block;border-left:1rem solid #d7b94c;box-shadow:0 0 5px 5px rgba(29,31,32,.45)}@media screen and (min-width: 800px){.home #root.v1 .bottom #work .jobs .right .job-highlight.show{border-right:1rem solid #d7b94c;border-left:unset}}.home #root.v1 .bottom #work .jobs .right .job-highlight.hide{display:none}.home #root.v1 .bottom #work .tech{padding:2rem 0}.home #root.v1 .bottom #work .tech .title{color:#49111c;text-align:center}.home #root.v1 .bottom #work .tech .title:after{content:"";display:block;width:50px;margin:0 auto;border-bottom:5px solid #d7b94c}.home #root.v1 .bottom #work .tech .education{text-align:center;font-size:1.125rem}.home #root.v1 .bottom #work .tech .list{display:flex;justify-content:center;column-gap:2rem;row-gap:1rem;flex-wrap:wrap;padding:0}.home #root.v1 .bottom #work .tech .list li{font-size:1.125rem}.home #root.v1 .bottom #contact{display:block;background-color:#1f2421}.home #root.v1 .bottom #contact .title{color:#fbfcff;text-align:center}.home #root.v1 .bottom #contact .title:after{content:"";display:block;width:75px;margin:0 auto;border-bottom:5px solid dimgray}.home #root.v1 .bottom #contact .info{display:flex;justify-content:center;padding:1rem 0}.home #root.v1 .bottom #contact .info .icon.icon-email{position:relative}.home #root.v1 .bottom #contact .info .icon.icon-email:before{content:"";display:block;background-image:url("/icons/email.svg");background-size:100%;width:30px;height:30px}.home #root.v1 #continue{display:block;position:absolute;bottom:5rem;left:50%;transform:translateX(-50%);text-align:center;width:100%;opacity:0;color:#fbfcff;animation:showText .1s forwards,continue .5s steps(50) forwards;animation-delay:4s}@media screen and (min-width: 600px){.home #root.v1 #continue{animation-delay:6s}}.home #root.v1 #continue .icon.icon-arrow-down:after{content:"";display:block;position:absolute;top:0;left:50%;transform:translateX(-50%);background-image:url("/icons/arrow-down-top-line.svg");background-size:100%;width:50px;height:50px}@keyframes typing{0%{color:#d7b94c}100%{width:0;color:#1d1f20}}@keyframes typing2{0%{color:#d7b94c}99.9%{color:#d7b94c}100%{width:0;color:#1d1f20}}@keyframes cursor{50%{color:rgba(0,0,0,0)}}@keyframes showText{0%{opacity:0}100%{opacity:1}}@keyframes continue{0%{bottom:5rem}100%{bottom:4rem}}@font-face{font-family:RobotoSlab-Regular;src:url("/fonts/RobotoSlab-Regular.ttf") format("opentype")}@font-face{font-family:RobotoSlab-Medium;src:url("/fonts/RobotoSlab-Regular.ttf") format("opentype")}@font-face{font-family:RobotoSlab-Bold;src:url("/fonts/RobotoSlab-Bold.ttf") format("opentype")}@font-face{font-family:RobotoSlab-Black;src:url("/fonts/RobotoSlab-Black.ttf") format("opentype")}@font-face{font-family:AtomicAge-Regular;src:url("/fonts/AtomicAge-Regular.ttf") format("opentype")}@font-face{font-family:Montserrat-Regular;src:url("/fonts/Montserrat-Regular.ttf") format("opentype")}@font-face{font-family:Montserrat-Light;src:url("/fonts/Montserrat-Light.ttf") format("opentype")}@font-face{font-family:Montserrat-Italic;src:url("/fonts/Montserrat-Italic.ttf") format("opentype")}@font-face{font-family:Montserrat-Bold;src:url("/fonts/Montserrat-Bold.ttf") format("opentype")}@font-face{font-family:Montserrat-SemiBold;src:url("/fonts/Montserrat-SemiBold.ttf") format("opentype")}@font-face{font-family:Orbitron-Regular;src:url("/fonts/Orbitron-Regular.ttf") format("opentype")}@font-face{font-family:Amarante;src:url("/fonts/Amarante-Regular.ttf") format("opentype")}h1,h2,h3,h4,h5,h6{font-family:Amarante;letter-spacing:2px}h1{font-size:2rem}@media screen and (min-width: 600px){h1{font-size:3rem}}h2{font-size:1.75rem}@media screen and (min-width: 600px){h2{font-size:2.5rem}}h3{font-size:1.5rem}@media screen and (min-width: 600px){h3{font-size:2rem}}h4{font-size:1.25rem}@media screen and (min-width: 600px){h4{font-size:1.5rem}}h5{font-size:1rem}@media screen and (min-width: 600px){h5{font-size:1.25rem}}h6{font-size:1rem}@media screen and (min-width: 600px){h6{font-size:1em}}p,a,li,span{font-family:RobotoSlab-Regular;letter-spacing:1px}strong{font-family:Montserrat-Bold}em{font-family:Montserrat-Italic}u{font-family:Montserrat-SemiBold}cite,q,small{font-family:Orbitron-Regular}s{font-family:Montserrat-SemiBold} +.home { + display: flex; + align-items: center; + flex-direction: column; + background-color: #696969; + margin: 0; +} +.home header { + width: 100%; +} +.home header h1 { + margin: 0; +} +.home header h1 a { + display: block; + font-size: 1.5rem; + text-decoration: none; + color: #1d1f20; + background-color: #d7b94c; + border: 2px solid #d7b94c; + padding: 2px 2px; +} +.home header h1 a:hover { + color: #d7b94c; + background-color: unset; +} +.home header nav { + display: flex; + justify-content: space-between; + align-items: center; + padding: 1rem 2rem; + overflow: hidden; + position: relative; +} +.home header nav .icon.icon-menu { + position: absolute; + z-index: 999; + display: block; + right: 2rem; + width: 30px; + height: 30px; + transition: right 100ms ease; +} +@media screen and (min-width: 600px) { + .home header nav .icon.icon-menu { + display: none; + } +} +.home header nav .icon.icon-menu:before { + content: ""; + display: block; + background-image: url("/icons/menu-grid.svg"); + background-size: 100%; + position: absolute; + width: 30px; + height: 30px; +} +.home header nav .icon.icon-menu:hover { + cursor: pointer; +} +.home header nav .icon.icon-menu.open { + right: 200px; +} +.home header nav .front-menu { + display: flex; + flex-direction: column; + gap: 1rem; + overflow: hidden; + position: fixed; + right: -100%; + top: 1rem; + margin: 0; + padding: 0; + transition: right 200ms ease; + background-color: #d7b94c; +} +.home header nav .front-menu.open { + right: 0; +} +@media screen and (min-width: 600px) { + .home header nav .front-menu { + flex-direction: row; + position: relative; + top: unset; + right: unset; + background-color: unset; + } +} +.home header nav .front-menu { + list-style: none; +} +.home header nav .front-menu li { + display: block; + padding: 5px 10px; +} +.home header nav .front-menu li a { + display: block; + font-family: Amarante; + color: #FBFCFF; + font-size: 1.5rem; + text-decoration: none; + padding-bottom: 2px; +} +@media (min-width: 600px) { + .home header nav .front-menu li a { + color: #d7b94c; + } +} +.home header nav .front-menu li a:hover { + border-bottom: 2px solid #d7b94c; + padding-bottom: 0; +} +.home #root.v1 { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + height: auto; + width: 100%; + margin: 0 auto; +} +.home #root.v1 section { + margin: 0; + padding: 1rem 0; +} +.home #root.v1 section .title { + margin: 0; +} +.home #root.v1 .top { + display: flex; + min-height: 100vh; + justify-content: center; + align-items: flex-start; + width: 100%; +} +@media (min-width: 600px) { + .home #root.v1 .top { + align-items: center; + } +} +.home #root.v1 .top .computer { + display: block; + max-width: 800px; + max-height: 400px; + width: 100%; + height: 100%; + background-color: #1d1f20; + border: 2rem solid #a6a695; + padding: 1rem 1rem; + box-shadow: 0 0 5px 10px rgba(29, 31, 32, 0.45); + margin-top: 5rem; +} +@media (min-width: 600px) { + .home #root.v1 .top .computer { + margin-top: -2rem; + } +} +.home #root.v1 .top .computer .heading { + margin: 0; + font-size: 0.85rem; + font-family: Montserrat-Light; + color: #d7b94c; + position: relative; + padding-left: 1rem; +} +@media screen and (min-width: 600px) { + .home #root.v1 .top .computer .heading { + font-size: 1rem; + } +} +.home #root.v1 .top .computer .heading:before { + content: ">"; + position: absolute; + left: 0; + width: 100%; +} +.home #root.v1 .top .computer .heading:after { + content: "|"; + position: absolute; + right: 0; + width: 100%; + background: #1d1f20; + animation: typing 0.5s steps(16) forwards, cursor 1s infinite; +} +@media screen and (min-width: 600px) { + .home #root.v1 .top .computer .heading:after { + animation: typing 0.5s steps(16) forwards, cursor 1s infinite; + } +} +.home #root.v1 .top .computer #intro { + width: fit-content; +} +.home #root.v1 .top .computer #intro .heading { + width: 260px; +} +.home #root.v1 .top .computer #body { + width: fit-content; +} +.home #root.v1 .top .computer #body .about { + opacity: 0; + animation: showText 0.1s forwards; + animation-delay: 1s; + font-size: 0.95rem; + color: #d7b94c; +} +@media screen and (min-width: 600px) { + .home #root.v1 .top .computer #body .about { + font-size: 1.125rem; + animation: showText 0.1s forwards; + animation-delay: 1s; + } +} +.home #root.v1 .top .computer #outro { + width: fit-content; +} +.home #root.v1 .top .computer #outro .heading { + width: 160px; +} +.home #root.v1 .top .computer #outro .heading:after { + color: #1d1f20; + animation: typing 0.5s steps(16) forwards, cursor 1s infinite; + animation-delay: 2.5s; +} +@media screen and (min-width: 600px) { + .home #root.v1 .top .computer #outro .heading:after { + animation: typing 0.5s steps(16) forwards, cursor 1s infinite; + animation-delay: 2.5s; + } +} +.home #root.v1 .top .computer #outro .menu { + opacity: 0; + animation: showText 0.1s forwards; + animation-delay: 3s; + display: flex; + flex-wrap: wrap; + gap: 1rem; + padding-top: 2rem; + padding-bottom: 2rem; +} +@media screen and (min-width: 600px) { + .home #root.v1 .top .computer #outro .menu { + animation-delay: 3.5s; + } +} +.home #root.v1 .top .computer #outro .menu a { + font-size: 0.95rem; + color: #d7b94c; + cursor: pointer; +} +@media screen and (min-width: 600px) { + .home #root.v1 .top .computer #outro .menu a { + font-size: 1.125rem; + } +} +.home #root.v1 .bottom { + width: 100%; + height: 100%; +} +.home #root.v1 .bottom section { + box-shadow: 0 0 5px 4px rgba(29, 31, 32, 0.45); + margin: 4rem 0; +} +.home #root.v1 .bottom #cool-stuff { + display: flex; + flex-direction: column; + align-items: center; + width: 100%; + height: auto; + background-color: #d7b94c; + padding: 2rem 0; +} +.home #root.v1 .bottom #cool-stuff .title:after { + content: ""; + display: block; + width: 150px; + margin: 0 auto; + border-bottom: 5px solid #04392f; +} +.home #root.v1 .bottom #cool-stuff .highlights { + display: flex; + justify-content: center; + align-items: center; + flex-wrap: wrap; + gap: 2rem; + position: relative; + height: 100%; + width: 100%; + padding-top: 1rem; +} +.home #root.v1 .bottom #cool-stuff .highlights .highlight { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + align-self: stretch; + padding: 1rem 1rem; + position: relative; + width: 100%; + height: auto; + max-width: 300px; +} +@media (min-width: 600px) { + .home #root.v1 .bottom #cool-stuff .highlights .highlight { + max-width: 400px; + } +} +.home #root.v1 .bottom #cool-stuff .highlights .highlight { + box-shadow: 0 0 5px 0 rgba(29, 31, 32, 0.45); +} +.home #root.v1 .bottom #cool-stuff .highlights .highlight img { + width: 75%; +} +.home #root.v1 .bottom #cool-stuff .highlights .highlight p { + font-size: 1.25rem; + text-align: center; +} +.home #root.v1 .bottom #cool-stuff .highlights .highlight a { + display: block; + font-family: Orbitron-Regular; + color: #49111C; + font-size: 1.5rem; + font-weight: bold; + text-decoration: none; + padding-bottom: 5px; +} +.home #root.v1 .bottom #cool-stuff .highlights .highlight a:hover { + border-bottom: 5px solid #49111C; + padding-bottom: 0; +} +.home #root.v1 .bottom #cool-stuff .highlights .highlight .icon.icon-paperclip { + position: absolute; + top: 0; + left: 0; +} +.home #root.v1 .bottom #cool-stuff .highlights .highlight .icon.icon-paperclip:before { + content: ""; + display: block; + background-image: url("/icons/paperclip.svg"); + background-size: 100%; + position: absolute; + width: 50px; + height: 50px; + top: -10px; + left: -10px; +} +.home #root.v1 .bottom #cool-stuff .highlights .highlight:hover { + box-shadow: 0 0 5px 5px rgba(29, 31, 32, 0.45); +} +.home #root.v1 .bottom #work { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + background-color: #a6a695; + padding: 1rem 2rem; +} +.home #root.v1 .bottom #work > .title { + color: #49111C; + font-weight: bold; +} +.home #root.v1 .bottom #work > .title:after { + content: ""; + display: block; + width: 50px; + margin: 0 auto; + border-bottom: 5px solid #d7b94c; +} +.home #root.v1 .bottom #work .jobs { + display: flex; + justify-content: center; + flex-wrap: wrap; + gap: 2rem; + width: 100%; + height: 100%; +} +@media screen and (min-width: 800px) { + .home #root.v1 .bottom #work .jobs { + flex-wrap: nowrap; + } +} +.home #root.v1 .bottom #work .jobs .left, .home #root.v1 .bottom #work .jobs .right { + width: 100%; + height: 100%; +} +@media screen and (min-width: 800px) { + .home #root.v1 .bottom #work .jobs .left, .home #root.v1 .bottom #work .jobs .right { + width: 50%; + } +} +.home #root.v1 .bottom #work .jobs .left .title, .home #root.v1 .bottom #work .jobs .right .title { + text-align: center; + color: #49111C; +} +.home #root.v1 .bottom #work .jobs .left .wrapper { + display: flex; + flex-direction: column; + justify-content: space-between; +} +.home #root.v1 .bottom #work .jobs .left .job { + padding: 1rem 2rem; + margin-top: 1rem; + padding: 5px; + position: relative; + box-shadow: 0 0 5px 0px rgba(29, 31, 32, 0.45); +} +.home #root.v1 .bottom #work .jobs .left .job .title { + text-align: left; + color: #49111C; +} +.home #root.v1 .bottom #work .jobs .left .job:hover { + cursor: pointer; +} +.home #root.v1 .bottom #work .jobs .left .job.active { + border-left: 1rem solid #d7b94c; + box-shadow: 0 0 5px 5px rgba(29, 31, 32, 0.45); +} +.home #root.v1 .bottom #work .jobs .right .highlights { + display: block; + height: 100%; + width: 100%; + margin-top: 1rem; +} +.home #root.v1 .bottom #work .jobs .right .job-highlight { + padding: 1rem 2rem; +} +.home #root.v1 .bottom #work .jobs .right .job-highlight ul { + padding: 0; +} +.home #root.v1 .bottom #work .jobs .right .job-highlight ul li { + font-size: 1.125rem; +} +.home #root.v1 .bottom #work .jobs .right .job-highlight ul li ul { + padding-left: 1rem; +} +.home #root.v1 .bottom #work .jobs .right .job-highlight ul li ul li { + padding: 2px 0; +} +.home #root.v1 .bottom #work .jobs .right .job-highlight.show { + display: block; + border-left: 1rem solid #d7b94c; + box-shadow: 0 0 5px 5px rgba(29, 31, 32, 0.45); +} +@media screen and (min-width: 800px) { + .home #root.v1 .bottom #work .jobs .right .job-highlight.show { + border-right: 1rem solid #d7b94c; + border-left: unset; + } +} +.home #root.v1 .bottom #work .jobs .right .job-highlight.hide { + display: none; +} +.home #root.v1 .bottom #work .tech { + padding: 2rem 0; +} +.home #root.v1 .bottom #work .tech .title { + color: #49111C; + text-align: center; +} +.home #root.v1 .bottom #work .tech .title:after { + content: ""; + display: block; + width: 50px; + margin: 0 auto; + border-bottom: 5px solid #d7b94c; +} +.home #root.v1 .bottom #work .tech .education { + text-align: center; + font-size: 1.125rem; +} +.home #root.v1 .bottom #work .tech .list { + display: flex; + justify-content: center; + column-gap: 2rem; + row-gap: 1rem; + flex-wrap: wrap; + padding: 0; +} +.home #root.v1 .bottom #work .tech .list li { + font-size: 1.125rem; +} +.home #root.v1 .bottom #contact { + display: block; + background-color: #1F2421; +} +.home #root.v1 .bottom #contact .title { + color: #FBFCFF; + text-align: center; +} +.home #root.v1 .bottom #contact .title:after { + content: ""; + display: block; + width: 75px; + margin: 0 auto; + border-bottom: 5px solid #696969; +} +.home #root.v1 .bottom #contact .info { + display: flex; + justify-content: center; + padding: 1rem 0; +} +.home #root.v1 .bottom #contact .info .icon.icon-email { + position: relative; +} +.home #root.v1 .bottom #contact .info .icon.icon-email:before { + content: ""; + display: block; + background-image: url("/icons/email.svg"); + background-size: 100%; + width: 30px; + height: 30px; +} +.home #root.v1 #continue { + display: block; + position: absolute; + bottom: 5rem; + left: 50%; + transform: translateX(-50%); + text-align: center; + width: 100%; + opacity: 0; + color: #FBFCFF; + animation: showText 0.1s forwards, continue 0.5s steps(50) forwards; + animation-delay: 4s; +} +@media screen and (min-width: 600px) { + .home #root.v1 #continue { + animation-delay: 6s; + } +} +.home #root.v1 #continue .icon.icon-arrow-down:after { + content: ""; + display: block; + position: absolute; + top: 0; + left: 50%; + transform: translateX(-50%); + background-image: url("/icons/arrow-down-top-line.svg"); + background-size: 100%; + width: 50px; + height: 50px; +} + +@keyframes typing { + 0% { + color: #d7b94c; + } + 100% { + width: 0; + color: #1d1f20; + } +} +@keyframes typing2 { + 0% { + color: #d7b94c; + } + 99.9% { + color: #d7b94c; + } + 100% { + width: 0; + color: #1d1f20; + } +} +@keyframes cursor { + 50% { + color: transparent; + } +} +@keyframes showText { + 0% { + opacity: 0; + } + 100% { + opacity: 1; + } +} +@keyframes continue { + 0% { + bottom: 5rem; + } + 100% { + bottom: 4rem; + } +} +@font-face { + font-family: RobotoSlab-Regular; + src: url("/fonts/RobotoSlab-Regular.ttf") format("opentype"); +} +@font-face { + font-family: RobotoSlab-Medium; + src: url("/fonts/RobotoSlab-Regular.ttf") format("opentype"); +} +@font-face { + font-family: RobotoSlab-Bold; + src: url("/fonts/RobotoSlab-Bold.ttf") format("opentype"); +} +@font-face { + font-family: RobotoSlab-Black; + src: url("/fonts/RobotoSlab-Black.ttf") format("opentype"); +} +@font-face { + font-family: AtomicAge-Regular; + src: url("/fonts/AtomicAge-Regular.ttf") format("opentype"); +} +@font-face { + font-family: Montserrat-Regular; + src: url("/fonts/Montserrat-Regular.ttf") format("opentype"); +} +@font-face { + font-family: Montserrat-Light; + src: url("/fonts/Montserrat-Light.ttf") format("opentype"); +} +@font-face { + font-family: Montserrat-Italic; + src: url("/fonts/Montserrat-Italic.ttf") format("opentype"); +} +@font-face { + font-family: Montserrat-Bold; + src: url("/fonts/Montserrat-Bold.ttf") format("opentype"); +} +@font-face { + font-family: Montserrat-SemiBold; + src: url("/fonts/Montserrat-SemiBold.ttf") format("opentype"); +} +@font-face { + font-family: Orbitron-Regular; + src: url("/fonts/Orbitron-Regular.ttf") format("opentype"); +} +@font-face { + font-family: Amarante; + src: url("/fonts/Amarante-Regular.ttf") format("opentype"); +} +h1, h2, h3, h4, h5, h6 { + font-family: Amarante; + letter-spacing: 2px; +} + +h1 { + font-size: 2rem; +} +@media screen and (min-width: 600px) { + h1 { + font-size: 3rem; + } +} + +h2 { + font-size: 1.75rem; +} +@media screen and (min-width: 600px) { + h2 { + font-size: 2.5rem; + } +} + +h3 { + font-size: 1.5rem; +} +@media screen and (min-width: 600px) { + h3 { + font-size: 2rem; + } +} + +h4 { + font-size: 1.25rem; +} +@media screen and (min-width: 600px) { + h4 { + font-size: 1.5rem; + } +} + +h5 { + font-size: 1rem; +} +@media screen and (min-width: 600px) { + h5 { + font-size: 1.25rem; + } +} + +h6 { + font-size: 1rem; +} +@media screen and (min-width: 600px) { + h6 { + font-size: 1em; + } +} + +p, a, li, span { + font-family: RobotoSlab-Regular; + letter-spacing: 1px; +} + +strong { + font-family: Montserrat-Bold; +} + +em { + font-family: Montserrat-Italic; +} + +u { + font-family: Montserrat-SemiBold; +} + +cite, q, small { + font-family: Orbitron-Regular; +} + +s { + font-family: Montserrat-SemiBold; +} + +/*# sourceMappingURL=landing.css.map */ diff --git a/assets/styles/main.css b/assets/styles/main.css index ea4a737..afe06b1 100644 --- a/assets/styles/main.css +++ b/assets/styles/main.css @@ -1 +1 @@ -/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:rgba(0,0,0,0)}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}@font-face{font-family:RobotoSlab-Regular;src:url("/fonts/RobotoSlab-Regular.ttf") format("opentype")}@font-face{font-family:RobotoSlab-Medium;src:url("/fonts/RobotoSlab-Regular.ttf") format("opentype")}@font-face{font-family:RobotoSlab-Bold;src:url("/fonts/RobotoSlab-Bold.ttf") format("opentype")}@font-face{font-family:RobotoSlab-Black;src:url("/fonts/RobotoSlab-Black.ttf") format("opentype")}@font-face{font-family:AtomicAge-Regular;src:url("/fonts/AtomicAge-Regular.ttf") format("opentype")}@font-face{font-family:Montserrat-Regular;src:url("/fonts/Montserrat-Regular.ttf") format("opentype")}@font-face{font-family:Montserrat-Light;src:url("/fonts/Montserrat-Light.ttf") format("opentype")}@font-face{font-family:Montserrat-Italic;src:url("/fonts/Montserrat-Italic.ttf") format("opentype")}@font-face{font-family:Montserrat-Bold;src:url("/fonts/Montserrat-Bold.ttf") format("opentype")}@font-face{font-family:Montserrat-SemiBold;src:url("/fonts/Montserrat-SemiBold.ttf") format("opentype")}@font-face{font-family:Orbitron-Regular;src:url("/fonts/Orbitron-Regular.ttf") format("opentype")}@font-face{font-family:Amarante;src:url("/fonts/Amarante-Regular.ttf") format("opentype")}h1,h2,h3,h4,h5,h6{font-family:Amarante;letter-spacing:2px}h1{font-size:2rem}@media screen and (min-width: 600px){h1{font-size:3rem}}h2{font-size:1.75rem}@media screen and (min-width: 600px){h2{font-size:2.5rem}}h3{font-size:1.5rem}@media screen and (min-width: 600px){h3{font-size:2rem}}h4{font-size:1.25rem}@media screen and (min-width: 600px){h4{font-size:1.5rem}}h5{font-size:1rem}@media screen and (min-width: 600px){h5{font-size:1.25rem}}h6{font-size:1rem}@media screen and (min-width: 600px){h6{font-size:1em}}p,a,li,span{font-family:RobotoSlab-Regular;letter-spacing:1px}strong{font-family:Montserrat-Bold}em{font-family:Montserrat-Italic}u{font-family:Montserrat-SemiBold}cite,q,small{font-family:Orbitron-Regular}s{font-family:Montserrat-SemiBold}h1,h2,h3,h4,h5,h6,p,a,span,time{color:#fbfcff}.secondary.layout--v1{display:block;position:relative;padding:.5rem .5rem;background-color:#d7b94c}.secondary.layout--v1 #root{display:flex;flex-direction:column}@media(min-width: 800px){.secondary.layout--v1 #root{display:grid;grid-template-columns:25% 75%;grid-template-rows:1fr;margin:0 auto;padding:1rem 1rem}}.secondary.layout--v1 #root{gap:1rem;position:relative;width:100%;height:100%;min-height:100vh;max-width:1200px;background-color:#1f2421;box-shadow:0 0 5px 10px rgba(29,31,32,.45)}.secondary.layout--v1 #root main{padding:1rem 1rem}.secondary.layout--v1.menu-open,.secondary.layout--v1.photo-open{overflow:hidden}.secondary.layout--v1.photo-open .overlay{display:block;position:absolute;top:0;left:0;width:100%;height:100%;background-color:#171a21;opacity:.9}header{display:block;position:sticky;overflow:auto;width:100%;height:50px;top:0;padding-bottom:1rem;background-color:#1f2421}@media(min-width: 600px){header{height:500px}}header.open{overflow:visible}header.open .top h1{display:none}header nav.main{display:block;position:relative}@media(min-width: 600px){header nav.main{display:flex;flex-direction:column;gap:2rem}}header nav.main .top{display:flex}header nav.main .top h1{margin:0}header nav.main .top h1 a{display:block;position:relative;top:1rem;left:1rem;font-size:1.5rem;text-decoration:none;color:#1d1f20;background-color:#d7b94c;border:2px solid #d7b94c;padding:2px 2px}header nav.main .top h1 a:hover{color:#d7b94c;background-color:unset}header nav.main .top .icon.icon-menu{display:block;position:absolute;top:1rem;right:1rem;width:35px;height:35px;z-index:999;transition:right 100ms ease}@media screen and (min-width: 600px){header nav.main .top .icon.icon-menu{display:none}}header nav.main .top .icon.icon-menu:before{content:"";display:block;background-image:url("/icons/menu-grid.svg");background-size:100%;position:absolute;width:35px;height:35px}header nav.main .top .icon.icon-menu:hover{cursor:pointer}header nav.main .top .icon.icon-menu.open{right:325px}header nav.main .top .icon.icon-menu.open:before{background-image:url("/icons/menu-close.svg")}header nav.main menu{position:absolute;right:0;top:0;width:0;background-color:#d7b94c;overflow:hidden;padding:0;margin:0;transition:width 100ms ease}@media(min-width: 600px){header nav.main menu{position:relative;top:unset;right:unset;width:100%;transition:unset;background-color:unset}}header nav.main menu.open{width:300px;box-shadow:0 0 5px 10px rgba(29,31,32,.45)}header nav.main menu li{padding:1rem 2rem}header nav.main menu li a{display:block;color:#fbfcff;text-decoration:none}header nav.main menu li a:hover{text-decoration:underline}.posts .list ul{list-style:none;padding:0}.posts .list ul li{padding:1rem 0}.posts .list ul li a{color:#fbfcff;text-decoration:none;display:block}.posts .list ul li a .post-title{margin:0}.page .text ul li,.page .text ol li{color:#fbfcff}.photos{display:block}.photos .albums{display:flex;flex-direction:column;width:100%}@media(min-width: 800px){.photos .albums{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto}}.photos .albums{gap:1rem;list-style:none;padding:0}.photos .albums .album{display:block;width:100%}.photos .albums .album a{display:block;position:relative;color:#fff;text-decoration:none;overflow:hidden}.photos .albums .album a img{display:block;width:100%;height:auto}.photos .albums .album a .title,.photos .albums .album a .date,.photos .albums .album a .overlay{position:absolute;visibility:visible;margin:0}.photos .albums .album a .title,.photos .albums .album a .date,.photos .albums .album a .category{z-index:2}.photos .albums .album a .title{top:1rem;left:1rem}.photos .albums .album a .date{bottom:1rem;left:1rem;font-weight:bold}.photos .albums .album a .overlay{width:100%;height:auto;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.333);z-index:1}.photos .albums .album a:hover .title,.photos .albums .album a:hover .date,.photos .albums .album a:hover .category,.photos .albums .album a:hover .overlay{visibility:hidden}.photos .albums .album a:hover img{transform:scale(1.01);transition:transform 100ms ease-in-out}.photos img{width:100%}#album .title{margin:0}#album .meta{border-bottom:5px solid #a6a695}#album .photos{display:flex;flex-direction:column;width:100%}@media(min-width: 800px){#album .photos{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto}}#album .photos{gap:1rem;list-style:none;padding:0}#album .photos .photo{width:100%;overflow:hidden}#album .photos .photo img{transition:transform 100ms ease-in-out}#album .photos .photo:hover{cursor:pointer}#album .photos .photo:hover img{transform:scale(1.01);transition:transform 100ms ease-in-out}#open-image{display:none;position:fixed;top:0;left:0;z-index:999;width:100%;height:100vh}#open-image .wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:100%;max-width:700px;height:75%;max-height:100vh}#open-image .wrapper .close{cursor:pointer;font-family:AtomicAge-Regular;font-size:2rem;position:absolute;right:5px;top:0}#open-image .wrapper img{width:100%;height:auto}#open-image .wrapper #details{display:block;height:auto;padding:1rem 1rem;background-color:#a6a695}#open-image .wrapper #details p{margin:0}#open-image .wrapper #details #caption{font-size:1.5rem;padding-bottom:1rem}#open-image .wrapper #details #location,#open-image .wrapper #details #date,#open-image .wrapper #details #equipment{font-size:1.25rem}#open-image.open{display:block}.posts{display:block}.posts h2,.posts h3{position:relative;margin:0;width:fit-content}.posts h2:after,.posts h3:after{content:"";display:block;width:75px;height:5px;background-color:#a6a695}.posts .intro{padding:1rem 0}.posts .list{padding:2rem 0;border-top:5px solid #d7b94c}.posts .list .post a .title{padding:.5rem 0}.posts .list .post a:hover{text-decoration:underline;text-decoration-color:#a6a695}.posts .list .post .description{margin-top:1rem;padding-left:1rem;border-left:5px solid #a6a695}.posts .list .post .description p{padding:1rem 0}.post{display:block}.post .title{margin:.5rem 0}.post .meta{padding-bottom:1rem;border-bottom:5px solid #a6a695}.post .meta .admin-actions{padding-bottom:1rem}.post .meta .published{font-size:1.125rem}.post .meta .category{font-size:1.125rem}.post .text p{font-size:1.25rem;line-height:1.5}.post .tags{margin-top:2rem;background-color:dimgray}.post .tags .list{display:flex;align-items:center;gap:1rem;margin:0;list-style:none;padding:.5rem .5rem}.post .tags .list p{font-size:.85rem}.post .tags .list .tag a{font-size:.85rem}.category .posts ul,.category .photos ul,.tag .posts ul,.tag .photos ul{list-style-type:square;color:#fbfcff}.category .posts ul li,.category .photos ul li,.tag .posts ul li,.tag .photos ul li{padding:.5rem 0} +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:rgba(0,0,0,0)}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}@font-face{font-family:RobotoSlab-Regular;src:url("/fonts/RobotoSlab-Regular.ttf") format("opentype")}@font-face{font-family:RobotoSlab-Medium;src:url("/fonts/RobotoSlab-Regular.ttf") format("opentype")}@font-face{font-family:RobotoSlab-Bold;src:url("/fonts/RobotoSlab-Bold.ttf") format("opentype")}@font-face{font-family:RobotoSlab-Black;src:url("/fonts/RobotoSlab-Black.ttf") format("opentype")}@font-face{font-family:AtomicAge-Regular;src:url("/fonts/AtomicAge-Regular.ttf") format("opentype")}@font-face{font-family:Montserrat-Regular;src:url("/fonts/Montserrat-Regular.ttf") format("opentype")}@font-face{font-family:Montserrat-Light;src:url("/fonts/Montserrat-Light.ttf") format("opentype")}@font-face{font-family:Montserrat-Italic;src:url("/fonts/Montserrat-Italic.ttf") format("opentype")}@font-face{font-family:Montserrat-Bold;src:url("/fonts/Montserrat-Bold.ttf") format("opentype")}@font-face{font-family:Montserrat-SemiBold;src:url("/fonts/Montserrat-SemiBold.ttf") format("opentype")}@font-face{font-family:Orbitron-Regular;src:url("/fonts/Orbitron-Regular.ttf") format("opentype")}@font-face{font-family:Amarante;src:url("/fonts/Amarante-Regular.ttf") format("opentype")}h1,h2,h3,h4,h5,h6{font-family:Amarante;letter-spacing:2px}h1{font-size:2rem}@media screen and (min-width: 600px){h1{font-size:3rem}}h2{font-size:1.75rem}@media screen and (min-width: 600px){h2{font-size:2.5rem}}h3{font-size:1.5rem}@media screen and (min-width: 600px){h3{font-size:2rem}}h4{font-size:1.25rem}@media screen and (min-width: 600px){h4{font-size:1.5rem}}h5{font-size:1rem}@media screen and (min-width: 600px){h5{font-size:1.25rem}}h6{font-size:1rem}@media screen and (min-width: 600px){h6{font-size:1em}}p,a,li,span{font-family:RobotoSlab-Regular;letter-spacing:1px}strong{font-family:Montserrat-Bold}em{font-family:Montserrat-Italic}u{font-family:Montserrat-SemiBold}cite,q,small{font-family:Orbitron-Regular}s{font-family:Montserrat-SemiBold}h1,h2,h3,h4,h5,h6,p,a,span,time{color:#fbfcff}.secondary.layout--v1{display:block;position:relative;padding:.5rem .5rem;background-color:#d7b94c}.secondary.layout--v1 #root{display:flex;flex-direction:column}@media(min-width: 800px){.secondary.layout--v1 #root{display:grid;grid-template-columns:25% 75%;grid-template-rows:1fr;margin:0 auto;padding:1rem 1rem}}.secondary.layout--v1 #root{gap:1rem;position:relative;width:100%;height:100%;min-height:100vh;max-width:1200px;background-color:#1f2421;box-shadow:0 0 5px 10px rgba(29,31,32,.45)}.secondary.layout--v1 #root main{padding:1rem 1rem}.secondary.layout--v1.menu-open,.secondary.layout--v1.photo-open{overflow:hidden}.secondary.layout--v1.photo-open .overlay{display:block;position:absolute;top:0;left:0;width:100%;height:100%;background-color:#171a21;opacity:.9}header{display:block;position:sticky;overflow:auto;width:100%;height:50px;top:0;padding-bottom:1rem;background-color:#1f2421}@media(min-width: 600px){header{height:500px}}header.open{overflow:visible}header.open .top h1{display:none}header nav.main{display:block;position:relative}@media(min-width: 600px){header nav.main{display:flex;flex-direction:column;gap:2rem}}header nav.main .top{display:flex}header nav.main .top h1{margin:0}header nav.main .top h1 a{display:block;position:relative;top:1rem;left:1rem;font-size:1.5rem;text-decoration:none;color:#1d1f20;background-color:#d7b94c;border:2px solid #d7b94c;padding:2px 2px}header nav.main .top h1 a:hover{color:#d7b94c;background-color:unset}header nav.main .top .icon.icon-menu{display:block;position:absolute;top:1rem;right:1rem;width:35px;height:35px;z-index:999;transition:right 100ms ease}@media screen and (min-width: 600px){header nav.main .top .icon.icon-menu{display:none}}header nav.main .top .icon.icon-menu:before{content:"";display:block;background-image:url("/icons/menu-grid.svg");background-size:100%;position:absolute;width:35px;height:35px}header nav.main .top .icon.icon-menu:hover{cursor:pointer}header nav.main .top .icon.icon-menu.open{right:325px}header nav.main .top .icon.icon-menu.open:before{background-image:url("/icons/menu-close.svg")}header nav.main menu{position:absolute;right:0;top:0;width:0;background-color:#d7b94c;overflow:hidden;padding:0;margin:0;transition:width 100ms ease}@media(min-width: 600px){header nav.main menu{position:relative;top:unset;right:unset;width:100%;transition:unset;background-color:unset}}header nav.main menu.open{width:300px;box-shadow:0 0 5px 10px rgba(29,31,32,.45)}header nav.main menu li{padding:1rem 2rem}header nav.main menu li a{display:block;color:#fbfcff;text-decoration:none}header nav.main menu li a:hover{text-decoration:underline}.posts .list ul{list-style:none;padding:0}.posts .list ul li{padding:1rem 0}.posts .list ul li a{color:#fbfcff;text-decoration:none;display:block}.posts .list ul li a .post-title{margin:0}.photos{display:block}.photos .albums{display:flex;flex-direction:column;width:100%}@media(min-width: 800px){.photos .albums{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto}}.photos .albums{gap:1rem;list-style:none;padding:0}.photos .albums .album{display:block;width:100%}.photos .albums .album a{display:block;position:relative;color:#fff;text-decoration:none;overflow:hidden}.photos .albums .album a img{display:block;width:100%;height:auto}.photos .albums .album a .title,.photos .albums .album a .date,.photos .albums .album a .overlay{position:absolute;visibility:visible;margin:0}.photos .albums .album a .title,.photos .albums .album a .date,.photos .albums .album a .category{z-index:2}.photos .albums .album a .title{top:1rem;left:1rem}.photos .albums .album a .date{bottom:1rem;left:1rem;font-weight:bold}.photos .albums .album a .overlay{width:100%;height:auto;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.333);z-index:1}.photos .albums .album a:hover .title,.photos .albums .album a:hover .date,.photos .albums .album a:hover .category,.photos .albums .album a:hover .overlay{visibility:hidden}.photos .albums .album a:hover img{transform:scale(1.01);transition:transform 100ms ease-in-out}.photos img{width:100%}#album .title{margin:0}#album .meta{border-bottom:5px solid #a6a695}#album .photos{display:flex;flex-direction:column;width:100%}@media(min-width: 800px){#album .photos{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto}}#album .photos{gap:1rem;list-style:none;padding:0}#album .photos .photo{width:100%;overflow:hidden}#album .photos .photo img{transition:transform 100ms ease-in-out}#album .photos .photo:hover{cursor:pointer}#album .photos .photo:hover img{transform:scale(1.01);transition:transform 100ms ease-in-out}#open-image{display:none;position:absolute;top:0;left:0;z-index:999;width:100%;height:100vh}#open-image .wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:75%;height:75%}#open-image .wrapper .close{cursor:pointer;font-family:AtomicAge-Regular;font-size:2rem;position:absolute;right:5px;top:0}#open-image .wrapper img{width:100%;height:auto}#open-image .wrapper #details{display:block;height:auto;padding:1rem 1rem;background-color:#a6a695}#open-image .wrapper #details p{margin:0}#open-image .wrapper #details #caption{font-size:1.5rem;padding-bottom:1rem}#open-image .wrapper #details #location,#open-image .wrapper #details #date,#open-image .wrapper #details #equipment{font-size:1.25rem}#open-image.open{display:block}.posts{display:block}.posts h2,.posts h3{position:relative;margin:0;width:fit-content}.posts h2:after,.posts h3:after{content:"";display:block;width:75px;height:5px;background-color:#a6a695}.posts .intro{padding:1rem 0}.posts .list{padding:2rem 0;border-top:5px solid #d7b94c}.posts .list .post a .title{padding:.5rem 0}.posts .list .post a:hover{text-decoration:underline;text-decoration-color:#a6a695}.posts .list .post .description{margin-top:1rem;padding-left:1rem;border-left:5px solid #a6a695}.posts .list .post .description p{padding:1rem 0}.post{display:block}.post .title{margin:.5rem 0}.post .meta{padding-bottom:1rem;border-bottom:5px solid #a6a695}.post .meta .admin-actions{padding-bottom:1rem}.post .meta .published{font-size:1.125rem}.post .meta .category{font-size:1.125rem}.post .text p{font-size:1.25rem;line-height:1.5}.post .tags{margin-top:2rem;background-color:dimgray}.post .tags .list{display:flex;align-items:center;gap:1rem;margin:0;list-style:none;padding:.5rem .5rem}.post .tags .list p{font-size:.85rem}.post .tags .list .tag a{font-size:.85rem}.category .posts ul,.category .photos ul,.tag .posts ul,.tag .photos ul{list-style-type:square;color:#fbfcff}.category .posts ul li,.category .photos ul li,.tag .posts ul li,.tag .photos ul li{padding:.5rem 0} diff --git a/assets/styles/scss/brain.scss b/assets/styles/scss/brain.scss index 24de1a3..685f968 100644 --- a/assets/styles/scss/brain.scss +++ b/assets/styles/scss/brain.scss @@ -1,4 +1,3 @@ -@use './brain/actions'; @use './brain/form'; @use './brain/layout'; diff --git a/assets/styles/scss/brain/_actions.scss b/assets/styles/scss/brain/_actions.scss deleted file mode 100644 index ee6badc..0000000 --- a/assets/styles/scss/brain/_actions.scss +++ /dev/null @@ -1,11 +0,0 @@ -.actions { - padding-bottom: 1rem; - - .list { - display: flex; - gap: 2rem; - list-style: none; - margin: 0; - padding: 0; - } -} \ No newline at end of file diff --git a/assets/styles/scss/brain/_layout.scss b/assets/styles/scss/brain/_layout.scss index e657329..73539d0 100644 --- a/assets/styles/scss/brain/_layout.scss +++ b/assets/styles/scss/brain/_layout.scss @@ -1,5 +1,3 @@ -@use '../shared/colors' as colors; - #brain-wrapper { header { .level-1 { @@ -32,8 +30,4 @@ } } } - - a { - color: colors.$inkBlack; - } } \ No newline at end of file diff --git a/assets/styles/scss/front/_pages.scss b/assets/styles/scss/front/_pages.scss deleted file mode 100644 index 5dc2bea..0000000 --- a/assets/styles/scss/front/_pages.scss +++ /dev/null @@ -1,11 +0,0 @@ -@use '../shared/colors' as colors; - -.page { - .text { - ul, ol { - li { - color: colors.$primaryWhite; - } - } - } -} \ No newline at end of file diff --git a/assets/styles/scss/front/_photos.scss b/assets/styles/scss/front/_photos.scss index 88f3935..4d67a8d 100644 --- a/assets/styles/scss/front/_photos.scss +++ b/assets/styles/scss/front/_photos.scss @@ -133,7 +133,7 @@ #open-image { display: none; - position: fixed; + position: absolute; top: 0; left: 0; z-index: 999; @@ -145,15 +145,8 @@ top: 50%; left: 50%; transform: translate(-50%, -50%); - width: 100%; - max-width: 700px; + width: 75%; height: 75%; - max-height: 100vh; - -/* @media (min-width: 600px) { - top: 2rem; - transform: translate(-50%, 0); - } */ .close { cursor: pointer; diff --git a/assets/styles/scss/landing/_computer.scss b/assets/styles/scss/landing/_computer.scss index f5a7c3f..6c0d80e 100644 --- a/assets/styles/scss/landing/_computer.scss +++ b/assets/styles/scss/landing/_computer.scss @@ -172,7 +172,7 @@ margin-top: 5rem; @media (min-width: 600px) { - margin-top: -6rem; + margin-top: -2rem; } .heading { @@ -328,7 +328,7 @@ .highlight { display: flex; flex-direction: column; - justify-content: space-between; + justify-content: center; align-items: center; align-self: stretch; padding: 1rem 1rem; diff --git a/assets/styles/scss/main.scss b/assets/styles/scss/main.scss index 0ca9f1d..155067e 100644 --- a/assets/styles/scss/main.scss +++ b/assets/styles/scss/main.scss @@ -4,7 +4,6 @@ @use './front/layout'; @use './front/menu'; @use './front/lists'; -@use './front/pages'; @use './front/photos'; @use './front/posts'; @use './front/taxonomy'; \ No newline at end of file diff --git a/src/Controller/Brain/BrainPageController.php b/src/Controller/Brain/BrainPageController.php index 165bfc4..4192b6a 100644 --- a/src/Controller/Brain/BrainPageController.php +++ b/src/Controller/Brain/BrainPageController.php @@ -51,7 +51,7 @@ final class BrainPageController extends AbstractController $entityManager->flush(); - return $this->redirectToRoute('front_end_page', ['url' => $data->getUrl()]); + return $this->redirectToRoute('brain_page_list'); } return $this->render('brain/page/create.html.twig', [ @@ -86,7 +86,7 @@ final class BrainPageController extends AbstractController $entityManager->flush(); - return $this->redirectToRoute('front_end_page', ['url' => $data->getUrl()]); + return $this->redirectToRoute('brain_page_list'); } return $this->render('brain/page/create.html.twig', [ diff --git a/src/Controller/Brain/BrainPhotosController.php b/src/Controller/Brain/BrainPhotosController.php index 8924843..06e72a2 100644 --- a/src/Controller/Brain/BrainPhotosController.php +++ b/src/Controller/Brain/BrainPhotosController.php @@ -83,7 +83,7 @@ final class BrainPhotosController extends AbstractController $entityManager->flush(); - return $this->redirectToRoute('front_end_photos_detail', ['url' => $data->getUrl()]); + return $this->redirectToRoute('brain_photos_list'); } return $this->render('brain/photos/create.html.twig', [ @@ -128,7 +128,7 @@ final class BrainPhotosController extends AbstractController $entityManager->flush(); - return $this->redirectToRoute('front_end_photos_detail', ['url' => $data->getUrl()]); + return $this->redirectToRoute('brain_photos_list'); } return $this->render('brain/photos/create.html.twig', [ diff --git a/src/Controller/Brain/BrainPostController.php b/src/Controller/Brain/BrainPostController.php index 030c4e6..1777d9d 100644 --- a/src/Controller/Brain/BrainPostController.php +++ b/src/Controller/Brain/BrainPostController.php @@ -78,7 +78,7 @@ final class BrainPostController extends AbstractController $entityManager->flush(); - return $this->redirectToRoute('front_end_post_detail', ['url' => $data->getUrl()]); + return $this->redirectToRoute('brain_post_list'); } return $this->render('brain/post/create.html.twig', [ @@ -134,7 +134,7 @@ final class BrainPostController extends AbstractController $entityManager->flush(); - return $this->redirectToRoute('front_end_post_detail', ['url' => $data->getUrl()]); + return $this->redirectToRoute('brain_post_list'); } return $this->render('brain/post/create.html.twig', [ 'action' => 'edit', diff --git a/templates/brain/home/index.html.twig b/templates/brain/home/index.html.twig index cdeb027..3c38351 100644 --- a/templates/brain/home/index.html.twig +++ b/templates/brain/home/index.html.twig @@ -7,32 +7,9 @@ {% endblock %} {% block actions %} -
- -
+ this will be some global admin actions {% endblock %} {% block admin %} -
-

Dashboard

-

To Do

- -
- +

This will be a dashboard of sorts

{% endblock %} diff --git a/templates/front/home/index.html.twig b/templates/front/home/index.html.twig index 7b594b0..95c0766 100644 --- a/templates/front/home/index.html.twig +++ b/templates/front/home/index.html.twig @@ -55,7 +55,7 @@
-

Photos

+

Item 1

I embarked on a cross country road trip and back. See some photos!

Check It Out @@ -69,10 +69,10 @@
-

Site Tech

- -

Site framework, libraries, and tools used to make this site

- Check It Out +

Item 3

+ +

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

+ Check It Out
diff --git a/templates/front/post/index.html.twig b/templates/front/post/index.html.twig index b125f19..5dd2f1f 100644 --- a/templates/front/post/index.html.twig +++ b/templates/front/post/index.html.twig @@ -18,9 +18,6 @@

A truly random smattering of thoughts and feelings. Things may not always be relevant, but they will always be irreverant.

Recent

- {% if app.user %} -
Add New Post - {% endif %}