diff --git a/frontend/src/lang/en.js b/frontend/src/lang/en.js
index f1521c9..52970dd 100644
--- a/frontend/src/lang/en.js
+++ b/frontend/src/lang/en.js
@@ -120,6 +120,7 @@ export default {
networkFonts: 'Network fonts',
localFonts: 'Local fonts',
fontSize: 'Font size',
+ fontWeight: 'Font weight',
normalColor: 'Normal color',
ownerColor: 'Owner color',
moderatorColor: 'Moderator color',
@@ -149,12 +150,15 @@ export default {
scAndNewMember: 'Super Chat / New Member',
firstLineFont: 'First line font',
firstLineFontSize: 'First line font size',
+ firstLineWeight: 'First line font weight',
firstLineColor: 'First line color',
secondLineFont: 'Second line font',
secondLineFontSize: 'Second line font size',
+ secondLineWeight: 'Second line font weight',
secondLineColor: 'Second line color',
scContentLineFont: 'Super Chat content font',
scContentLineFontSize: 'Super Chat content font size',
+ scContentWeight: 'Super Chat content font weight',
scContentLineColor: 'Super Chat content color',
showNewMemberBg: 'Show new member background',
showScTicker: 'Show Super Chat ticker',
diff --git a/frontend/src/lang/ja.js b/frontend/src/lang/ja.js
index 97e12ec..4ef25eb 100644
--- a/frontend/src/lang/ja.js
+++ b/frontend/src/lang/ja.js
@@ -120,6 +120,7 @@ export default {
networkFonts: 'ネットワークフォント',
localFonts: 'ローカルフォント',
fontSize: 'フォントサイズ',
+ fontWeight: 'フォントの太さ',
normalColor: 'ノーマルの色',
ownerColor: 'オーナーの色',
moderatorColor: '管理者の色',
@@ -149,12 +150,15 @@ export default {
scAndNewMember: 'スーパーチャット、新メンバー',
firstLineFont: '1行目のフォント',
firstLineFontSize: '1行目のフォントサイズ',
+ firstLineWeight: '1行目のフォントの太さ',
firstLineColor: '1行目の色',
secondLineFont: '2行目のフォント',
secondLineFontSize: '2行目のフォントサイズ',
+ secondLineWeight: '2行目のフォントの太さ',
secondLineColor: '2行目の色',
scContentLineFont: 'スーパーチャットのコンテンツフォント',
scContentLineFontSize: 'スーパーチャットコンテンツフォントサイズ',
+ scContentWeight: 'スーパーチャットコンテンツフォントの太さ',
scContentLineColor: 'スーパーチャットコンテンツライン色',
showNewMemberBg: '新メンバーの背景を表示する',
showScTicker: 'スーパーチャットチカーの表示',
diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js
index 0c5b6fd..43b4df5 100644
--- a/frontend/src/lang/zh.js
+++ b/frontend/src/lang/zh.js
@@ -118,6 +118,7 @@ export default {
networkFonts: '网络字体',
localFonts: '本地字体',
fontSize: '字体尺寸',
+ fontWeight: '字体粗细',
normalColor: '普通颜色',
ownerColor: '主播颜色',
moderatorColor: '房管颜色',
@@ -147,12 +148,15 @@ export default {
scAndNewMember: '打赏、舰长',
firstLineFont: '第一行字体',
firstLineFontSize: '第一行字体尺寸',
+ firstLineWeight: '第一行字体粗细',
firstLineColor: '第一行颜色',
secondLineFont: '第二行字体',
secondLineFontSize: '第二行字体尺寸',
+ secondLineWeight: '第二行字体粗细',
secondLineColor: '第二行颜色',
scContentLineFont: 'Super Chat内容字体',
scContentLineFontSize: 'Super Chat内容字体尺寸',
+ scContentWeight: 'Super Chat内容字体粗细',
scContentLineColor: 'Super Chat内容颜色',
showNewMemberBg: '显示新舰长背景',
showScTicker: '显示Super Chat固定栏',
diff --git a/frontend/src/views/StyleGenerator/FontWeightSelect.vue b/frontend/src/views/StyleGenerator/FontWeightSelect.vue
new file mode 100644
index 0000000..f6e1d65
--- /dev/null
+++ b/frontend/src/views/StyleGenerator/FontWeightSelect.vue
@@ -0,0 +1,28 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/frontend/src/views/StyleGenerator/Legacy.vue b/frontend/src/views/StyleGenerator/Legacy.vue
index 59e2d99..b440293 100644
--- a/frontend/src/views/StyleGenerator/Legacy.vue
+++ b/frontend/src/views/StyleGenerator/Legacy.vue
@@ -67,6 +67,11 @@
+
+
+
+
+
@@ -128,6 +133,11 @@
+
+
+
+
+
@@ -180,6 +190,11 @@
+
+
+
+
+
@@ -247,6 +262,11 @@
+
+
+
+
+
@@ -268,6 +288,11 @@
+
+
+
+
+
@@ -289,6 +314,11 @@
+
+
+
+
+
@@ -363,6 +393,7 @@
import _ from 'lodash'
import FontSelect from './FontSelect'
+import FontWeightSelect from './FontWeightSelect'
import * as common from './common'
import { mergeConfig } from '@/utils'
@@ -377,6 +408,7 @@ export const DEFAULT_CONFIG = {
showUserNames: true,
userNameFont: 'Imprima,Noto Sans SC',
userNameFontSize: 20,
+ userNameWeight: 700,
userNameColor: '#cccccc',
ownerUserNameColor: '#ffd600',
moderatorUserNameColor: '#5e84f1',
@@ -386,6 +418,7 @@ export const DEFAULT_CONFIG = {
messageFont: 'Imprima,Noto Sans SC',
messageFontSize: 20,
+ messageWeight: 700,
messageColor: '#ffffff',
messageOnNewLine: false,
messageReverseScroll: false,
@@ -395,6 +428,7 @@ export const DEFAULT_CONFIG = {
showTime: false,
timeFont: 'Imprima,Noto Sans SC',
timeFontSize: 20,
+ timeWeight: 400,
timeColor: '#999999',
bgColor: 'rgba(0, 0, 0, 0)',
@@ -406,12 +440,15 @@ export const DEFAULT_CONFIG = {
firstLineFont: 'Imprima,Noto Sans SC',
firstLineFontSize: 22,
+ firstLineWeight: 700,
firstLineColor: '#ffffff',
secondLineFont: 'Imprima,Noto Sans SC',
secondLineFontSize: 20,
+ secondLineWeight: 700,
secondLineColor: '#ffffff',
scContentFont: 'Imprima,Noto Sans SC',
scContentFontSize: 20,
+ scContentWeight: 700,
scContentColor: '#ffffff',
showScTicker: false,
showOtherThings: true,
@@ -428,7 +465,7 @@ export const DEFAULT_CONFIG = {
export default {
name: 'Legacy',
components: {
- FontSelect
+ FontSelect, FontWeightSelect
},
props: {
value: String
@@ -481,10 +518,13 @@ export default {
/* 付费、上舰消息 Super Chats / Membership messages */
--paid-msg-line-1-color: ${this.form.firstLineColor ?? '#ffffff'};
--paid-msg-line-1-size: calc(${this.form.firstLineFontSize} * var(--font-base-size));
+ --paid-msg-line-1-weight: ${this.form.firstLineWeight};
--paid-msg-line-2-color: ${this.form.secondLineColor ?? '#ffffff'};
--paid-msg-line-2-size: calc(${this.form.secondLineFontSize} * var(--font-base-size));
+ --paid-msg-line-2-weight: ${this.form.secondLineWeight};
--paid-msg-content-color: ${this.form.scContentColor ?? '#ffffff'};
--paid-msg-content-size: calc(${this.form.scContentFontSize} * var(--font-base-size));
+ --paid-msg-content-weight: ${this.form.scContentWeight};
--membership-msg-bg-color: var(--username-color-member);
}`
},
diff --git a/frontend/src/views/StyleGenerator/LineLike.vue b/frontend/src/views/StyleGenerator/LineLike.vue
index 2efece5..e1e33ec 100644
--- a/frontend/src/views/StyleGenerator/LineLike.vue
+++ b/frontend/src/views/StyleGenerator/LineLike.vue
@@ -42,6 +42,11 @@
+
+
+
+
+
@@ -98,6 +103,11 @@
+
+
+
+
+
@@ -145,6 +155,11 @@
+
+
+
+
+
@@ -207,6 +222,11 @@
+
+
+
+
+
@@ -223,6 +243,11 @@
+
+
+
+
+
@@ -239,6 +264,11 @@
+
+
+
+
+
@@ -313,6 +343,7 @@
import _ from 'lodash'
import FontSelect from './FontSelect'
+import FontWeightSelect from './FontWeightSelect'
import * as common from './common'
import { mergeConfig } from '@/utils'
@@ -323,6 +354,7 @@ export const DEFAULT_CONFIG = {
showUserNames: true,
userNameFont: 'Noto Sans SC',
userNameFontSize: 18,
+ userNameWeight: 700,
userNameColor: '#cccccc',
ownerUserNameColor: '#ffd600',
moderatorUserNameColor: '#5e84f1',
@@ -331,6 +363,7 @@ export const DEFAULT_CONFIG = {
messageFont: 'Noto Sans SC',
messageFontSize: 20,
+ messageWeight: 700,
messageColor: '#000000',
emoticonSize: 24,
largeEmoticonSize: 60,
@@ -339,6 +372,7 @@ export const DEFAULT_CONFIG = {
showTime: false,
timeFont: 'Noto Sans SC',
timeFontSize: 18,
+ timeWeight: 400,
timeColor: '#999999',
bgColor: 'rgba(0, 0, 0, 0)',
@@ -350,10 +384,13 @@ export const DEFAULT_CONFIG = {
firstLineFont: 'Noto Sans SC',
firstLineFontSize: 22,
+ firstLineWeight: 700,
secondLineFont: 'Noto Sans SC',
secondLineFontSize: 20,
+ secondLineWeight: 700,
scContentFont: 'Noto Sans SC',
scContentFontSize: 20,
+ scContentWeight: 700,
showScTicker: false,
showOtherThings: true,
@@ -369,7 +406,7 @@ export const DEFAULT_CONFIG = {
export default {
name: 'LineLike',
components: {
- FontSelect
+ FontSelect, FontWeightSelect
},
props: {
value: String
@@ -417,8 +454,11 @@ export default {
/* 付费、上舰消息 Super Chats / Membership messages */
--paid-msg-line-1-size: calc(${this.form.firstLineFontSize} * var(--font-base-size));
+ --paid-msg-line-1-weight: ${this.form.firstLineWeight};
--paid-msg-line-2-size: calc(${this.form.secondLineFontSize} * var(--font-base-size));
+ --paid-msg-line-2-weight: ${this.form.secondLineWeight};
--paid-msg-content-size: calc(${this.form.scContentFontSize} * var(--font-base-size));
+ --paid-msg-content-weight: ${this.form.scContentWeight};
--membership-msg-bg-color: var(--username-color-member);
}`
},
diff --git a/frontend/src/views/StyleGenerator/common.js b/frontend/src/views/StyleGenerator/common.js
index 98a53ce..7c127c5 100644
--- a/frontend/src/views/StyleGenerator/common.js
+++ b/frontend/src/views/StyleGenerator/common.js
@@ -58,6 +58,7 @@ export function getVariableStyle(config) {
/* 时间 Timestamps */
--time-color: ${config.timeColor ?? '#999999'};
--time-size: calc(${config.timeFontSize} * var(--font-base-size));
+ --time-weight: ${config.timeWeight};
/* 用户名 Channel names
普通、舰长、房管、主播 */
@@ -66,10 +67,12 @@ export function getVariableStyle(config) {
--username-color-moderator: ${config.moderatorUserNameColor ?? 'var(--username-color)'};
--username-color-owner: ${config.ownerUserNameColor ?? 'var(--username-color)'};
--username-size: calc(${config.userNameFontSize} * var(--font-base-size));
+ --username-weight: ${config.userNameWeight};
/* 文本消息 Text messages */
--text-content-color: ${config.messageColor ?? '#111111'};
--text-content-size: calc(${config.messageFontSize} * var(--font-base-size));
+ --text-content-weight: ${config.messageWeight};
/* 表情 Emotes */
--emote-size: calc(${config.emoticonSize} * var(--font-base-size));
@@ -104,6 +107,7 @@ yt-live-chat-text-message-renderer #timestamp {
color: var(--time-color);
font-family: ${fontsStrToCss(config.timeFont)};
--font-size: var(--time-size);
+ font-weight: var(--time-weight);
}`
}
@@ -114,6 +118,7 @@ yt-live-chat-text-message-renderer #author-name {
color: var(--username-color);
font-family: ${fontsStrToCss(config.userNameFont)};
--font-size: var(--username-size);
+ font-weight: var(--username-weight);
}
yt-live-chat-text-message-renderer :is(#author-name, yt-live-chat-author-badge-renderer)[type="owner"] {
@@ -144,6 +149,7 @@ yt-live-chat-text-message-renderer :is(#message, #message *) {
color: var(--text-content-color);
font-family: ${fontsStrToCss(config.messageFont)};
--font-size: var(--text-content-size);
+ font-weight: var(--text-content-weight);
}
${EMOTICON_STYLE}
@@ -197,6 +203,7 @@ function getScAndNewMemberFontStyle(config) {
yt-live-chat-membership-item-renderer :is(#header-content-inner-column, #header-content-inner-column *) {
font-family: ${fontsStrToCss(config.firstLineFont)};
--font-size: var(--paid-msg-line-1-size);
+ font-weight: var(--paid-msg-line-1-weight);
}
yt-live-chat-membership-item-renderer yt-live-chat-author-badge-renderer :is(img, yt-icon) {
@@ -208,11 +215,13 @@ yt-live-chat-paid-message-renderer :is(#purchase-amount, #purchase-amount *),
yt-live-chat-membership-item-renderer :is(#header-subtext, #header-subtext *) {
font-family: ${fontsStrToCss(config.secondLineFont)};
--font-size: var(--paid-msg-line-2-size);
+ font-weight: var(--paid-msg-line-2-weight);
}
yt-live-chat-paid-message-renderer :is(#content, #content *) {
font-family: ${fontsStrToCss(config.scContentFont)};
--font-size: var(--paid-msg-content-size);
+ font-weight: var(--paid-msg-content-weight);
}`
}
@@ -223,19 +232,20 @@ function getScTickerStyle(config) {
}`
}
return `/* SC固定栏 Super Chat ticker */
-yt-live-chat-ticker-renderer #items {
+yt-live-chat-ticker-renderer :is(#items, #content) {
height: unset;
}
yt-live-chat-ticker-paid-message-item-renderer #author-photo img {
+ --font-size: var(--paid-msg-line-2-size);
width: var(--line-height);
height: var(--line-height);
}
-yt-live-chat-ticker-paid-message-item-renderer #content {
- height: unset;
+yt-live-chat-ticker-paid-message-item-renderer #text {
font-family: ${fontsStrToCss(config.secondLineFont)};
--font-size: var(--paid-msg-line-2-size);
+ font-weight: var(--paid-msg-line-2-weight);
}`
}