From 6b7cd7b972ff425d3df26479ab57f7493c51cb0b Mon Sep 17 00:00:00 2001 From: evazion Date: Sun, 2 Aug 2020 18:06:40 -0500 Subject: [PATCH] posts: update tag counter icons. --- app/javascript/src/javascripts/tag_counter.js | 10 ++--- app/javascript/src/styles/base/000_vars.scss | 1 + app/javascript/src/styles/base/040_colors.css | 8 ---- app/javascript/src/styles/specific/posts.scss | 27 +++++++++++ app/javascript/src/styles/specific/tags.scss | 42 ------------------ app/views/posts/partials/show/_edit.html.erb | 6 +-- app/views/uploads/new.html.erb | 6 +-- public/images/blobaww.png | Bin 0 -> 12944 bytes public/images/blobglare.png | Bin 0 -> 6932 bytes public/images/blobthinkingglare.png | Bin 0 -> 11990 bytes 10 files changed, 37 insertions(+), 63 deletions(-) create mode 100644 public/images/blobaww.png create mode 100644 public/images/blobglare.png create mode 100644 public/images/blobthinkingglare.png diff --git a/app/javascript/src/javascripts/tag_counter.js b/app/javascript/src/javascripts/tag_counter.js index 3aa537cf7..37ff8f46d 100644 --- a/app/javascript/src/javascripts/tag_counter.js +++ b/app/javascript/src/javascripts/tag_counter.js @@ -19,7 +19,7 @@ export default @observer class TagCounter extends Component { return ( {this.tagCount} / {TagCounter.highCount} tags - + ); } @@ -28,13 +28,13 @@ export default @observer class TagCounter extends Component { this.tagCount = Utility.regexp_split($(this.props.tags).val()).length; } - @computed get emoji() { + @computed get iconName() { if (this.tagCount < TagCounter.lowCount) { - return "frown"; + return "blobglare"; } else if (this.tagCount >= TagCounter.lowCount && this.tagCount < TagCounter.highCount) { - return "meh"; + return "blobthinkingglare"; } else { - return "smile"; + return "blobaww"; } } diff --git a/app/javascript/src/styles/base/000_vars.scss b/app/javascript/src/styles/base/000_vars.scss index 78a4c20bb..a7e84a847 100644 --- a/app/javascript/src/styles/base/000_vars.scss +++ b/app/javascript/src/styles/base/000_vars.scss @@ -1,4 +1,5 @@ :root { + --text-xs: 0.8em; --text-sm: 0.9em; --text-md: 1em; --text-lg: 1.16667em; diff --git a/app/javascript/src/styles/base/040_colors.css b/app/javascript/src/styles/base/040_colors.css index 211b835fc..6d32823ae 100644 --- a/app/javascript/src/styles/base/040_colors.css +++ b/app/javascript/src/styles/base/040_colors.css @@ -145,10 +145,6 @@ --tag-count-color: var(--muted-text-color); --low-post-count-color: red; - --tag-count-indicator-frown-color: red; - --tag-count-indicator-meh-color: darkkhaki; - --tag-count-indicator-smile-color: green; - --remove-favorite-button: deeppink; --ugoira-seek-slider-background: #EEE; @@ -417,10 +413,6 @@ body[data-current-user-theme="dark"] { --target-background: var(--blue-0); - --tag-count-indicator-frown-color: var(--red-1); - --tag-count-indicator-meh-color: var(--yellow-1); - --tag-count-indicator-smile-color: var(--green-1); - --uploads-dropzone-background: var(--grey-3); --uploads-dropzone-progress-bar-foreground-color: var(--link-color); --uploads-dropzone-progress-bar-background-color: var(--link-hover-color); diff --git a/app/javascript/src/styles/specific/posts.scss b/app/javascript/src/styles/specific/posts.scss index 1412f86be..42f36505e 100644 --- a/app/javascript/src/styles/specific/posts.scss +++ b/app/javascript/src/styles/specific/posts.scss @@ -485,6 +485,33 @@ div#c-posts, div#c-uploads { } } +/* Container for the tag edit