virtualgrid: adjusts VI effect for an overflow action

[platform/framework/web/web-ui-fw.git] / src / themes / tizen / common / jquery.mobile.tizen.virtualgridview.less

diff --git a/src/themes/tizen/common/jquery.mobile.tizen.virtualgridview.less b/src/themes/tizen/common/jquery.mobile.tizen.virtualgridview.less
index 8a04bd6..b18bf90 100644 (file)
--- a/src/themes/tizen/common/jquery.mobile.tizen.virtualgridview.less
+++ b/src/themes/tizen/common/jquery.mobile.tizen.virtualgridview.less
@@ -31,3 +31,72 @@
 .ui-scrollbar-thumb-y {
        height : 1.5rem !important;
 }
+
+.ui-virtualgrid-overflow-indicator-x-top {
+       position : absolute;
+       display : block;
+       left : 0;
+       top : 0;
+       width : 10 * @unit_base;
+       height : 100%;
+       opacity : 0;
+       background : -webkit-gradient(linear,
+                               right top,
+                               left top,
+                               color-stop(0, rgba(128,128,128,0)),
+                               color-stop(1, rgba(128,128,128,1)));
+       pointer-events : none;
+}
+
+.ui-virtualgrid-overflow-indicator-x-bottom {
+       position : absolute;
+       display : block;
+       right : 0;
+       bottom : 0;
+       width : 10 * @unit_base;
+       height : 100%;
+       opacity : 0;
+       background : -webkit-gradient(linear,
+                               right top,
+                               left top,
+                               color-stop(0, rgba(128,128,128,1)),
+                               color-stop(1, rgba(128,128,128,0)));
+       pointer-events : none;
+}
+
+.ui-virtualgrid-overflow-indicator-y-top {
+       position : absolute;
+       display : block;
+       top : 0;
+       width : 100%;
+       height : 10 * @unit_base;
+       opacity : 0;
+       background : -webkit-gradient(linear,
+                               left bottom,
+                               left top,
+                               color-stop(0, rgba(128,128,128,0)),
+                               color-stop(1, rgba(128,128,128,1)));
+       pointer-events : none;
+}
+
+.ui-virtualgrid-overflow-indicator-y-bottom {
+       position : absolute;
+       display : block;
+       bottom : 0;
+       width : 100%;
+       height : 10 * @unit_base;
+       opacity : 0;
+       background : -webkit-gradient(linear,
+                               left bottom,
+                               left top,
+                               color-stop(0, rgba(128,128,128,1)),
+                               color-stop(1, rgba(128,128,128,0)));
+       pointer-events : none;
+}
+
+/*
+ * padding here set to zero - otherwise the list scrolls underneith the top heading and can be seen above it
+ */
+.ui-content.ui-virtualgrid-content {
+  padding : 0;
+}
\ No newline at end of file