paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-10-23 04:52:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

stream_color: Remove spectrum-colorpicker library.

Browse Source 
As a follow-up to the previous commit which replaces the spectrum color
picker instances with the custom color picker popover, this commit
removes the spectrum-colorpicker library and its related code from the
codebase.
This commit is contained in:
Sayam Samal
2024-12-09 23:18:18 +05:30
committed by Tim Abbott
parent 6557cd74cd
commit c8de1debf8
10 changed files with 1 additions and 194 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -75,7 +75,6 @@
"sorttable": "^1.0.2",
"source-code-pro": "^2.38.0",
"source-sans": "^3.28.0",
"spectrum-colorpicker": "^1.8.1",
"stackframe": "^1.3.4",
"stacktrace-gps": "^3.0.4",
"style-loader": "^4.0.0",
@@ -118,7 +117,6 @@
"@types/node": "^22.9.0",
"@types/plotly.js": "^2.12.20",
"@types/sortablejs": "^1.15.1",
"@types/spectrum": "^1.8.4",
"@types/textarea-caret": "^3.0.3",
"@types/throttle-debounce": "^5.0.2",
"@types/tinycolor2": "^1.4.5",

19
pnpm-lock.yaml generated
View File

@@ -244,9 +244,6 @@ importers:
source-sans:
specifier: ^3.28.0
version: 3.46.0(patch_hash=4n7ij66tzyhzaqnxsenbilrxr4)
spectrum-colorpicker:
specifier: ^1.8.1
version: 1.8.1
stackframe:
specifier: ^1.3.4
version: 1.3.4
@@ -368,9 +365,6 @@ importers:
'@types/sortablejs':
specifier: ^1.15.1
version: 1.15.8
'@types/spectrum':
specifier: ^1.8.4
version: 1.8.7
'@types/textarea-caret':
specifier: ^3.0.3
version: 3.0.3
@@ -2668,9 +2662,6 @@ packages:
'@types/sortablejs@1.15.8':
resolution: {integrity: sha512-b79830lW+RZfwaztgs1aVPgbasJ8e7AXtZYHTELNXZPsERt4ymJdjV4OccDbHQAvHrCcFpbF78jkm0R6h/pZVg==}
'@types/spectrum@1.8.7':
resolution: {integrity: sha512-zeLcQ1qyKJGyq7V3TzXwyKITcetm8BOMY/PI1qHLxeJrBFS9BtsHtLFfj+X2wU6B7TCqoes7ZMQeoFBxHxg/6g==}
'@types/supercluster@7.1.3':
resolution: {integrity: sha512-Z0pOY34GDFl3Q6hUFYf3HkTwKEE02e7QgtJppBt+beEAxnyOpJua+voGFvxINBHa06GwLFFym7gRPY2SiKIfIA==}
@@ -8072,9 +8063,6 @@ packages:
resolution: {integrity: sha512-r46gZQZQV+Kl9oItvl1JZZqJKGr+oEkB08A6BzkiR7593/7IbtuncXHd2YoYeTsG4157ZssMu9KYvUHLcjcDoA==}
engines: {node: '>=6.0.0'}
spectrum-colorpicker@1.8.1:
resolution: {integrity: sha512-x1picQ5giVso71ESII7jZ3+ZFdit8WthNkzwJqLNdPDPzrltKUQGpTohWyPfSAID+bK1zGdO6bDbSh1S6GoLYA==}
sprintf-js@1.0.3:
resolution: {integrity: sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==}
@@ -11720,11 +11708,6 @@ snapshots:
'@types/sortablejs@1.15.8': {}
'@types/spectrum@1.8.7':
dependencies:
'@types/jquery': 3.5.32
'@types/tinycolor2': 1.4.6
'@types/supercluster@7.1.3':
dependencies:
'@types/geojson': 7946.0.15
@@ -18589,8 +18572,6 @@ snapshots:
transitivePeerDependencies:
- supports-color
spectrum-colorpicker@1.8.1: {}
sprintf-js@1.0.3: {}
sprintf-js@1.1.3: {}

2
version.py
View File

@@ -49,4 +49,4 @@ API_FEATURE_LEVEL = 334 # Last bumped for adding empty_topic_name client capabi
# historical commits sharing the same major version, in which case a
# minor version bump suffices.
PROVISION_VERSION = (308, 0) # bumped 2025-01-03 to upgrade @uppy/core and @uppy/tus
PROVISION_VERSION = (309, 0) # bumped 2024-01-07 to remove spectrum-colorpicker

2
web/src/bundles/app.ts
View File

@@ -3,7 +3,6 @@ import "./common.ts";
// Import third party jQuery plugins
import "jquery-caret-plugin/dist/jquery.caret";
import "../../third/jquery-idle/jquery.idle.js";
import "spectrum-colorpicker";
import "jquery-validation";
// Import app JS
@@ -18,7 +17,6 @@ import "tippy.js/dist/tippy.css";
// https://atomiks.github.io/tippyjs/v6/themes/#arrow-border
import "tippy.js/dist/border.css";
import "tippy.js/themes/light-border.css";
import "spectrum-colorpicker/spectrum.css";
import "katex/dist/katex.css";
import "flatpickr/dist/flatpickr.css";
import "flatpickr/dist/plugins/confirmDate/confirmDate.css";

2
web/src/global.ts
View File

