Переглянути джерело

this is so broken. the ribbon will never work in IE

raylu 14 роки тому
батько
коміт
2d2842845b
2 змінених файлів з 14 додано та 92 видалено
  1. 8 6
      views/layouts/default.html.php
  2. 6 86
      webroot/css/ribbon.css

+ 8 - 6
views/layouts/default.html.php

@@ -6,18 +6,20 @@ use \lithium\security\Auth;
 <head>
 	<?= $this->html->charset(); ?>
 	<title>OtakuHub<?php $title = $this->title(); if ($title) echo " > $title" ?></title>
-	<?= $this->html->style(array('style', 'base')) ?>
+	<?= $this->html->style('style') ?>
+	<?= $this->html->style('base') ?>
 	<?= $this->html->style('themes/light') ?>
 	<?= $this->html->style('ribbon'); ?>
 	<?= $this->html->style('jquery.fancybox-1.3.4') ?>
 	<?= $this->html->style('http://fonts.googleapis.com/css?family=Cantarell:regular,bold&amp;v1') ?>
 	<?= $this->styles(); ?>
 </head>
-<div class="right ribbon-holder">
-        <a href="http://github.com/jbalogh" class="orange ribbon">
-          <span class="text"><?= lithium\core\Environment::is('development') ? "Development" : "Production" ?></span>
-        </a>
-      </div>
+<body>
+<aside id="ribbon">
+	<a href="http://github.com/jbalogh">
+		<?= lithium\core\Environment::is('development') ? "Development" : "Production" ?>
+	</a>
+</aside>
 <header>
 	<?php
 	$links = array(

+ 6 - 86
webroot/css/ribbon.css

@@ -1,109 +1,29 @@
-.ribbon-holder {
+#ribbon {
   position: absolute;
   top: 0;
   overflow: hidden;
   height: 10em;
-}
-
-.right.ribbon-holder {
   right: 0;
 }
 
-.left.ribbon-holder {
-  left: 0;
-}
-
-.ribbon,
-.ribbon:hover {
-  text-decoration: none;
-}
-
-.ribbon {
+#ribbon a {
   letter-spacing: -.1px;
   opacity: 0.95;
 
-  padding: 0.25em 0;
   position: relative;
   top: 2.5em;
+  right: -2.6em;
+  padding: 0.1em 3em;
 
-  /* Defaults friendly for white pages. */
   -moz-box-shadow: 0 0 13px #888;
   -webkit-box-shadow: 0 0 13px #888;
   color: #FFF;
   display: block;
   line-height: 1.35em;
-}
+  border: 1px solid #ebaa65;
 
-.ribbon .text {
-  padding: 0.1em 3em;
-}
+  background-color: #e57504;
 
-.right .ribbon {
   -moz-transform: rotate(45deg);
   -webkit-transform: rotate(45deg);
-  right: -2.6em;
-}
-
-.left .ribbon {
-  -moz-transform: rotate(-45deg);
-  -webkit-transform: rotate(-45deg);
-  left: -2.6em;
-}
-
-.white.ribbon {
-  color: #111;
-  background-color: #F5F5F5;
-  background: -webkit-gradient(linear, left bottom, left top, from(#f3f3f3), to(#fff));
-  -moz-box-shadow: 0 0 13px #999;
-  -webkit-box-shadow: 0 0 13px #999;
-  text-shadow: 0 0 .05em;
-}
-
-.white.ribbon .text {
-  border: 1px solid #cecece;
-}
-
-.red.ribbon {
-  background-color: #9a0000;
-  background: -webkit-gradient(linear, left bottom, left top, from(#9a0000), to(#a90000));
-}
-
-.red.ribbon .text {
-  border: 1px solid #bf6060;
-}
-
-.green.ribbon {
-  background-color: #006e00;
-  background: -webkit-gradient(linear, left bottom, left top, from(#006e00), to(#007200));
-}
-
-.green.ribbon .text {
-  border: 1px solid #6bac6b;
-}
-
-.darkblue.ribbon {
-  background-color: #121621;
-  color: #ecedee;
-}
-
-.darkblue.ribbon .text {
-  border: 1px solid #53565e;
-}
-
-.orange.ribbon {
-  background-color: #E57504;
-  background: -webkit-gradient(linear, left bottom, left top, from(#dc7202), to(#ee7906));
-}
-
-.orange.ribbon .text {
-  border: 1px solid #ebaa65;
-}
-
-.gray.ribbon {
-  background-color: #6d6d6d;
-  background: -webkit-gradient(linear, left bottom, left top, from(#6a6a6a) to(#6d6d6d));
-}
-
-.gray.ribbon .text {
-  border: 1px solid #a4a4a4;
 }