From 138656ee238d498e5f7a978554a5d2eb8e1c6323 Mon Sep 17 00:00:00 2001 From: Patrick Spek Date: Thu, 11 Oct 2018 07:55:16 +0200 Subject: Add "Hackerrank solutions: Python 3 and Perl 6 (part 2)" --- css/language-war.less | 69 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 69 insertions(+) create mode 100644 css/language-war.less (limited to 'css/language-war.less') diff --git a/css/language-war.less b/css/language-war.less new file mode 100644 index 0000000..c7f563b --- /dev/null +++ b/css/language-war.less @@ -0,0 +1,69 @@ +@import "./variables.less"; + +main { + max-width: 80em; + margin: 0 auto; + text-align: justify; + + @media(max-width: @mainWidth) { + padding: 1rem; + } + + h1, h2, p { + max-width: @mainWidth; + margin-left: auto; + margin-right: auto; + } + + .language-announcer { + max-width: @mainWidth; + margin: 0 auto; + } + + .admonitionblock { + max-width: @mainWidth * .9; + margin: 0 auto; + } + + figure.highlight pre { + overflow-x: auto; + } + + @media(min-width: @mainWidth) { + .language-arena { + display: grid; + + grid-template-columns: [challenger] 1fr [defender] 1fr [end]; + grid-template-rows: [code] auto [comments] auto [end]; + + .language-challenger { + grid-column-start: challenger; + grid-column-end: defender; + grid-row-start: code; + grid-row-end: end; + } + + .language-defender { + grid-column-start: defender; + grid-column-end: end; + grid-row-start: code; + grid-row-end: end; + } + + .language-code { + grid-row-start: code; + grid-row-end: comments; + + max-width: 40em; + } + + .language-commentary { + max-width: @mainWidth; + grid-row-start: comments; + grid-row-end: end; + + margin: 0 40px; + } + } + } +} -- cgit v1.1