[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
www layout.css style.rtl.css
From: |
Therese Godefroy |
Subject: |
www layout.css style.rtl.css |
Date: |
Tue, 13 Sep 2016 09:06:53 +0000 (UTC) |
CVSROOT: /webcvs/www
Module name: www
Changes by: Therese Godefroy <th_g> 16/09/13 09:06:53
Modified files:
. : layout.css style.rtl.css
Log message:
Redefine .emph-box, .highlight(-para), .lyrics and .announcement to fix
rendering in NetSurf.
CVSWeb URLs:
http://web.cvs.savannah.gnu.org/viewcvs/www/layout.css?cvsroot=www&r1=1.211&r2=1.212
http://web.cvs.savannah.gnu.org/viewcvs/www/style.rtl.css?cvsroot=www&r1=1.12&r2=1.13
Patches:
Index: layout.css
===================================================================
RCS file: /webcvs/www/www/layout.css,v
retrieving revision 1.211
retrieving revision 1.212
diff -u -b -r1.211 -r1.212
--- layout.css 5 Sep 2016 08:24:16 -0000 1.211
+++ layout.css 13 Sep 2016 09:06:52 -0000 1.212
@@ -419,50 +419,70 @@
/*** NON-FLOATING INSETS AND HIGHLIGHTED STUFF ***/
-.emph-box {
- padding: .5em 1.2em;
- background-color: #f0f2f4;
- border: 1px solid #c9cccf;
-}
-.emph-box p { font-size: .9em }
-.emph-box h4 {
- text-align: center;
- font-size: 1.5em;
-}
-.highlight, .highlight-para {
- clear: both;
- margin-bottom: 1em;
- color: black;
-}
-.highlight {
-/* Please do not add borders. This style is applied to an in-line tag. */
- padding: .2em .5em;
- background-color: #fff898;
- border: 0;
-}
+/** WITH BACKGROUND **/
+
+/* NetSurf collapses the bottom border of the last element with that of its
+ parent div, even when the div has a padding or border.
+ To fix this, strip the bottom margin of <p> and <pre>. If another element
+ comes last, it may need a special clause. */
+div.highlight-para p, div.highlight-para pre, div.highlight-para ul,
+ div.emph-box p, div.emph-box pre, div.emph-box ul,
+ .lyrics p { margin-bottom: 0; }
+
+/* .highlight doesn't have a border. It can be applied to in-line elements.
+ .highlight-para and .emph-box have borders. They are used for block
elements.
+ highlight-para can be used next to .note or .summary because it only has top
+ and bottom borders. */
+
+div.highlight-para, div.emph-box { padding: .2em 1.2em 1.2em; }
+
+.highlight-para, p.highlight,
+ p.emph-box, pre.emph-box { padding: .6em 1.2em; }
+
+.highlight-para, .highlight { background-color: #ffc; }
+span.highlight { background-color: #fff898; }
.highlight-para {
- padding: 0 1.2em;
- background-color: #ffc;
- border: 2px solid #b9bcbf;
+ border-top: .1em solid #b9bcbf;
+ border-bottom: .1em solid #b9bcbf;
+}
+.emph-box, .lyrics {
+ background-color: #f0f2f4;
+ border: .1em solid #c9cccf;
}
.lyrics {
- background-color: #f0f2f4; font-style: italic; width: 25em;
- padding: 2em; border: 2px solid #e7e9eb;
- margin-left: 2em; margin-right: 2em;
+ max-width: 25em;
+ font-style: italic;
+ padding: 1em 2em 2em;
+ margin-left: 3%; margin-right: 3%;
}
-/* Announcements */
-div.announcement {
- font-size: 1.1em; font-weight: bold;
- padding: 0 1em;
+
+/** WITH LEFT BORDER **/
+
+.announcement blockquote { margin: 0; }
+
+.announcement {
+ font-size: 1.1em;
+ padding: .1em 1em .7em;
margin: 1.5em 0;
color: #333;
- border-left: .5em solid #b9bcbf;
-}
-div.announcement blockquote {
- margin-left: 0; margin-right: 0;
+ border-left: .3em solid #b9bcbf;
+ background: #f4f6f8;
+ background: linear-gradient(to right, #f0f2f4, white);
+}
+/* Currently, announcements contain <p>, <ul>, and <h3>, with p or
+ ul as last element. Try to make them NetSurf-friendly. */
+.announcement p { margin: .5em 0 0; }
+.announcement ul { margin: 0 1em; }
+.announcement ul li { margin-top: .5em; }
+.announcement h3 {
+ font-size: 1.3em;
+ margin: .4em 0;
}
+
+/** WITH NO BACKGROUND OR LEFT BORDER **/
+
/* Note about Free Software Free Society */
blockquote#fsfs p { padding: .3em 0; }
Index: style.rtl.css
===================================================================
RCS file: /webcvs/www/www/style.rtl.css,v
retrieving revision 1.12
retrieving revision 1.13
diff -u -b -r1.12 -r1.13
--- style.rtl.css 5 Sep 2016 08:24:29 -0000 1.12
+++ style.rtl.css 13 Sep 2016 09:06:52 -0000 1.13
@@ -39,9 +39,10 @@
#gnu-banner img {
margin-left: .4em;
}
-div.announcement {
+.announcement {
border-left: 0;
- border-right: .5em solid #b9bcbf;
+ border-right: .3em solid #b9bcbf;
+ background: linear-gradient(to left, #f0f2f4, white);
}
.note, div.summary {
clear: left;
- www layout.css style.rtl.css,
Therese Godefroy <=