Permalink
Browse files

clean up css on feed viewer

  • Loading branch information...
maxogden committed Apr 14, 2011
1 parent bafbacc commit 4757dbe986cdd44a3eed462a3674342f537c5fa6
@@ -6,6 +6,8 @@
<link rel="stylesheet" href="style/reset.css" media="screen">
<link rel="stylesheet" href="style/demo.css" media="screen">
<link rel="stylesheet" href="style/css3buttons.css" media="screen">
+ <link rel="stylesheet" href="style/monocles.css" type="text/css">
+ <link rel="stylesheet" href="style/jquery.cluetip.css" type="text/css">
<script type="text/javascript" src="script/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="script/jquery.mustache.js"></script>
<script type="text/javascript" src="script/jquery.cluetip.js"></script>
@@ -0,0 +1,247 @@
+/* global */
+#cluetip {
+ border: 3px solid #DDD;
+ -moz-border-radius: 5px;
+ -webkit-border-radius: 5px;
+ border-radius: 5px;
+}
+
+#cluetip-close img {
+ border: 0;
+}
+#cluetip-title {
+ overflow: hidden;
+}
+#cluetip-title #cluetip-close {
+ float: right;
+ position: relative;
+}
+#cluetip-waitimage {
+ width: 43px;
+ height: 11px;
+ position: absolute;
+}
+.cluetip-arrows {
+ display: none;
+ position: absolute;
+ top: 0;
+ left: -11px;
+ height: 22px;
+ width: 11px;
+ background-repeat: no-repeat;
+ background-position: 0 0;
+}
+#cluetip-extra {
+ display: none;
+}
+/***************************************
+ =cluetipClass: 'default'
+-------------------------------------- */
+
+.cluetip-default {
+ background-color: #DDD;
+}
+.cluetip-default #cluetip-outer {
+ position: relative;
+ margin: 0;
+ background-color: #FFF;
+ -moz-border-radius: 5px;
+ -webkit-border-radius: 5px;
+ border-radius: 5px;
+}
+.cluetip-default h3#cluetip-title {
+ margin: 0 0 5px;
+ padding: 8px 10px 4px;
+ font-size: 1.1em;
+ font-weight: normal;
+ background-color: #F6F6F6;
+ color: #019DBE;
+ -moz-border-radius: 5px;
+ -webkit-border-radius: 5px;
+ border-radius: 5px;
+}
+.cluetip-default #cluetip-title a {
+ color: #d9d9c2;
+ font-size: 0.95em;
+}
+.cluetip-default #cluetip-inner {
+ padding: 10px;
+ -moz-border-radius: 5px;
+ -webkit-border-radius: 5px;
+ border-radius: 5px;
+}
+.cluetip-default div#cluetip-close {
+ top: 5px;
+ right: 2px;
+ position: absolute;
+ margin: 0 5px 5px;
+ color: #900;
+}
+
+/* default arrows */
+
+.clue-right-default .cluetip-arrows {
+ background-image: url(images/darrowleft.gif);
+}
+.clue-left-default .cluetip-arrows {
+ background-image: url(images/darrowright.gif);
+ left: 100%;
+ margin-right: -11px;
+}
+.clue-top-default .cluetip-arrows {
+ background-image: url(images/darrowdown.gif);
+ top: 100%;
+ left: 50%;
+ margin-left: -11px;
+ height: 11px;
+ width: 22px;
+}
+.clue-bottom-default .cluetip-arrows {
+ background-image: url(images/darrowup.gif);
+ top: -11px;
+ left: 50%;
+ margin-left: -11px;
+ height: 11px;
+ width: 22px;
+}
+
+/***************************************
+ =cluetipClass: 'jtip'
+-------------------------------------- */
+.cluetip-jtip {
+ background-color: transparent;
+}
+.cluetip-jtip #cluetip-outer {
+ border: 2px solid #ccc;
+ position: relative;
+ background-color: #fff;
+}
+
+.cluetip-jtip h3#cluetip-title {
+ margin: 0 0 5px;
+ padding: 2px 5px;
+ font-size: 16px;
+ font-weight: normal;
+ background-color: #ccc;
+ color: #333;
+}
+
+.cluetip-jtip #cluetip-inner {
+ padding: 0 5px 5px;
+ display: inline-block;
+}
+.cluetip-jtip div#cluetip-close {
+ text-align: right;
+ margin: 0 5px 5px;
+ color: #900;
+}
+
+/* jtip arrows */
+
+.clue-right-jtip .cluetip-arrows {
+ background-image: url(images/arrowleft.gif);
+}
+.clue-left-jtip .cluetip-arrows {
+ background-image: url(images/arrowright.gif);
+ left: 100%;
+ margin-right: -11px;
+}
+.clue-top-jtip .cluetip-arrows {
+ background-image: url(images/arrowdown.gif);
+ top: 100%;
+ left: 50%;
+ margin-left: -11px;
+ height: 11px;
+ width: 22px;
+}
+.clue-bottom-jtip .cluetip-arrows {
+ background-image: url(images/arrowup.gif);
+ top: -11px;
+ left: 50%;
+ margin-left: -11px;
+ height: 11px;
+ width: 22px;
+}
+
+/***************************************
+ =cluetipClass: 'rounded'
+-------------------------------------- */
+
+.cluetip-rounded {
+ background: transparent url(images/bl.gif) no-repeat 0 100%;
+ margin-top: 10px;
+ margin-left: 12px;
+}
+
+.cluetip-rounded #cluetip-outer {
+ background: transparent url(images/tl.gif) no-repeat 0 0;
+ margin-top: -12px;
+}
+
+.cluetip-rounded #cluetip-title {
+ background-color: transparent;
+ padding: 12px 12px 0;
+ margin: 0 -12px 0 0;
+ position: relative;
+}
+.cluetip-rounded #cluetip-extra {
+ position: absolute;
+ display: block;
+ background: transparent url(images/tr.gif) no-repeat 100% 0;
+ top: 0;
+ right: 0;
+ width: 12px;
+ height: 30px;
+ margin: -12px -12px 0 0;
+}
+.cluetip-rounded #cluetip-inner {
+ background: url(images/br.gif) no-repeat 100% 100%;
+ padding: 5px 12px 12px;
+ margin: -18px -12px 0 0;
+ position: relative;
+}
+
+.cluetip-rounded div#cluetip-close {
+ text-align: right;
+ margin: 0 5px 5px;
+ color: #009;
+ background: transparent;
+}
+.cluetip-rounded div#cluetip-close a {
+ color: #777;
+}
+
+/* rounded arrows */
+
+.clue-right-rounded .cluetip-arrows {
+ background-image: url(images/rarrowleft.gif);
+}
+.clue-left-rounded .cluetip-arrows {
+ background-image: url(images/rarrowright.gif);
+ left: 100%;
+ margin-left: 12px;
+}
+.clue-top-rounded .cluetip-arrows {
+ background-image: url(images/rarrowdown.gif);
+ top: 100%;
+ left: 50%;
+ margin-left: -11px;
+ height: 11px;
+ width: 22px;
+}
+.clue-bottom-rounded .cluetip-arrows {
+ background-image: url(images/rarrowup.gif);
+ top: -23px;
+ left: 50%;
+ margin-left: -11px;
+ height: 11px;
+ width: 22px;
+}
+
+
+
+/* stupid IE6 HasLayout hack */
+.cluetip-rounded #cluetip-title,
+.cluetip-rounded #cluetip-inner {
+ zoom: 1;
+}
Oops, something went wrong.

0 comments on commit 4757dbe

Please sign in to comment.