Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Unified Diff: static/poland/css/main.css

Issue 29800606: Fixes #91 - Homepage duplicate in Polish for SEM (Closed) Base URL: https://hg.adblockplus.org/web.adblockplus.org
Patch Set: Addressed comments #3 Created June 8, 2018, 6:26 p.m.
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « static/poland/css/index.css ('k') | static/poland/img/abb-logo.png » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: static/poland/css/main.css
===================================================================
new file mode 100644
--- /dev/null
+++ b/static/poland/css/main.css
@@ -0,0 +1,900 @@
+body
+{
+ font-family: "Source Sans Pro", Arial, sans-serif;
+ margin: 0;
+ /* Start below fixed navbar */
+ padding-top: 4em;
+ line-height: 1.5;
+}
+
+#content,
+#blog
+{
+ padding-bottom: 2em;
+}
+
+a img
+{
+ border: none;
+}
+
+a:link, a:visited
+{
+ color: #555;
+}
+
+button
+{
+ cursor: pointer;
+}
+
+code, pre
+{
+ font-family: monospace;
+}
+
+pre
+{
+ background: #ececec;
+ padding: 1em;
+ overflow: auto;
+}
+
+.sprite
+{
+ display: inline-block;
+ font-size: 0px; /* fix for IE6 height bug */
+ background-image: url(../img/sprite-main.png);
+ background-repeat: no-repeat;
+}
+
+.toc
+{
+ display: inline-block;
+ border: 1px solid #aaa;
+ background: #fff;
+ padding: 16px 20px;
+}
+
+.toc ul
+{
+ list-style: none;
+ margin: 0;
+ padding: 0;
+}
+
+.toc ul ul
+{
+ padding-left: 40px;
+}
+
+.toc li
+{
+ margin: 4px 0;
+}
+
+#social-list ul
+{
+ list-style: none;
+ padding: 0;
+ margin: 0;
+}
+
+div.animation[started="false"]:before
+{
+ content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPBAMAAADJ%2BIh5AAAAFVBMVEUAgAAAgAD%2F%2F%2F%2Fr9uvY7Ni%2B376h0aGeNpcsAAAAAXRSTlNtc%2BXFgwAAADVJREFUeF5dzVEKACAMAlC7QW6t%2F7r%2FIYOBEPr1GOgw2AHiduaHkwKXwBK4BYZdylrpy4K%2BP%2Fu5C1CVKVSzAAAAAElFTkSuQmCC);
+ padding-left: 0px;
+ padding-right: 3px;
+}
+
+html[dir="rtl"] div.animation[started="false"]:before
+{
+ padding-left: 3px;
+ padding-right: 0px;
+}
+
+div.animation[started="false"]
+{
+ cursor: pointer;
+}
+
+div.animation[started="true"]
+{
+ box-sizing: initial;
+ -moz-user-select: none;
+}
+
+.animation img
+{
+ max-width: none;
+}
+
+.alert
+{
+ display: block;
+ padding: 15px;
+ margin: 15px 0;
+ background-color: #fff;
+ border: 1px solid #a1a1a1;
+}
+
+[dir="ltr"] .alert
+{
+ border-left: 5px solid #d14841;
+}
+
+[dir="rtl"] .alert
+{
+ border-right: 5px solid #d14841;
+}
+
+/******************************************************************************
+ * .section
+ *****************************************************************************/
+
+.section
+{
+ padding: 2em 0;
+}
+
+/******************************************************************************
+ * .content
+ *****************************************************************************/
+
+.content h1,
+.content .h1,
+.content h2,
+.content h3,
+.content h4,
+.content h5
+{
+ font-weight: bold;
+ margin: 32px 0 16px 0;
+ margin: 2rem 0 1rem 0;
+ line-height: 1.4;
+}
+
+.content h1,
+.content .h1 { font-size: 1.4em; }
+.content h2 { font-size: 1.3em; }
+.content h3 { font-size: 1.2em; }
+.content h4 { font-size: 1.1em; }
+.content h5 { font-size: 1em; }
+
+@media(min-width: 576px)
+{
+ .content h1,
+ .content .h1 { font-size: 1.6em; }
+ .content h2 { font-size: 1.4em; }
+ .content h3 { font-size: 1.3em; }
+ .content h4 { font-size: 1.2em; }
+ .content h5 { font-size: 1.1em; }
+}
+
+@media(min-width: 768px)
+{
+ .content h1,
+ .content .h1
+ {
+ font-size: 2.4em;
+ line-height: 1.3;
+ }
+
+ .content h2 { font-size: 1.6em; }
+}
+
+.content a,
+.content a:visited
+{
+ color: #c70d2c;
+}
+
+/* Buttons
+ ******************************************************************************/
+
+.button
+{
+ padding: 0.5em 2em;
+ border: none;
+ text-align: center;
+}
+
+.button:hover,
+.button:active,
+.button:focus
+{
+ text-decoration: none;
+}
+
+@media(max-width: 767px)
+{
+ .button
+ {
+ display: block;
+ width: 100%;
+ }
+}
+
+.button.primary
+{
+ color: #fff !important;
+ background-color: #c70d2c !important;
+ box-shadow: 0px 2px 5px #95989A;
+}
+
+.button.primary:hover
+{
+ background-color: #E00F32 !important;
+}
+
+.button.primary:active
+{
+ background-color: #AD102A !important;
+}
+
+.button.accent,
+.button.accent:visited
+{
+ background: #077CA6 !important;
+ color: #fff !important;
+ margin-left: 2px;
+ margin-right: 2px;
+}
+
+.button.accent:hover,
+.button.accent:active,
+.button.accent:focus
+{
+ box-shadow: inset 0 0 0 3px #005D80;
+}
+
+/*******************************************************************************
+ * .fg-* utilities
+ ******************************************************************************/
+
+.fg-accent
+{
+ color: #077CA6;
+}
+
+.bg-secondary
+{
+ color: #000;
+ background-color: #F4F4F4;
+}
+
+/*******************************************************************************
+ * #navbar
+ ******************************************************************************/
+
+ #navbar
+{
+ min-height: 4em;
+ background-color: #c70d2c;
+ position: fixed;
+ z-index: 2;
+ width: 100%;
+ top: 0;
+ transition: top 0.2s ease-in-out;
+}
+
+@media(max-width: 991px)
+{
+ #navbar
+ {
+ overflow: auto;
+ }
+}
+
+#navbar li
+{
+ list-style-type: none;
+}
+
+#navbar .container
+{
+ padding-left: 0;
+ padding-right: 0;
+}
+
+/* #navbar #navbar-logo
+ ******************************************************************************/
+
+#navbar-logo
+{
+ /* padding is visible in hover background-color change */
+ padding: 0em 1em;
+ color: #fff;
+}
+
+#navbar-logo:hover,
+#navbar-logo:active,
+#navbar-logo:focus
+{
+ background-color: #AE0013;
+ text-decoration: none;
+}
+
+#navbar-logo,
+#navbar-logo > *
+{
+ float: left;
+}
+
+[dir="rtl"] #navbar-logo,
+[dir="rtl"] #navbar-logo > *
+{
+ float: right;
+}
+
+#navbar-logo img
+{
+ height: 4em;
+ padding: 0.5em 0em;
+ margin: 0em 1em 0em 0em;
+}
+
+[dir="rtl"] #navbar-logo > img
+{
+ margin: 0em 0em 0em 1em;
+}
+
+#navbar-logo > span
+{
+ /* full-height: 2.91 * 1.375 = ~4em */
+ line-height: 2.91em;
+ font-size: 1.375em;
+}
+
+/* #navbar #navbar-menu-toggle
+ ******************************************************************************/
+
+#navbar-menu-toggle
+{
+ float: right;
+ padding: 1em;
+}
+
+[dir="rtl"] #navbar-menu-toggle
+{
+ float: left;
+}
+
+/* show on mobile */
+#navbar-menu-toggle,
+#navbar-menu-toggle > img
+{
+ display: block;
+}
+
+/* hide on desktop */
+@media(min-width: 992px)
+{
+ #navbar-menu-toggle
+ {
+ display: none;
+ }
+}
+
+#navbar-menu-toggle > img
+{
+ /* plus 2em padding = 4em */
+ height: 2em;
+}
+
+#navbar-menu-toggle:hover,
+#navbar-menu-toggle:active,
+#navbar-menu-toggle:focus
+{
+ background-color: #AE0013;
+}
+
+/* #navbar #navbar-menu
+ ******************************************************************************/
+
+#navbar-menu a
+{
+ display: block;
+ color: #fff;
+ text-decoration: none;
+}
+
+/* #navbar #navbar-menu #navbar-locale-menu
+ ******************************************************************************/
+
+/* caret */
+#navbar-locale-selected:after
+{
+ display: inline-block;
+ width: 0;
+ height: 0;
+ margin: 0em 0em 0em 0.255em;
+ vertical-align: .255em;
+ content: "";
+ border-top: .3em solid;
+ border-right: .3em solid transparent;
+ border-left: .3em solid transparent;
+}
+
+[dir="rtl"] #navbar-locale-selected:after
+{
+ margin: 0em 0.255em 0em 0em;
+}
+
+#navbar-locale-menu
+{
+ display: none;
+}
+
+#navbar-locale-menu.visible
+{
+ display: block;
+}
+
+#navbar-locale-menu > li > a
+{
+ padding: 0.75em 1em;
+}
+
+#navbar-locale-menu > li > a:hover,
+#navbar-locale-menu > li > a:active,
+#navbar-locale-menu > li > a:focus
+{
+ background-color: #434343;
+}
+
+/* #navbar #navbar-menu (desktop)
+ ******************************************************************************/
+
+@media(min-width: 992px)
+{
+ #navbar-menu
+ {
+ float: right;
+ }
+
+ [dir="rtl"] #navbar-menu
+ {
+ float: left;
+ }
+
+ #navbar-menu > li,
+ #navbar-menu > li > a
+ {
+ display: inline-block;
+ }
+
+ #navbar-menu > li > a
+ {
+ padding: 0em 1em;
+ line-height: 4em;
+ }
+
+ #navbar-menu > li > a:hover,
+ #navbar-menu > li > a:active,
+ #navbar-menu > li > a:focus
+ {
+ background-color: #AE0013;
+ }
+
+ /* #navbar #navbar-menu #navbar-locale-menu
+ ****************************************************************************/
+
+ #navbar-locale-menubar
+ {
+ position: relative;
+ }
+
+ #navbar-locale-menu
+ {
+ position: absolute;
+ min-width: 16em;
+ max-height: 20em;
+ max-height: 50vh;
+ top: 100%;
+ right: 0px;
+ overflow: auto;
+ z-index: 9001;
+ background-color: #292929;
+ }
+
+ [dir="rtl"] #navbar-locale-menu
+ {
+ right: auto;
+ left: 0px;
+ }
+}
+
+/* #navbar #navbar-menu (mobile)
+ ******************************************************************************/
+
+@media(max-width: 991px)
+{
+ #navbar-menu
+ {
+ display: none;
+ float: left;
+ clear: both;
+ width: 100%;
+ background-color: #292929;
+ overflow-y: scroll;
+ max-height: 416px;
+ max-height: 80vh;
+ }
+
+ #navbar-menu.visible
+ {
+ display: block;
+ }
+
+ #navbar-menu li a
+ {
+ padding: 0.75em 1em;
+ }
+
+ #navbar-menu li a:hover,
+ #navbar-menu li a:active,
+ #navbar-menu li a:focus
+ {
+ background-color: #434343;
+ }
+}
+
+/*******************************************************************************
+ * #footer
+ ******************************************************************************/
+
+#footer
+{
+ overflow: auto;
+ padding: 2em 0em;
+ color: #ececec;
+ background-color: #292929;
+ font-size: 0.9em;
+}
+
+/* #footer body
+ ******************************************************************************/
+
+#footer h5
+{
+ margin-top: 1em;
+ margin-bottom: 1.5em;
+}
+
+#footer h5:after
+{
+ content: "";
+ display: block;
+ width: 1.25em;
+ height: 0.125em;
+ margin-top: 0.5em;
+ background-color: #ececec;
+}
+
+#footer ul
+{
+ padding: 0em;
+ list-style-type: none;
+}
+
+#footer a
+{
+ color: #ececec;
+}
+
+#footer a:hover,
+#footer a:active,
+#footer a:focus
+{
+ color: #fff;
+ text-decoration: underline;
+}
+
+/* #footer #social-list
+ ******************************************************************************/
+
+#social-list ul
+{
+ /* negative margin canceled out by li margin below */
+ margin: 0em -0.375em;
+}
+
+#social-list li
+{
+ float: left;
+ margin: 0em 0.375em;
+}
+
+[dir="rtl"] #social-list li
+{
+ float: right;
+}
+
+#social-list img
+{
+ height: 2em;
+}
+
+@media(min-width: 1200px)
+{
+ #social-list img
+ {
+ height: 3em;
+ }
+}
+
+/* #footer #footer-legal
+ ******************************************************************************/
+
+#footer-legal
+{
+ margin-top: 1em;
+}
+
+@media(min-width: 1200px)
+{
+ #footer-legal
+ {
+ margin-top: 2em;
+ }
+}
+
+/* #footer #footer-legal #legal-list
+ ******************************************************************************/
+
+#legal-list li
+{
+ float: left;
+}
+
+[dir="rtl"] #legal-list li
+{
+ float: right;
+}
+
+#legal-list li:after
+{
+ margin: 0em 0.375em;
+}
+
+/* IE9+ only */
+#legal-list li::after
+{
+ content: "|"
+}
+
+#legal-list li:last-of-type::after
+{
+ content: none;
+}
+
+/* float copyright and legal links left and right on ~desktop */
+@media(min-width: 1200px)
+{
+ #copyright-notice
+ {
+ float: left;
+ }
+
+ [dir="rtl"] #copyright-notice
+ {
+ float: right;
+ }
+
+ #legal-list
+ {
+ float: right;
+ }
+
+ [dir="rtl"] #legal-list
+ {
+ float: left;
+ }
+}
+
+/* hide all footer links except #social-list on ~mobile */
+@media(max-width: 767px)
+{
+ #footer .column
+ {
+ display: none;
+ }
+
+ /* overriding display:none above */
+ #footer #social-list
+ {
+ display: block;
+ }
+}
+
+/* Video
+ ****************************************************************************/
+
+.video-parent
+{
+ position: relative;
+ display: block;
+ width: 100%;
+ padding: 0;
+ border: 1px solid #c9c9c9;
+ box-shadow: 1px 1px 0 0 #dbdbdb;
+ overflow: hidden;
+}
+
+.video-parent.has-iframe::before
+{
+ display: block;
+ content: "";
+ padding-top: 56.25%;
+}
+
+.video-parent iframe
+{
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ border: 0;
+}
+
+.video-link
+{
+ display: block;
+ position: relative;
+}
+
+.video-thumbnail
+{
+ width: 100%;
+ transition: opacity 0.8s;
+ opacity: 0.2;
+}
+
+.hide-disclaimer .video-thumbnail
+{
+ opacity: 1;
+}
+
+.video-disclaimer
+{
+ visibility: visible;
+ opacity: 1;
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ padding: 1em;
+ background-color: #fff;
+ font-size: 0.9em;
+ text-align: center;
+ transition: opacity 0.8s;
+}
+
+.hide-disclaimer .video-disclaimer
+{
+ visibility: hidden;
+ opacity: 0;
+}
+
+.video-play
+{
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ width: 80px;
+ margin-top: -60px;
+ margin-left: -40px;
+}
+
+.hide-disclaimer .video-play
+{
+ margin-top: -40px;
+}
+
+/******************************************************************************
+ * .item-group
+ *****************************************************************************/
+
+.item-group
+{
+ text-align: center;
+ padding-top: 3em;
+ padding-bottom: 3em;
+}
+
+.item-group img
+{
+ height: 5em;
+ width: auto;
+}
+
+.item-group h2
+{
+ text-transform: uppercase;
+}
+
+@media (max-width: 575px)
+{
+ .item-group .column
+ {
+ margin-bottom: 3em;
+ }
+
+ .item-group .column:last-of-type
+ {
+ margin-bottom: 0;
+ }
+}
+
+@media (min-width: 576px) and (max-width: 1023px)
+{
+ .item-group
+ {
+ text-align: left;
+ }
+
+ [dir="rtl"] .item-group
+ {
+ text-align: right;
+ }
+
+ .item-group .column
+ {
+ position: relative;
+ width: auto;
+ padding: 0 3em 2em 10.5em;
+ min-height: 7em; /* Height of image plus 2em bottom padding */
+ }
+
+ [dir="rtl"] .item-group .column
+ {
+ padding: 0 10.5em 2em 3em;
+ }
+
+ .item-group .column:last-of-type
+ {
+ padding-bottom: 0;
+ min-height: 6em; /* Height of image */
+ }
+
+ .item-group img
+ {
+ position: absolute;
+ left: 3em;
+ top: 0.5em;
+ }
+
+ [dir="rtl"] .item-group img
+ {
+ left: auto;
+ right: 3em;
+ }
+
+ .item-group h2
+ {
+ margin: 0;
+ }
+}
+
+/* Horizontal List
+ ******************************************************************************/
+
+.horizontal-list
+{
+ display: inline;
+ list-style: none;
+}
+
+.horizontal-list,
+.content .horizontal-list
+{
+ padding: 0;
+}
+
+.horizontal-list li
+{
+ display: inline;
+ list-style: none;
+}
« no previous file with comments | « static/poland/css/index.css ('k') | static/poland/img/abb-logo.png » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld