layout: update nocontents style based on the latest UX guidesubmit/tizen/20200824.045643accepted/tizen/unified/20200825.033224

Change-Id: I6b138e535b50d1c2a973ebafdf7dbafd21b92ffd

2 files changed, 39 insertions, 45 deletions

diff --git a/common/HD-inc.edc b/common/HD-inc.edc
index c5b2ed4..557383e 100644
--- a/common/HD-inc.edc
+++ b/common/HD-inc.edc
@@ -576,14 +576,14 @@
 //****************************************************************************//
 // No Content
 //****************************************************************************//
-#define NO_CONTENT_BG_HEIGHT_INC 1280
-#define NO_CONTENT_TEXT_BG_MAX_HEIGHT_INC 572
-#define NO_CONTENT_BOTTOM_PADDING_HEIGHT_INC 235
-#define NO_CONTENT_LEFT_RIGHT_PADDING_WIDTH_INC 32
-#define NO_CONTENT_TITLE_TEXT_HEIGHT_INC 41
-#define NO_CONTENT_TEXT_PADDING_HEIGHT_INC 54
-#define NO_CONTENT_TITLE_TEXT_FONT_SIZE_INC 40
-#define NO_CONTENT_TEXT_FONT_SIZE_INC 38
+#define NO_CONTENT_TEXT_BG_MAX_HEIGHT_INC 608 // 720 - 112
+#define NO_CONTENT_BOTTOM_PADDING_HEIGHT_INC 66
+#define NO_CONTENT_LEFT_RIGHT_PADDING_WIDTH_INC 40
+#define NO_CONTENT_TOP_BOTTOM_PADDING_WIDTH_INC 20
+#define NO_CONTENT_TITLE_TEXT_HEIGHT_INC 49 // 20 + 29
+#define NO_CONTENT_TEXT_PADDING_HEIGHT_INC 8
+#define NO_CONTENT_TITLE_TEXT_FONT_SIZE_INC 22
+#define NO_CONTENT_TEXT_FONT_SIZE_INC 22
 
 //****************************************************************************//
 // Button
@@ -1457,11 +1457,11 @@ base: "color=#ffffffff align=left font=Tizen:weight=SemiBold:width=Condensed fon
    }
   // ************* no Content text ********** //
    style { name: "empty_state_1";
-      base: "font=Tizen:weight=Normal font_size="NO_CONTENT_TITLE_TEXT_FONT_SIZE_INC" align=center color=#ffffffff text_class=tizen wrap=mixed ellipsis=1.0";
+      base: "font=Tizen:weight=Regular font_size="NO_CONTENT_TITLE_TEXT_FONT_SIZE_INC" align=center color=#001447 text_class=tizen wrap=mixed ellipsis=1.0";
       STYLE_TAGS
    }
    style { name: "empty_state_2";
-      base: "font=Tizen:weight=Normal font_size="NO_CONTENT_TEXT_FONT_SIZE_INC" align=center color=#ffffffff text_class=tizen wrap=mixed ellipsis=1.0";
+      base: "font=Tizen:weight=Regular font_size="NO_CONTENT_TEXT_FONT_SIZE_INC" align=center color=#001447 text_class=tizen wrap=mixed ellipsis=1.0";
       STYLE_TAGS
    }
    style { name: "popup_title_style";
diff --git a/common/widgets/layout.edc b/common/widgets/layout.edc
index a117272..77262bc 100644
--- a/common/widgets/layout.edc
+++ b/common/widgets/layout.edc
@@ -97,30 +97,33 @@ group { "elm/layout/nocontents/default";
             max: -1 NO_CONTENT_TEXT_BG_MAX_HEIGHT_INC;
             fixed: 0 1;
             align: 0.5 0.5;
-            rel1.to: "bg";
-            rel2.to: "bg";
+            rel.to: "bg";
          }
       }
-      spacer { "left_padding";
+      spacer { "top_left_padding";
          scale;
          desc { "default";
-            min: NO_CONTENT_LEFT_RIGHT_PADDING_WIDTH_INC 0;
-            fixed: 1 0;
+            min: NO_CONTENT_LEFT_RIGHT_PADDING_WIDTH_INC NO_CONTENT_TOP_BOTTOM_PADDING_WIDTH_INC;
+            max: NO_CONTENT_LEFT_RIGHT_PADDING_WIDTH_INC NO_CONTENT_TOP_BOTTOM_PADDING_WIDTH_INC;
+            fixed: 1 1;
             align: 0.0 0.0;
             rel1.to: "text_bg";
-            rel2.to: "text_bg";
-            rel2.relative: 0.0 1.0;
+            rel2 {
+               to: "text_bg";
+               relative: 0.0 0.0;
+            }
          }
       }
-      spacer { "right_padding";
+      spacer { "bottom_right_padding";
          scale;
          desc { "default";
-            min: NO_CONTENT_LEFT_RIGHT_PADDING_WIDTH_INC 0;
-            fixed: 1 0;
-            align: 1.0 0.0;
+            min: NO_CONTENT_LEFT_RIGHT_PADDING_WIDTH_INC NO_CONTENT_TOP_BOTTOM_PADDING_WIDTH_INC;
+            max: NO_CONTENT_LEFT_RIGHT_PADDING_WIDTH_INC NO_CONTENT_TOP_BOTTOM_PADDING_WIDTH_INC;
+            fixed: 1 1;
+            align: 1.0 1.0;
             rel1 {
                to: "text_bg";
-               relative: 1.0 0.0;
+               relative: 1.0 1.0;
             }
             rel2.to: "text_bg";
          }
@@ -129,16 +132,13 @@ group { "elm/layout/nocontents/default";
          scale;
          desc { "default";
             fixed: 1 1;
-            color: 0 0 0 255;
             rel1 {
-               to_x: "left_padding";
-               to_y: "text_bg";
-               relative: 1.0 0.0;
+               to: "top_left_padding";
+               relative: 1.0 1.0;
             }
             rel2 {
-               to_x: "right_padding";
-               to_y: "text_bg";
-               relative: 0.0 1.0;
+               to: "bottom_right_padding";
+               relative: 0.0 0.0;
             }
             text {
                style: "empty_state_1";
@@ -165,11 +165,11 @@ group { "elm/layout/nocontents/default";
          desc { "default";
             align: 0.0 1.0;
             min: 0 NO_CONTENT_TEXT_PADDING_HEIGHT_INC;
-            fixed: 1 1;
+            fixed: 0 1;
             rel1.to:"elm.help.text";
             rel2 {
-               relative: 1.0 0.0;
                to: "elm.help.text";
+               relative: 1.0 0.0;
             }
          }
       }
@@ -191,27 +191,21 @@ group { "elm/layout/nocontents/default";
          desc { "default";
             fixed: 0 1;
             rel1 {
-               to: "help_text_top_padding";
-               relative: 0.0 1.0;
+               to_x: "top_left_padding";
+               to_y: "help_text_top_padding";
+               relative: 1.0 1.0;
+            }
+            rel2 {
+               to: "bottom_right_padding";
+               relative: 0.0 0.0;
             }
-            rel2.to: "text_bg";
          }
       }
       textblock { "elm.help.text";
          scale;
          desc { "default";
             fixed: 1 1;
-            color: 0 0 0 255;
-            rel1 {
-               relative: 1.0 0.0;
-               to_x:"left_padding";
-               to_y:"help_text_bg";
-            }
-            rel2 {
-               relative: 0.0 1.0;
-               to_x:"right_padding";
-               to_y:"help_text_bg";
-            }
+            rel.to: "help_text_bg";
             text {
                style: "empty_state_2";
                align: 0.0 0.5;