[Xfce4-commits] [www/www.xfce.org] 23/29: CSS vendor prefixes; remove where not needed, add where required

noreply at xfce.org noreply at xfce.org
Sun May 21 22:01:05 CEST 2017


This is an automated email from the git hooks/post-receive script.

k   n   o   m   e       p   u   s   h   e   d       a       c   o   m   m   i   t       t   o       b   r   a   n   c   h       m   a   s   t   e   r   
   in repository www/www.xfce.org.

commit 3beef2e7a374375a67c9efd6982f40c7a77f703b
Author: Pasi Lallinaho <pasi at shimmerproject.org>
Date:   Fri May 19 00:34:07 2017 +0300

    CSS vendor prefixes; remove where not needed, add where required
---
 style/base.css                 | 40 ++++++++++++++-----
 style/frontpage.css            | 63 +++++++++++++++++++++++++-----
 style/img/orig/menu-button.svg | 89 ++++++++++++++++++++++++++++++++++++++++++
 style/mirrorbrain.css          | 20 ----------
 style/mobile.css               |  8 +++-
 5 files changed, 180 insertions(+), 40 deletions(-)

diff --git a/style/base.css b/style/base.css
index ff7c88a..ec40d41 100644
--- a/style/base.css
+++ b/style/base.css
@@ -115,9 +115,6 @@ dl dd {
 
 		color: #fff;
 		font-weight: bold;
-
-		-webkit-border-radius: 3px;
-		-moz-border-radius: 3px;
 		border-radius: 3px;
 	}
 		#mainnav-icon:hover, #mainnav-icon:active, #mainnav-icon:focus {
@@ -127,19 +124,19 @@ dl dd {
 
 	/* Content */
 	#content {
+		display: -webkit-box;
+		display: -ms-flexbox;
 		display: flex;
-		background-color: #fff;
 
+		background-color: #fff;
 		box-shadow: 0 0 3px rgba(0, 0, 0, .25);
-		-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .25);
-		-moz-box-shadow: 0 0 3px rgba(0, 0, 0, .25);
-
 		border-radius: 4px;
-		-moz-border-radius: 4px;
-		-webkit-border-radius: 4px;
 	}
 		#article {
+			-webkit-box-flex: 70;
+			-ms-flex: 70;
 			flex: 70;
+
 			padding: 2em;
 			border-right: 1px solid #ccc;
 			line-height: 1.7em;
@@ -149,7 +146,10 @@ dl dd {
 				margin-left: 3em;
 			}
 		#related {
+			-webkit-box-flex: 30;
+			-ms-flex: 30;
 			flex: 30;
+
 			max-width: 230px;
 			padding: 1em 1.5em;
 		}
