Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: updating workspaceAdmin theme #1106

Merged
merged 2 commits into from
Nov 25, 2024
Merged

feat: updating workspaceAdmin theme #1106

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
9e6e954
feat: font family for vk workspace
Oct 25, 2024
8bfe2e0
feat: update snapthots
Oct 25, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
208 changes: 134 additions & 74 deletions src/build/__snapshots__/snapthots.test.ts.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -517379,25 +517379,49 @@ exports[`shapshots workspaceAdmin theme should match cssVars snapshot 1`] = `
},
},
"fontHeadline3": {
"fontFamily": {
"name": "--vkui--font_headline3--font_family",
"value": "var(--vkui--font_headline3--font_family, MailSans, Helvetica, Arial, sans-serif)",
},
"fontSize": {
"name": "--vkui--font_headline3--font_size",
"value": "var(--vkui--font_headline3--font_size, 13px)",
},
"fontStyle": {
"name": "--vkui--font_headline3--font_style",
"value": "var(--vkui--font_headline3--font_style, normal)",
},
"fontWeight": {
"name": "--vkui--font_headline3--font_weight",
"value": "var(--vkui--font_headline3--font_weight, 500)",
"auto": {
"fontFamily": {
"name": "--vkui--font_headline3--font_family",
"value": "var(--vkui--font_headline3--font_family)",
},
"fontSize": {
"name": "--vkui--font_headline3--font_size",
"value": "var(--vkui--font_headline3--font_size)",
},
"fontStyle": {
"name": "--vkui--font_headline3--font_style",
"value": "var(--vkui--font_headline3--font_style)",
},
"fontWeight": {
"name": "--vkui--font_headline3--font_weight",
"value": "var(--vkui--font_headline3--font_weight)",
},
"lineHeight": {
"name": "--vkui--font_headline3--line_height",
"value": "var(--vkui--font_headline3--line_height)",
},
},
"lineHeight": {
"name": "--vkui--font_headline3--line_height",
"value": "var(--vkui--font_headline3--line_height, 16px)",
"regular": {
"fontFamily": {
"name": "--vkui--font_headline3--font_family--regular",
"value": "var(--vkui--font_headline3--font_family--regular, VKSansDisplay, MailSans, Helvetica, Arial, sans-serif)",
},
"fontSize": {
"name": "--vkui--font_headline3--font_size--regular",
"value": "var(--vkui--font_headline3--font_size--regular, 15px)",
},
"fontStyle": {
"name": "--vkui--font_headline3--font_style--regular",
"value": "var(--vkui--font_headline3--font_style--regular, normal)",
},
"fontWeight": {
"name": "--vkui--font_headline3--font_weight--regular",
"value": "var(--vkui--font_headline3--font_weight--regular, 500)",
},
"lineHeight": {
"name": "--vkui--font_headline3--line_height--regular",
"value": "var(--vkui--font_headline3--line_height--regular, 20px)",
},
},
},
"fontParagraph": {
Expand Down Expand Up @@ -517594,7 +517618,7 @@ exports[`shapshots workspaceAdmin theme should match cssVars snapshot 1`] = `
"regular": {
"fontFamily": {
"name": "--vkui--font_title2--font_family--regular",
"value": "var(--vkui--font_title2--font_family--regular, MailSans, Helvetica, Arial, sans-serif)",
"value": "var(--vkui--font_title2--font_family--regular, VKSansDisplay, MailSans, Helvetica, Arial, sans-serif)",
},
"fontSize": {
"name": "--vkui--font_title2--font_size--regular",
Expand Down Expand Up @@ -517632,7 +517656,7 @@ exports[`shapshots workspaceAdmin theme should match cssVars snapshot 1`] = `
"regular": {
"fontFamily": {
"name": "--vkui--font_title3--font_family--regular",
"value": "var(--vkui--font_title3--font_family--regular, MailSans, Helvetica, Arial, sans-serif)",
"value": "var(--vkui--font_title3--font_family--regular, VKSansDisplay, MailSans, Helvetica, Arial, sans-serif)",
},
"fontSize": {
"name": "--vkui--font_title3--font_size--regular",
Expand Down Expand Up @@ -520137,11 +520161,13 @@ exports[`shapshots workspaceAdmin theme should match pixelify theme snapshot 1`]
},
},
"fontHeadline3": {
"fontFamily": "MailSans, Helvetica, Arial, sans-serif",
"fontSize": "13px",
"fontStyle": "normal",
"fontWeight": 500,
"lineHeight": "16px",
"regular": {
"fontFamily": "VKSansDisplay, MailSans, Helvetica, Arial, sans-serif",
"fontSize": "15px",
"fontStyle": "normal",
"fontWeight": 500,
"lineHeight": "20px",
},
},
"fontParagraph": {
"regular": {
Expand Down Expand Up @@ -520185,15 +520211,15 @@ exports[`shapshots workspaceAdmin theme should match pixelify theme snapshot 1`]
},
"fontTitle2": {
"regular": {
"fontFamily": "MailSans, Helvetica, Arial, sans-serif",
"fontFamily": "VKSansDisplay, MailSans, Helvetica, Arial, sans-serif",
"fontSize": "20px",
"fontWeight": 500,
"lineHeight": "24px",
},
},
"fontTitle3": {
"regular": {
"fontFamily": "MailSans, Helvetica, Arial, sans-serif",
"fontFamily": "VKSansDisplay, MailSans, Helvetica, Arial, sans-serif",
"fontSize": "17px",
"fontWeight": 500,
"lineHeight": "24px",
Expand Down Expand Up @@ -521626,11 +521652,13 @@ exports[`shapshots workspaceAdmin theme should match pseudo theme from CssVars 1
},
},
"fontHeadline3": {
"fontFamily": "var(--vkui--font_headline3--font_family, MailSans, Helvetica, Arial, sans-serif)",
"fontSize": "var(--vkui--font_headline3--font_size, 13px)",
"fontStyle": "var(--vkui--font_headline3--font_style, normal)",
"fontWeight": "var(--vkui--font_headline3--font_weight, 500)",
"lineHeight": "var(--vkui--font_headline3--line_height, 16px)",
"regular": {
"fontFamily": "var(--vkui--font_headline3--font_family--regular, VKSansDisplay, MailSans, Helvetica, Arial, sans-serif)",
"fontSize": "var(--vkui--font_headline3--font_size--regular, 15px)",
"fontStyle": "var(--vkui--font_headline3--font_style--regular, normal)",
"fontWeight": "var(--vkui--font_headline3--font_weight--regular, 500)",
"lineHeight": "var(--vkui--font_headline3--line_height--regular, 20px)",
},
},
"fontParagraph": {
"regular": {
Expand Down Expand Up @@ -521674,15 +521702,15 @@ exports[`shapshots workspaceAdmin theme should match pseudo theme from CssVars 1
},
"fontTitle2": {
"regular": {
"fontFamily": "var(--vkui--font_title2--font_family--regular, MailSans, Helvetica, Arial, sans-serif)",
"fontFamily": "var(--vkui--font_title2--font_family--regular, VKSansDisplay, MailSans, Helvetica, Arial, sans-serif)",
"fontSize": "var(--vkui--font_title2--font_size--regular, 20px)",
"fontWeight": "var(--vkui--font_title2--font_weight--regular, 500)",
"lineHeight": "var(--vkui--font_title2--line_height--regular, 24px)",
},
},
"fontTitle3": {
"regular": {
"fontFamily": "var(--vkui--font_title3--font_family--regular, MailSans, Helvetica, Arial, sans-serif)",
"fontFamily": "var(--vkui--font_title3--font_family--regular, VKSansDisplay, MailSans, Helvetica, Arial, sans-serif)",
"fontSize": "var(--vkui--font_title3--font_size--regular, 17px)",
"fontWeight": "var(--vkui--font_title3--font_weight--regular, 500)",
"lineHeight": "var(--vkui--font_title3--line_height--regular, 24px)",
Expand Down Expand Up @@ -523115,11 +523143,13 @@ exports[`shapshots workspaceAdmin theme should match root theme snapshot 1`] = `
},
},
"fontHeadline3": {
"fontFamily": "MailSans, Helvetica, Arial, sans-serif",
"fontSize": 13,
"fontStyle": "normal",
"fontWeight": 500,
"lineHeight": 16,
"regular": {
"fontFamily": "VKSansDisplay, MailSans, Helvetica, Arial, sans-serif",
"fontSize": 15,
"fontStyle": "normal",
"fontWeight": 500,
"lineHeight": 20,
},
},
"fontParagraph": {
"regular": {
Expand Down Expand Up @@ -523163,15 +523193,15 @@ exports[`shapshots workspaceAdmin theme should match root theme snapshot 1`] = `
},
"fontTitle2": {
"regular": {
"fontFamily": "MailSans, Helvetica, Arial, sans-serif",
"fontFamily": "VKSansDisplay, MailSans, Helvetica, Arial, sans-serif",
"fontSize": 20,
"fontWeight": 500,
"lineHeight": 24,
},
},
"fontTitle3": {
"regular": {
"fontFamily": "MailSans, Helvetica, Arial, sans-serif",
"fontFamily": "VKSansDisplay, MailSans, Helvetica, Arial, sans-serif",
"fontSize": 17,
"fontWeight": 500,
"lineHeight": 24,
Expand Down Expand Up @@ -526694,25 +526724,49 @@ exports[`shapshots workspaceAdminDark theme should match cssVars snapshot 1`] =
},
},
"fontHeadline3": {
"fontFamily": {
"name": "--vkui--font_headline3--font_family",
"value": "var(--vkui--font_headline3--font_family, MailSans, Helvetica, Arial, sans-serif)",
},
"fontSize": {
"name": "--vkui--font_headline3--font_size",
"value": "var(--vkui--font_headline3--font_size, 13px)",
},
"fontStyle": {
"name": "--vkui--font_headline3--font_style",
"value": "var(--vkui--font_headline3--font_style, normal)",
},
"fontWeight": {
"name": "--vkui--font_headline3--font_weight",
"value": "var(--vkui--font_headline3--font_weight, 500)",
"auto": {
"fontFamily": {
"name": "--vkui--font_headline3--font_family",
"value": "var(--vkui--font_headline3--font_family)",
},
"fontSize": {
"name": "--vkui--font_headline3--font_size",
"value": "var(--vkui--font_headline3--font_size)",
},
"fontStyle": {
"name": "--vkui--font_headline3--font_style",
"value": "var(--vkui--font_headline3--font_style)",
},
"fontWeight": {
"name": "--vkui--font_headline3--font_weight",
"value": "var(--vkui--font_headline3--font_weight)",
},
"lineHeight": {
"name": "--vkui--font_headline3--line_height",
"value": "var(--vkui--font_headline3--line_height)",
},
},
"lineHeight": {
"name": "--vkui--font_headline3--line_height",
"value": "var(--vkui--font_headline3--line_height, 16px)",
"regular": {
"fontFamily": {
"name": "--vkui--font_headline3--font_family--regular",
"value": "var(--vkui--font_headline3--font_family--regular, VKSansDisplay, MailSans, Helvetica, Arial, sans-serif)",
},
"fontSize": {
"name": "--vkui--font_headline3--font_size--regular",
"value": "var(--vkui--font_headline3--font_size--regular, 15px)",
},
"fontStyle": {
"name": "--vkui--font_headline3--font_style--regular",
"value": "var(--vkui--font_headline3--font_style--regular, normal)",
},
"fontWeight": {
"name": "--vkui--font_headline3--font_weight--regular",
"value": "var(--vkui--font_headline3--font_weight--regular, 500)",
},
"lineHeight": {
"name": "--vkui--font_headline3--line_height--regular",
"value": "var(--vkui--font_headline3--line_height--regular, 20px)",
},
},
},
"fontParagraph": {
Expand Down Expand Up @@ -529452,11 +529506,13 @@ exports[`shapshots workspaceAdminDark theme should match pixelify theme snapshot
},
},
"fontHeadline3": {
"fontFamily": "MailSans, Helvetica, Arial, sans-serif",
"fontSize": "13px",
"fontStyle": "normal",
"fontWeight": 500,
"lineHeight": "16px",
"regular": {
"fontFamily": "VKSansDisplay, MailSans, Helvetica, Arial, sans-serif",
"fontSize": "15px",
"fontStyle": "normal",
"fontWeight": 500,
"lineHeight": "20px",
},
},
"fontParagraph": {
"regular": {
Expand Down Expand Up @@ -530941,11 +530997,13 @@ exports[`shapshots workspaceAdminDark theme should match pseudo theme from CssVa
},
},
"fontHeadline3": {
"fontFamily": "var(--vkui--font_headline3--font_family, MailSans, Helvetica, Arial, sans-serif)",
"fontSize": "var(--vkui--font_headline3--font_size, 13px)",
"fontStyle": "var(--vkui--font_headline3--font_style, normal)",
"fontWeight": "var(--vkui--font_headline3--font_weight, 500)",
"lineHeight": "var(--vkui--font_headline3--line_height, 16px)",
"regular": {
"fontFamily": "var(--vkui--font_headline3--font_family--regular, VKSansDisplay, MailSans, Helvetica, Arial, sans-serif)",
"fontSize": "var(--vkui--font_headline3--font_size--regular, 15px)",
"fontStyle": "var(--vkui--font_headline3--font_style--regular, normal)",
"fontWeight": "var(--vkui--font_headline3--font_weight--regular, 500)",
"lineHeight": "var(--vkui--font_headline3--line_height--regular, 20px)",
},
},
"fontParagraph": {
"regular": {
Expand Down Expand Up @@ -532430,11 +532488,13 @@ exports[`shapshots workspaceAdminDark theme should match root theme snapshot 1`]
},
},
"fontHeadline3": {
"fontFamily": "MailSans, Helvetica, Arial, sans-serif",
"fontSize": 13,
"fontStyle": "normal",
"fontWeight": 500,
"lineHeight": 16,
"regular": {
"fontFamily": "VKSansDisplay, MailSans, Helvetica, Arial, sans-serif",
"fontSize": 15,
"fontStyle": "normal",
"fontWeight": 500,
"lineHeight": 20,
},
},
"fontParagraph": {
"regular": {
Expand Down
3 changes: 2 additions & 1 deletion src/interfaces/themes/workspaceAdmin/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import {
ColorsDescriptionStruct,
ColorWithStates,
} from '@/interfaces/general/colors';
import { Adaptive } from '@/interfaces/general/tools';
import { Font } from '@/interfaces/general/typography';
import {
LocalParadigmColorsDescriptionStruct,
Expand All @@ -12,7 +13,7 @@ import {
} from '@/interfaces/namespaces/paradigm';

export interface ThemeWorkspaceOverValues {
fontHeadline3: Font;
fontHeadline3: Adaptive<Font>;
}

export interface LocalWorkspaceAdminColorsDescriptionStruct {
Expand Down
25 changes: 10 additions & 15 deletions src/themeDescriptions/themes/workspaceAdmin/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,8 @@
import { Adaptive } from '@/interfaces/general/tools';
import { Font } from '@/interfaces/general/typography';
import { ThemeWorkspaceAdminDescription } from '@/interfaces/themes/workspaceAdmin';
import { ThemeWorkspaceAdminDarkDescription } from '@/interfaces/themes/workspaceAdminDark';
import { darkTheme, lightTheme } from '@/themeDescriptions/base/paradigm';
import { fontFamilyAccent } from '@/themeDescriptions/common/fontSizes';

const fontWeightAccent1 = 500;
const fontWeightAccent2 = 500;

export const workspaceAdminTheme: ThemeWorkspaceAdminDescription = {
...lightTheme,
Expand Down Expand Up @@ -117,27 +115,24 @@ export const workspaceAdminTheme: ThemeWorkspaceAdminDescription = {

fontTitle2: {
regular: {
fontSize: 20,
...(lightTheme.fontTitle2 as Adaptive<Font>).regular,
lineHeight: 24,
fontFamily: fontFamilyAccent,
fontWeight: fontWeightAccent1,
},
},
fontTitle3: {
regular: {
fontSize: 17,
...(lightTheme.fontTitle3 as Adaptive<Font>).regular,
lineHeight: 24,
fontFamily: fontFamilyAccent,
fontWeight: fontWeightAccent1,
},
},

fontHeadline3: {
fontSize: 13,
lineHeight: 16,
fontStyle: 'normal',
fontFamily: fontFamilyAccent,
fontWeight: fontWeightAccent2,
regular: {
...(lightTheme.fontHeadline2 as Adaptive<Font>).regular,
fontSize: 15,
lineHeight: 20,
fontStyle: 'normal',
},
},
};

Expand Down
Loading