summaryrefslogtreecommitdiffstats
path: root/helpcontent2/help3xsl/default.css
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--helpcontent2/help3xsl/default.css994
1 files changed, 994 insertions, 0 deletions
diff --git a/helpcontent2/help3xsl/default.css b/helpcontent2/help3xsl/default.css
new file mode 100644
index 000000000..374050472
--- /dev/null
+++ b/helpcontent2/help3xsl/default.css
@@ -0,0 +1,994 @@
+/*
+ * This file is part of the LibreOffice project.
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * This file incorporates work covered by the following license notice:
+ *
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed
+ * with this work for additional information regarding copyright
+ * ownership. The ASF licenses this file to you under the Apache
+ * License, Version 2.0 (the "License"); you may not use this file
+ * except in compliance with the License. You may obtain a copy of
+ * the License at http://www.apache.org/licenses/LICENSE-2.0 .
+ */
+/*
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
++ LIBREOFFICE HELP IN BROWSER +
++ DEFAULT STYLESHEET +
++ WESTERN LANGUAGES +
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+
+We use px as the unit for navigation elements and fonts because we do
+not want them to scale with browser-set font size.
+We use rem as the unit for article and footer contents because they
+do not break anything related to layout by scaling.
+
+*/
+:root {
+ --font_mono: Menlo, "Cascadia Mono", "Cascadia Code", Consolas, "DejaVu Sans Mono", monospace;
+ --font_body: Ubuntu, Cantarell, "Segoe UI Variable", "Segoe UI", "Noto Sans", "DejaVu Sans", "Lucida Grande", sans-serif, FreeSerif, NanumGothic, "Noto Sans Tibetan", Taprom;
+}
+
+body,
+p,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+.listitem,
+.listitemintable,
+.tablecontent {
+ font-family: var(--font_body);
+}
+.input {
+ background-color: rgba(0,0,0,0.04);
+ transition-property: background-color;
+ transition-duration: 150ms;
+ border-bottom: 1px dashed rgba(0,0,0,0.1);
+ font-family: var(--font_mono);
+}
+[data-tooltip]{
+ position:relative;
+}
+[data-tooltip]::before {
+ content: "";
+ position: absolute;
+ top:-6px;
+ left:50%;
+ transform: translateX(-50%);
+ border-width: 4px 6px 0 6px;
+ border-style: solid;
+ border-color: rgba(0,0,0,0.7) transparent transparent transparent;
+ z-index: 100;
+ opacity: 0;
+ pointer-events: none;
+}
+[data-tooltip]::after {
+ content: attr(data-tooltip);
+ position: absolute;
+ left:50%;
+ top:-6px;
+ transform: translateX(-50%) translateY(-100%);
+ background: rgba(0,0,0,0.7);
+ text-align: center;
+ color: #fff;
+ padding:4px 2px;
+ font-size: 12px;
+ min-width: 80px;
+ border-radius: 5px;
+ opacity: 0;
+ pointer-events: none;
+}
+[data-tooltip]:hover:before, [data-tooltip]:hover:after {
+ opacity: 1;
+ pointer-events: auto;
+}
+body {
+ background-color: #F7F8F7;
+ margin: 0;
+ line-height: normal;
+}
+::selection {
+ background: #FFEB9F;
+}
+a {
+ text-decoration-color: rgba(0,0,0,0.15);
+ color: #0461e0;
+}
+a:hover {
+ text-decoration: underline;
+ color: #023a86;
+}
+a:visited {
+ color: #633363;
+}
+pre,
+.code,
+.codeintable,
+.example,
+.exampleintable,
+.literal,
+.literalintable,
+.path,
+.pathintable {
+ background-color: rgba(0,0,0,0.04);
+ border-radius: 2px;
+ display: inline;
+ padding: 1px 3px;
+ font-family: var(--font_mono);
+ word-wrap: anywhere;
+}
+.smathcode {
+ border-radius: 2px;
+ padding: 1px 3px;
+ font-family: var(--font_mono);
+}
+.acronym {
+ font-weight: bold;
+}
+.related {
+ font-weight: bold;
+ margin-top: 1.67rem;
+ border-top: 1px solid black;
+}
+.emph,
+.menuitem {
+ font-weight: bold;
+}
+.keycode {
+ font-family: var(--font_mono);
+}
+.widget{
+ padding: 1px 10px;
+ background: #f0f0f0;
+ background: linear-gradient(to bottom,#f0f0f0,#fcfcfc);
+ border-radius: 3px;
+ color: #303030;
+ border: 1px solid #a0a0a0;
+ border-bottom-width: 2px;
+ white-space: nowrap;
+}
+/* div's for warning, tip and note */
+.note,
+.tip,
+.warning {
+ display:flex;
+ align-items: center;
+ border-radius: 2px;
+ box-shadow: 0 2px 5px -3px rgb(0 0 0 / 10%);
+ padding: 0.2em;
+ margin-top: 15px;
+}
+.note {
+ border-left: 2px solid #309048;
+ background-color: #d9f1dd;
+}
+.tip {
+ border-left: 2px solid #0063b1;
+ background-color: #cde5f7;
+}
+.warning {
+ border-left: 2px solid #ed8733;
+ background-color: #f6f1d2;
+}
+.noteicon, .notetext {
+ padding:0.3em;
+}
+/* Override some Prism.js styles */
+code[class*="language-"], pre[class*="language-"] {
+ white-space: pre-wrap;
+}
+
+/* Table related classes */
+
+/* Special case of table with one cell*/
+.onecell{
+ box-shadow: rgba(0,0,0,0.1) 0px 1px 3px 0px;
+ border-bottom: 1px solid #E8E8E8;
+}
+/* Special case of icon table*/
+.icontable {
+ display:flex;
+ align-items:center;
+}
+.iconcell {
+ padding:0.3em;
+}
+
+table {
+ background: #FEFEFE;
+ box-shadow: rgba(0,0,0,0.08) 0 1px 5px 0;
+ border-collapse: collapse;
+}
+table, th, td {
+ border-top: 0;
+ border-bottom: 1px solid #E8E8E8;
+ border-left: 0;
+ border-right: 0;
+ padding: 0.3em;
+}
+html[dir=ltr] th {
+ text-align: left;
+}
+.tablehead,
+.tableheadintable {
+ font-weight: bold;
+ margin-top: 0px;
+}
+.tableheadcell {
+ color: white;
+ vertical-align:top;
+}
+
+.table_font_small {
+ font-size: 0.98rem;
+}
+
+/* ScriptForge service tables */
+.sf_table {
+ min-width: 100%;
+}
+.sf_table thead {
+ display: none;
+}
+.sf_table tr, .sf_table td {
+ display: block;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ margin-bottom: 0.67rem;
+ color: #148603;
+}
+p,
+ol,
+td {
+ font-size: 1.15rem;
+ margin: 2px 0 10px 0;
+}
+h1 {
+ font-size: 1.83rem;
+ font-weight: 300;
+ border-bottom: 2px solid #148603;
+ margin-bottom: 1.67rem;
+}
+h1 a {
+ text-decoration: none;
+}
+h2 {
+ font-size: 1.55rem;
+}
+h3 {
+ font-size: 1.33rem;
+}
+h4,
+h5,
+h6 {
+ font-size: 1.17rem;
+}
+.relatedtopics {
+ font-weight: normal;
+}
+.howtoget {
+ background: #EBE7E9;
+ border-left: 2px solid #4E4B55;
+ border-radius: 2px;
+ box-shadow: 0 2px 5px -3px rgb(0 0 0 / 10%);
+ padding: 0.2em;
+ display: flex;
+ flex-direction: column;
+}
+.howtogetheader {
+ background: #FFF;
+ border-radius: 2px;
+ box-shadow: 0 2px 2px -2px rgba(0,0,0,0.2);
+ display: inline-block;
+ font-weight: bold;
+ padding: 0.1em 0.3em;
+}
+.howtogetbody {
+ padding: 0 0.3em;
+}
+.samplefilesection{
+}
+.wide {
+ width: 100%;
+}
+.bug {
+ color: red;
+}
+.debug {
+ border: 1px solid black;
+ padding: 3px;
+ display: none;
+ background-color: #222;
+ color: red;
+ text-align: left;
+}
+.sqlcode,
+.pycode,
+.bascode {
+ border: solid 5px transparent;
+ margin-top: 15px;
+ margin-bottom: 15px;
+}
+
+#DisplayArea {
+ background-color: #FCFCFC;
+ overflow: auto;
+ padding: 10px 10px 40px 10px;
+ grid-area: main;
+}
+
+.mediabutton {
+ background-color: cyan;
+}
+.mediadiv{
+ padding-bottom:5%;
+ height:0;
+ display:inline-block;
+ border:none;
+}
+.screenshot, .genericimage {
+ border: .5px solid rgba(0,0,0,.1);
+ border-radius: 3px;
+ margin-left: auto;
+ margin-right: auto;
+ margin-top: 2em;
+ margin-bottom: 2em;
+ display:block;
+ box-shadow: rgba(0,0,0,0.08) 0 1px 5px 0;
+}
+.iconimage {}
+
+.switch,
+.switchinline {}
+
+.embedded {}
+#TopLeftHeader {
+ grid-area: header;
+ position: sticky;
+ top: 0px;
+ color: #fff;
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: flex-start;
+ z-index: 100;
+}
+.dropdowns {
+ /* allow for scrolling */
+ overflow-x: auto;
+ overflow-y: hidden;
+ /* make it smooth on iOS */
+ -webkit-overflow-scrolling: touch;
+ grid-area: dropdowns;
+ display: flex;
+ justify-content: space-between;
+ flex-direction: column;
+}
+.symbol, .logo, .logo:hover, .logo:visited {
+ color: #fff;
+ text-decoration: none;
+}
+.logo p {
+ font-size: 24px;
+}
+.symbol {
+ grid-area: symbol;
+ padding: 8px 8px 8px 20px;
+}
+.symbol div {
+ background-image: url(media/navigation/libo-symbol-white.svg);
+ background-repeat: no-repeat;
+ background-size: contain;
+ width: 52px;
+ height: 60px;
+}
+
+[data-a11y-toggle]:not([aria-controls]) {
+ display: none;
+}
+/* You Tube matters */
+.youtube_placeholder{
+ border: 1px solid #eee;
+ max-width:700px;
+ padding: 10px;
+ background-color: #eee;
+ text-align: center;
+}
+.youtube_button {
+ appearance: none;
+ backface-visibility: hidden;
+ background-color: #27ae60;
+ border-radius: 8px;
+ border-style: none;
+ box-shadow: rgba(39, 174, 96, .15) 0 4px 9px;
+ box-sizing: border-box;
+ color: #fff;
+ cursor: pointer;
+ display: inline-block;
+ font-size: 16px;
+ font-weight: 600;
+ letter-spacing: normal;
+ line-height: 1.5;
+ outline: none;
+ overflow: hidden;
+ padding: 13px 20px;
+ position: relative;
+ text-align: center;
+ text-decoration: none;
+ transform: translate3d(0, 0, 0);
+ transition: all .3s;
+ user-select: none;
+ -webkit-user-select: none;
+ touch-action: manipulation;
+ vertical-align: top;
+ white-space: nowrap;
+}
+.youtube_button:hover {
+ background-color: #1e8449;
+ opacity: 1;
+ transform: translateY(0);
+ transition-duration: .35s;
+ box-shadow: rgba(39, 174, 96, .2) 0 6px 12px;
+}
+.youtube_button:active {
+ transform: translateY(2px);
+ transition-duration: .35s;
+}
+
+#langs-nav:not([aria-hidden='true']), #modules-nav:not([aria-hidden='true']) {
+ z-index: 100;
+ /* line them up horizontally */
+ display: flex;
+ flex-direction: row;
+ /* allow for scrolling */
+ overflow-x: auto;
+ overflow-y: hidden;
+ /* make it smooth on iOS */
+ -webkit-overflow-scrolling: touch;
+}
+#langs-nav a, #modules-nav a {
+ color: #fff;
+ background-color: #233336;
+ display: block;
+ line-height: 1.5;
+ padding: 3px 6px;
+ text-decoration: none;
+ font-size: 24px;
+ flex-shrink: 0;
+ z-index: 100;
+ white-space: nowrap;
+}
+footer {
+ padding: 30px 20px;
+}
+footer p {
+ font-size: 0.98rem;
+}
+.contents-treeview input[type=checkbox], aside input[type=checkbox] {
+ /* from .visuallyhidden class of html5-boilerplate */
+ border: 0;
+ clip: rect(0 0 0 0);
+ height: 1px;
+ margin: -1px;
+ overflow: hidden;
+ padding: 0;
+ position: absolute;
+ width: 1px;
+ white-space: nowrap;
+}
+label[for=accordion-1] {
+ color: #233336;
+ display: block;
+ padding: 10px 0 10px 20px;
+ font-size: 22px;
+ line-height: .6;
+}
+label[for=accordion-1]:after {
+ font-size: 44px;
+ content:"⌄";
+}
+aside input[type=checkbox] ~ .contents-treeview {
+ display: none;
+}
+aside input[type=checkbox]:checked ~ .contents-treeview {
+ color: #333;
+ z-index: 6;
+ display: block;
+ margin: 0 20px 0 20px;
+}
+.index-label {
+ font-size: 22px;
+ color: #233336;
+ padding-left: 20px;
+ margin: 20px 0 0 0;
+}
+#Index, .index {
+ margin-top: 10px;
+}
+.index {
+ padding-left: 15px;
+}
+.index a {
+ font-size: 15px;
+ display: block;
+}
+.index .hidden {
+ display: none;
+}
+#Bookmarks {
+ padding: 0 20px;
+}
+#Bookmarks p {
+ font-size: 22px;
+ font-weight: bold;
+ color: #148603;
+}
+#WRITER::before {
+ content: "Writer";
+ display: block;
+ font-size: 22px;
+ font-weight: bold;
+ color: #0369a3;
+}
+#CALC::before {
+ content: "Calc";
+ display: block;
+ font-size: 22px;
+ font-weight: bold;
+ color: #43c330;
+}
+#IMPRESS::before {
+ content: "Impress";
+ display: block;
+ font-size: 22px;
+ font-weight: bold;
+ color: #a33e03;
+}
+#DRAW::before {
+ content: "Draw";
+ display: block;
+ font-size: 22px;
+ font-weight: bold;
+ color: #c99c00;
+}
+#BASE::before {
+ content: "Base";
+ display: block;
+ font-size: 22px;
+ font-weight: bold;
+ color: #8e03a3;
+}
+#MATH::before {
+ content: "Math";
+ display: block;
+ font-size: 22px;
+ font-weight: bold;
+ color: darkslategray;
+}
+#CHART::before {
+ content: "Chart";
+ display: block;
+ font-size: 22px;
+ font-weight: bold;
+ color: darkcyan;
+}
+#BASIC::before {
+ content: "Basic";
+ display: block;
+ font-size: 22px;
+ font-weight: bold;
+ color: black;
+}
+#SHARED::before {
+ content: "%PRODUCTNAME";
+ display: block;
+ font-size: 22px;
+ font-weight: bold;
+ color: gray;
+}
+.pagination-container {
+ text-align: center;
+ margin-left: -40px; /* The normalizer fails to account for this */
+}
+.pagination li {
+ display: inline-block;
+ padding: 0 5px;
+}
+.pagination a {
+ text-decoration: none;
+}
+li.active {
+ background-color: #023a86;
+}
+li.active a {
+ color: #fff;
+}
+li.disabled a {
+ opacity: 0.4;
+ pointer-events: none;
+}
+#search-bar, input {
+ border: 1px solid #CCC;
+ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
+ box-sizing: border-box;
+ line-height: 1.5em;
+ margin-top: 10px;
+ outline: none;
+ padding: 0 .25em;
+ transition: all 0.30s ease-in-out;
+}
+#search-bar:focus, input:focus {
+ border: 1px solid #0EA5FB;
+}
+#search-bar {
+ width: 100%;
+}
+#search-bar::placeholder {
+ font-style: italic;
+}
+.xapian-donation {
+ border-top: 2px solid #148603;
+ background-color: #FCFCFC;
+ box-shadow: 0 2px 8px 0 rgba(0,0,0,.05);
+}
+#DonationFrame {
+ background: #18A303;
+ position: sticky;
+ top: 0px;
+}
+.donation{
+ border: 1px solid #f1c62a;
+ border-radius: 2px;
+ padding: 5px 10px;
+ margin: auto;
+ max-width: 200px;
+ color: #ffffff;
+}
+.donation:hover {
+ background: linear-gradient(90deg, #1c71d8 0%, #30c877 100%);
+}
+.donation a {
+ color: white;
+ text-decoration: none;
+}
+.donation p {
+ font-size:1rem;
+ text-align: center;
+}
+#SearchFrame {
+ background: #18A303;
+ top: 0px;
+ position: sticky;
+ z-index: 100;
+}
+.xapian-omega-search {
+ margin: auto;
+}
+.modules {
+ border-bottom: 2px solid #f3f3f3;
+ background-color: #233336;
+ z-index: 100;
+}
+#modules:after, #langs:after {
+ font-size: 30px;
+ color: #fff;
+ content:"⌄";
+}
+.lang {
+ background-color: #233336;
+}
+#langs, #modules {
+ display: none;
+}
+#modules-nav div {
+ background-repeat: no-repeat;
+ background-size: contain;
+ float: left;
+ display: none;
+}
+
+.office-icon,
+.calc-icon,
+.chart-icon,
+.writer-icon,
+.impress-icon,
+.draw-icon,
+.math-icon,
+.basic-icon,
+.base-icon {
+ width: 21.5px;
+ height: 26px;
+ position: relative;
+ margin-right: 5px;
+}
+.office-icon {
+ background-image: url(media/navigation/libo-symbol-black.svg);
+}
+.calc-icon {
+ background-image: url(media/navigation/libo-calc.svg);
+}
+.writer-icon {
+ background-image: url(media/navigation/libo-writer.svg);
+}
+.impress-icon {
+ background-image: url(media/navigation/libo-impress.svg);
+}
+.draw-icon {
+ background-image: url(media/navigation/libo-draw.svg);
+}
+.math-icon {
+ background-image: url(media/navigation/libo-math.svg);
+}
+.base-icon {
+ background-image: url(media/navigation/libo-base.svg);
+}
+.chart-icon {
+ background-image: url(media/navigation/libo-chart.svg);
+}
+.basic-icon {
+ background-image: url(media/navigation/libo-basic.svg);
+}
+/* tree view */
+
+.contents-treeview ul,
+.contents-treeview li {
+ padding: 0;
+ margin: 0;
+ list-style: none;
+ font-size: 15px;
+}
+.contents-treeview {
+ -moz-user-select: none;
+ -webkit-user-select: none;
+ user-select: none;
+}
+.contents-treeview a, .index a {
+ text-decoration: none;
+ line-height: 1.4;
+}
+.contents-treeview a:hover, .index a:hover {
+ border-left: 2px solid rgba(0,0,0,0.05);
+ margin-left: -12px;
+ padding-left: 10px;
+}
+.contents-treeview input + label + ul {
+ margin: 0 0 0 22px;
+}
+.contents-treeview input ~ ul {
+ display: none;
+}
+.contents-treeview label,
+.contents-treeview label:before {
+ cursor: pointer;
+ color: #111;
+}
+.contents-treeview input:disabled + label {
+ cursor: default;
+ opacity: .6;
+}
+.contents-treeview input:checked:not(:disabled) ~ ul {
+ display: block;
+}
+.contents-treeview label,
+.contents-treeview a,
+.contents-treeview label::before {
+ display: block;
+ vertical-align: middle;
+}
+.contents-treeview label:before {
+ content: "⊞";
+ color: #0461e0;
+ width: 16px;
+ margin: 0 5px 0 0;
+ display: inline-block;
+}
+.contents-treeview input:checked + label::before {
+ content: "⊟";
+}
+.contents-current {
+ background: rgba(0,0,0,0.1);
+ border-left: 2px solid #6E7487;
+ margin-left: -12px;
+ padding-left: 10px;
+}
+/* webkit adjacent element selector bugfix */
+
+@media screen and (-webkit-min-device-pixel-ratio: 0) {
+ .contents-treeview {
+ -webkit-animation: webkit-adjacent-element-selector-bugfix infinite 1s;
+ }
+ @-webkit-keyframes webkit-adjacent-element-selector-bugfix {
+ from {
+ padding: 0;
+ }
+ to {
+ padding: 0;
+ }
+ }
+}
+@media screen and (min-width: 960px) {
+ .dropdowns {
+ flex-direction: row;
+ overflow-y: auto;
+ overflow-x: hidden;
+ }
+ #langs-nav, #modules-nav {
+ display: none;
+ }
+ #langs-nav a {
+ font-size: 19px;
+ white-space: normal;
+ }
+ /* these are buttons, so also reset some default stylings */
+ #langs, #modules {
+ cursor: pointer;
+ color: #fff;
+ font-size: 19px;
+ display: block;
+ background: transparent;
+ border: none;
+ text-transform: none;
+ padding: 0;
+ line-height: normal;
+ }
+
+ /* change the menu direction to stacked */
+ #langs-nav:not([aria-hidden='true']), #modules-nav:not([aria-hidden='true']) {
+ display: flex;
+ flex-direction: column;
+ overflow-y: auto;
+ max-height: 480px;
+ position: absolute;
+ }
+ #modules-nav {
+ background-color: #101820;
+ text-align: left;
+ }
+ #modules-nav div {
+ display: block;
+ }
+ #modules-nav a {
+ font-size: 19px;
+ }
+ aside {
+ float: left;
+ width: 320px;
+ }
+ .leftside {
+ grid-area: leftside;
+ }
+ .rightside {
+ grid-area: rightside;
+ }
+ #DonationFrame {
+ grid-area: donation;
+ }
+ #SearchFrame {
+ grid-area: search;
+ }
+ footer {
+ grid-area: footer;
+ }
+ .lang {
+ background-color: transparent;
+ }
+ .modules {
+ border: none;
+ background-color: transparent;
+ }
+ #DisplayArea {
+ box-shadow: 0 2px 8px 0 rgba(0,0,0,.05);
+ padding: 10px 50px 40px 50px;
+ }
+ .xapian-omega-search {
+ width: 100%;
+ }
+ .xapian-omega-search form {
+ display: flex;
+ justify-content: center;
+ }
+ .omega-autofocus {
+ max-width: 200px;
+ width: 100%
+ }
+ /* ScriptForge service tables */
+ .sf_table {
+ min-width: auto;
+ }
+ .sf_table thead {
+ display: table-header-group;
+ }
+ .sf_table tr {
+ display: table-row;
+ }
+ .sf_table td {
+ display: table-cell;
+ }
+}
+@media screen and (min-width: 1440px) {
+ #Contents {
+ color: #333;
+ z-index: 6;
+ display: block;
+ margin: 0 20px 0 20px;
+ }
+ label[for=accordion-1] {
+ background-color: transparent;
+ text-decoration: none;
+ }
+ label[for=accordion-1]:hover {
+ background-color: transparent;
+ }
+ label[for=accordion-1]:after {
+ content: "";
+ }
+ .omega-autofocus {
+ max-width: 400px;
+ }
+}
+/* Use @supports to sneak these rules past IE */
+@supports (grid-area: auto) {
+ @media screen and (min-width: 960px) {
+ #TopLeftHeader {
+ display: grid;
+ align-items: end;
+ grid-template-columns: auto auto;
+ grid-template-rows: auto auto;
+ grid-template-areas: "symbol logo"
+ "symbol dropdowns"
+ }
+ #SearchFrame {
+ grid-area: search;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
+ #DonationFrame {
+ grid-area: donation;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
+ body {
+ display: grid;
+ grid-template-columns: 320px 100px 300px 1fr;
+ grid-template-rows: minmax(1em, auto) minmax(1em, auto) 1fr minmax(1em, auto);
+ grid-template-areas: "header header search donation"
+ "rightside main main main"
+ "leftside main main main"
+ ". footer footer footer"
+ }
+ html {
+ scroll-padding-top: 64px;
+ }
+ }
+ @media screen and (min-width: 1440px) {
+ body {
+ display: grid;
+ grid-template-columns: 360px 100px 400px 400px 1fr;
+ grid-template-rows: 1fr minmax(1em, auto) minmax(1em, auto);
+ grid-template-areas: "header header search search donation"
+ "leftside main main main rightside"
+ ". footer footer footer ."
+ }
+ .donation {
+ max-width: 300px;
+ }
+ .rightside {
+ width: auto;
+ border-right: none;
+ }
+ }
+}
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-14 10:09:03 +0000