From 8c744752ed55dd527fcd99af9526fad61c8cb4a6 Mon Sep 17 00:00:00 2001 From: Aman Agrawal Date: Sat, 8 Apr 2023 00:49:01 +0000 Subject: [PATCH] stream_privacy: Use new lock and hashtag icons. This commit doesn't modify the lock and hashtag icon in settings. --- help/stream-permissions.md | 11 ++--- tools/tests/test_pretty_print.py | 4 +- web/shared/icons/hashtag.svg | Bin 0 -> 947 bytes web/shared/icons/lock.svg | Bin 0 -> 896 bytes web/src/filter.js | 35 ++++++++++------ web/src/message_view_header.js | 8 +--- web/styles/left_sidebar.css | 16 +++++-- web/styles/recent_topics.css | 12 +++--- web/styles/subscriptions.css | 21 +++++----- web/styles/zulip.css | 39 ++++++++++++------ web/templates/navbar_icon_and_title.hbs | 4 +- web/templates/stream_privacy.hbs | 4 +- .../stream_settings/stream_privacy_icon.hbs | 8 ++-- .../subscription_setting_icon.hbs | 4 +- web/tests/filter.test.js | 19 +++++---- 15 files changed, 109 insertions(+), 76 deletions(-) create mode 100644 web/shared/icons/hashtag.svg create mode 100644 web/shared/icons/lock.svg diff --git a/help/stream-permissions.md b/help/stream-permissions.md index 25b21094a2..4a13c2fcfc 100644 --- a/help/stream-permissions.md +++ b/help/stream-permissions.md @@ -3,14 +3,15 @@ Streams are similar to chat rooms, IRC channels, or email lists in that they determine who receives a message. Zulip supports a few types of streams: -* **Public** (**#**): Members can join and view the complete message history. +* **Public** (): + Members can join and view the complete message history. Public streams are visible to guest users only if they are subscribed (exactly like private streams with shared history). -* **Private** (): New subscribers must be - added by an existing subscriber. Only subscribers and organization - administrators can see the stream's name and description, and only - subscribers can view topics and messages with the stream: +* **Private** (): + New subscribers must be added by an existing subscriber. Only subscribers + and organization administrators can see the stream's name and description, + and only subscribers can view topics and messages with the stream: * In **private streams with shared history**, new subscribers can access the stream's full message history. * In **private streams with protected history**, new subscribers diff --git a/tools/tests/test_pretty_print.py b/tools/tests/test_pretty_print.py index b6cd95dc09..1766e66620 100644 --- a/tools/tests/test_pretty_print.py +++ b/tools/tests/test_pretty_print.py @@ -163,7 +163,7 @@ BAD_HTML7 = """
{{dyn_name}} -{{#if invite_only}}{{/if}} +{{#if invite_only}}{{/if}}
""" @@ -171,7 +171,7 @@ GOOD_HTML7 = """
{{dyn_name}} - {{#if invite_only}}{{/if}} + {{#if invite_only}}{{/if}}
""" diff --git a/web/shared/icons/hashtag.svg b/web/shared/icons/hashtag.svg new file mode 100644 index 0000000000000000000000000000000000000000..7a50562cfc0964861dd1fddb391c85df95019e0d GIT binary patch literal 947 zcmbW0&yIs25XSF)3c{X6RQ%VdhrRb9Hr5pqD~%9r`t*y!Y?h|kG`%pH$?);xgK3l* zkr@^x5I}JNs;4qK%f-@DW7_1$h@;a%Omji zxi(nvo;GO0Yf+$ZuML@FQb92^8O$_*`)haqT)TQl8*szl1yUi={ghYv{&Ri&g9euR Qc*k~TwsF`-!%koK1410ss{jB1 literal 0 HcmV?d00001 diff --git a/web/shared/icons/lock.svg b/web/shared/icons/lock.svg new file mode 100644 index 0000000000000000000000000000000000000000..87776ac0569447eecea592dc0c10a8879a62b4c5 GIT binary patch literal 896 zcmY*YO>d+y488YPMA>spoNup&IrQEiv7#&>O^0egQ1#c>kYrYSA$Icoo?jd;%QlFu ze=O5{ZzTds@%3@LFRdKc_49Yr?E4P8h50cwMr++LUW$EsUq^;(9_!E!CDlaAdr8idE0H-2z6SV6-J#n zTXCwEmv!Xx$b6wwRiQv^uB2yLDmL|$s3p0T0_5qO9om{_2X0fv(f6B2!&hT~tm_mH zz-lYBN*V~+PynZsLe#)8=OLh7R9;0$kTBLPW1cr<5y6FjLOje&u1-#y6}&*+0(%5ZP6TF65S=+9(g%Vac?%koI-Dj&9*9U$DAB^9 wIFIm%@-dH%TaLs}CO|}% and just have a single rule here. */ -.stream-privacy span.hashtag, #left-sidebar .filter-icon i { padding-right: 3px; - &.fa-lock { + &.zulip-icon-lock { position: relative; - top: 1px; + top: 2px; } } diff --git a/web/styles/recent_topics.css b/web/styles/recent_topics.css index 0a3880159b..1dbf127548 100644 --- a/web/styles/recent_topics.css +++ b/web/styles/recent_topics.css @@ -66,10 +66,6 @@ width: 10px; } - .fa-lock { - padding-right: 3px; - } - .fa-envelope { font-size: 0.7rem; margin-right: 2px; @@ -458,8 +454,12 @@ } } - .stream-privacy .zulip-icon.zulip-icon-globe { - left: -1px; + .stream-privacy { + .zulip-icon { + position: relative; + left: -1px; + top: 1.5px; + } } } diff --git a/web/styles/subscriptions.css b/web/styles/subscriptions.css index 3111930ff4..e08ec022f4 100644 --- a/web/styles/subscriptions.css +++ b/web/styles/subscriptions.css @@ -415,10 +415,12 @@ h4.user_group_setting_subsection_title { .large-icon { display: inline-block; - } - .fa-lock { - position: relative; + .zulip-icon { + font-size: 20px; + position: relative; + top: 3px; + } } .zulip-icon-globe { @@ -583,10 +585,6 @@ h4.user_group_setting_subsection_title { font-size: 1.1em; } - .fa-lock { - font-size: 1.4em; - } - .hashtag { font-size: 1.4em; font-weight: 600; @@ -828,9 +826,8 @@ h4.user_group_setting_subsection_title { .large-icon { display: inline-block; vertical-align: top; - margin-right: 5px; + margin-right: 8px; margin-top: -5px; - font-size: 1.5em; &.hash::after { top: -1px; @@ -838,8 +835,10 @@ h4.user_group_setting_subsection_title { font-weight: 800; } - .zulip-icon-globe { - font-size: 15px; + .zulip-icon { + font-size: 18px; + position: relative; + top: 1px; } } diff --git a/web/styles/zulip.css b/web/styles/zulip.css index b4ec6d3aa4..8d427dee1b 100644 --- a/web/styles/zulip.css +++ b/web/styles/zulip.css @@ -1168,6 +1168,15 @@ td.pointer { } } + .stream-privacy i { + font-size: 15px; + + &.zulip-icon-globe, + &.zulip-icon-hashtag { + position: relative; + top: -0.5px; + } + } } } @@ -1241,7 +1250,19 @@ td.pointer { text-decoration: none; } + .stream-privacy { + min-width: unset; + width: 16px; + height: 16px; + .hashtag { + padding-right: 0; + + &::after { + font-size: 16px; + } + } + } } .recipient_bar_controls { @@ -1801,12 +1822,6 @@ div.focused_table { display: none; } - .zulip-icon.zulip-icon-globe { - font-size: 14px; - position: relative; - top: 1px; - } - .sub_count, .stream, & > span { @@ -1832,11 +1847,6 @@ div.focused_table { } .fa { - &.fa-lock { - position: relative; - top: 0.5px; - } - .fa-envelope { font-size: 14px; margin: 0 5px; @@ -1856,6 +1866,12 @@ div.focused_table { text-decoration: none; /* The first ~3px of padding here overlaps with the left padding from sub_count for some reason. */ padding-right: calc(3px + 10px); + + .zulip-icon { + font-size: 14px; + position: relative; + top: 1px; + } } .divider { @@ -2410,7 +2426,6 @@ select.invite-as { } .date_row { - padding-left: 2px; text-align: right; } diff --git a/web/templates/navbar_icon_and_title.hbs b/web/templates/navbar_icon_and_title.hbs index 79e7662566..d31603b4a9 100644 --- a/web/templates/navbar_icon_and_title.hbs +++ b/web/templates/navbar_icon_and_title.hbs @@ -1,5 +1,5 @@ -{{#if web_public_stream}} - +{{#if zulip_icon}} + {{else if icon}} {{/if}} diff --git a/web/templates/stream_privacy.hbs b/web/templates/stream_privacy.hbs index 1f49a3a7fa..bebdac58ab 100644 --- a/web/templates/stream_privacy.hbs +++ b/web/templates/stream_privacy.hbs @@ -1,8 +1,8 @@ {{! This controls whether the swatch next to streams in the left sidebar has a lock icon. }} {{#if invite_only}} - + {{else if is_web_public}} {{else}} - + {{/if}} diff --git a/web/templates/stream_settings/stream_privacy_icon.hbs b/web/templates/stream_settings/stream_privacy_icon.hbs index 83b45cd8e7..1e9f4d8b59 100644 --- a/web/templates/stream_settings/stream_privacy_icon.hbs +++ b/web/templates/stream_settings/stream_privacy_icon.hbs @@ -1,12 +1,14 @@ {{! This controls whether the swatch next to streams in the stream edit page has a lock icon. }} {{#if invite_only}} -
- +
+
{{else if is_web_public}}
{{else}} -
+
+ +
{{/if}} diff --git a/web/templates/stream_settings/subscription_setting_icon.hbs b/web/templates/stream_settings/subscription_setting_icon.hbs index 8077d4df8d..8a3cb123cc 100644 --- a/web/templates/stream_settings/subscription_setting_icon.hbs +++ b/web/templates/stream_settings/subscription_setting_icon.hbs @@ -1,11 +1,11 @@
{{#if invite_only}} - + {{else if is_web_public}} {{else}} - # + {{/if}}
diff --git a/web/tests/filter.test.js b/web/tests/filter.test.js index 4417a566d8..a9568be37d 100644 --- a/web/tests/filter.test.js +++ b/web/tests/filter.test.js @@ -1437,9 +1437,12 @@ test("navbar_helpers", () => { assert.equal(filter.is_common_narrow(), test_case.is_common_narrow); } - function test_get_icon(test_case) { + function test_add_icon_data(test_case) { const filter = new Filter(test_case.operator); - assert.equal(filter.get_icon(), test_case.icon); + const context = {}; + filter.add_icon_data(context); + assert.equal(context.icon, test_case.icon); + assert.equal(context.zulip_icon, test_case.zulip_icon); } function test_get_title(test_case) { @@ -1450,7 +1453,7 @@ test("navbar_helpers", () => { function test_helpers(test_case) { // debugging tip: add a `console.log(test_case)` here test_common_narrow(test_case); - test_get_icon(test_case); + test_add_icon_data(test_case); test_get_title(test_case); test_redirect_url_with_search(test_case); } @@ -1541,7 +1544,7 @@ test("navbar_helpers", () => { { operator: stream_topic_operators, is_common_narrow: true, - icon: "hashtag", + zulip_icon: "hashtag", title: "Foo", redirect_url_with_search: "/#narrow/stream/43-Foo/topic/bar", }, @@ -1555,7 +1558,7 @@ test("navbar_helpers", () => { { operator: stream_operator, is_common_narrow: true, - icon: "hashtag", + zulip_icon: "hashtag", title: "Foo", redirect_url_with_search: "/#narrow/stream/43-Foo", }, @@ -1576,14 +1579,14 @@ test("navbar_helpers", () => { { operator: private_stream_operator, is_common_narrow: true, - icon: "lock", + zulip_icon: "lock", title: "psub", redirect_url_with_search: "/#narrow/stream/22-psub", }, { operator: web_public_stream_operator, is_common_narrow: true, - icon: "globe", + zulip_icon: "globe", title: "webPublicSub", redirect_url_with_search: "/#narrow/stream/12-webPublicSub", }, @@ -1631,7 +1634,7 @@ test("navbar_helpers", () => { { operator: stream_topic_near, is_common_narrow: false, - icon: "hashtag", + zulip_icon: "hashtag", title: "Foo", redirect_url_with_search: "#", },