https://alexharri.com/_next/static/chunks/pages/index-ba4ebf7e23371253.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[5405],{8312:function(n,e,t){(window.__NEXT_P=window.__NEXT_P||[]).push(["/",function(){return t(635)}])},6110:function(n,e,t){"use strict";t.d(e,{x:function(){return h}});var r=t(5893),i=t(9821),s=t(3205),o=t(2729);function a(){let n=(0,o._)(["\n    display: flex;\n    gap: 32px;\n\n    @media (max-width: 640px) {\n      flex-direction: column;\n      gap: 24px;\n    }\n  "]);return a=function(){return n},n}function l(){let n=(0,o._)(["\n    margin: 0;\n  "]);return l=function(){return n},n}function c(){let n=(0,o._)(["\n    border: 1px solid ",";\n    background: ",';\n    padding: 16px;\n    border-radius: 8px;\n    position: relative;\n\n    h2 {\n      margin: 0;\n    }\n    p:first-child {\n      margin-top: 0;\n    }\n    p:last-child {\n      margin-bottom: 0;\n    }\n\n    &:before,\n    &:after {\n      content: "";\n      position: absolute;\n      top: 29px;\n      left: 0;\n      right: 100%;\n      transform: translate(-50%, -50%) rotate(45deg);\n\n      @media (max-width: 640px) {\n        left: 64px;\n        bottom: 100%;\n        top: 0;\n      }\n    }\n    &:before {\n      width: 16px;\n      height: 16px;\n      background: ',";\n      z-index: -1;\n    }\n    &:after {\n      width: 14px;\n      height: 14px;\n      background: ",";\n      z-index: 10;\n    }\n  "]);return c=function(){return n},n}function d(){let n=(0,o._)(["\n    width: 128px;\n    height: auto;\n    border-radius: 8px;\n  "]);return d=function(){return n},n}function u(){let n=(0,o._)(["\n    margin-top: 16px;\n    display: flex;\n    gap: 12px;\n    align-items: center;\n\n    [data-dot] {\n      display: flex;\n      width: 5px;\n      height: 5px;\n      background: ",";\n      border-radius: 50%;\n    }\n  "]);return u=function(){return n},n}function p(){let n=(0,o._)(['\n    &:before {\n      content: "•";\n    }\n    margin: auto 12px;\n    display: inline-block;\n    color: ',";\n    transform: scale(1.4);\n  "]);return p=function(){return n},n}let x=n=>{let{styled:e,theme:t}=n;return{container:e.css(a()),left:e.css(l()),right:e.css(c(),t.medium400,t.background100,t.medium400,t.background100),image:e.css(d()),links:e.css(u(),t.medium500),dot:e.css(p(),t.text400)}},h=()=>{let n=(0,i.y)(x);return(0,r.jsxs)("section",{className:n("container"),children:[(0,r.jsx)("div",{className:n("left"),children:(0,r.jsx)("img",{src:"/images/me.png",className:n("image")})}),(0,r.jsxs)("div",{className:n("right"),children:[(0,r.jsx)("p",{children:"Hey, I'm Alex. I'm super interested in software and design. I've been writing about software-related topics since 2019."}),(0,r.jsxs)("p",{children:["You can find my writing on"," ",(0,r.jsx)(s.r,{href:"/blog",children:(0,r.jsx)("span",{className:"monospace",children:"/blog"})})," ","and learn about me on my"," ",(0,r.jsx)(s.r,{href:"/about",children:(0,r.jsx)("span",{className:"monospace",children:"/about"})})," ","page ."]})]})]})}},6268:function(n,e,t){"use strict";t.d(e,{Y:function(){return s}});var r=t(5893);let i={down:90,left:180,up:270,right:0},s=n=>{let{direction:e,variant:t="arrow"}=n;return(0,r.jsx)("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,r.jsx)("g",{style:{transform:"rotate(".concat(i[e],"deg)"),transformOrigin:"50% 50%"},children:(0,r.jsx)("path",{d:"arrow"===t?"M15 8L15.495 8.49497L15.9899 8L15.495 7.50503L15 8ZM10.495 2.50503C10.2216 2.23166 9.77839 2.23166 9.50503 2.50503C9.23166 2.77839 9.23166 3.22161 9.50503 3.49497L10.495 2.50503ZM9.50503 12.505C9.23166 12.7784 9.23166 13.2216 9.50503 13.495C9.77839 13.7683 10.2216 13.7683 10.495 13.495L9.50503 12.505ZM2 8.7H15V7.3H2V8.7ZM15.495 7.50503L10.495 2.50503L9.50503 3.49497L14.505 8.49497L15.495 7.50503ZM14.505 7.50503L9.50503 12.505L10.495 13.495L15.495 8.49497L14.505 7.50503Z":"M12.7728 8.00002L5.50004 15.2728L4.22724 14L10.2272 8.00002L4.22724 2.00003L5.50004 0.727234L12.7728 8.00002Z",fill:"currentColor"})})})}},635:function(n,e,t){"use strict";t.r(e),t.d(e,{__N_SSG:function(){return z},default:function(){return C}});var r=t(2729),i=t(5893),s=t(6110),o=t(6268),a=t(6740),l=t(3205),c=t(1664),d=t.n(c),u=t(2778),p=t(9821);function x(){let n=(0,r._)(["\n    width: 100%;\n    display: flex;\n    justify-content: stretch;

