added col banner

okfde · Jan 25, 2014 · 5611fd4 · 5611fd4
1 parent 306d50d
commit 5611fd4
Show file tree

Hide file tree

Showing 2 changed files with 168 additions and 0 deletions.
diff --git a/de/youtube/yt-banner-col.html b/de/youtube/yt-banner-col.html
@@ -0,0 +1,161 @@
+<html>
+ <head><meta charset="utf-8"></head>
+<body>
+ <style type="text/css">
+
+body, html {margin: 0; padding: 0;}
+
+#euCopyrightOriginal {
+ width: 150px;
+ height: 350px;
+ background-color: #121212;
+ text-shadow: black 1px 1px 0px;
+ font-family: "Helvetica Narrow","Arial Narrow",Tahoma,Arial,Helvetica,sans-serif;
+ font-size: 12px;
+ position: relative;
+ float: left;
+ background-image: -webkit-linear-gradient(#121212 0%,#383838 100%);
+ background-image: -moz-linear-gradient(#121212 0%,#383838 100%);
+ background-image: -ms-linear-gradient(#121212 0%,#383838 100%);
+ background-image: -o-linear-gradient(#121212 0%,#383838 100%);
+ background-image: linear-gradient(#121212 0%,#383838 100%);
+}
+
+#euCopyrightOriginal #euMain {
+ margin: 116px 11px 0 11px;
+ color: white;
+ font-size: 130%;
+}
+
+#euCopyrightOriginal a {
+ -webkit-transition: color 0.5s;
+ transition: color 0.5s;
+ font-size: 1.2em;
+ font-weight: bold;
+ display: inline-block;
+ margin-top: 21px;
+}
+
+#euCopyrightOriginal a:link {
+ color: #3773dd;
+ text-decoration: none;
+}
+
+#euCopyrightOriginal a:visited {
+ color: #3773dd;
+ text-decoration: none;
+}
+
+#euCopyrightOriginal a:focus {
+ color: #3773dd;
+ text-decoration: none;
+}
+
+#euCopyrightOriginal a:hover {
+ color: #3773dd;
+ text-decoration: underline;
+}
+
+#euCopyrightOriginal a:active {
+ color: #3773dd;
+ text-decoration: none;
+}
+
+#euCopyrightOriginal #euHead {
+ width: 107px;
+ height: 74px;
+ position: absolute;
+ top: 21px;
+ left: 21px;
+ background-color: #ef2b24;
+ background-image: -webkit-linear-gradient(#ef2b24 0%, #692124 100%);
+ background-image: -moz-linear-gradient(#ef2b24 0%, #692124 100%);
+ background-image: -ms-linear-gradient(#ef2b24 0%, #692124 100%);
+ background-image: -o-linear-gradient(#ef2b24 0%, #692124 100%);
+ background-image: linear-gradient(#ef2b24 0%, #692124 100%);
+ -webkit-border-radius: 17px;
+ -moz-border-radius: 17px;
+ -ms-border-radius: 17px;
+ -o-border-radius: 17px;
+ border-radius: 17px;
+ -webkit-transition: background 0.5s;
+ transition: background 0.5s;
+}
+
+#euCopyrightOriginal #euEyeL,#euCopyrightOriginal #euEyeR {
+ width: 14px;
+ height: 9px;
+ position: absolute;
+ background-color: white;
+ border-bottom: 1px solid #999999;
+ border-left: 1px solid #cccccc;
+ border-right: 1px solid #cccccc;
+ -webkit-border-radius: 6px;
+ -moz-border-radius: 6px;
+ -ms-border-radius: 6px;
+ -o-border-radius: 6px;
+ border-radius: 6px;
+ -webkit-transform: rotate(90deg);
+ -moz-transform: rotate(90deg);
+ -ms-transform: rotate(90deg);
+ -o-transform: rotate(90deg);
+ transform: rotate(90deg);
+}
+
+#euCopyrightOriginal #euEyeL {
+ top: 40px;
+ left: 55px;
+}
+
+#euCopyrightOriginal #euEyeR {
+ top: 40px;
+ left: 77px;
+}
+
+#euCopyrightOriginal #euMouth {
+ width: 42px;
+ height: 42px;
+ position: absolute;
+ top: 29px;
+ left: 49px;
+ border-bottom: 5px solid white;
+ -webkit-transform: rotate(-12deg);
+ -moz-transform: rotate(-12deg);
+ -ms-transform: rotate(-12deg);
+ -o-transform: rotate(-12deg);
+ transform: rotate(-12deg);
+ -webkit-transition: left 0.5s,-webkit-transform 0.5s;
+ transition: left 0.5s,transform 0.5s;
+}
+
+#euCopyrightOriginal:hover #euHead {
+ background-color: #24ef2b;
+ background-image: -webkit-linear-gradient(#24ef2b 0%, #246921 100%);
+ background-image: -moz-linear-gradient(#24ef2b 0%, #246921 100%);
+ background-image: -ms-linear-gradient(#24ef2b 0%, #246921 100%);
+ background-image: -o-linear-gradient(#24ef2b 0%, #246921 100%);
+ background-image: linear-gradient(#24ef2b 0%, #246921 100%);
+}
+
+#euCopyrightOriginal:hover #euMouth {
+ left: 53px;
+ -webkit-transform: rotate(0deg);
+ -moz-transform: rotate(0deg);
+ -ms-transform: rotate(0deg);
+ -o-transform: rotate(0deg);
+ transform: rotate(0deg);
+ -webkit-border-radius: 14px;
+ -moz-border-radius: 14px;
+ -ms-border-radius: 14px;
+ -o-border-radius: 14px;
+ border-radius: 14px;
+}
+
+#euCopyrightOriginal:hover a {
+ color: #24ef2b;
+}</style>
+ <div id='euCopyrightOriginal'><div id='euHead'></div><div id='euEyeL'></div><div id='euEyeR'></div><div id='euMouth'></div><div id='euMain'>Dieses Video leidet unter einem veralteten Urheberrecht und ist in deinem Land nicht verfügbar.<br><a href='http:https://youcan.fixcopyright.eu/de/youtube/' target="_top">Du kannst das ändern!</a></div></div>
+ <!-- End original size -->
+ <div style='clear:both;'></div>
+</body>
+</html>
diff --git a/de/youtube/yt-banner-info.html b/de/youtube/yt-banner-info.html
@@ -11,6 +11,13 @@ <h2>Kleines Banner (193x637):</h2>
 
 <iframe src="http:https://youcan.fixcopyright.eu/de/youtube/yt-banner-small.html" height="193" width="637" scrolling="no" frameborder="0"></iframe>
 
+<h2>Senkrechtess Banner (350x150):</h2>
+
+Code: <pre>&lt;iframe src="http:https://youcan.fixcopyright.eu/de/youtube/yt-banner-col.html"
+height="350" width="150" scrolling="no" frameborder="0"&gt;&lt;/iframe&gt;</pre>
+
+<iframe src="http:https://youcan.fixcopyright.eu/de/youtube/yt-banner-col.html" height="350" width="150" scrolling="no" frameborder="0"></iframe>
+
 <h2>Großes Banner (386x637):</h2>
 
 Code: <pre>&lt;iframe src="http:https://youcan.fixcopyright.eu/de/youtube/yt-banner.html"