@@ -185,12 +185,21 @@ dl dd {
 
 .newsitem {
 	clear: both;
+
+	display: -webkit-box;
+	display: -ms-flexbox;
 	display: flex;
+
+	-ms-flex-wrap: wrap;
 	flex-wrap: wrap;
+
 	padding-bottom: 1em;
 }
 	.newsitem .post-date {
+		-webkit-box-flex: 1;
+		-ms-flex: 1;
 		flex: 1;
+
 		min-width: 50px;
 		max-width: 50px;
 		order: 2;
@@ -225,13 +234,19 @@ dl dd {
 			}
 
 	.newsitem .post-wrap {
+		-webkit-box-flex: 80;
+		-ms-flex: 80;
 		flex: 80;
+
 		order: 3;
 		padding-left: 1.2em;
 	}
 		.newsitem h2,
 		.newsitem h3 {
+			-webkit-box-flex: 100;
+			-ms-flex: 100;
 			flex: 100;
+
 			order: 1;
 			min-width: 100%;
 			margin: 0 0 0.3em 0;
@@ -265,11 +280,18 @@ h1 + .rss {
 /* Grid for projects */
 
 div.grid {
+	display: -webkit-box;
+	display: -ms-flexbox;
 	display: flex;
+
+	-ms-flex-wrap: wrap;
 	flex-wrap: wrap;
 }
 	div.grid .item {
+		-webkit-box-flex: 50;
+		-ms-flex: 50;
 		flex: 50;
+
 		min-width: 45%;
 		margin-right: 2em;
 	}
diff --git a/style/frontpage.css b/style/frontpage.css
index 698b4cd..5673ddd 100644
--- a/style/frontpage.css
+++ b/style/frontpage.css
@@ -25,14 +25,24 @@
  */
 
 .frontpage_cols {
+	display: -webkit-box;
+	display: -ms-flexbox;
 	display: flex;
+
+	-ms-flex-wrap: wrap;
 	flex-wrap: wrap;
+
 	padding: 2em 0.5em;
 }
 	.frontpage_cols .column {
 		box-sizing: border-box;
 		margin: 0 1.5em;
+
+		-webkit-box-flex: 50;
+		-ms-flex: 50;
 		flex: 50;
+
+		max-width: 33%; /* try to be nice to midori */
 	}
 
 	.frontpage_cols .column h2 {
@@ -71,6 +81,8 @@
 			height: 400px;
 			text-align: center;
 
+			-webkit-transform: translateX(100%);
+			-ms-transform: translateX(100%);
 			transform: translateX(100%);
 
 			background-size: contain;
@@ -79,24 +91,61 @@
 			background-size: auto 400px;
 		}
 			#slide div:first-child {
+				-webkit-transform: translateX(0%);
+				-ms-transform: translateX(0%);
 				transform: translateX(0%);
 				z-index: 1000;
 			}
 			#slide .current {
+				-webkit-animation: slide-in 1s forwards;
 				animation: slide-in 1s forwards;
 			}
 			#slide .prev {
+				-webkit-animation: slide-out 1s forwards;
 				animation: slide-out 1s forwards;
 			}
 
 	/* Slide animations */
+	@-webkit-keyframes slide-in {
+		0% {
+			-webkit-transform: translateX(100%);
+			transform: translateX(100%);
+		}
+		100% {
+			-webkit-transform: translateX(0%);
+			transform: translateX(0%);
+		}
+	}
 	@keyframes slide-in {
-		0% { transform: translateX(100%); }
-		100% { transform: translateX(0%); }
+		0% {
+			-ms-transform: translateX(100%);
+			transform: translateX(100%);
+		}
+		100% {
+			-ms-transform: translateX(0%);
+			transform: translateX(0%);
+		}
+	}
+
+	@-webkit-keyframes slide-out {
+		0% {
+			-webkit-transform: translateX(0%);
+			transform: translateX(0%);
+		}
+		100% {
+			-webkit-transform: translateX(-100%);
+			transform: translateX(-100%);
+		}
 	}
 	@keyframes slide-out {
-		0% { transform: translateX(0%); }
-		100% { transform: translateX(-100%); }
+		0% {
+			-ms-transform: translateX(0%);
+			transform: translateX(0%);
+		}
+		100% {
+			-ms-transform: translateX(-100%);
+			transform: translateX(-100%);
+		}
 	}
 
 	/* Slide navigation */
@@ -117,13 +166,7 @@
 			background: #dcdcdc;
 
 			border-radius: 7px;
-			-moz-border-radius: 7px;
-			-webkit-border-radius: 7px;
-
 			transition: background 0.2s linear;
-			-moz-transition: background 0.2s linear;
-			-webkit-transition: background 0.2s linear;
-			-o-transition: background 0.2s linear;
 		}
 			#slidenav a:hover {
 				background: #bababa;
diff --git a/style/img/orig/menu-button.svg b/style/img/orig/menu-button.svg
new file mode 100644
index 0000000..bf32067
--- /dev/null
+++ b/style/img/orig/menu-button.svg
@@ -0,0 +1,89 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="20.000004"
+   height="15"
+   viewBox="0 0 20.000003 15"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="menu-button.svg"
+   inkscape:export-filename="/home/knome/menu-button.png"
+   inkscape:export-xdpi="90"
+   inkscape:export-ydpi="90">
+  <defs
+     id="defs4" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="16"
+     inkscape:cx="26.710327"
+     inkscape:cy="-4.2195996"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     units="px"
+     inkscape:window-width="1920"
+     inkscape:window-height="1152"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata7">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-177.08517,-502.36233)">
+    <path
+       style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:1.99999988;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 178.09941,504.36223 15.09816,0"
+       id="path8265"
+       inkscape:connector-curvature="0"
+       inkscape:export-filename="/home/knome/menu-button.png"
+       inkscape:export-xdpi="90"
+       inkscape:export-ydpi="90" />
+    <path
+       inkscape:connector-curvature="0"
+       id="path8267"
+       d="m 178.09941,510.36223 17.75235,0"
+       style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:1.99999952;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       inkscape:export-filename="/home/knome/menu-button.png"
+       inkscape:export-xdpi="90"
+       inkscape:export-ydpi="90" />
+    <path
+       style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:1.99999952;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 178.09941,516.36223 12.7933,0"
+       id="path8269"
+       inkscape:connector-curvature="0"
+       inkscape:export-filename="/home/knome/menu-button.png"
+       inkscape:export-xdpi="90"
+       inkscape:export-ydpi="90" />
+  </g>
+</svg>
diff --git a/style/mirrorbrain.css b/style/mirrorbrain.css
index 765298a..841660a 100644
--- a/style/mirrorbrain.css
+++ b/style/mirrorbrain.css
@@ -18,17 +18,11 @@ body {
 	padding: 2em;
 	background-color: #fff;
 	box-shadow: 0 0 3px rgba(0, 0, 0, .25);
-	-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .25);
-	-moz-box-shadow: 0 0 3px rgba(0, 0, 0, .25);
 	border-radius: 4px;