1\n    align-items: stretch;\n  "]);return x=function(){return n},n}function h(){let n=(0,r._)(["\n    color: inherit;\n    display: block;\n    width: 100%;\n    background: ",";\n    border: 1px solid ",";\n    border-radius: 4px;\n    padding: 24px;\n\n    time {\n      display: block;\n      font-size: 16px;\n      margin-bottom: 8px;\n      color: ",";\n    }\n\n    h2 {\n      font-size: 24px;\n      margin-top: 0;\n      margin-bottom: 16px;\n    }\n\n    &:hover {\n      text-decoration: none;\n\n      h2 {\n        text-decoration: underline;\n      }\n    }\n\n    p {\n      margin-bottom: 16px;\n    }\n  "]);return h=function(){return n},n}function f(){let n=(0,r._)(["\n    font-size: 18px;\n    line-height: 1.2;\n    color: ",";\n    font-weight: 600;\n    display: inline-block;\n\n    &:hover {\n      text-decoration: underline;\n    }\n  "]);return f=function(){return n},n}let m=n=>{let{styled:e,theme:t}=n;return{container:e.css(x()),link:e.css(h(),t.background100,t.darkBlue400,t.text400),read:e.css(f(),t.blue)}},g=n=>{let e=(0,p.y)(m),{post:t}=n;return(0,i.jsx)("article",{className:e("container"),children:(0,i.jsxs)(d(),{href:t.publishedAt?"/blog/".concat(t.slug):"/blog/draft/".concat(t.slug),className:e("link"),children:[(0,i.jsx)("time",{dateTime:t.publishedAt,children:(0,u.p)(t.publishedAt)}),(0,i.jsx)("h2",{children:t.title}),t.description&&(0,i.jsx)("p",{children:t.description}),(0,i.jsx)("div",{className:e("read"),children:"Read"})]})})};var b=t(7294),w=t(7484);function y(){let n=(0,r._)([""]);return y=function(){return n},n}function j(){let n=(0,r._)(["\n    display: flex;\n    gap: ","px;\n    transition: transform 0.4s;\n\n    @media (max-width: 900px) {\n      display: grid;\n      grid-template-columns: repeat(2, 1fr);\n      gap: 16px;\n      transition: none;\n    }\n\n    @media (max-width: 670px) {\n      grid-template-columns: repeat(1, 1fr);\n    }\n  "]);return j=function(){return n},n}function v(){let n=(0,r._)(["\n    @media (min-width: 901px) {\n      min-width: ","px;\n      max-width: ","px;\n      transition: opacity 0.4s;\n\n      &--outOfBounds {\n        opacity: 0.5;\n        &:hover {\n          opacity: 0.7;\n        }\n\n        cursor: pointer;\n        * {\n          pointer-events: none;\n        }\n      }\n    }\n\n    @media (max-width: 900px) {\n      display: flex;\n      justify-content: stretch;\n      align-content: stretch;\n    }\n  "]);return v=function(){return n},n}let _=(w.q.contentWidth-2*w.q.contentPadding)/2-8,k=n=>{let{styled:e}=n;return{container:e.css(y()),inner:e.css(j(),16),item:e.css(v(),_,_)}},N=n=>{let e=(0,p.y)(k),t=(0,b.useRef)(null),[r,s]=(0,b.useState)(0),o=(0,b.useRef)(r);return o.current=r,(0,b.useEffect)(()=>{let n=()=>{window.innerWidth<=900&&0!=o.current&&s(0)};return window.addEventListener("resize",n),()=>window.removeEventListener("resize",n)},[]),(0,i.jsx)("section",{className:e("container"),ref:t,children:(0,i.jsx)("div",{className:e("inner"),style:{transform:"translateX(".concat(-((_+16)*r),"px)")},children:b.Children.map(n.children,(n,t)=>{let o=t-r,a=o<0||o>1;return(0,i.jsx)("div",{className:e("item",{outOfBounds:a}),onClick:a?()=>s(n=>o<0?n+o:n+o-1):void 0,children:n},t)})})})};function L(){let n=(0,r._)(["\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-end;\n    margin-bottom: 16px;\n\n    h1 {\n      font-size: 32px;\n      margin: 0;\n    }\n\n    div {\n      margin-bottom: 3px;\n      a {\n        font-size: 18px;\n      }\n      @media (max-width: 500px) {\n        display: none;\n      }\n    }\n  "]);return L=function(){return n},n}function M(){let n=(0,r._)(["\n    margin-top: 32px;\n    a {\n      display: block;\n      text-align: center;\n      font-size: 20px;\n    }\n    svg {\n      display: inline-block;\n      margin-left: 4px;\n    }\n    @media (min-width: 901px) {\n      display: none;\n    }\n  "]);return M=function(){return n},n}let A=n=>{let{styled:e}=n;return{header:e.css(L()),viewAllPostsMobile:e.css(M())}};var z=!0;function C(n){let e=(0,p.y)(A);return(0,i.jsxs)(a.A,{constrainWidth:!0,children:[(0,i.jsxs)("div",{className:e("header"),children:[(0,i.jsx)("h1",{children:"Popular posts"}),(0,i.jsx)("div",{children:(0,i.jsx)(l.r,{href:"/blog#all-posts",children:"View all posts"})})]}),(0,i.jsx)(N,{children:n.posts.map(n=>(0,i.jsx)(g,{post:n},n.slug))}),(0,i.jsx)("div",{className:e("viewAllPostsMobile"),children:(0,i.jsxs)(l.r,{href:"/blog#all-posts",children:["View all posts ",(0,i.jsx)(o.Y,{direction:"right"})]})}),(0,i.jsx)("div",{style:{height:96}}),(0,i.jsx)(s.x,{})]})}},2778:function(n,e,t){"use strict";t.d(e,{p:function(){return s}});let r=["January","February","March","April","May","June","July","August","September","October","November","December"],i=["Jan","Feb","Mar","Apr","May","June","July","Aug","Sept","Oct","Nov","Dec"];function s(n){let e=arguments.length>1&&void 0!==arguments[1]&&arguments[1],[t,s,o]=n.split("-").map(Number);return"".concat((e?i:r)[s-1]," ").concat(o,", ").concat(t)}}},function(n){n.O(0,[1664,6740,2888,9774,179],function(){return n(n.s=8312)}

1),_N_E=n.O()}]);