Styling improvements.
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
This commit is contained in:
parent
8887f58bc3
commit
c584866355
|
|
@ -7,7 +7,7 @@
|
|||
[]
|
||||
(dumdom/render
|
||||
[:div.bg-slate-200.w-full
|
||||
[:div.w-full.m-auto.pl-4.pr-4 {:class "md:w-4/5"}
|
||||
[:div.w-full.p-4.m-auto {:class "lg:w-4/5 lg:p-0"}
|
||||
(c/page-header)
|
||||
(c/dual-column-circle)
|
||||
(c/split-bar)
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
(ns com.oly.static-sites.portfolio.page)
|
||||
|
||||
|
||||
(defn left-bar []
|
||||
[:div.m-4.text-2xl
|
||||
[:div.m-4.text-4xl
|
||||
[:h1.mt-8 [:i.fa-solid.fa-gear.mr-2] "Oliver Marks - Software Engineer"]
|
||||
[:p.mt-8 "Example projects"]])
|
||||
#_[:p.mt-8 "Example projects"]])
|
||||
|
||||
(defn right-bar []
|
||||
[:div
|
||||
|
|
@ -22,45 +21,51 @@
|
|||
(left-bar)
|
||||
;[:div.grow]
|
||||
]
|
||||
[:p.mt-8 "Software engineer with over 20 years of experience in various languages technology's see below for technologies and projects developed personally and Professionally"]])
|
||||
[:p.mt-8.text-xl
|
||||
{:class "lg:text-2xl"}
|
||||
"Software engineer with over 20 years of experience in various languages technology's see below for technologies and projects developed personally and Professionally"]
|
||||
[:p.mt-8.text-xl
|
||||
{:class "lg:text-2xl"}
|
||||
"Open to new opportunities, full time, part time and contract anything I can work around family life."]])
|
||||
|
||||
(defn tile [{:keys [title href direction image description]}]
|
||||
[:div.rounded-lg.mt-8.mb-8.w-full
|
||||
[:a {:href href}
|
||||
[:img.rounded-lg.h-24.w-24.md:ml-2.md:mr-2
|
||||
{:src "https://img.theplantscape.com/api/image/p/missing.jpg?p=medium"
|
||||
[:div.rounded-lg.mt-4.mb-8.w-full.min-h-40
|
||||
[:a {:href href :target "_blank"}
|
||||
[:img.object-cover.rounded-lg.h-40.w-48.md:ml-2.md:mr-2
|
||||
{:src (str image "?p=h-96")
|
||||
:class (if (= direction "right") "ml-4" "mr-4")
|
||||
:align (if (= direction "right") "right" "left")}]
|
||||
[:h3.text-xl:md:text-base title]
|
||||
[:p.text-sm description]]])
|
||||
[:h3.mb-2.text-2xl title]
|
||||
[:p.font-sans.leading-normal.text-2xl {:class "md:text-lg"} description]]])
|
||||
|
||||
(defn skills-list [title skills]
|
||||
[:div.mb-8.align-top
|
||||
[:h3.m-4.text-2xl title]
|
||||
[:h3.m-4.text-4xl title]
|
||||
(into [:ul]
|
||||
(mapv (fn skill-item [{:keys [direction icon skill]}]
|
||||
(if (= direction "right")
|
||||
[:li.m-2.text-xl {:class "md:text-lg"}
|
||||
[:li.m-2.text-lg {:class "md:text-lg"}
|
||||
[:span [:i.mr-4 {:class (str "devicon-" icon "-plain")}] skill]]
|
||||
[:li.m-2.text-xl {:class "md:text-base"}
|
||||
[:li.m-2.text-lg {:class "md:text-lg"}
|
||||
[:span skill [:i.ml-4 {:class (str "devicon-" icon "-plain")}]]]))
|
||||
skills))])
|
||||
|
||||
(defn shaped-circle
|
||||
([direction w h] (shaped-circle direction w h 0))
|
||||
([direction w h offset]
|
||||
([direction w h offset] (shaped-circle direction w h offset "0"))
|
||||
([direction w h offset top]
|
||||
(if (= direction "right")
|
||||
[:div.hidden.right {:class "md:block"}
|
||||
[:div.ml-8.opacity-50
|
||||
{:style {:float "right" :right "0px"
|
||||
[:div.right #_hidden {:class "md:block"}
|
||||
[:div.ml-8.opacity-15.relative
|
||||
{:style {:float "right" :right "0px" :top (str top "px")
|
||||
:width (str w "px") :height (str h "px")
|
||||
:background-color "#666666"
|
||||
:border-radius (str w "px 0px 0px " w "px")
|
||||
:shape-margin "20px";
|
||||
:shape-outside (str "circle(" w "px at " (+ w offset) "px " w "px)")}}]]
|
||||
[:div.hidden.left {:class "md:block"}
|
||||
[:div.mr-8.opacity-50
|
||||
{:style {:float "left"
|
||||
[:div.left #_hidden {:class "md:block"}
|
||||
[:div.mr-8.opacity-15.relative
|
||||
{:style {:float "left" :top (str top "px")
|
||||
:width (str w "px") :height (str h "px")
|
||||
:background-color "#666666"
|
||||
:border-radius (str "0px " w "px " w "px 0px")
|
||||
|
|
@ -69,95 +74,125 @@
|
|||
|
||||
(defn dual-column-circle []
|
||||
[:section.w-full
|
||||
{:class "md:bg-hero-developer"
|
||||
:style {;;:background-image "url(/img/dev-02.png)"
|
||||
:background-repeat "no-repeat"
|
||||
:background-position "center top"
|
||||
:background-size "800px 800px"}}
|
||||
[:div.flex.w-full ;.flex-col
|
||||
[:div.relative {:class "w-1/2" :style {:width "50%"}}
|
||||
[:div.align-middle.text-right.w-full.h-64
|
||||
{;:class "md:bg-hero-developer"
|
||||
#_#_:style {:background-image "url(/img/dev-02.png)"
|
||||
:background-repeat "no-repeat"
|
||||
:background-position "right top"
|
||||
:background-size "680px 680px"}}
|
||||
[:div.flex.w-full
|
||||
[:div.flex-1]
|
||||
[:div.relative ;.flex-none ;{:class "w-1/2" :style {:width "50%"}}
|
||||
{:class "md:bg-hero-developer"
|
||||
:style {:background-image "url(/img/dev-02.png)"
|
||||
:background-repeat "no-repeat"
|
||||
:background-position "right -340px top"
|
||||
:background-size "680px 680px"}}
|
||||
[:div.align-middle.text-right.h-64.w-96
|
||||
|
||||
(shaped-circle "right" 120 240 20)
|
||||
(shaped-circle "right" 230 420 20 "-20")
|
||||
(skills-list "Operations"
|
||||
[{:icon "googlecloud" :skill "Google Cloud"}
|
||||
{:icon "digitalocean" :skill "Digitalocean"}
|
||||
{:icon "docker" :skill "Docker"}
|
||||
{:icon "kubernetes" :skill "Kubernetes"}])]]
|
||||
[:div.relative {:class "w-1/2" :style {:width "50%"}}
|
||||
[:div.align-middle.relative.text-left.w-full.h-64
|
||||
(shaped-circle "left" 120 240)
|
||||
{:icon "kubernetes" :skill "Kubernetes"}
|
||||
{:icon "circleci" :skill "CI"}])]]
|
||||
|
||||
[:div.relative ;.flex-none ;{:class "w-1/2" :style {:width "50%"}}
|
||||
{:class "md:bg-hero-developer"
|
||||
:style {:background-image "url(/img/dev-02.png)"
|
||||
:background-repeat "no-repeat"
|
||||
:background-position "left -340px top"
|
||||
:background-size "680px 680px"}}
|
||||
[:div.align-middle.relative.text-left.h-64.w-96
|
||||
(shaped-circle "left" 120 240 0)
|
||||
(shaped-circle "left" 230 420 0 "-20")
|
||||
(skills-list
|
||||
"Development"
|
||||
[{:direction "right" :icon "clojure" :skill "Clojure"}
|
||||
{:direction "right" :icon "javascript" :skill "Javascript"}
|
||||
{:direction "right" :icon "python" :skill "Python"}
|
||||
{:direction "right" :icon "c" :skill "C / Arduino"}
|
||||
#_{:direction "right" :icon "sql" :skill "SQL / Datalog"}])]]]
|
||||
{:direction "right" :icon "sqldeveloper" :skill "SQL / Datalog"}])]]
|
||||
[:div.flex-1]]
|
||||
|
||||
[:div.flex.w-full.flex-col.md:flex-row;.mt-48
|
||||
[:div {:class "w-full"}
|
||||
[:div.align-middle.relative.text-right.w-full
|
||||
{:style {:top "-60px"}}
|
||||
[:div.invisible {:class "md:visible"}
|
||||
(shaped-circle "right" 225 450)]
|
||||
[:div.flex.flex-col.w-half.md:w-full
|
||||
(tile {:title "GASP Air quality sensor"
|
||||
:direction "right"
|
||||
:image "https://img.theplantscape.com/api/image/p/missing.jpg?p=medium"
|
||||
:href "https://gasp.digitaloctave.com"
|
||||
:description "Single page site, which display's data relayed via mqtt from a physical device."})
|
||||
(tile {:title "Image scaling & resizing"
|
||||
:direction "right"
|
||||
:href "https://images.digitaloctave.com/"
|
||||
:image "https://img.theplantscape.com/api/image/p/missing.jpg?p=medium"
|
||||
:description "API to upload image's and handle scaling to different sizes, build in clojure."})]]]
|
||||
#_[:div.flex.w-full.flex-col.md:flex-row
|
||||
[:div {:class "w-full"}
|
||||
[:div.align-middle.relative.text-right.w-full
|
||||
;{:style {:top "-60px"}}
|
||||
[:div;.invisible {:class "md:visible"}
|
||||
(shaped-circle "right" 205 430)]]]
|
||||
|
||||
[:div {:class "w-full"}
|
||||
[:div.align-middle.relative.text-left.w-full
|
||||
{:style {:top "-60px"}}
|
||||
[:div.invisible {:class "md:visible"}
|
||||
(shaped-circle "left" 225 450)]
|
||||
[:div.flex.flex-col.w-half.md:w-full
|
||||
(tile {:title "GASP Air quality sensor"
|
||||
:image "https://img.theplantscape.com/api/image/p/missing.jpg?p=medium"
|
||||
:href "https://gasp.digitaloctave.com"
|
||||
:description "Single page site written in clojurescript, which display's data relayed via mqtt from a physical device built on an esp32."})
|
||||
(tile {:title "theplantscape"
|
||||
:href "https://theplantscape.com"
|
||||
:image "https://img.theplantscape.com/api/image/p/missing.jpg?p=medium"
|
||||
:description "Site for designing and planning gardens, uses datalog via xtdb and datascript with front end written in clojurescript and the backend in clojure."})]]]]
|
||||
[:div {:class "w-full"}
|
||||
[:div.align-middle.relative.text-left.w-full
|
||||
;{:style {:top "-60px"}}
|
||||
[:div;.invisible {:class "md:visible"}
|
||||
(shaped-circle "left" 205 430)]]]]
|
||||
|
||||
[:h2.text-3xl "Personal work"]
|
||||
[:div.grid.grid-cols-1.gap-4
|
||||
{:class "md:grid-cols-2"}
|
||||
[:div.align-middle.relative.text-left.w-full
|
||||
(tile {:title "theplantscape"
|
||||
:href "https://theplantscape.com"
|
||||
:direction "right"
|
||||
:image "https://img.theplantscape.com/api/image/pf/plantscape.png"
|
||||
:description "Site for designing and planning gardens, uses datalog via xtdb and datascript with front end written in clojurescript and the backend in clojure."})]
|
||||
|
||||
[:div.align-middle.relative.text-left.w-full
|
||||
(tile {:title "do-img image scaling & sizing API"
|
||||
:direction "left"
|
||||
:href "https://img.digitaloctave.com/api/"
|
||||
:image "https://img.theplantscape.com/api/image/pf/missing.jpg"
|
||||
:description "API to upload image's and handle scaling to different sizes, build in clojure."})]
|
||||
|
||||
[:div.align-middle.relative.text-left.w-full
|
||||
(tile {:title "Clojure Demo's"
|
||||
:direction "right"
|
||||
:image "https://img.theplantscape.com/api/image/pf/clojure-demo.png"
|
||||
:href "https://clojure-demos.digitaloctave.com"
|
||||
:description "Site used to teach the language and Eco system and various DSL's to colleagues"})]
|
||||
|
||||
[:div.align-middle.relative.text-left.w-full
|
||||
(tile {:title "GASP Air quality sensor"
|
||||
:direction "left"
|
||||
:image "https://img.theplantscape.com/api/image/pf/gasp.png"
|
||||
:href "https://gasp.digitaloctave.com"
|
||||
:description "Single page site, which display's data relayed via mqtt from a physical device."})]]
|
||||
|
||||
[:h2.text-3xl "Professional work"]
|
||||
[:div.flex.flex-col
|
||||
(tile {:title "Compare & Recycle"
|
||||
:direction "right"
|
||||
:href "https://www.compareandrecycle.co.uk/"
|
||||
:image "https://img.theplantscape.com/api/image/p/missing.jpg?p=medium"
|
||||
:description "Software for comparing and offering prices on your old tech, user facing and merchant facing applications with a mix of Python Django Clojure & ClojureScript backed by postgres, with some datalog for the merchant applciation."})
|
||||
:image "https://img.theplantscape.com/api/image/pf/car.png"
|
||||
:description "Software for comparing and offering prices on your old tech, user facing and merchant facing applications with a mix of Python Django JavaScript Clojure & ClojureScript backed by postgres, redis with some datalog for the merchant application."})
|
||||
|
||||
(tile {:title "Wolsely - Stock management system"
|
||||
:direction "right"
|
||||
:href "https://www.wolseley.co.uk/"
|
||||
:image "https://img.theplantscape.com/api/image/p/missing.jpg?p=medium"
|
||||
:description "Python django application for reporting & managing stock written in python using the django framework backed by a postgres database."})
|
||||
:image "https://img.theplantscape.com/api/image/pf/wolseley.png"
|
||||
:description "Python application for reporting & managing stock using the Django framework backed by a postgres database."})
|
||||
|
||||
(tile {:title "Taylor & Francis - Stock Management system"
|
||||
:direction "right"
|
||||
:href "https://taylorandfrancis.com/"
|
||||
:image "https://img.theplantscape.com/api/image/p/missing.jpg?p=medium"
|
||||
:description "PHP Application for managing book stock backed by oracle with a lot of psql queries."})]])
|
||||
|
||||
|
||||
:image "https://img.theplantscape.com/api/image/pf/taylor.png"
|
||||
:description "Internal PHP Application for managing book inventory, Adding & Editing books ordering new stock backed by a oracle database."})]])
|
||||
|
||||
(defn footer-blocks [blocks]
|
||||
(into [:div.md:mt-8.w-full]
|
||||
(into [:div.w-full]
|
||||
(mapv (fn footer-block [{:keys [title children]}]
|
||||
[:div.ml-8.w-full [:h2.mb-6.text-sm.font-semibold.text-gray-900.uppercase.dark title]
|
||||
[:div.ml-8.w-full [:h2.mb-4.text-sm.font-semibold.text-gray-900.uppercase.dark title]
|
||||
(into [:ul.text-gray-500.dark:text-gray-800.font-medium]
|
||||
(mapv (fn footer-link [{:keys [title link]}]
|
||||
[:li.mb-4 [:a.hover:underline {:href link} title]]) children))])
|
||||
[:li.mb-2 [:a.hover:underline {:href link} title]]) children))])
|
||||
blocks)))
|
||||
|
||||
(defn page-footer []
|
||||
[:section.md:p-8.flex.flex-row
|
||||
[:img.rounded-full.w-24.h-24 {:src "https://img.theplantscape.com/api/image/p/missing.jpg?p=medium"}]
|
||||
[:section.mt-4.flex.flex-row
|
||||
[:img.rounded-full.w-24.h-24
|
||||
{:src "https://img.theplantscape.com/api/image/pf/profile.jpg?p=medium"}]
|
||||
(footer-blocks [{:title "Social / Contact Me"
|
||||
:children [{:link "https://matrix.to/#/#theplantscape.com:matrix.org" :title "Chat"}
|
||||
{:link "https://fo.llow.social/u/olymk2@mastodon.social" :title "Masterdon"}]}])])
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
/*
|
||||
! tailwindcss v3.3.5 | MIT License | https://tailwindcss.com
|
||||
! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com
|
||||
*/
|
||||
|
||||
/*
|
||||
|
|
@ -32,9 +32,11 @@
|
|||
4. Use the user's configured `sans` font-family by default.
|
||||
5. Use the user's configured `sans` font-feature-settings by default.
|
||||
6. Use the user's configured `sans` font-variation-settings by default.
|
||||
7. Disable tap highlights on iOS
|
||||
*/
|
||||
|
||||
html {
|
||||
html,
|
||||
:host {
|
||||
line-height: 1.5;
|
||||
/* 1 */
|
||||
-webkit-text-size-adjust: 100%;
|
||||
|
|
@ -44,12 +46,14 @@ html {
|
|||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
/* 3 */
|
||||
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||||
font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||||
/* 4 */
|
||||
font-feature-settings: normal;
|
||||
/* 5 */
|
||||
font-variation-settings: normal;
|
||||
/* 6 */
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
/* 7 */
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -121,8 +125,10 @@ strong {
|
|||
}
|
||||
|
||||
/*
|
||||
1. Use the user's configured `mono` font family by default.
|
||||
2. Correct the odd `em` font sizing in all browsers.
|
||||
1. Use the user's configured `mono` font-family by default.
|
||||
2. Use the user's configured `mono` font-feature-settings by default.
|
||||
3. Use the user's configured `mono` font-variation-settings by default.
|
||||
4. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
|
|
@ -131,8 +137,12 @@ samp,
|
|||
pre {
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
/* 1 */
|
||||
font-size: 1em;
|
||||
font-feature-settings: normal;
|
||||
/* 2 */
|
||||
font-variation-settings: normal;
|
||||
/* 3 */
|
||||
font-size: 1em;
|
||||
/* 4 */
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -574,10 +584,6 @@ video {
|
|||
visibility: visible;
|
||||
}
|
||||
|
||||
.invisible {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.collapse {
|
||||
visibility: collapse;
|
||||
}
|
||||
|
|
@ -614,12 +620,12 @@ video {
|
|||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.mb-4 {
|
||||
margin-bottom: 1rem;
|
||||
.mb-2 {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.mb-6 {
|
||||
margin-bottom: 1.5rem;
|
||||
.mb-4 {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.mb-8 {
|
||||
|
|
@ -646,6 +652,10 @@ video {
|
|||
margin-right: 2rem;
|
||||
}
|
||||
|
||||
.mt-4 {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.mt-8 {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
|
@ -686,22 +696,42 @@ video {
|
|||
height: 6rem;
|
||||
}
|
||||
|
||||
.h-40 {
|
||||
height: 10rem;
|
||||
}
|
||||
|
||||
.h-64 {
|
||||
height: 16rem;
|
||||
}
|
||||
|
||||
.w-1\/2 {
|
||||
width: 50%;
|
||||
.h-96 {
|
||||
height: 24rem;
|
||||
}
|
||||
|
||||
.min-h-40 {
|
||||
min-height: 10rem;
|
||||
}
|
||||
|
||||
.w-24 {
|
||||
width: 6rem;
|
||||
}
|
||||
|
||||
.w-48 {
|
||||
width: 12rem;
|
||||
}
|
||||
|
||||
.w-96 {
|
||||
width: 24rem;
|
||||
}
|
||||
|
||||
.w-full {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.flex-1 {
|
||||
flex: 1 1 0%;
|
||||
}
|
||||
|
||||
.flex-shrink {
|
||||
flex-shrink: 1;
|
||||
}
|
||||
|
|
@ -727,6 +757,10 @@ video {
|
|||
resize: both;
|
||||
}
|
||||
|
||||
.grid-cols-1 {
|
||||
grid-template-columns: repeat(1, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
|
@ -735,6 +769,10 @@ video {
|
|||
flex-direction: column;
|
||||
}
|
||||
|
||||
.gap-4 {
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.truncate {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
|
@ -772,12 +810,13 @@ video {
|
|||
background-color: rgb(148 163 184 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.p-4 {
|
||||
padding: 1rem;
|
||||
.object-cover {
|
||||
-o-object-fit: cover;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.p-8 {
|
||||
padding: 2rem;
|
||||
.p-4 {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.pl-4 {
|
||||
|
|
@ -804,11 +843,30 @@ video {
|
|||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.font-sans {
|
||||
font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||||
}
|
||||
|
||||
.text-2xl {
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
.text-3xl {
|
||||
font-size: 1.875rem;
|
||||
line-height: 2.25rem;
|
||||
}
|
||||
|
||||
.text-4xl {
|
||||
font-size: 2.25rem;
|
||||
line-height: 2.5rem;
|
||||
}
|
||||
|
||||
.text-lg {
|
||||
font-size: 1.125rem;
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
|
||||
.text-sm {
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.25rem;
|
||||
|
|
@ -840,6 +898,10 @@ video {
|
|||
font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
|
||||
}
|
||||
|
||||
.leading-normal {
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.text-gray-500 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(107 114 128 / var(--tw-text-opacity));
|
||||
|
|
@ -854,8 +916,8 @@ video {
|
|||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
.opacity-50 {
|
||||
opacity: 0.5;
|
||||
.opacity-15 {
|
||||
opacity: 0.15;
|
||||
}
|
||||
|
||||
.shadow {
|
||||
|
|
@ -899,43 +961,15 @@ video {
|
|||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.dark\:text-gray-400 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(156 163 175 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.dark\:text-white {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.md\:visible {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.md\:m-8 {
|
||||
margin: 2rem;
|
||||
}
|
||||
|
||||
.md\:ml-2 {
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
|
||||
.md\:ml-8 {
|
||||
margin-left: 2rem;
|
||||
}
|
||||
|
||||
.md\:mr-2 {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.md\:mr-8 {
|
||||
margin-right: 2rem;
|
||||
}
|
||||
|
||||
.md\:block {
|
||||
display: block;
|
||||
}
|
||||
|
|
@ -944,25 +978,38 @@ video {
|
|||
width: 80%;
|
||||
}
|
||||
|
||||
.md\:w-full {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.md\:flex-row {
|
||||
flex-direction: row;
|
||||
.md\:grid-cols-2 {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.md\:bg-hero-developer {
|
||||
background-image: url('/img/dev-02.png');
|
||||
}
|
||||
|
||||
.md\:text-base {
|
||||
font-size: 1rem;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
|
||||
.md\:text-lg {
|
||||
font-size: 1.125rem;
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
.lg\:w-4\/5 {
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.lg\:p-0 {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.lg\:text-2xl {
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.dark\:text-gray-800 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(31 41 55 / var(--tw-text-opacity));
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,9 +4,10 @@
|
|||
<title>Personal portfolio for olymk2</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta content="#da532c" name="msapplication-TileColor" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=0.5">
|
||||
<meta content="#ffffff" name="theme-color" />
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/gh/devicons/devicon@v2.15.1/devicon.min.css"
|
||||
href="https://cdn.jsdelivr.net/gh/devicons/devicon@v2.16.0/devicon.min.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
|
|
@ -23,7 +24,7 @@
|
|||
/>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<div id="app" style="text-size-adjust: none;"></div>
|
||||
<script src="/cljs-out/base.js" type="application/javascript"></script>
|
||||
<script src="/cljs-out/app.js" type="application/javascript"></script>
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
clj -Mshadow-cljs-run watch app
|
||||
|
||||
npx shadow-cljs server
|
||||
|
||||
npx tailwindcss -i ./development/resources/public/css/tailwind-styles.css -o ./development/resources/public/css/styles.css --watch
|
||||
|
||||
clj -Mshadow-cljs watch app
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
;; "../../components/svg-generation/src"
|
||||
;; "../../components/local-store/src"]
|
||||
:builds {:app {:output-dir "development/resources/public/cljs-out"
|
||||
:asset-path "cljs-out"
|
||||
;:asset-path "."
|
||||
:target :browser
|
||||
:compiler-options {:infer-externs :auto :output-feature-set :es6}
|
||||
:modules {:base {:entries []}
|
||||
|
|
|
|||
Loading…
Reference in New Issue