diff --git a/customize.dist/src/less2/include/modals-ui-elements.less b/customize.dist/src/less2/include/modals-ui-elements.less
index 3e6855fbe..e13263d36 100644
--- a/customize.dist/src/less2/include/modals-ui-elements.less
+++ b/customize.dist/src/less2/include/modals-ui-elements.less
@@ -26,6 +26,42 @@
// Properties modal
.cp-app-prop {
margin-bottom: 10px;
+ .cp-app-prop-size-container {
+ height: 20px;
+ background-color: @colortheme_logo-2;
+ margin: 10px 0;
+ padding: 0;
+ div {
+ height: 20px;
+ margin: 0;
+ padding: 0;
+ background-color: #CCCCCC;
+ }
+ }
+ .cp-app-prop-size-legend {
+ color: @colortheme_modal-fg;
+ display: flex;
+ margin: 10px 0;
+ & > div {
+ display: flex;
+ align-items: center;
+ flex-basis: 50%;
+ margin: 0;
+ padding: 0;
+ }
+ .cp-app-prop-history-size-color, .cp-app-prop-contents-size-color {
+ display: inline-block;
+ height: 20px;
+ width: 20px;
+ margin-right: 10px;
+ }
+ .cp-app-prop-history-size-color {
+ background-color: #CCCCCC;
+ }
+ .cp-app-prop-contents-size-color {
+ background-color: @colortheme_logo-2;
+ }
+ }
}
.cp-app-prop-content {
diff --git a/www/common/common-ui-elements.js b/www/common/common-ui-elements.js
index af1b4f679..393a82c11 100644
--- a/www/common/common-ui-elements.js
+++ b/www/common/common-ui-elements.js
@@ -689,6 +689,9 @@ define([
var $d = $('
');
if (!data) { return void cb(void 0, $d); }
+ var priv = common.getMetadataMgr().getPrivateData();
+ var edPublic = priv.edPublic;
+
if (data.href) {
$('