Merge lp:~widelands-dev/widelands-website/css_border into lp:widelands-website

[kaputtnik]

Use a css-border for the landing image

Not sure if we should use the 'round' property instead of 'repeat'. -> https://caniuse.com/#search=border-image

Some browsers don't support this feature.

Example image: https://i.ibb.co/S3k6WCc/landing-image-border.jpg

[GunChleoc (gunchleoc)]

According to that list, only Opera Mini and Blackberry don't support the "round" parameter, so I'd say the coverage is pretty good.

Screenshot looks good :)

review: Approve

[kaputtnik (franku)]

Thanks.

Merged and deployed.

=== modified file 'mainpage/static/css/base.css'
--- mainpage/static/css/base.css	2018-11-21 06:21:45 +0000
+++ mainpage/static/css/base.css	2019-04-15 21:29:55 +0000
@@ -409,6 +409,10 @@
 img.landing {
 	margin-left: 20px;
 	margin-bottom: 15px;
+	border: 10px solid transparent;
+	border-image: url(../img/image_border.png) 20 round;
+	-webkit-border-image: url(../img/image_border.png) 20 round; /* Safari 3.1-5 */
+	-o-border-image: url(../img/image_border.png) 20 round; /* Opera 11-12.1 */
 }
 
 div.blogEntry {
@@ -544,4 +548,4 @@
 		justify-content: center;
 		margin-bottom: 10px !important;
 	}
-}
\ No newline at end of file
+}

=== added file 'mainpage/static/img/image_border.png'
Binary files mainpage/static/img/image_border.png	1970-01-01 00:00:00 +0000 and mainpage/static/img/image_border.png	2019-04-15 21:29:55 +0000 differ