diff --git a/TheyCameFromBeyondTheGrave/tcfbtg.css b/TheyCameFromBeyondTheGrave/tcfbtg.css index 9134c0c1df..44d3948a4a 100644 --- a/TheyCameFromBeyondTheGrave/tcfbtg.css +++ b/TheyCameFromBeyondTheGrave/tcfbtg.css @@ -114,10 +114,12 @@ textarea { "attributes attributes attributes attributes" "paths paths aspirations aspirations" "connections connections trademarks trademarks" - "quips tropes tropes favored-stunts" + "quips quips quips quip-cards" + "tropes favored-stunts favored-stunts cinematic-cards" "health footer-general footer-general footer-general"; row-gap: 10px; column-gap: 10px; + align-items: start; } .version { @@ -377,6 +379,16 @@ textarea { grid-area: quips; } +.quip-cards { + grid-area: quip-cards; + justify-self: center; +} + +.cinematic-cards { + grid-area: cinematic-cards; + justify-self: center; +} + .tropes { grid-area: tropes; } @@ -796,21 +808,22 @@ input.toggle-more[value="0"] + button > span.less { /* Responsive CSS */ @media only screen and (max-width: 480px) { .wrapper { - grid-template-columns: 1fr; + grid-template-columns: 1fr 1fr; grid-template-areas: - "logo" - "header-general" - "skills" - "attributes" - "paths" - "aspirations" - "connections" - "trademarks" - "quips" - "tropes" - "favored-stunts" - "health" - "footer-general"; + "logo logo" + "header-general header-general" + "skills skills" + "attributes attributes" + "paths paths" + "aspirations aspirations" + "connections connections" + "trademarks trademarks" + "quips quips" + "tropes tropes" + "favored-stunts favored-stunts" + "health health" + "footer-general footer-general" + "quip-cards cinematic-cards"; } .logo img {