diff --git a/gatsby/createExifFields.js b/gatsby/createExifFields.js index 6f39d518..c17312b0 100644 --- a/gatsby/createExifFields.js +++ b/gatsby/createExifFields.js @@ -55,10 +55,10 @@ const constructExifFields = (exifData, createNodeField, node) => { ExposureTime, FocalLength, ExposureBiasValue, - ExposureMode + ExposureMode, + LensModel } = exifData.exif - const model = `${Model}` const iso = `ISO ${ISO}` const fstop = `ƒ ${FNumber}` const focalLength = `${FocalLength}mm` @@ -81,10 +81,11 @@ const constructExifFields = (exifData, createNodeField, node) => { name: 'exif', value: { iso, - model, + model: Model, fstop, shutterspeed, focalLength, + lensModel: LensModel, exposure, gps: { latitude, longitude } } diff --git a/src/components/Layout.module.scss b/src/components/Layout.module.scss index ada64bc4..7f516f15 100644 --- a/src/components/Layout.module.scss +++ b/src/components/Layout.module.scss @@ -42,14 +42,14 @@ background-color: $body-background-color--dark; color: $text-color--dark; border-top-color: darken($brand-grey, 15%); - border-bottom-color: darken($brand-grey, 15%); - box-shadow: 0 1px 4px darken($brand-main, 10%), + border-bottom-color: darken($body-background-color--dark, 3%); + box-shadow: 0 1px 8px rgba(darken($brand-main, 15%), 0.1), 0 -1px 4px darken($brand-main, 15%); } @media (min-width: $screen-sm) and (min-height: 500px) { margin-top: $spacer * 2.65; - margin-bottom: $spacer * 19; // height of footer + margin-bottom: $spacer * 18; // height of footer position: relative; z-index: 2; min-height: 500px; diff --git a/src/components/atoms/Exif.module.scss b/src/components/atoms/Exif.module.scss index c47c8fda..797a72a3 100644 --- a/src/components/atoms/Exif.module.scss +++ b/src/components/atoms/Exif.module.scss @@ -21,7 +21,7 @@ display: block; flex: 1 1 20%; white-space: nowrap; - padding: $spacer / 1.5; + padding: $spacer $spacer / 1.5; border-bottom: 1px dashed $brand-grey-dimmed; &:first-child { @@ -29,17 +29,18 @@ } :global(.dark) & { - border-bottom-color: $brand-grey; + border-bottom-color: rgba($brand-grey, 0.6); } } @media (min-width: $screen-sm) { margin-bottom: 0; + font-size: $font-size-small; span { border-left: 1px dashed $brand-grey-dimmed; border-bottom: 0; - padding: $spacer; + padding: $spacer * 1.5 $spacer; &, &:first-child { @@ -51,7 +52,7 @@ } :global(.dark) & { - border-left-color: $brand-grey; + border-left-color: rgba($brand-grey, 0.6); } } } @@ -62,5 +63,5 @@ @include media-frame; overflow: hidden; - height: 160px; + height: 200px; } diff --git a/src/components/atoms/Exif.tsx b/src/components/atoms/Exif.tsx index 18c49cf2..fdf05876 100644 --- a/src/components/atoms/Exif.tsx +++ b/src/components/atoms/Exif.tsx @@ -8,6 +8,7 @@ interface ExifProps { fstop: string shutterspeed: string focalLength: string + lensModel: string exposure: string gps: { latitude: string @@ -18,15 +19,17 @@ interface ExifProps { export default function Exif({ exif }: { exif: ExifProps }) { const { iso, model, fstop, shutterspeed, focalLength, exposure, gps } = exif + // iPhone lenses + return ( - ) -} diff --git a/src/components/molecules/ThemeSwitch.module.scss b/src/components/molecules/ThemeSwitch.module.scss index 4735aaa9..69e852a0 100644 --- a/src/components/molecules/ThemeSwitch.module.scss +++ b/src/components/molecules/ThemeSwitch.module.scss @@ -4,9 +4,7 @@ .themeSwitch { position: relative; display: inline-block; - margin-right: $spacer; - opacity: 0.75; - bottom: -0.1rem; + margin-bottom: $spacer * $line-height; svg { width: 0.8rem; diff --git a/src/components/molecules/Vcard.module.scss b/src/components/molecules/Vcard.module.scss index 9f025617..63c125db 100644 --- a/src/components/molecules/Vcard.module.scss +++ b/src/components/molecules/Vcard.module.scss @@ -1,10 +1,14 @@ @import 'variables'; @import 'mixins'; +.vcard { + margin-bottom: $spacer * 2; +} + .avatar { @include media-frame; - margin-bottom: ($spacer / 2); + margin-bottom: $spacer / 3; &, img { @@ -16,7 +20,7 @@ .description { font-size: $font-size-h5; margin-top: 0; - margin-bottom: ($spacer / 4); + margin-bottom: ($spacer / $line-height); a { display: block; diff --git a/src/components/molecules/Vcard.tsx b/src/components/molecules/Vcard.tsx index 68a5765e..94201d97 100644 --- a/src/components/molecules/Vcard.tsx +++ b/src/components/molecules/Vcard.tsx @@ -23,12 +23,13 @@ const query = graphql` export default function Vcard() { const data = useStaticQuery(query) - const { twitter, github, facebook, name, uri } = useSiteMetadata().author + const { author, rss, jsonfeed } = useSiteMetadata() + const { twitter, github, name, uri } = author const avatar = data.avatar.edges[0].node.childImageSharp.fixed - const links = [twitter, github, facebook] + const links = [twitter, github, rss, jsonfeed] return ( -