mirror of
https://github.com/GenderDysphoria/GenderDysphoria.fyi.git
synced 2025-01-31 07:16:17 +00:00
Adjustments for printing
This commit is contained in:
Jocelyn Badgley (Twipped)
parent
08478f5a81
commit
b6fcbc0e4d
@ -36,7 +36,16 @@ If you've seen Jurassic Park then you may remember this scene:
|
||||
}}
|
||||
}!}
|
||||
|
||||
{!{ <div class="gutter flex" style="justify-content: center"> {{import '~/img' images.fetalgenitals className="card" caption="<a href=\"https://schoolbag.info/biology/concepts/188.html\">Source</a>" alt="Fetal development of internal sexual anatomy"}}</div> }!}
|
||||
{!{
|
||||
<div class="gutter flex flex-center print-span3">
|
||||
{{import '~/img' images.fetalgenitals
|
||||
className="card"
|
||||
caption="<a href=\"https://schoolbag.info/biology/concepts/188.html\">Source</a>"
|
||||
alt="Fetal development of internal sexual anatomy"
|
||||
}}
|
||||
</div>
|
||||
}!}
|
||||
|
||||
The gonads in human fetuses initially develop in a bi-potential state, meaning they can become either ovaries or testes. The SRY gene on the Y chromosome releases a protein called [Testis Determining Factor](https://en.wikipedia.org/wiki/Testis-determining_factor) (TDF). This protein then starts a chain reaction with SOX9 production (another protein), which causes the gonadal cells to form into the Sertoli and Leydig cells that make up the testes. If TDF is never produced or is interfered with then the gonad cells form into the Theca cells and Follicles which comprise the ovaries.
|
||||
|
||||
|
||||
@ -48,16 +57,19 @@ This is known as Swyer Syndrome, and an unknown number of women may have this co
|
||||
|
||||
The fact is, the vast majority of the population has never been tested for genetic karyotype, so we don’t know how common these cases actually are. Where does this come into affect for gender identity? Well, the exact same process that causes the external genitals to differentiate also occurs for the brain.
|
||||
|
||||
{!{ <div class="gutter">
|
||||
{!{
|
||||
<div class="gutter">
|
||||
<strong style="display: block;text-align: center;">And it gets even weirder!</strong>
|
||||
{{import '~/tweet' ids=[
|
||||
{{import '~/tweet' ids=[
|
||||
'1224039568971710464'
|
||||
'1224040716365524993'
|
||||
'1224041800513380352'
|
||||
'1224042620164296705'
|
||||
'1224043995413639168'
|
||||
'1224044949160611840'
|
||||
] tweets=meta.tweets className="oneblock hide-reply" }}</div> }!}
|
||||
] tweets=meta.tweets className="oneblock hide-reply" }}
|
||||
</div>
|
||||
}!}
|
||||
|
||||
#### Brain Split
|
||||
|
||||
|
||||
@ -47,6 +47,8 @@ This is the most fundamental reason why we as a community say "you do not need d
|
||||
|
||||
Anything that can be a source of dysphoria has an equal and opposite euphoria.
|
||||
|
||||
{!{ <div class="print-break-before"></div> }!}
|
||||
|
||||
{!{ <div class="gutter">{{import '~/tweet' ids=[
|
||||
'1228141518386585607'
|
||||
'1228165207316287489'
|
||||
|
||||
@ -18,7 +18,14 @@ In 1948, noted sexologist Dr. Alfred Kinsey (yes, [*that* Kinsey](https://en.wik
|
||||
|
||||
Benjamin then went on to refine his protocol and treated thousands of patients with similar feelings over the course of his career. He refused to take payment for his work, instead taking satisfaction from the relief he granted these patients, and using their treatment to further his understanding of the condition. He coined a term for this feeling of incongruence in 1973: Gender Dysphoria. Unfortunately, this term would not be used in the United States until 2013, with the American Psychiatric Association opting for the term Gender Identity Disorder instead.
|
||||
|
||||
{!{ <div class="gutter">{{import '~/img' images.hbscale className="card sideline" caption="Harry Benjamin Diagnostic Scale"}}</div> }!}
|
||||
{!{
|
||||
<div class="gutter print-inline">
|
||||
{{import '~/img' images.hbscale
|
||||
className="card print-span34 print-center"
|
||||
caption="Harry Benjamin Diagnostic Scale"
|
||||
}}
|
||||
</div>
|
||||
}!}
|
||||
|
||||
If you are a trans person reading this, you may have heard the name Harry Benjamin before, but probably not in a favorable context. In 1979 his name was used (with permission) in the forming of the Harry Benjamin International Gender Dysphoria Association (HBIGDA), which released a Standards of Care (SoC) for transgender people. This SoC came to be known as the Harry Benjamin Rules, and were infamously limiting in regards to how Gender Dysphoria could be diagnosed. Patients were placed within a six tier scale based upon their level of misery and sexual dysfunction. If you did not land at Tier 5 or higher, classified as a "True Transsexual", you were usually rejected for treatment.
|
||||
|
||||
@ -38,7 +45,9 @@ Transgender people are coming out of the woodwork; we are everywhere.
|
||||
<strong>Dys·pho·ri·a</strong> - <em>Noun</em><br>
|
||||
A state of unease or generalized dissatisfaction with life. The opposite of euphoria.
|
||||
</blockquote>
|
||||
{{import '~/img' images.glue className="card sideline"}}
|
||||
</div>
|
||||
<div class="gutter print-span4">
|
||||
{{import '~/img' images.glue className="card print-span4"}}
|
||||
</div>
|
||||
}!}
|
||||
|
||||
@ -46,7 +55,9 @@ There is a common misconception among both cisgender and transgender people that
|
||||
|
||||
In principle, Gender Dysphoria is a feeling of wrongness intrinsic to the self. There is no logical backing to this wrongness, there is nothing which explains it, you can not describe why you feel this way, it is just there. Things in your existence are incorrect, and even knowing which things *are* incorrect can be hard to properly identify.
|
||||
|
||||
Evey Winters described it extremely aptly [in her Dysphoria post](https://eveywinters.com/2019/10/14/on-dysphoria-before-enduring-and-after/).
|
||||
The way I used to describe it is like wearing an adult's glove when you are a child. You can put your hand into the glove, and your fingers feed into the digits of the glove, but your dexterity with the glove is severely hindered. You might be able to pick something up, but you can not manipulate it like an adult could. Things just aren't quite right.
|
||||
|
||||
Evey Winters described it this way [in her Dysphoria post](https://eveywinters.com/2019/10/14/on-dysphoria-before-enduring-and-after/).
|
||||
|
||||
> Have you ever been sitting somewhere in a public or a formal place and all of a sudden the bottom of your foot itches? It’s not like you can remove your shoes right there and scratch it, so you endure the feeling of dying inside while this itch grows and grows until you are ready to murder the next person that speaks to you.
|
||||
>
|
||||
@ -56,8 +67,6 @@ Evey Winters described it extremely aptly [in her Dysphoria post](https://eveywi
|
||||
>
|
||||
> It is knowing that something is wrong and not being able to do a damn thing about it.
|
||||
|
||||
The way I used to describe it is like wearing an adult's glove when you are a child. You can put your hand into the glove, and your fingers feed into the digits of the glove, but your dexterity with the glove is severely hindered. You might be able to pick something up, but you can not manipulate it like an adult could. Things just aren't quite right.
|
||||
|
||||
Gender Dysphoria is, at its core, simply emotional reactions to the brain knowing that something does not fit. This incongruence is so deep inside the brain's subsystems that there is no obvious message of what the problem is. The only way we have to identify it is via the emotions that it triggers. Our consciousness receives either positive (euphoria) or negative (dysphoria) feedback according to how well our current environment aligns with our internal sense of self. Part of transition is learning to recognize those signals.
|
||||
|
||||
Cisgender people receive them as well, but since the signals usually align with their environment, they take them for granted. There have been a few notable occasions, however, when a cisgender person has been [put into a situation](https://www.teenvogue.com/story/maisie-williams-arya-stark-game-of-thrones-affected-her-body-image) where they experience gender dysphoria. Attempts to raise cisgender children [as the opposite sex](https://www.nytimes.com/2004/05/12/us/david-reimer-38-subject-of-the-john-joan-case.html) (Content warning: suicide) have always met with failure when the child inevitably declares themselves differently.
|
||||
|
||||
@ -40,10 +40,11 @@ There are four main kinds of hormones:
|
||||
- [Eicosanoids](https://en.wikipedia.org/wiki/Eicosanoid) that are formed from lipids and fatty acids and predominantly affect the immune system
|
||||
- [Steroids](https://en.wikipedia.org/wiki/Steroid) are signaling molecules produced by various internal organs in order to pass messages to other organs within the body.
|
||||
|
||||
{!{ <div class="gutter">{{import '~/img' images.steroidogenesis
|
||||
className="card sideline"
|
||||
{!{ <div class="gutter print-span3">{{import '~/img' images.steroidogenesis
|
||||
className="card"
|
||||
link="https://en.wikipedia.org/wiki/File:Steroidogenesis.svg"
|
||||
external=1
|
||||
alt="Chart of steroid metabolism flow"
|
||||
caption="All steroids are formed from cholesterols (top left) and are derived from other steroids. Progestins form into Androgens which form into Estrogens. This is a one-way exchange, and does not reverse, so don't believe it when someone tells you that too much estrogen will turn it into testosterone."
|
||||
}}</div> }!}
|
||||
|
||||
|
||||
@ -70,7 +70,7 @@ siblings:
|
||||
|
||||
{!{ </div> }!}
|
||||
|
||||
---
|
||||
<hr class="print-break-after print-hidden">
|
||||
|
||||
## Introduction
|
||||
|
||||
@ -96,7 +96,7 @@ This experience of discontinuity between the internal and external self is what
|
||||
The purpose of this site is to document the many ways that Gender Dysphoria can manifest, as well as other aspects of gender transition, in order to provide a guide for those who are questioning, those who are starting their transgender journey, those already on their path, and those who simply wish to be better allies.
|
||||
|
||||
{!{
|
||||
<div class="gutter flex flex-end print-center">
|
||||
<div class="gutter flex flex-end print-inline print-span2 print-center">
|
||||
<span>Title artwork based on works by <a href="https://www.instagram.com/jp_means_jumpei/">Jumpei JP Ueoka</a></span>
|
||||
<div class="grid-row" style="grid-template-columns: 1fr 1fr">
|
||||
{{import '~/img' images.jpjumpei_1 className="" link="https://www.instagram.com/p/Bq2uRCtFttU/"}}
|
||||
|
||||
@ -107,8 +107,6 @@ Primary characteristics can only be altered through surgical intervention. Some
|
||||
|
||||
Some secondary traits can be surgically enhanced (Breast Augmentation, body contouring, facial masculinization / feminization), and some cannot be changed at all.
|
||||
|
||||
---
|
||||
|
||||
Physical dysphoria manifests in several different ways. Sometimes this is felt in a sort of phantom limb phenomenon, where the person can feel sensations from a penis or vagina that is not there, an ache in a uterus that does not exist, or a sense of absence on the chest from breasts that have not grown in.
|
||||
|
||||
It can be felt as a sort of *reverse* phantom effect, where the person is persistently aware of something that should *not* be there. The brain is receiving sensory input that it does not expect, such as the weight of breasts, or the presence of testicles or a uterus, and this input takes priority because it isn't expected.
|
||||
|
||||
@ -28,8 +28,6 @@ Many people attribute the term to psychologist John Money, who proposed using "g
|
||||
>
|
||||
> Margaret Mead moves from the specific delineation to the more general comparison of male and female in several communities, finally coming to an analysis of sex-patterns in our own midst and for our own time.
|
||||
|
||||
---
|
||||
|
||||
Human Sex (the adjective, not the verb) is broken down into three categories:
|
||||
|
||||
- **Genotype**: The genetically defined chromosomal kareotype of an organism (XX, XY, [and all variants there of](https://twitter.com/sciencevet2/status/1035250518870900737?lang=en))
|
||||
@ -38,14 +36,14 @@ Human Sex (the adjective, not the verb) is broken down into three categories:
|
||||
|
||||
Any of these three aspects can fall into a position on a range of values. Your elementary school health class probably taught you that Genotype is binary, either Female (XX) or Male (XY), when the reality is that there are a dozen other permutations that can occur within human beings.
|
||||
|
||||
{!{ {{import '~/img' images.bimodal className="card borderless center span34"}} }!}
|
||||
{!{ {{import '~/img' images.bimodal className="card borderless center span34 print-right print-span3"}} }!}
|
||||
|
||||
Likewise, many people believe that Phenotype is also binary, but biology has recognized for hundreds of years that when you plot out all sexual characteristics across a population, you actually end up with a bimodal distribution where the majority of the population falls within a percentile of two groups. This means that some people will, simply by nature of how life works, fall outside of the typical two piles. Many people fall in the middle, with characteristics of both sexes.
|
||||
|
||||
Gender, however, is a lot more... esoteric. There are a lot of different ways that people have attempted to illustrate the gender spectrum, but none have quite thoroughly captured it, because the spectrum is itself a very abstract concept.
|
||||
|
||||
{!{
|
||||
<div class="gutter flex">
|
||||
<div class="gutter flex print-span34 print-row print-inline print-break-before">
|
||||
{{import '~/img' images.spectrum className="" link="https://bahamutzero.tumblr.com/post/56838411871/gender-a-visual-guide-when-most-people-think-of" style="margin-bottom: 5px"}}
|
||||
{{import '~/img' images.graph className="" style="margin-bottom: 5px"}}
|
||||
{{import '~/img' images.gender_unicorn className="" link="http://www.transstudent.org/gender" style="margin-bottom: 5px"}}
|
||||
|
||||
@ -8,12 +8,7 @@
|
||||
}
|
||||
|
||||
.card-img, .card-img-top {
|
||||
width: unset;
|
||||
}
|
||||
|
||||
.card-img-top {
|
||||
page-break-before: avoid;
|
||||
page-break-after: avoid;
|
||||
// width: unset;
|
||||
}
|
||||
|
||||
.card-img-top + .card-img-top {
|
||||
@ -148,8 +143,6 @@
|
||||
.card.right {
|
||||
float: right;
|
||||
margin-left: 10px;
|
||||
page-break-inside: always;
|
||||
|
||||
}
|
||||
|
||||
.card.center {
|
||||
|
||||
67
scss/_gutter.scss
Normal file
67
scss/_gutter.scss
Normal file
@ -0,0 +1,67 @@
|
||||
|
||||
.gutter {
|
||||
|
||||
@media screen and (min-width: 800px) {
|
||||
position: relative;
|
||||
height: 0;
|
||||
left: calc(100% + 1em);
|
||||
width: 400px;
|
||||
padding: 0 1em;
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
width: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 500px) and (max-width: 800px) {
|
||||
float: right;
|
||||
width: 300px;
|
||||
margin-left: 1em;
|
||||
zoom: 0.9;
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
||||
page-break-inside: avoid;
|
||||
clear: both;
|
||||
|
||||
&:not(.print-inline) {
|
||||
float: right;
|
||||
width: 40vw;
|
||||
margin-left: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
// outline: 1px solid red;
|
||||
|
||||
&.flex, .flex {
|
||||
.tweet {
|
||||
flex: none;
|
||||
}
|
||||
}
|
||||
|
||||
> a > img:not(.card-img-top), > img {
|
||||
max-width: 100%;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.flex, .gutter.flex {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
@media print {
|
||||
&.print-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
|
||||
&.flex-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
&.flex-center {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
@ -149,6 +149,11 @@ header {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
max-height: 90vh;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
@ -167,7 +172,7 @@ header {
|
||||
}
|
||||
|
||||
// @media (min-width: 500px) {
|
||||
body:not(.front-page):not(.longform) header + * {
|
||||
body:not(.front-page) header + * {
|
||||
margin-top: $header-full-height;
|
||||
}
|
||||
// }
|
||||
|
||||
@ -1,11 +1,5 @@
|
||||
.front-page {
|
||||
|
||||
header {
|
||||
@media (max-width: 500px) {
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
||||
.top-fold {
|
||||
min-height: 100vh;
|
||||
background-color: $header-bg-mid;
|
||||
|
||||
@ -2,54 +2,40 @@
|
||||
|
||||
body.longform {
|
||||
|
||||
#body {
|
||||
background: unset;
|
||||
|
||||
@media screen {
|
||||
padding: 0 1em;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
h1, h2 {
|
||||
clear: both;
|
||||
page-break-before: always;
|
||||
}
|
||||
|
||||
.header-link { display: none; }
|
||||
|
||||
article hr {
|
||||
page-break-after: always;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
|
||||
.gutter {
|
||||
float: right;
|
||||
width: 40vw;
|
||||
margin-left: 1em;
|
||||
zoom: 0.9;
|
||||
|
||||
page-break-inside: avoid;
|
||||
|
||||
&.print-center {
|
||||
float: none;
|
||||
margin: 1em auto;
|
||||
}
|
||||
}
|
||||
|
||||
&.flex, .flex {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
> a > img:not(.card-img-top), > img {
|
||||
max-width: 100%;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
// #body {
|
||||
// // background: unset;
|
||||
|
||||
// @media screen {
|
||||
// padding: 0 1em;
|
||||
// }
|
||||
// }
|
||||
|
||||
// header {
|
||||
// display: none;
|
||||
// }
|
||||
|
||||
// h1, h2 {
|
||||
// clear: both;
|
||||
// page-break-before: always;
|
||||
// }
|
||||
|
||||
// .header-link { display: none; }
|
||||
|
||||
// article hr {
|
||||
// page-break-after: always;
|
||||
// opacity: 0;
|
||||
// }
|
||||
|
||||
// > a > img:not(.card-img-top), > img {
|
||||
// max-width: 100%;
|
||||
// margin-bottom: 5px;
|
||||
// }
|
||||
|
||||
}
|
||||
|
||||
|
||||
@ -121,6 +121,12 @@
|
||||
}
|
||||
|
||||
ul { padding-left: 2em; }
|
||||
|
||||
.center {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.cw {
|
||||
@ -152,9 +158,30 @@
|
||||
}
|
||||
|
||||
.two-column-list {
|
||||
|
||||
@media (min-width: 500px) {
|
||||
h1, h2, h3, h4 {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
ol, ul {
|
||||
|
||||
@media (max-width: 400px) {
|
||||
padding-left: 1.5em;
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
padding-left: 2em;
|
||||
}
|
||||
|
||||
@media (min-width: 500px) {
|
||||
columns: 2;
|
||||
padding-left: 3em;
|
||||
}
|
||||
|
||||
@media (min-width: 1100px) {
|
||||
padding-left: 5em;
|
||||
}
|
||||
|
||||
li { margin-bottom: 0.5em; }
|
||||
|
||||
@ -26,7 +26,7 @@ body.post {
|
||||
}
|
||||
}
|
||||
|
||||
body.gdb, body.hrt {
|
||||
body.gdb {
|
||||
|
||||
#body {
|
||||
background-color: $gutter-bg;
|
||||
@ -73,53 +73,6 @@ body.gdb, body.hrt {
|
||||
overflow: hidden;
|
||||
} }
|
||||
|
||||
.gutter {
|
||||
|
||||
@media screen and (min-width: 800px) {
|
||||
position: relative;
|
||||
height: 0;
|
||||
left: calc(100% + 1em);
|
||||
width: 400px;
|
||||
padding: 0 1em;
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
width: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
@media print, screen and (min-width: 500px) and (max-width: 800px) {
|
||||
float: right;
|
||||
width: 300px;
|
||||
margin-left: 1em;
|
||||
zoom: 0.9;
|
||||
}
|
||||
|
||||
// outline: 1px solid red;
|
||||
|
||||
&.flex, .flex {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.tweet {
|
||||
flex: none;
|
||||
}
|
||||
|
||||
&.flex-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
&.flex-center {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
> a > img:not(.card-img-top), > img {
|
||||
max-width: 100%;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.full-wide {
|
||||
width: calc(100vw - 4em);
|
||||
background-color: darken($content-bg, 1%);
|
||||
|
||||
@ -8,7 +8,6 @@
|
||||
$borderRadius: .35em;
|
||||
$avatarSize: 36px;
|
||||
|
||||
// zoom: 0.8;
|
||||
font-size: 12px;
|
||||
border: 1px solid $borderColor;
|
||||
border-radius: .35em;
|
||||
@ -18,6 +17,8 @@
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
|
||||
page-break-inside: avoid;
|
||||
|
||||
@include media-breakpoint-up(md) {
|
||||
&.capped { max-height: 700px; }
|
||||
}
|
||||
|
||||
@ -101,6 +101,7 @@ $header-full-height: 100px;
|
||||
// @import "./index";
|
||||
@import "./page";
|
||||
@import "./card";
|
||||
@import "./gutter";
|
||||
@import "./grid-row";
|
||||
@import "./markup";
|
||||
// @import "./pager";
|
||||
@ -141,14 +142,58 @@ body.page, body.post {
|
||||
|
||||
article {
|
||||
border: 0;
|
||||
|
||||
blockquote {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
.card {
|
||||
&.span34 {
|
||||
width: 50vw;
|
||||
h1 {
|
||||
// clear: both;
|
||||
page-break-before: always;
|
||||
}
|
||||
}
|
||||
|
||||
.print-break-before {
|
||||
page-break-before: always;
|
||||
}
|
||||
|
||||
.print-break-after {
|
||||
page-break-after: always;
|
||||
}
|
||||
|
||||
.print-hidden {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.card, .gutter {
|
||||
&.print-span1 { width: 100vw !important; }
|
||||
&.print-span34 { width: 75vw !important; }
|
||||
&.print-span2 { width: 50vw !important; }
|
||||
&.print-span3 { width: 33vw !important; }
|
||||
&.print-span4 { width: 25vw !important; }
|
||||
&.print-span5 { width: 20vw !important; }
|
||||
&.print-span6 { width: 15vw !important; }
|
||||
|
||||
&.print-span1,
|
||||
&.print-span34,
|
||||
&.print-span2 {
|
||||
&.print-inline, &.print-center {
|
||||
margin: 1em auto;
|
||||
}
|
||||
}
|
||||
|
||||
&.print-center {
|
||||
margin: 1em auto;
|
||||
}
|
||||
|
||||
&.print-right {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.card img.card-img-top {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
}
|
||||
|
||||
.header-link { display: none; }
|
||||
@ -183,4 +228,3 @@ body.page, body.post {
|
||||
footer .patreon-support { display: none; }
|
||||
footer .foot-nav { display: none; }
|
||||
|
||||
article hr { page-break-after: always; }
|
||||
|
||||
@ -101,6 +101,7 @@ $header-full-height: 100px;
|
||||
@import "./index";
|
||||
@import "./page";
|
||||
@import "./card";
|
||||
@import "./gutter";
|
||||
@import "./grid-row";
|
||||
@import "./markup";
|
||||
@import "./pager";
|
||||
|
||||
@ -1,14 +1,21 @@
|
||||
{{#if sizes}}
|
||||
<div class="{{className}}" {{#if style}}style="{{style}}"{{/if}} target="_break">
|
||||
<a href="{{#if link}}{{link}}{{else}}{{rev (get (last sizes) 'url')}}{{/if}}" class="{{#includes className "card"}}card-img-top{{/includes}} {{#unless external}}lb{{/unless}}"><img
|
||||
<div class="{{className}}" {{#if style}}style="{{style}}"{{/if}}>
|
||||
<a
|
||||
href="{{#if link}}{{link}}{{else}}{{rev (get (last sizes) 'url')}}{{/if}}"
|
||||
class="{{#includes className "card"}}card-img-top{{/includes}} {{#unless external}}lb{{/unless}}"
|
||||
{{#if external}}target="_break" rel="noopener"{{/if}}
|
||||
>
|
||||
<img
|
||||
src="{{rev url}}"
|
||||
alt="{{alt}}"
|
||||
srcset="{{#join sizes}}{{rev url}} {{width}}w{{/join}}"
|
||||
sizes="{{#if srcSizes}}{{srcSizes}}{{else}}(max-width: 576px) 100vw, 576px{{/if}}"
|
||||
{{#includes className "card"}}class="card-img-top"{{/includes}}
|
||||
{{#includes className "card"}}
|
||||
class="card-img-top"
|
||||
{{/includes}}
|
||||
{{#if imgStyle}}style="{{imgStyle}}"{{/if}}
|
||||
></a>
|
||||
|
||||
>
|
||||
</a>
|
||||
{{#if caption}}<span class="card-body">{{{caption}}}</span>{{/if}}
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user