diff --git a/assets/stylesheets/common/fbff.scss b/assets/stylesheets/common/fbff.scss index 3b059fa..d7d9c1c 100644 --- a/assets/stylesheets/common/fbff.scss +++ b/assets/stylesheets/common/fbff.scss @@ -9,6 +9,7 @@ grid-template-areas: "gif gif gif" "friend nothing you"; } } + --border-size: 6px; @media screen and (width <= 768px) { --border-size: 4px; @@ -16,6 +17,7 @@ @media screen and (width <= 475px) { --border-size: 3px; } + .fbff-gif-container { position: relative; width: 90%; @@ -27,21 +29,25 @@ grid-area: gif; } } + .fbff-gif { width: 100%; border-radius: var(--rewind-border-radius); } + .fbff-avatar-container { z-index: 10; @media screen and (width <= 625px) { &:first-of-type { grid-area: friend; } + &:last-of-type { grid-area: you; } } } + .fbff-avatar-container img.avatar { align-self: center; justify-self: center; @@ -56,11 +62,13 @@ height: 25px; } } + .fbff-avatar-container { display: grid; grid-template-rows: 1fr min-content; flex-direction: column; } + .fbff-avatar-name { margin: 0; align-self: center; @@ -68,7 +76,7 @@ margin-top: auto; height: min-content; font-size: var(--font-down-1); - font-family: Pixelify Sans; + font-family: "Pixelify Sans"; @media screen and (width <= 475px) { font-size: var(--font-down-3); } diff --git a/assets/stylesheets/common/fonts.scss b/assets/stylesheets/common/fonts.scss index 774a5f4..724c978 100644 --- a/assets/stylesheets/common/fonts.scss +++ b/assets/stylesheets/common/fonts.scss @@ -1,5 +1,5 @@ @font-face { - font-family: "receipt-narrow"; + font-family: receipt-narrow; src: absolute-image-url( "/plugins/discourse-rewind/fonts/receipt-narrow.woff2" ) @@ -21,9 +21,21 @@ format("woff2"); } +@font-face { + font-display: swap; + font-family: "Pixelify Sans"; + font-style: normal; + font-weight: 400; + src: absolute-image-url( + "/plugins/discourse-rewind/fonts/pixelify-sans-v1-latin-regular.woff2" + ) + format("woff2"); +} + .rewind { - --jersey-heading: "Jersey 20", Helvetica, Arial, sans-serif; + --jersey-heading: "Jersey 20", helvetica, arial, sans-serif; --pixel-text: "receipt-narrow", sans-serif; + h1, h2, h3, diff --git a/public/fonts/pixelify-sans-v1-latin-regular.woff2 b/public/fonts/pixelify-sans-v1-latin-regular.woff2 new file mode 100644 index 0000000..ccbbc95 Binary files /dev/null and b/public/fonts/pixelify-sans-v1-latin-regular.woff2 differ