@@ -1,5 +1,3 @@
/// <reference types="spectrum" />
import type * as zulip_test_module from "./zulip_test.ts";
type JQueryCaretRange = {

48
web/src/stream_color.ts
View File

@@ -2,13 +2,9 @@ import type {Colord} from "colord";
import {colord, extend} from "colord";
import lchPlugin from "colord/plugins/lch";
import mixPlugin from "colord/plugins/mix";
import $ from "jquery";
import type tinycolor from "tinycolor2";
import {$t} from "./i18n.ts";
import * as settings_data from "./settings_data.ts";
import * as stream_data from "./stream_data.ts";
import * as stream_settings_api from "./stream_settings_api.ts";
extend([lchPlugin, mixPlugin]);
@@ -69,47 +65,3 @@ export const stream_color_palette = [
["#a6dcbf", "#addfe5", "#a6c7e5", "#4f8de4", "#95a5fd", "#b0a5fd"],
["#c2c2c2", "#c8bebf", "#c6a8ad", "#e79ab5", "#bd86e5", "#9987e1"],
];
const subscriptions_table_colorpicker_options = {
clickoutFiresChange: true,
showPalette: true,
showInput: true,
palette: stream_color_palette,
change: picker_do_change_color,
};
export function set_colorpicker_color($colorpicker: JQuery, color: string): void {
$colorpicker.spectrum({
...subscriptions_table_colorpicker_options,
color,
});
}
export const sidebar_popover_colorpicker_options_full = {
clickoutFiresChange: false,
showPalette: true,
showInput: true,
flat: true,
cancelText: "",
chooseText: $t({defaultMessage: "Confirm"}),
palette: stream_color_palette,
change: picker_do_change_color,
};
function picker_do_change_color(this: HTMLElement, color: tinycolor.Instance): void {
$(".colorpicker").spectrum("destroy");
$(".colorpicker").spectrum(sidebar_popover_colorpicker_options_full);
const stream_id = Number.parseInt($(this).attr("stream_id")!, 10);
const hex_color = color.toHexString();
stream_settings_api.set_color(stream_id, hex_color);
}
export const sidebar_popover_colorpicker_options = {
clickoutFiresChange: true,
showPaletteOnly: true,
showPalette: true,
showInput: true,
flat: true,
palette: stream_color_palette,
change: picker_do_change_color,
};

14
web/styles/dark_theme.css
View File

@@ -273,20 +273,6 @@
}
}
#stream-actions-menu-popover .sp-container {
background-color: transparent;
& button {
background-color: hsl(208deg 35% 11%);
border: 1px solid hsl(210deg 36% 4%);
color: hsl(236deg 31% 90%);
}
.sp-picker-container {
border-left: solid 1px hsl(210deg 36% 4%);
}
}
.stream_header_colorblock.disabled {
filter: brightness(50%);
}

85
web/styles/popovers.css
View File

@@ -8,11 +8,6 @@
/* Basic Tippy popovers scale with the base font-size. */
font-size: var(--base-font-size-px);
.sp-input {
/* Override incorrect color for text in dark theme. */
color: var(--color-text-default) !important;
}
.tippy-content {
/* We set the font-size here to override the
default value in the upstream tippy.css */
@@ -223,10 +218,6 @@
}
}
.sp-container {
z-index: 106;
}
#stream-actions-menu-popover,
#stream-card-popover {
.popover-stream-name {
@@ -250,48 +241,6 @@
.popover-stream-info-menu-description {
color: var(--color-text-popover-menu);
}
.colorpicker-container {
display: none;
margin-right: 10px;
.sp-container {
/* The base-font size for the color container is 12px,
inherited from the upstream spectrum.css file. */
background-color: hsl(0deg 0% 100%);
cursor: pointer;
border: none;
.sp-palette-container {
border-right: none;
}
& input {
box-sizing: inherit; /* IE */
box-sizing: initial;
width: calc(100% - 13px);
}
& button {
background-color: hsl(0deg 0% 100%);
background-image: none;
border: 1px solid hsl(0deg 0% 80%);
border-radius: 4px;
color: hsl(0deg 0% 25%);
/* 12px at 12px/1em */
font-size: 1em;
padding: 6px;
text-transform: capitalize;
text-align: center;
text-shadow: none;
}
.sp-picker-container {
border-left: solid 1px hsl(0deg 0% 88%);
}
}
}
}
#topic-actions-menu-popover {
@@ -738,40 +687,6 @@ ul.popover-group-menu-member-list {
}
@media (width < $md_min) {
.colorpicker-popover {
display: flex !important;
justify-content: center;
align-items: center;
/* these are to override JS embedded inline styles. */
top: 0 !important;
left: 0 !important;
margin: 0 !important;
width: 100%;
height: 100%;
background-color: hsl(0deg 0% 0% / 70%);
border-radius: 0;
border: none;
pointer-events: none;
.popover-inner {
background-color: hsl(0deg 0% 100%);
pointer-events: all;
}
@media (width < $sm_min) {
.popover-inner {
width: 70%;
}
.sp-picker-container {
border-left: none !important;
}
}
}
.popover-flex {
position: absolute;
top: 0 !important;

16
web/styles/subscriptions.css
View File

@@ -29,18 +29,6 @@
border-radius: 4px;
}
.sp-preview {
width: 20px;
border: none;
box-shadow: 0 0 1px hsl(0deg 0% 0%);
}
.sp-replacer {
margin-right: 12px;
border: none;
box-shadow: 0 0 2px hsl(0deg 0% 0% / 80%);
}
.stream-email .email-address {
display: block;
margin: auto;
@@ -1068,10 +1056,6 @@ h4.user_group_setting_subsection_title {
border-bottom: none;
}
.sp-replacer {
box-shadow: none;
}
& input[type="radio"] {
margin-right: 5px;
}

5
web/styles/zulip.css
View File

@@ -689,11 +689,6 @@ strong {
white-space: pre-wrap;
}
.sp-input {
width: calc(100% - 14px);
box-sizing: initial !important;
}
.logout {
white-space: nowrap;
}