-	-moz-border-radius: 4px;
-	-webkit-border-radius: 4px;
 }
 
 #mirrorbrain-fileinfo {
 	border-radius: 4px;
-	-moz-border-radius: 4px;
-	-webkit-border-radius: 4px;
 	background-color: #eee;
 	border: 1px solid #ccc;
 	padding: 10px;
@@ -64,17 +58,9 @@ body {
 
 .mirrorbrain-btn {
 	background-color: rgba(18,127,210,1);
-	background-image: -webkit-linear-gradient(top, rgba(54,168,234,1) 0%,rgba(18,127,210,1) 100%);
-	background-image: -moz-linear-gradient(top, rgba(54,168,234,1) 0%,rgba(18,127,210,1) 100%);
-	background-image: -ms-linear-gradient(top, rgba(54,168,234,1) 0%,rgba(18,127,210,1) 100%);
-	background-image: -o-linear-gradient(top, rgba(54,168,234,1) 0%,rgba(18,127,210,1) 100%);
 	background-image: linear-gradient(top, rgba(54,168,234,1) 0%,rgba(18,127,210,1) 100%);
-	-webkit-box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 1px 0px 0px 0px rgba(255,255,255,0.4)inset, -1px 0px 0px 0px rgba(255,255,255,0.4)inset;
-	-moz-box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 1px 0px 0px 0px rgba(255,255,255,0.4)inset, -1px 0px 0px 0px rgba(255,255,255,0.4)inset;
 	box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 1px 0px 0px 0px rgba(255,255,255,0.4)inset, -1px 0px 0px 0px rgba(255,255,255,0.4)inset;
 	border: solid 1px rgba(3,94,163,1);
-	-webkit-border-radius: 6px;
-	-moz-border-radius: 6px;
 	border-radius: 6px;
 	text-shadow: 0px 1px 1px rgba(0,0,0,0.33);
 	padding: 8px;
@@ -82,13 +68,7 @@ body {
 	color: rgba(255,255,255,1);
 }
 .mirrorbrain-btn:hover {
-	background-image: -webkit-linear-gradient(top, rgba(47,144,213,1) 0%,rgba(3,81,183,1) 100%);
-	background-image: -moz-linear-gradient(top, rgba(47,144,213,1) 0%,rgba(3,81,183,1) 100%);
-	background-image: -ms-linear-gradient(top, rgba(47,144,213,1) 0%,rgba(3,81,183,1) 100%);
-	background-image: -o-linear-gradient(top, rgba(47,144,213,1) 0%,rgba(3,81,183,1) 100%);
 	background-image: linear-gradient(top, rgba(47,144,213,1) 0%,rgba(3,81,183,1) 100%);
-	-webkit-box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 0px -1px 0px 0px rgba(255,255,255,0.2)inset;
-	-moz-box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 0px -1px 0px 0px rgba(255,255,255,0.2)inset;
 	box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 0px -1px 0px 0px rgba(255,255,255,0.2)inset;
 	border: solid 1px rgba(0,52,129,1);
 	color: rgba(255,255,255,1);
diff --git a/style/mobile.css b/style/mobile.css
index 351bee6..457b007 100644
--- a/style/mobile.css
+++ b/style/mobile.css
@@ -1,4 +1,7 @@
 @media screen and (max-width: 1200px) {
+	.frontpage_cols .column {
+		max-width: 50%; /* try to be nice to midori */
+	}
 	.frontpage_cols .column:nth-child(3) {
 		min-width: 90%;
 	}
@@ -41,8 +44,10 @@
 				padding: 1.5em;
 			}
 			#related {
-				background-color: #eee;
+				background-color: #fafafa;
+				border-top: 1px solid #eee;
 				max-width: 100%;
+				padding-bottom: 1.5em;
 
 				border-bottom-right-radius: 4px;
 				border-bottom-left-radius: 4px;
@@ -144,6 +149,7 @@
 		padding: 1em 0 2em 0;
 	}
 		.frontpage_cols .column {
+			max-width: 100%; /* try to be nice to midori */
 			margin-bottom: 2em;
 		}
 

-- 
To stop receiving notification emails like this one, please contact
the administrator of this repository.


More information about the Xfce4-commits mailing list