1
0
mirror of https://git.tt-rss.org/git/tt-rss.git synced 2025-12-13 13:05:56 +00:00

update label rendering (and editor)

This commit is contained in:
Andrew Dolgov
2018-12-06 08:26:52 +03:00
parent 6142e15347
commit 0a41c1a6e1
10 changed files with 45 additions and 70 deletions

View File

@@ -320,10 +320,10 @@ class Pref_Filters extends Handler_Protected {
$label_sth->execute([$line['action_param'], $_SESSION['uid']]); $label_sth->execute([$line['action_param'], $_SESSION['uid']]);
if ($label_row = $label_sth->fetch()) { if ($label_row = $label_sth->fetch()) {
$fg_color = $label_row["fg_color"]; //$fg_color = $label_row["fg_color"];
$bg_color = $label_row["bg_color"]; $bg_color = $label_row["bg_color"];
$name[1] = "<span class=\"labelColorIndicator\" id=\"label-editor-indicator\" style='color : $fg_color; background-color : $bg_color; margin-right : 4px'>&alpha;</span>" . $name[1]; $name[1] = "<i class=\"material-icons\" style='color : $bg_color; margin-right : 4px'>label</i>" . $name[1];
} }
} }

View File

@@ -29,12 +29,9 @@ class Pref_Labels extends Handler_Protected {
$fg_color = $line['fg_color']; $fg_color = $line['fg_color'];
$bg_color = $line['bg_color']; $bg_color = $line['bg_color'];
print "<span class=\"labelColorIndicator\" id=\"label-editor-indicator\" style='color : $fg_color; background-color : $bg_color; margin-bottom : 4px; margin-right : 4px'>&alpha;</span>"; print "<input style='font-size : 16px; color : $fg_color; background : $bg_color; transition : background 0.1s linear'
id='labelEdit_caption' name='caption' dojoType='dijit.form.ValidationTextBox'
print "<input style=\"font-size : 16px\" name=\"caption\" required='true' value=\"".htmlspecialchars($line['caption'])."\">";
dojoType=\"dijit.form.ValidationTextBox\"
required=\"true\"
value=\"".htmlspecialchars($line['caption'])."\">";
print "</div>"; print "</div>";
print "<div class=\"dlgSec\">" . __("Colors") . "</div>"; print "<div class=\"dlgSec\">" . __("Colors") . "</div>";
@@ -56,8 +53,8 @@ class Pref_Labels extends Handler_Protected {
print "<div dojoType=\"dijit.ColorPalette\"> print "<div dojoType=\"dijit.ColorPalette\">
<script type=\"dojo/method\" event=\"onChange\" args=\"fg_color\"> <script type=\"dojo/method\" event=\"onChange\" args=\"fg_color\">
dijit.byId(\"labelEdit_fgColor\").attr('value', fg_color); dijit.byId('labelEdit_fgColor').attr('value', fg_color);
$('label-editor-indicator').setStyle({color: fg_color}); dijit.byId('labelEdit_caption').domNode.setStyle({color: fg_color});
</script> </script>
</div>"; </div>";
print "</div>"; print "</div>";
@@ -66,8 +63,8 @@ class Pref_Labels extends Handler_Protected {
print "<div dojoType=\"dijit.ColorPalette\"> print "<div dojoType=\"dijit.ColorPalette\">
<script type=\"dojo/method\" event=\"onChange\" args=\"bg_color\"> <script type=\"dojo/method\" event=\"onChange\" args=\"bg_color\">
dijit.byId(\"labelEdit_bgColor\").attr('value', bg_color); dijit.byId('labelEdit_bgColor').attr('value', bg_color);
$('label-editor-indicator').setStyle({backgroundColor: bg_color}); dijit.byId('labelEdit_caption').domNode.setStyle({backgroundColor: bg_color});
</script> </script>
</div>"; </div>";
print "</div>"; print "</div>";

View File

@@ -574,17 +574,8 @@ body.ttrss_main .dijitDialog .dlgButtons {
text-align: right; text-align: right;
clear: both; clear: both;
} }
body.ttrss_main span.labelColorIndicator { body.ttrss_main i.icon-label {
height: 16px; color: #fff7d5;
width: 16px;
border-radius: 4px;
line-height: 14px;
vertical-align: middle;
font-size: 9px;
display: inline-block;
background-color: #fff7d5;
color: #063064;
text-align: center;
} }
body.ttrss_main div#cmdline { body.ttrss_main div#cmdline {
position: absolute; position: absolute;
@@ -677,6 +668,7 @@ body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRowSelected {
box-shadow: -1px 0px 2px -1px rgba(0, 0, 0, 0.1); box-shadow: -1px 0px 2px -1px rgba(0, 0, 0, 0.1);
border-color: #ddd transparent; border-color: #ddd transparent;
background: white; background: white;
color: #333;
} }
body.ttrss_main #feeds-holder #feedTree .icon { body.ttrss_main #feeds-holder #feedTree .icon {
position: relative; position: relative;
@@ -1600,8 +1592,8 @@ body.ttrss_prefs hr {
.flat .dijitTree .dijitTreeRowSelected .dijitTreeExpando { .flat .dijitTree .dijitTreeRowSelected .dijitTreeExpando {
color: #257aa7; color: #257aa7;
} }
.flat .dijitTree .dijitTreeNode .dijitTreeRowSelected { .flat .dijitTree .dijitTreeNode:not(.dijitTreeNodeHover) .dijitTreeRowSelected {
background: white; color: white;
} }
.flat .dijitTree .labelParam { .flat .dijitTree .labelParam {
float: right; float: right;

File diff suppressed because one or more lines are too long

View File

@@ -74,8 +74,8 @@
color : @color-accent; color : @color-accent;
} }
.dijitTreeNode .dijitTreeRowSelected { .dijitTreeNode:not(.dijitTreeNodeHover) .dijitTreeRowSelected {
background : white; color : white;
} }
.labelParam { .labelParam {

View File

@@ -672,17 +672,8 @@ body.ttrss_main {
} }
} }
span.labelColorIndicator { i.icon-label {
height : 16px; color : #fff7d5;
width : 16px;
border-radius : 4px;
line-height : 14px;
vertical-align : middle;
font-size : 9px;
display : inline-block;
background-color : #fff7d5;
color : #063064;
text-align : center;
} }
div#cmdline { div#cmdline {
@@ -789,6 +780,7 @@ body.ttrss_main {
box-shadow : -1px 0px 2px -1px rgba(0,0,0,0.1); box-shadow : -1px 0px 2px -1px rgba(0,0,0,0.1);
border-color : #ddd transparent; border-color : #ddd transparent;
background : white; background : white;
color : #333;
} }
.icon { .icon {

View File

@@ -34,17 +34,17 @@ define(["dojo/_base/declare", "dojo/dom-construct", "dijit/Tree", "dijit/Menu"],
const bare_id = parseInt(id.substr(id.indexOf(':')+1)); const bare_id = parseInt(id.substr(id.indexOf(':')+1));
if (bare_id < _label_base_index) { if (bare_id < _label_base_index) {
const span = dojo.doc.createElement('span'); const label = dojo.doc.createElement('i');
const fg_color = args.item.fg_color[0]; //const fg_color = args.item.fg_color[0];
const bg_color = args.item.bg_color[0]; const bg_color = args.item.bg_color[0];
span.innerHTML = "&alpha;"; label.className = "material-icons icon icon-label";
span.className = 'labelColorIndicator'; label.innerHTML = "label";
span.setStyle({ label.setStyle({
color: fg_color, color: bg_color,
backgroundColor: bg_color}); });
domConstruct.place(span, tnode.iconNode, 'only'); domConstruct.place(label, tnode.iconNode, 'only');
} }
if (id.match("FEED:")) { if (id.match("FEED:")) {

View File

@@ -18,18 +18,20 @@ define(["dojo/_base/declare", "dojo/dom-construct", "lib/CheckBoxTree", "dijit/f
const bare_id = this.model.store.getValue(args.item, 'bare_id'); const bare_id = this.model.store.getValue(args.item, 'bare_id');
if (type == 'label') { if (type == 'label') {
const span = dojo.doc.createElement('span'); const label = dojo.doc.createElement('i');
span.innerHTML = '&alpha;'; //const fg_color = args.item.fg_color[0];
span.className = 'labelColorIndicator'; const bg_color = args.item.bg_color[0];
span.id = 'LICID-' + bare_id;
span.setStyle({ label.className = "material-icons icon-label";
color: fg_color, label.innerHTML = "label";
backgroundColor: bg_color}); label.setStyle({
color: bg_color,
});
tnode._labelIconNode = span; domConstruct.place(label, tnode.iconNode, 'before');
domConstruct.place(tnode._labelIconNode, tnode.labelNode, 'before'); //tnode._labelIconNode = span;
//domConstruct.place(tnode._labelIconNode, tnode.labelNode, 'before');
} }
return tnode; return tnode;

View File

@@ -574,17 +574,8 @@ body.ttrss_main .dijitDialog .dlgButtons {
text-align: right; text-align: right;
clear: both; clear: both;
} }
body.ttrss_main span.labelColorIndicator { body.ttrss_main i.icon-label {
height: 16px; color: #fff7d5;
width: 16px;
border-radius: 4px;
line-height: 14px;
vertical-align: middle;
font-size: 9px;
display: inline-block;
background-color: #fff7d5;
color: #063064;
text-align: center;
} }
body.ttrss_main div#cmdline { body.ttrss_main div#cmdline {
position: absolute; position: absolute;
@@ -677,6 +668,7 @@ body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRowSelected {
box-shadow: -1px 0px 2px -1px rgba(0, 0, 0, 0.1); box-shadow: -1px 0px 2px -1px rgba(0, 0, 0, 0.1);
border-color: #ddd transparent; border-color: #ddd transparent;
background: white; background: white;
color: #333;
} }
body.ttrss_main #feeds-holder #feedTree .icon { body.ttrss_main #feeds-holder #feedTree .icon {
position: relative; position: relative;
@@ -1600,8 +1592,8 @@ body.ttrss_prefs hr {
.flat .dijitTree .dijitTreeRowSelected .dijitTreeExpando { .flat .dijitTree .dijitTreeRowSelected .dijitTreeExpando {
color: #257aa7; color: #257aa7;
} }
.flat .dijitTree .dijitTreeNode .dijitTreeRowSelected { .flat .dijitTree .dijitTreeNode:not(.dijitTreeNodeHover) .dijitTreeRowSelected {
background: white; color: white;
} }
.flat .dijitTree .labelParam { .flat .dijitTree .labelParam {
float: right; float: right;

File diff suppressed because one or more lines are too long