initial commit

Author: planetapex

README.md

@@ -0,0 +1,29 @@
+
+# Oracle APEX Region Type Plugin - KPI Numeric Card
+
+Region type plugin for displaying responsive kpi numeric cards. Fully customizable, including coloring, font-size to display target metric in your own custom styles.
+
+
+
+## Documentation
+
+In progress. Checkout the Demo Application mentioned below.
+
+## Donate
+
+[![Donate](https://img.shields.io/badge/Donate-PayPal-green.svg)](https://www.paypal.me/MYasirAliShah/4)
+
+## Changelog
+
+#### 1.0 - Initial Release
+
+
+## Install
+- Import plugin file "region_type_plugin_com_planetapex_kpi_numeric_cards.sql" from source directory into your application
+- (Optional) Deploy the CSS/JS files from "src" directory on your webserver and change the "File Prefix" to webservers folder.
+
+## Preview
+![Oracle Apex Plugin KPI Numeric Card](assets/kpiNumericCard.png "KPI Numeric Card")
+
+## Demo Application
+[KPI Numeric Card Application](https://apex.oracle.com/pls/apex/f?p=83009:50 "KPI Numeric Card Homepage")

apexplugin.json

@@ -0,0 +1,38 @@
+{
+    "name": "KPI Numeric Card",
+    "version": "1.0",
+    "private": "N",
+    "description": "Region type plugin for displaying responsive kpi numeric cards",
+    "keywords": ["oracle", "apex", "plugin", "AJAX", "PPR", "region", "card", "performance", "responsive","kpi"],
+    "homepage": "https://github.com/planetapex/apex-plugin-kpiNumericCard",
+    "bugs": {
+        "url": "https://github.com/planetapex/apex-plugin-kpiNumericCard/issues",
+        "email": "yasirali.wizerp@gmail.com"
+    },
+    "license": "MIT",
+    "author": {
+        "name": "M.Yasir Ali Shah",
+        "email": "yasirali.wizerp@gmail.com",
+        "url": "http://apexfusion.blogspot.com/2017/07/oracle-apex-plugin-kpi-numeric-cards.html",
+        "twitter": "m_yasir_ali",
+        "linkedin": "https://www.linkedin.com/in/myasiralishah/",
+        "donationUrl": "https://www.paypal.me/MYasirAliShah/4"
+    },
+    "repository": {
+        "type": "git",
+        "url": "https://github.com/planetapex/apex-plugin-kpiNumericCard.git"
+    },
+    "private": false,
+    "oracle": {
+        "versions": ["11.2.0.1", "12.1.0.1"],
+        "apex": {
+            "versions": ["5.0.0", "5.1.0"],
+            "plugin": {
+                "internalName": "COM.PLANETAPEX.KPI_NUMERIC_CARDS",
+                "type": "region",
+                "demo": "https://apex.oracle.com/pls/apex/f?p=83009:50",
+                "previewImage": "https://raw.githubusercontent.com/planetapex/apex-plugin-kpiNumericCard/master/assets/kpiNumericCard.png"
+            }
+        }
+    }
+}

assets/kpiNumericCard.png

@@ -0,0 +1,116 @@
+@font-face {
+    font-family: KPIWidget;
+    src: url('fonts/Gotham-Medium.otf');
+}
+
+@font-face {
+    font-family: KPIWidgetNumber;
+    src: url('fonts/PT_DIN_Condensed_Cyrillic.ttf');
+}
+
+.kpi-container-div {
+    display: table;
+}
+
+.kpi-item {
+    display: table-cell;
+    padding-left: 13px;
+}
+
+.kpi-title {
+    /*background-color: #f4f4f4;*/
+    box-shadow: inset 0 -5px 20px rgba(0, 0, 0, .05);
+    color: #3e3e3e;
+    display: table;
+    font-size: 14px;
+    font-weight: bold;
+    width: 100%;
+    vertical-align: middle;
+}
+
+.kpi-title-text {
+    display: table-cell;
+    text-align: center;
+    vertical-align: middle;
+}
+
+.kpi-footer-text {
+    display: table-cell;
+    font-size: 12px;
+    color: #939393;
+    text-align: center;
+    vertical-align: middle;
+}
+
+.kpi-footer-text a {
+    color: #939393;
+}
+
+.kpi-trend-up {
+    background: url("images/trend_up.png") no-repeat scroll right center rgba(0, 0, 0, 0);
+    width: 30px;
+}
+
+.kpi-trend-down {
+    background: url("images/trend_down.png") no-repeat scroll right center rgba(0, 0, 0, 0);
+    width: 30px;
+}
+
+.kpi-trend-flat {
+    width: 30px;
+}
+
+.kpi-trend-up-small {
+    background: url("images/trend_up_small.png") no-repeat scroll center right rgba(0, 0, 0, 0);
+    background-position: 5px;
+    display: table-cell;
+    height: 100%;
+    width: 20px;
+}
+
+.kpi-trend-down-small {
+    background: url("images/trend_down_small.png") no-repeat scroll center right rgba(0, 0, 0, 0);
+    background-position: 5px;
+    display: table-cell;
+    height: 100%;
+    width: 20px;
+}
+
+.kpi-trend-flat-small {
+    display: table-cell;
+    height: 100%;
+    width: 20px;
+}
+
+.kpi-delta-up {
+    display: table-cell;
+    font-family: KPIWidgetNumber;
+    font-size: 0.35em;
+    height: 100%;
+    vertical-align: middle;
+    width: 34px;
+    color: #9dd07c;
+    text-align: center;
+    /*border: 1px solid;*/
+}
+
+.kpi-delta-down {
+    display: table-cell;
+    font-family: KPIWidgetNumber;
+    font-size: 0.35em;
+    height: 100%;
+    vertical-align: middle;
+    width: 34px;
+    color: #e05d63;
+    text-align: center;
+}
+
+.kpi-delta-flat {
+    font-family: KPIWidgetNumber;
+    font-size: 0.35em;
+    height: 100%;
+    vertical-align: middle;
+    width: 34px;
+    color: #fff;
+    text-align: center;
+}