Upgrade to ExtJS 4.0.0 - Released 04/26/2011

[extjs.git] / examples / charts / TipsChart.html
diff --git a/examples/charts/TipsChart.html b/examples/charts/TipsChart.html

new file mode 100644 (file)

index 0000000..a30d0fe
--- /dev/null
+++ b/examples/charts/TipsChart.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
+    <title>Charts</title>
+    <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
+    <link rel="stylesheet" type="text/css" href="../shared/example.css" />
+    <style>
+        .x-tip {
+        background-color: #fff;
+        border-radius: 0.5em;
+        -moz-border-radius: 0.5em;
+        -webkit-border-radius: 0.5em;
+        border-radius: 0.5em;
+        border: 1px solid rgba(134, 84, 41, 0.5);
+        opacity: 0.95;
+    }
+    .x-tip-header {
+        margin-bottom: 5px;
+    }
+    .x-tip .x-panel .x-panel-body.x-layout-fit {
+        border: none;
+    }
+    .x-tip .x-panel.x-grid-section.x-panel-noborder.x-fit-item {
+        margin: 0;
+    }
+    .x-tip .x-panel.x-box-item {
+        top: 0 !important;
+    }
+    .x-tip-header-body .x-component.x-box-item {
+        width: 100%;
+        text-align: center;
+    }
+    .x-tip-body {
+        text-shadow: none;
+    }
+    .x-panel {
+            margin: 20px;
+        }
+    ul {
+        margin-left: 10px;
+    }
+    ul li {
+        display: block;
+        font-weight: normal;
+        color: #444;
+        padding: 2px;
+    }
+    h1 {
+        font-size: 18px;
+        margin: 10px;
+    }
+    </style>
+    <script type="text/javascript" src="../../bootstrap.js"></script>
+    <script type="text/javascript" src="../example-data.js"></script>
+    <script type="text/javascript" src="TipsChart.js"></script>
+</head>
+    <body id="docbody">
+    <h1>Chart in tips example</h1>
+    <div style="margin: 10px;">
+        Showing a Pie Chart and a Grid Panel as elements in a tooltip. <a href="TipsChart.js">View Source</a>
+    </div>
+    </body>
+</html>