diff options
| author | sharkiecodes <lanyi_stroud@brown.edu> | 2025-06-13 10:17:46 -0400 |
|---|---|---|
| committer | sharkiecodes <lanyi_stroud@brown.edu> | 2025-06-13 10:17:46 -0400 |
| commit | fbf768dd4c7734cfdcca38fd1dc1ecf63c64d985 (patch) | |
| tree | 1c267a3762543b469805d0e08e13f9d311e6a036 | |
| parent | 2c947f1ba7785ccbb705c0dce7e6bd64821da99d (diff) | |
| parent | a7a7a5a75845d40f835a38a3af24f000db50009b (diff) | |
Merge branch 'master' into lanyi-branch
137 files changed, 1099 insertions, 1120 deletions
diff --git a/.eslintrc.json b/.eslintrc.json index aba260657..187ddbdc7 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -1,6 +1,6 @@ { "extends": ["airbnb", "prettier", "plugin:node/recommended", "plugin:import/react"], - "plugins": ["prettier", "import", "@typescript-eslint"], + "plugins": ["prettier", "import", "@typescript-eslint", "css-modules"], "ignorePatterns": ["solr-8.3.1/*", "deploy/*"], // <<< ignore all files in test folder "settings": { "import/parsers": { @@ -14,7 +14,10 @@ "extensions": [".js", ".ts", ".tsx"] } }, - "import/extensions": [".js", ".jsx", ".ts", ".tsx"] + "import/extensions": [".js", ".jsx", ".ts", ".tsx"], + "css-modules": { + "basePath": "src" // Adjust this to your project's base path + } }, "rules": { "import/extensions": [ @@ -60,7 +63,9 @@ "no-param-reassign": ["error", { "props": false }], // "import/no-cycle": 0, "no-alert": 0, - "radix": "off" + "radix": "off", + "css-modules/no-unused-class": "warn", // Warn for unused CSS classes + "css-modules/no-undef-class": "error" // Error for undefined CSS classes }, "overrides": [ { diff --git a/.stylelintrc.json b/.stylelintrc.json new file mode 100644 index 000000000..c9198c5dc --- /dev/null +++ b/.stylelintrc.json @@ -0,0 +1,15 @@ +{ + "extends": ["stylelint-config-standard-scss"], + "plugins": ["stylelint-scss"], + "rules": { + "unit-no-unknown": true, + "length-zero-no-unit": true, + "declaration-property-unit-required": { + "width": ["px", "%", "em", "rem", "vw", "vh"], + "height": ["px", "%", "em", "rem", "vw", "vh"] + }, + "property-no-unknown": true, + "value-no-vendor-prefix": true, + "scss/at-rule-no-unknown": true + } +} diff --git a/deploy/index.html b/deploy/index.html index 1c48f24bf..b469c7032 100644 --- a/deploy/index.html +++ b/deploy/index.html @@ -1,3 +1,4 @@ +<!doctype html> <html style="overflow: hidden"> <head> <title>Dash</title> diff --git a/package-lock.json b/package-lock.json index 8e7219bdb..73b8b007b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -20,6 +20,7 @@ "@dash/components": "file:packages/components", "@emotion/react": "^11.11.1", "@emotion/styled": "^11.11.0", + "@eslint/css": "^0.8.1", "@ffmpeg-installer/ffmpeg": "^1.1.0", "@ffmpeg/core": "^0.12.5", "@ffmpeg/ffmpeg": "^0.12.10", @@ -109,6 +110,7 @@ "dompurify": "^3.1.7", "dotenv": "^16.4.7", "dropbox": "^10.34.0", + "eslint-plugin-css-modules": "^2.12.0", "eslint-webpack-plugin": "^5.0.0", "exif": "^0.6.0", "exifr": "^7.1.3", @@ -4083,6 +4085,33 @@ "node": "^18.18.0 || ^20.9.0 || >=21.1.0" } }, + "node_modules/@eslint/css": { + "version": "0.8.1", + "resolved": "https://registry.npmjs.org/@eslint/css/-/css-0.8.1.tgz", + "integrity": "sha512-674JJD1q8sDlJORLep+gGnm3VRCQo/qLmKQgCIf2LnUK/tHf96StWjLX2IF3yyp3yeU9npZ6ixySMr2G256eiQ==", + "license": "Apache-2.0", + "dependencies": { + "@eslint/core": "^0.14.0", + "@eslint/css-tree": "^3.3.3", + "@eslint/plugin-kit": "^0.3.1" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + } + }, + "node_modules/@eslint/css-tree": { + "version": "3.6.1", + "resolved": "https://registry.npmjs.org/@eslint/css-tree/-/css-tree-3.6.1.tgz", + "integrity": "sha512-5DIsBME23tUQD5zHD+T38lC2DG4jB8x8JRa+yDncLne2TIZA0VuCpcSazOX1EC+sM/q8w24qeevXfmfsIxAeqA==", + "license": "MIT", + "dependencies": { + "mdn-data": "2.21.0", + "source-map-js": "^1.0.1" + }, + "engines": { + "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0" + } + }, "node_modules/@eslint/eslintrc": { "version": "3.3.1", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.1.tgz", @@ -21145,6 +21174,22 @@ } } }, + "node_modules/eslint-plugin-css-modules": { + "version": "2.12.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-css-modules/-/eslint-plugin-css-modules-2.12.0.tgz", + "integrity": "sha512-ruFBdad69ABrbCDCh5mXj7UzNmrvytfzPACjyvZWIAjFZAG8BXpYSbqmE8gU5wF+pIzV3jU2CWhLvfekXT/IgQ==", + "license": "MIT", + "dependencies": { + "gonzales-pe": "^4.3.0", + "lodash": "^4.17.2" + }, + "engines": { + "node": ">=4.0.0" + }, + "peerDependencies": { + "eslint": ">=2.0.0" + } + }, "node_modules/eslint-plugin-react": { "version": "7.37.5", "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.37.5.tgz", @@ -23084,6 +23129,21 @@ "integrity": "sha512-sIVQCiRWOymHbVD1Aw/T9/ijbPYAVGBlgGYd1N9MRKfcyBNSpjr87Vg9nSHm+RCT8ELrvK8IJYJV0QRJuVUkCQ==", "license": "MIT" }, + "node_modules/gonzales-pe": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/gonzales-pe/-/gonzales-pe-4.3.0.tgz", + "integrity": "sha512-otgSPpUmdWJ43VXyiNgEYE4luzHCL2pz4wQ0OnDluC6Eg4Ko3Vexy/SrSynglw/eR+OhkzmqFCZa/OFa/RgAOQ==", + "license": "MIT", + "dependencies": { + "minimist": "^1.2.5" + }, + "bin": { + "gonzales": "bin/gonzales.js" + }, + "engines": { + "node": ">=0.6.0" + } + }, "node_modules/google-auth-library": { "version": "9.15.1", "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-9.15.1.tgz", @@ -26886,6 +26946,12 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/mdn-data": { + "version": "2.21.0", + "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.21.0.tgz", + "integrity": "sha512-+ZKPQezM5vYJIkCxaC+4DTnRrVZR1CgsKLu5zsQERQx6Tea8Y+wMx5A24rq8A8NepCeatIQufVAekKNgiBMsGQ==", + "license": "CC0-1.0" + }, "node_modules/mdurl": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-2.0.0.tgz", diff --git a/package.json b/package.json index 5e17a419b..e9f9dc4df 100644 --- a/package.json +++ b/package.json @@ -27,7 +27,8 @@ "test": "mocha -r ts-node/register test/**/*.ts", "tsc": "tsc -t es5", "storybook": "npm -w @dash/components run storybook", - "build-storybook": "npm -w @dash/components run build-storybook" + "build-storybook": "npm -w @dash/components run build-storybook", + "lint:css": "stylelint '**/*.{css,scss}'" }, "devDependencies": { "@eslint/js": "^9.10.0", @@ -104,6 +105,7 @@ "@dash/components": "file:packages/components", "@emotion/react": "^11.11.1", "@emotion/styled": "^11.11.0", + "@eslint/css": "^0.8.1", "@ffmpeg-installer/ffmpeg": "^1.1.0", "@ffmpeg/core": "^0.12.5", "@ffmpeg/ffmpeg": "^0.12.10", @@ -193,6 +195,7 @@ "dompurify": "^3.1.7", "dotenv": "^16.4.7", "dropbox": "^10.34.0", + "eslint-plugin-css-modules": "^2.12.0", "eslint-webpack-plugin": "^5.0.0", "exif": "^0.6.0", "exifr": "^7.1.3", diff --git a/packages/components/src/components/Button/Button.scss b/packages/components/src/components/Button/Button.scss index c86db9fad..c87198ddf 100644 --- a/packages/components/src/components/Button/Button.scss +++ b/packages/components/src/components/Button/Button.scss @@ -20,8 +20,8 @@ pointer-events: all; &.icon { - padding: 0; - gap: 0; + padding: 0px; + gap: 0px; } .button-content { @@ -44,8 +44,8 @@ width: 100%; height: 100%; z-index: 0; - left: 0; - top: 0; + left: 0px; + top: 0px; position: absolute; transition: 0.4s; } @@ -111,7 +111,7 @@ .label { position: absolute; - bottom: 0; + bottom: 0px; width: 100%; display: flex; justify-content: center; diff --git a/packages/components/src/components/Button/Button.stories.tsx b/packages/components/src/components/Button/Button.stories.tsx index 3893d9ded..9e7e8cb05 100644 --- a/packages/components/src/components/Button/Button.stories.tsx +++ b/packages/components/src/components/Button/Button.stories.tsx @@ -1,94 +1,97 @@ -import { Meta, Story } from '@storybook/react' -import React from 'react' -import * as bi from 'react-icons/bi' -import { Button, IButtonProps } from '..' -import { Colors, Size } from '../../global/globalEnums' -import { Type , getFormLabelSize } from '../../global' +import { Meta, Story } from '@storybook/react'; +import React from 'react'; +import * as bi from 'react-icons/bi'; +import { Button, IButtonProps } from '..'; +import { Type } from '../../global'; +import { Size } from '../../global/globalEnums'; export default { - title: 'Dash/Button', - component: Button, - argTypes: {}, -} as Meta<typeof Button> + title: 'Dash/Button', + component: Button, + argTypes: {}, +} as Meta<typeof Button>; -const Template: Story<IButtonProps> = (args) => <Button {...args} /> +const Template: Story<IButtonProps> = args => <Button {...args} />; -export const Primary = Template.bind({}) +export const Primary = Template.bind({}); Primary.args = { - onClick: () => {}, - text: 'Primary', - type: Type.PRIM, - style: { - fontWeight: 600 - }, - tooltip: 'Primary button' -} + onClick: () => {}, + text: 'Primary', + type: Type.PRIM, + style: { + fontWeight: 600, + }, + tooltip: 'Primary button', +}; -export const Secondary = Template.bind({}) +export const Secondary = Template.bind({}); Secondary.args = { - onClick: () => {}, - text: 'Secondary', - type: Type.SEC, - tooltip: 'Secondary button' -} + onClick: () => {}, + text: 'Secondary', + type: Type.SEC, + tooltip: 'Secondary button', + color: 'green', + background: 'yellow', +}; -export const Tertiary = Template.bind({}) +export const Tertiary = Template.bind({}); Tertiary.args = { - onClick: () => {}, - text: 'Tertiary', - type: Type.TERT, - size: Size.SMALL, -} + onClick: () => {}, + text: 'Tertiary', + type: Type.TERT, + size: Size.SMALL, + background: 'yellow', +}; -export const Small = Template.bind({}) +export const Small = Template.bind({}); Small.args = { - onClick: () => {}, - text: 'Small', - type: Type.PRIM, - size: Size.SMALL, -} + onClick: () => {}, + text: 'Small', + type: Type.PRIM, + size: Size.SMALL, +}; -export const Medium = Template.bind({}) +export const Medium = Template.bind({}); Medium.args = { - onClick: () => {}, - text: 'Medium', - type: Type.PRIM, - size: Size.MEDIUM, -} + onClick: () => {}, + text: 'Medium', + type: Type.PRIM, + size: Size.MEDIUM, +}; -export const Large = Template.bind({}) +export const Large = Template.bind({}); Large.args = { - onClick: () => {}, - text: 'Large', - type: Type.PRIM, - size: Size.LARGE, -} + onClick: () => {}, + text: 'Large', + type: Type.PRIM, + size: Size.LARGE, +}; -export const ButtonWithLeftIcon = Template.bind({}) +export const ButtonWithLeftIcon = Template.bind({}); ButtonWithLeftIcon.args = { - onClick: () => {}, - text: 'New', - icon: <bi.BiPlus />, - iconPosition: 'left', - type: Type.PRIM, -} + onClick: () => {}, + text: 'New', + icon: <bi.BiPlus />, + iconPosition: 'left', + type: Type.PRIM, +}; -export const ButtonWithRightIcon = Template.bind({}) +export const ButtonWithRightIcon = Template.bind({}); ButtonWithRightIcon.args = { - onClick: () => {}, - text: 'More', - iconPosition: 'right', - icon: <bi.BiMobile />, - type: Type.PRIM, -} + onClick: () => {}, + text: 'More', + iconPosition: 'right', + icon: <bi.BiMobile />, + type: Type.PRIM, +}; -export const Label = Template.bind({}) +export const Label = Template.bind({}); Label.args = { - onClick: () => {}, - text: 'Label', - type: Type.PRIM, - style: { - fontWeight: 600 - }, - tooltip: 'Label button' -}
\ No newline at end of file + onClick: () => {}, + text: 'Label', + type: Type.PRIM, + style: { + fontWeight: 600, + }, + tooltip: 'Label button', +}; diff --git a/packages/components/src/components/Dropdown/Dropdown.scss b/packages/components/src/components/Dropdown/Dropdown.scss index f9ea2711a..516c229a5 100644 --- a/packages/components/src/components/Dropdown/Dropdown.scss +++ b/packages/components/src/components/Dropdown/Dropdown.scss @@ -129,8 +129,8 @@ .dropdown-toggle-mini { .toggle-caret { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; } } } diff --git a/packages/components/src/components/EditableText/EditableText.scss b/packages/components/src/components/EditableText/EditableText.scss index 15965e97e..691b05590 100644 --- a/packages/components/src/components/EditableText/EditableText.scss +++ b/packages/components/src/components/EditableText/EditableText.scss @@ -16,18 +16,18 @@ justify-content: center; align-items: center; height: 100%; - right: 0; - top: 0; + right: 0px; + top: 0px; } .editableText-background { width: 100%; height: 100%; - z-index: -1; + z-index: -1px; position: absolute; transition: 0.4s; - top: 0; - left: 0; + top: 0px; + left: 0px; } &.primary { diff --git a/packages/components/src/components/FormInput/FormInput.scss b/packages/components/src/components/FormInput/FormInput.scss index 2554cbd01..187827724 100644 --- a/packages/components/src/components/FormInput/FormInput.scss +++ b/packages/components/src/components/FormInput/FormInput.scss @@ -58,7 +58,7 @@ .formInput-label { position: absolute; - top: 0; + top: 0px; transform: translate(0px, 8px); display: block; transition: 0.2s; diff --git a/packages/components/src/components/Overlay/Overlay.scss b/packages/components/src/components/Overlay/Overlay.scss index 5ba4f802c..2c3d9530d 100644 --- a/packages/components/src/components/Overlay/Overlay.scss +++ b/packages/components/src/components/Overlay/Overlay.scss @@ -1,9 +1,9 @@ .overlay-container { width: 100vw; height: 100vh; - top: 0; - left: 0; + top: 0px; + left: 0px; background: pink; position: absolute; pointer-events: none; -}
\ No newline at end of file +} diff --git a/packages/components/src/components/Toggle/Toggle.stories.tsx b/packages/components/src/components/Toggle/Toggle.stories.tsx index 28ab2e712..6adf63424 100644 --- a/packages/components/src/components/Toggle/Toggle.stories.tsx +++ b/packages/components/src/components/Toggle/Toggle.stories.tsx @@ -1,35 +1,37 @@ -import { Meta, Story } from '@storybook/react' -import React from 'react' -import * as bi from 'react-icons/bi' -import { IToggleProps, Toggle, ToggleType } from './Toggle' -import { Type , getFormLabelSize } from '../../global' +import { Meta, Story } from '@storybook/react'; +import React from 'react'; +import * as bi from 'react-icons/bi'; +import { Type } from '../../global'; +import { IToggleProps, Toggle, ToggleType } from './Toggle'; export default { - title: 'Dash/Toggle', - component: Toggle, - argTypes: {}, -} as Meta<typeof Toggle> + title: 'Dash/Toggle', + component: Toggle, + argTypes: {}, +} as Meta<typeof Toggle>; -const Template: Story<IToggleProps> = (args) => <Toggle {...args} /> +const Template: Story<IToggleProps> = args => <Toggle {...args} />; -export const Button = Template.bind({}) +export const Button = Template.bind({}); Button.args = { - // text: 'Button', - type: Type.TERT, - icon: <bi.BiAbacus/>, - toggleType: ToggleType.BUTTON, - tooltip: 'Test tooltip' -} + // text: 'Button', + type: Type.PRIM, + icon: <bi.BiAbacus />, + toggleType: ToggleType.BUTTON, + tooltip: 'Test tooltip', + color: 'green', + background: 'yellow', +}; -export const Checkbox = Template.bind({}) +export const Checkbox = Template.bind({}); Checkbox.args = { - type: Type.SEC, - toggleType: ToggleType.CHECKBOX -} + type: Type.SEC, + toggleType: ToggleType.CHECKBOX, +}; -export const Switch = Template.bind({}) +export const Switch = Template.bind({}); Switch.args = { - text: 'Button', - type: Type.SEC, - toggleType: ToggleType.SWITCH -}
\ No newline at end of file + text: 'Button', + type: Type.SEC, + toggleType: ToggleType.SWITCH, +}; diff --git a/packages/components/src/global/globalCssVariables.scss b/packages/components/src/global/globalCssVariables.scss index ebc44106d..99fe7fb11 100644 --- a/packages/components/src/global/globalCssVariables.scss +++ b/packages/components/src/global/globalCssVariables.scss @@ -59,7 +59,7 @@ $small-text: 9px; // $sans-serif: "Roboto Slab", sans-serif; // misc values -$search-thumnail-size: 130; +$search-thumnail-size: 130px; $topbar-height: 50px; $antimodemenu-height: 36px; diff --git a/src/client/util/BranchingTrailManager.tsx b/src/client/util/BranchingTrailManager.tsx index 65336812d..a0871514c 100644 --- a/src/client/util/BranchingTrailManager.tsx +++ b/src/client/util/BranchingTrailManager.tsx @@ -1,5 +1,3 @@ -/* eslint-disable react/no-unused-class-component-methods */ -/* eslint-disable react/no-array-index-key */ import { action, computed, makeObservable, observable } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; @@ -52,7 +50,6 @@ export class BranchingTrailManager extends React.Component { this.slideHistoryStack = newArr; }); - // eslint-disable-next-line react/sort-comp observeDocumentChange = (targetDoc: Doc, pres: PresBox) => { const presId = pres.Document[Id]; if (this.prevPresId === presId) { diff --git a/src/client/util/CaptureManager.scss b/src/client/util/CaptureManager.scss index e7cbb4287..9e81f2669 100644 --- a/src/client/util/CaptureManager.scss +++ b/src/client/util/CaptureManager.scss @@ -67,7 +67,7 @@ font-weight: bold; text-align: left; color: black; - width: 80; + width: 80px; margin-right: 50px; margin-bottom: 5px; } @@ -114,8 +114,8 @@ .buttons { display: flex; position: absolute; - bottom: 0; - right: 15; + bottom: 0px; + right: 15px; justify-content: flex-end; align-items: center; height: 60px; diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index a25c491d9..45feb0b2f 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -562,7 +562,7 @@ pie title Minerals in my tap water const reqdToolOps:DocumentOptions = { title: "My Tools", isSystem: true, ignoreClick: true, layout_boxShadow: "0 0", layout_explainer: "This is a palette of documents that can be created.", _layout_dontCenter: "y", - _layout_showTitle: "title", _width: 500, _yMargin: 20, _lockedPosition: true, _forceActive: true, _dragOnlyWithinContainer: true, layout_hideContextMenu: true, _chromeHidden: true, + _layout_showTitle: "title", _width: 500, _lockedPosition: true, _forceActive: true, _dragOnlyWithinContainer: true, layout_hideContextMenu: true, _chromeHidden: true, }; return DocUtils.AssignDocField(doc, field, (opts, items) => Docs.Create.StackingDocument(items??[], opts), reqdToolOps, [creatorBtns, userBtns]); } @@ -994,7 +994,7 @@ pie title Minerals in my tap water const reqdOpts:DocumentOptions = { title: "My Imports", _forceActive: true, _layout_showTitle: "title", childLayoutString: ImportElementBox.LayoutString('data'), _dragOnlyWithinContainer: true, layout_hideContextMenu: true, childLimitHeight: 0, onClickScriptDisable:"never", - childDragAction: dropActionType.copy, _layout_autoHeight: true, _yMargin: 50, _gridGap: 15, layout_boxShadow: "0 0", _lockedPosition: true, isSystem: true, _chromeHidden: true, + childDragAction: dropActionType.copy, _layout_autoHeight: true, _gridGap: 15, layout_boxShadow: "0 0", _lockedPosition: true, isSystem: true, dontRegisterView: true, layout_explainer: "This is where documents that are Imported into Dash will go." }; const myImports = DocUtils.AssignDocField(doc, field, (opts) => Docs.Create.MasonryDocument([], opts), reqdOpts, undefined, {onClick: "deselectAll()"}); diff --git a/src/client/util/GroupManager.scss b/src/client/util/GroupManager.scss index 673af16ee..66f11c529 100644 --- a/src/client/util/GroupManager.scss +++ b/src/client/util/GroupManager.scss @@ -21,7 +21,6 @@ } .group-input { - input { padding: 8px; width: 100%; @@ -33,13 +32,13 @@ border-color: inherit; background: white; color: black; - height: 30; + height: 30px; } } .select-users { - margin-right: 3; - max-height: 30; + margin-right: 3px; + max-height: 30px; width: 100%; display: inline-flex; flex-direction: row; @@ -51,7 +50,6 @@ } } - button { align-self: center; outline: none; @@ -108,7 +106,7 @@ .sort-groups { text-align: left; - margin-left: 5; + margin-left: 5px; width: 50px; cursor: pointer; display: flex; @@ -122,7 +120,7 @@ .group-body { justify-content: space-between; - height: 225; + height: 225px; padding-right: 1em; justify-content: space-around; @@ -149,8 +147,8 @@ button { position: absolute; width: 30%; - right: 2; - margin-top: 0; + right: 2px; + margin-top: 0px; } } @@ -161,7 +159,6 @@ min-width: 100%; margin: 2px 0; } - } } -}
\ No newline at end of file +} diff --git a/src/client/util/GroupMemberView.scss b/src/client/util/GroupMemberView.scss index d50569b26..cb1a4e098 100644 --- a/src/client/util/GroupMemberView.scss +++ b/src/client/util/GroupMemberView.scss @@ -6,7 +6,7 @@ overflow: visible; hr { - margin-top: 20; + margin-top: 20px; } button { @@ -31,7 +31,7 @@ } .editing-header { - margin-bottom: 5; + margin-bottom: 5px; .group-title { font-weight: bold; @@ -39,7 +39,7 @@ text-align: center; border: none; outline: none; - height: 20; + height: 20px; text-overflow: ellipsis; background: none; @@ -57,12 +57,12 @@ .group-buttons { display: flex; - margin-top: 5; - margin-bottom: 25; + margin-top: 5px; + margin-bottom: 25px; .add-member-dropdown { - margin-right: 3; - max-height: 30; + margin-right: 3px; + max-height: 30px; width: 250px; display: inline-flex; flex-direction: row; @@ -108,11 +108,9 @@ .remove-button { position: absolute; - right: 10; + right: 10px; cursor: pointer; } } } - - -}
\ No newline at end of file +} diff --git a/src/client/util/LinkFollower.ts b/src/client/util/LinkFollower.ts index 6081c3fae..a4f54f1cf 100644 --- a/src/client/util/LinkFollower.ts +++ b/src/client/util/LinkFollower.ts @@ -134,6 +134,6 @@ export class LinkFollower { // eslint-disable-next-line prefer-arrow-callback ScriptingGlobals.add(function followLink(doc: Doc, altKey: boolean) { - DocumentView.DeselectAll(); + // DocumentView.DeselectAll(); return LinkFollower.FollowLink(undefined, doc, altKey) ? undefined : { select: true }; }); diff --git a/src/client/util/PingManager.ts b/src/client/util/PingManager.ts index 0e4f8cab0..593978b4a 100644 --- a/src/client/util/PingManager.ts +++ b/src/client/util/PingManager.ts @@ -27,7 +27,7 @@ export class PingManager { this.IsBeating = status; setTimeout(this.showAlert, 100); }); - Networking.PostToServer('/ping', { date: new Date() }) + Networking.PostToServer('/DashPing', { date: new Date() }) .then(res => { SnappingManager.SetServerVersion((res as { message: string }).message); !this.IsBeating && setIsBeating(true); diff --git a/src/client/util/SettingsManager.scss b/src/client/util/SettingsManager.scss index f81f17589..51b719200 100644 --- a/src/client/util/SettingsManager.scss +++ b/src/client/util/SettingsManager.scss @@ -26,7 +26,7 @@ font-size: 16; font-weight: bold; text-align: left; - width: 80; + width: 80px; margin-right: 50px; } @@ -81,7 +81,7 @@ .acl-text { color: black; - margin-top: 2; + margin-top: 2px; text-align: left; } } @@ -119,7 +119,7 @@ .preferences-color-text { margin-top: 3px; - margin-right: 4; + margin-right: 4px; flex: 1 1 auto; text-align: left; } @@ -134,8 +134,8 @@ margin-top: 2px; .preferences-font-text { - margin-top: 4; - margin-right: 4; + margin-top: 4px; + margin-right: 4px; margin-bottom: 2px; text-align: left; } @@ -149,7 +149,7 @@ .font-select { height: 35px; font-size: 9; - margin-right: 6; + margin-right: 6px; border-radius: 5px; width: 65%; @@ -171,9 +171,9 @@ } .preferences-check { - margin-right: 4; + margin-right: 4px; margin-bottom: -3; - margin-left: 5; + margin-left: 5px; margin-top: -1px; display: inline-block; padding-left: 5px; @@ -205,14 +205,14 @@ .error-text { color: #c40233; font-size: 10; - margin-bottom: 4; + margin-bottom: 4px; } .success-text { - width: 300; + width: 300px; margin-left: -20; font-size: 10; - margin-bottom: 4; + margin-bottom: 4px; margin-top: -3; color: #009f6b; } @@ -225,7 +225,7 @@ text-transform: uppercase; letter-spacing: 2px; font-size: 19; - margin-top: 0; + margin-top: 0px; font-weight: bold; } @@ -246,7 +246,7 @@ font-style: normal; font-size: 15; font-weight: normal; - padding: 0; + padding: 0px; .padding { padding: 0 0 0 20px; @@ -273,8 +273,8 @@ align-items: center; flex-direction: column; bottom: 10px; - left: 0; - right: 0; + left: 0px; + right: 0px; .settings-username { padding-right: 0px; diff --git a/src/client/util/SharingManager.scss b/src/client/util/SharingManager.scss index c9f86f0e1..553f3a184 100644 --- a/src/client/util/SharingManager.scss +++ b/src/client/util/SharingManager.scss @@ -4,7 +4,7 @@ .select { text-align: justify; - text-align-last: end + text-align-last: end; } .sharing-contents { @@ -36,15 +36,14 @@ } .share-container { - .share-setup { display: flex; margin-bottom: 20px; align-items: center; - max-height: 28; + max-height: 28px; .user-search { - max-height: 30; + max-height: 30px; width: 90%; display: inline-flex; flex-direction: row; @@ -68,7 +67,7 @@ text-align-last: end; font-size: 13px; min-width: 90px; - height: 28; + height: 28px; margin-left: 2px; } @@ -99,8 +98,8 @@ display: flex; float: right; align-items: baseline; - margin-top: -12; - margin-bottom: 10; + margin-top: -12px; + margin-bottom: 10px; .layoutDoc-acls, .myDocs-acls { @@ -109,7 +108,7 @@ label { font-weight: normal; font-style: italic; - padding-right: 12; + padding-right: 12px; } input { @@ -127,13 +126,13 @@ .group-container { width: 50%; display: flex; - top:0; + top: 0px; flex-direction: column; border-radius: 4px; .user-sort { text-align: left; - margin-left: 10; + margin-left: 10px; width: 100%; cursor: pointer; } @@ -180,7 +179,7 @@ padding: 0 10; margin: 0 5; transition: transform 0.2s; - height: 25; + height: 25px; } } @@ -205,7 +204,7 @@ .people-with { font-size: 14px; - margin: 0; + margin: 0px; padding-top: 3px; font-style: normal; } @@ -216,30 +215,30 @@ } } - .title-individual{ + .title-individual { height: 25px; - padding-left: 2; + padding-left: 2px; width: 97%; border-radius: 4px; margin-top: 10px; margin-left: -8px; font-size: 14; - margin-bottom: -4; + margin-bottom: -4px; border: 2px solid; border-bottom: none; align-items: center; display: flex; } - .title-group{ + .title-group { height: 25px; - padding-left: 2; + padding-left: 2px; width: 97%; border-radius: 4px; margin-top: 10px; margin-left: -8px; font-size: 14; - margin-bottom: -4; + margin-bottom: -4px; border: 2px solid; border-bottom: none; align-items: center; @@ -289,18 +288,17 @@ text-align: right; margin-left: auto; margin-right: -12px; - } .edit-actions { display: flex; position: absolute; align-items: flex-end; - right: -10; + right: -10px; } } - .permissions-dropdown-None{ + .permissions-dropdown-None { height: 100%; min-width: 85px; text-align: right; @@ -325,7 +323,7 @@ border-radius: 6px; border: 1px solid rgb(75, 75, 5); } - .permissions-dropdown-Augment{ + .permissions-dropdown-Augment { height: 100%; min-width: 85px; text-align: right; @@ -333,12 +331,11 @@ padding: 0px; padding-left: 3px; background: rgb(208, 255, 208); - color:rgb(19, 80, 19); + color: rgb(19, 80, 19); border-radius: 6px; border: 1px solid rgb(19, 80, 19); - } - .permissions-dropdown-View{ + .permissions-dropdown-View { height: 100%; min-width: 85px; text-align: right; @@ -350,7 +347,7 @@ border-radius: 6px; border: 1px solid rgb(25, 25, 101); } - .permissions-dropdown-Not-Shared{ + .permissions-dropdown-Not-Shared { height: 100%; min-width: 85px; text-align: right; @@ -398,4 +395,4 @@ // padding-top: 12px; // } // } -}
\ No newline at end of file +} diff --git a/src/client/util/TrackMovements.ts b/src/client/util/TrackMovements.ts index 7da0281c0..74a3be83d 100644 --- a/src/client/util/TrackMovements.ts +++ b/src/client/util/TrackMovements.ts @@ -98,7 +98,6 @@ export class TrackMovements { // new tab was added - need to add it if (tabbedFFViews.size > this.recordingFFViews.size) { - // eslint-disable-next-line no-restricted-syntax for (const DashDoc of tabbedDocs) { if (!this.recordingFFViews.has(DashDoc)) { if (isFFView(DashDoc)) { @@ -112,7 +111,6 @@ export class TrackMovements { } // tab was removed - need to remove it from recordingFFViews else if (tabbedFFViews.size < this.recordingFFViews.size) { - // eslint-disable-next-line no-restricted-syntax for (const [doc] of this.recordingFFViews) { if (!tabbedFFViews.has(doc)) { this.removeRecordingFFView(doc); diff --git a/src/client/util/clamp.js b/src/client/util/clamp.js index 9c7fd78a4..8d74b5636 100644 --- a/src/client/util/clamp.js +++ b/src/client/util/clamp.js @@ -1,15 +1,15 @@ -"use strict"; +'use strict'; -Object.defineProperty(exports, "__esModule", { - value: true +Object.defineProperty(exports, '__esModule', { + value: true, }); -exports.default = clamp; function clamp(min, val, max) { - if (val < min) { - return min; - } - if (val > max) { - return max; - } - return val; -}
\ No newline at end of file + if (val < min) { + return min; + } + if (val > max) { + return max; + } + return val; +} +exports.default = clamp; diff --git a/src/client/util/convertToCSSPTValue.js b/src/client/util/convertToCSSPTValue.js index 66f8db5a1..032385d81 100644 --- a/src/client/util/convertToCSSPTValue.js +++ b/src/client/util/convertToCSSPTValue.js @@ -3,11 +3,8 @@ Object.defineProperty(exports, '__esModule', { value: true, }); -exports.PT_TO_PX_RATIO = exports.PX_TO_PT_RATIO = undefined; -exports.default = convertToCSSPTValue; -exports.toClosestFontPtSize = toClosestFontPtSize; -var SIZE_PATTERN = /([\d\.]+)(px|pt)/i; +var SIZE_PATTERN = /([\d.]+)(px|pt)/i; var PX_TO_PT_RATIO = (exports.PX_TO_PT_RATIO = 0.7518796992481203); // 1 / 1.33. var PT_TO_PX_RATIO = (exports.PT_TO_PX_RATIO = 1.33); @@ -39,3 +36,7 @@ function toClosestFontPtSize(styleValue) { return Math.abs(curr - originalPTValue) < Math.abs(prev - originalPTValue) ? curr : prev; }, Number.NEGATIVE_INFINITY); } + +exports.PT_TO_PX_RATIO = exports.PX_TO_PT_RATIO = undefined; +exports.default = convertToCSSPTValue; +exports.toClosestFontPtSize = toClosestFontPtSize; diff --git a/src/client/util/reportManager/ReportManager.scss b/src/client/util/reportManager/ReportManager.scss index 806741c22..65894fbd6 100644 --- a/src/client/util/reportManager/ReportManager.scss +++ b/src/client/util/reportManager/ReportManager.scss @@ -14,8 +14,8 @@ } h2 { - margin: 0; - padding: 0; + margin: 0px; + padding: 0px; font-size: 24px; } } @@ -27,8 +27,8 @@ gap: 4px; h2 { - margin: 0; - padding: 0; + margin: 0px; + padding: 0px; padding-bottom: 8px; font-size: 24px; } @@ -92,7 +92,7 @@ outline: none; border-bottom: 1px solid; padding: 8px; - padding-left: 0; + padding-left: 0px; transition: all 0.2s ease; background: transparent; @@ -178,15 +178,15 @@ cursor: pointer; font-size: 14px; font-weight: 400; - padding: 0; - margin: 0; + padding: 0px; + margin: 0px; } .issue-title { font-size: 16px; font-weight: 500; - padding: 0; - margin: 0; + padding: 0px; + margin: 0px; } } @@ -211,8 +211,8 @@ .file-list { box-sizing: border-box; - margin: 0; - padding: 0; + margin: 0px; + padding: 0px; font-size: 14px; width: 100%; overflow-x: auto; @@ -251,8 +251,8 @@ .issue-title { font-size: 24px; - margin: 0; - padding: 0; + margin: 0px; + padding: 0px; } .issue-date { @@ -314,8 +314,8 @@ .report-media-content::after { content: ''; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); /* Adjust the opacity as desired */ diff --git a/src/client/util/reportManager/ReportManager.tsx b/src/client/util/reportManager/ReportManager.tsx index a6b5911f7..87e8a8bf1 100644 --- a/src/client/util/reportManager/ReportManager.tsx +++ b/src/client/util/reportManager/ReportManager.tsx @@ -1,4 +1,3 @@ -/* eslint-disable react/no-unused-class-component-methods */ import { Octokit } from '@octokit/core'; import { Button, Dropdown, DropdownType, IconButton, Type } from '@dash/components'; import { action, makeObservable, observable } from 'mobx'; @@ -31,7 +30,6 @@ export class ReportManager extends React.Component<object> { @observable private isOpen = false; @observable private query = ''; - // eslint-disable-next-line react/sort-comp @action private setQuery = (q: string) => { this.query = q; }; diff --git a/src/client/views/ContextMenu.scss b/src/client/views/ContextMenu.scss index d22c4d096..337c976cb 100644 --- a/src/client/views/ContextMenu.scss +++ b/src/client/views/ContextMenu.scss @@ -68,8 +68,8 @@ width: 100%; height: 100%; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; z-index: 0; filter: opacity(0); } @@ -187,10 +187,10 @@ display: flex; .close-menu { - margin-top: 0; - margin-bottom: 0; - margin-right: 0; - padding: 0; + margin-top: 0px; + margin-bottom: 0px; + margin-right: 0px; + padding: 0px; margin-left: auto; z-index: 999999999; width: 20px; diff --git a/src/client/views/DashboardView.scss b/src/client/views/DashboardView.scss index daa711bc4..d74441b9c 100644 --- a/src/client/views/DashboardView.scss +++ b/src/client/views/DashboardView.scss @@ -79,8 +79,8 @@ $dashboard-container-width: 250px; position: absolute; width: 100%; height: 100%; - left: 0; - top: 0; + left: 0px; + top: 0px; z-index: -1; } } @@ -137,8 +137,8 @@ $dashboard-container-width: 250px; position: absolute; width: 100%; height: 100%; - left: 0; - top: 0; + left: 0px; + top: 0px; z-index: -1; } } diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss index 55eb0b127..25a806abd 100644 --- a/src/client/views/DocumentDecorations.scss +++ b/src/client/views/DocumentDecorations.scss @@ -11,8 +11,8 @@ $resizeHandler: 8px; // Rotation handler .documentDecorations-rotation { border-radius: 100%; - height: 30; - width: 30; + height: 30px; + width: 30px; right: -40; bottom: -20; //top: calc(50% - 15px); @@ -45,15 +45,15 @@ $resizeHandler: 8px; width: 100%; pointer-events: all; border-radius: 50%; - top: 30; // offset by height of documentButtonBar so that items can be clicked without overlap interference + top: 30px; // offset by height of documentButtonBar so that items can be clicked without overlap interference color: black; } } .documentDecorations-container { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; transform-origin: 50% calc(50% + 10px); display: grid; grid-template-rows: $headerHeight $resizeHandler 1fr $resizeHandler; @@ -121,7 +121,7 @@ $resizeHandler: 8px; } > svg { - margin: 0; + margin: 0px; } } @@ -150,7 +150,7 @@ $resizeHandler: 8px; } > svg { - margin: 0; + margin: 0px; } } &:hover { @@ -185,7 +185,7 @@ $resizeHandler: 8px; } > svg { - margin: 0; + margin: 0px; } } @@ -246,7 +246,7 @@ $resizeHandler: 8px; display: inline; position: relative; top: -2.5; - left: 35; + left: 35px; zoom: 0.7; } @@ -360,8 +360,8 @@ $resizeHandler: 8px; left: 7px; top: 7px; background: global.$medium-gray; - height: 10; - width: 10; + height: 10px; + width: 10px; opacity: 0.5; pointer-events: all; cursor: nwse-resize; @@ -371,8 +371,8 @@ $resizeHandler: 8px; position: relative; background: black; color: rgb(145, 144, 144); - height: 20; - width: 20; + height: 20px; + width: 20px; pointer-events: all; margin: auto; display: flex; @@ -380,8 +380,8 @@ $resizeHandler: 8px; border-radius: 100%; cursor: default; svg { - width: 10; - height: 10; + width: 10px; + height: 10px; margin: auto; } } @@ -389,7 +389,7 @@ $resizeHandler: 8px; .documentDecorations-rotationPath { position: absolute; width: 100%; - height: 0; + height: 0px; transform: translate(0px, -25%); padding-bottom: 100%; border-radius: 100%; diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index 383960444..9172a3734 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -912,8 +912,8 @@ export class DocumentDecorations extends ObservableReactComponent<DocumentDecora transform: `rotate(${rotation}deg)`, width: this.Bounds.r - this.Bounds.x + 'px', height: this.Bounds.b - this.Bounds.y + 'px', - left: this.Bounds.x, - top: this.Bounds.y, + left: this.Bounds.r, + top: this.Bounds.b, pointerEvents: 'none', }}> {this._isRotating ? null : ( diff --git a/src/client/views/EditableView.scss b/src/client/views/EditableView.scss index fa4542ac4..333939d03 100644 --- a/src/client/views/EditableView.scss +++ b/src/client/views/EditableView.scss @@ -6,14 +6,14 @@ overflow-y: auto; height: 100%; width: 100%; - min-width: 20; + min-width: 20px; text-overflow: ellipsis; - -ms-overflow-style: none; - scrollbar-width: none; + -ms-overflow-style: none; + scrollbar-width: none; } .editableView-container-editing::-webkit-scrollbar { - display: none; + display: none; } .editableView-container-editing-oneLine { @@ -44,4 +44,3 @@ border: none; outline: none; } - diff --git a/src/client/views/FilterPanel.scss b/src/client/views/FilterPanel.scss index 508b1ee1f..e32db000f 100644 --- a/src/client/views/FilterPanel.scss +++ b/src/client/views/FilterPanel.scss @@ -1,4 +1,3 @@ - .filterBox-flyout { display: block; text-align: left; @@ -29,7 +28,7 @@ // .filterBox-bottom { // // position: fixed; -// // bottom: 0; +// // bottom: 0px; // // width: 100%; // } @@ -88,7 +87,7 @@ // padding-bottom: 20px; // border-bottom: 2px solid black; // position: fixed; -// top: 0; +// top: 0px; // width: 100%; // } @@ -154,8 +153,8 @@ flex-direction: column; width: 100%; position: relative; - right: 0; - top: 0; + right: 0px; + top: 0px; z-index: 1; // background-color: #9f9f9f; @@ -240,60 +239,52 @@ transition: all 0.3s ease-out; display: flex; flex-direction: row; - padding: 5px; - + padding: 5px; - &:hover{ + &:hover { border-color: #e9e9e9; - background-color: #6d6c6c + background-color: #6d6c6c; } - .hotKey-icon, .hotKey-close{ + .hotKey-icon, + .hotKey-close { background-color: transparent; border-radius: 10%; padding: 5px; - - &:hover{ + &:hover { background-color: #616060; } } - .hotKey-close{ + .hotKey-close { right: 30px; - position: fixed; + position: fixed; padding-top: 10px; - -} + } - .hotkey-title{ + .hotkey-title { top: 6px; position: relative; cursor: text; - } - .hotkey-title-input{ + .hotkey-title-input { background-color: transparent; border: none; border-color: transparent; outline: none; cursor: text; - } } .hotKeyButtons { position: relative; width: 100%; - } .hotKey-icon-button { - - background-color: transparent; - - + background-color: transparent; } .icon-panel { @@ -305,24 +296,19 @@ border-radius: 10%; background-color: #323232; - .icon-panel-button{ + .icon-panel-button { background-color: #323232; border-radius: 10%; - - &:hover{ - background-color:#7a7878 + &:hover { + background-color: #7a7878; } } - - - } - // .sliderBox-outerDiv { // width: 30%;// width: calc(100% - 14px); // 14px accounts for handles that are at the max value of the slider that would extend outside the box -// height: 40; // height: 100%; +// height: 40px; // height: 100%; // border-radius: inherit; // display: flex; // flex-direction: column; diff --git a/src/client/views/GestureOverlay.scss b/src/client/views/GestureOverlay.scss index bfe2d5c64..0fa3fd973 100644 --- a/src/client/views/GestureOverlay.scss +++ b/src/client/views/GestureOverlay.scss @@ -3,7 +3,7 @@ height: 100%; position: absolute; touch-action: none; - top: 0; + top: 0px; .pointerBubbles { width: 100%; diff --git a/src/client/views/InkStroke.scss b/src/client/views/InkStroke.scss index c672824bf..0595283fc 100644 --- a/src/client/views/InkStroke.scss +++ b/src/client/views/InkStroke.scss @@ -8,8 +8,8 @@ svg:not(:root) { overflow: visible !important; position: absolute; - left: 0; - top: 0; + left: 0px; + top: 0px; } } diff --git a/src/client/views/InkTangentHandles.tsx b/src/client/views/InkTangentHandles.tsx index 577acc4d1..0af46df5d 100644 --- a/src/client/views/InkTangentHandles.tsx +++ b/src/client/views/InkTangentHandles.tsx @@ -105,7 +105,6 @@ export class InkTangentHandles extends React.Component<InkHandlesProps> { return ( <> {tangentHandles.map((pts, i) => ( - // eslint-disable-next-line react/no-array-index-key <svg height="10" width="10" key={`hdl${i}`}> <circle cx={pts.X} @@ -135,7 +134,6 @@ export class InkTangentHandles extends React.Component<InkHandlesProps> { /> ); return ( - // eslint-disable-next-line react/no-array-index-key <svg height="100" width="100" key={`line${i}`}> {tangentLine(pts.X1, pts.Y1, pts.X2, pts.Y2)} {tangentLine(pts.X2, pts.Y2, pts.X3, pts.Y3)} diff --git a/src/client/views/LightboxView.scss b/src/client/views/LightboxView.scss index 3e65843df..7a481d887 100644 --- a/src/client/views/LightboxView.scss +++ b/src/client/views/LightboxView.scss @@ -1,12 +1,12 @@ .lightboxView-navBtn { margin: auto; position: absolute; - right: 19; - top: 10; + right: 19px; + top: 10px; background: transparent; - border-radius: 8; + border-radius: 8px; opacity: 0.7; - width: 25; + width: 25px; flex-direction: column; display: flex; &:hover { @@ -16,12 +16,12 @@ .lightboxView-tabBtn { margin: auto; position: absolute; - right: 54; - top: 10; + right: 54px; + top: 10px; background: transparent; - border-radius: 8; + border-radius: 8px; opacity: 0.7; - width: 25; + width: 25px; flex-direction: column; display: flex; &:hover { @@ -31,12 +31,12 @@ .lightboxView-paletteBtn { margin: auto; position: absolute; - right: 89; - top: 10; + right: 89px; + top: 10px; background: transparent; - border-radius: 8; + border-radius: 8px; opacity: 0.7; - width: 25; + width: 25px; flex-direction: column; display: flex; &:hover { @@ -47,12 +47,12 @@ .lightboxView-penBtn { margin: auto; position: absolute; - right: 124; - top: 10; + right: 124px; + top: 10px; background: transparent; - border-radius: 8; + border-radius: 8px; opacity: 0.7; - width: 25; + width: 25px; flex-direction: column; display: flex; &:hover { @@ -62,12 +62,12 @@ .lightboxView-exploreBtn { margin: auto; position: absolute; - right: 159; - top: 10; + right: 159px; + top: 10px; background: transparent; - border-radius: 8; + border-radius: 8px; opacity: 0.7; - width: 25; + width: 25px; flex-direction: column; display: flex; &:hover { @@ -76,8 +76,8 @@ } .lightboxView-frame { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; z-index: 1000; @@ -91,9 +91,9 @@ margin: auto; position: relative; background: transparent; - border-radius: 8; + border-radius: 8px; opacity: 0.7; - width: 35; + width: 35px; &:hover { opacity: 1; } diff --git a/src/client/views/Main.scss b/src/client/views/Main.scss index bea1de435..df4160fc1 100644 --- a/src/client/views/Main.scss +++ b/src/client/views/Main.scss @@ -12,10 +12,10 @@ body { overflow: hidden; font-family: global.$sans-serif; font-size: global.$body-text; - margin: 0; + margin: 0px; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; } // div { diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss index db949285b..d5e6b8998 100644 --- a/src/client/views/MainView.scss +++ b/src/client/views/MainView.scss @@ -10,7 +10,7 @@ body { .dash-tooltip { font-size: 11px; padding: 2px; - max-width: 150; + max-width: 150px; line-height: 150%; } @@ -49,8 +49,8 @@ body { .mainView-snapLines { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; pointer-events: none; @@ -61,8 +61,8 @@ body { height: 100%; position: absolute; pointer-events: all; - top: 0; - left: 0; + top: 0px; + left: 0px; z-index: 1; touch-action: none; } @@ -86,8 +86,8 @@ body { .properties-container { height: 100%; position: absolute; - right: 0; - top: 0; + right: 0px; + top: 0px; } .mainView-propertiesDragger-minified, @@ -98,7 +98,7 @@ body { width: 17px; position: absolute; top: 50%; - border-radius: 0; + border-radius: 0px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; border-right: unset; @@ -141,7 +141,7 @@ body { } .propertiesView { - left: 0; + left: 0px; position: absolute; z-index: 2; // background-color: linen; //$light-gray; @@ -165,7 +165,7 @@ body { } ::-webkit-scrollbar { - width: 0; + width: 0px; } } @@ -173,19 +173,19 @@ body { width: 100%; height: 100%; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; overflow: hidden; } .buttonContainer { position: absolute; - bottom: 0; + bottom: 0px; .mainView-settings { // position: absolute; - // left: 0; - // bottom: 0; + // left: 0px; + // bottom: 0px; border-radius: 25%; margin-left: -5px; background: darkblue; @@ -198,8 +198,8 @@ body { .mainView-logout { position: absolute; - right: 0; - bottom: 0; + right: 0px; + bottom: 0px; font-size: 8px; } @@ -223,12 +223,12 @@ body { } .mainView-libraryFlyout-close { - right: 6; - top: 5; + right: 6px; + top: 5px; position: absolute; margin-right: 6px; z-index: 10; - margin-bottom: 10; + margin-bottom: 10px; } } diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index 686f8ed88..13b14617c 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -1039,7 +1039,7 @@ export class MainView extends ObservableReactComponent<object> { @computed get inkResources() { return ( - <svg width={0} height={0}> + <svg width={0} height={0} style={{ display: 'block' }}> <defs> <filter id="inkSelectionHalo"> <feColorMatrix diff --git a/src/client/views/MetadataEntryMenu.scss b/src/client/views/MetadataEntryMenu.scss index 28de0b7a5..924476a30 100644 --- a/src/client/views/MetadataEntryMenu.scss +++ b/src/client/views/MetadataEntryMenu.scss @@ -3,7 +3,7 @@ width: 310px; flex-direction: column; - input[type=checkbox] { + input[type='checkbox'] { margin-left: 5px; } } @@ -11,7 +11,7 @@ .metadataEntry-autoSuggester { width: 80%; height: 100%; - margin: 0; + margin: 0px; display: inline-block; } @@ -20,13 +20,13 @@ } .metadataEntry-keys { - max-height: 80; - overflow-y: auto; + max-height: 80px; + overflow-y: auto; display: flex; flex-direction: column; } .metadataEntry-inputArea { - display:inline-block; + display: inline-block; flex-direction: row; } @@ -53,8 +53,8 @@ } .react-autosuggest__input--open { - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; + border-bottom-left-radius: 0px; + border-bottom-right-radius: 0px; } .react-autosuggest__suggestions-container { @@ -78,8 +78,8 @@ } .react-autosuggest__suggestions-list { - margin: 0; - padding: 0; + margin: 0px; + padding: 0px; list-style-type: none; } @@ -90,4 +90,4 @@ .react-autosuggest__suggestion--highlighted { background-color: #ddd; -}
\ No newline at end of file +} diff --git a/src/client/views/OverlayView.scss b/src/client/views/OverlayView.scss index 2e8621b5b..44203e38f 100644 --- a/src/client/views/OverlayView.scss +++ b/src/client/views/OverlayView.scss @@ -1,7 +1,7 @@ .overlayView { position: absolute; pointer-events: none; - top: 0; + top: 0px; width: 100vw; height: 100vh; z-index: 2002; // shouold be greater than LightboxView's z-index so that link lines and the presentation mini player appear @@ -14,8 +14,8 @@ overflow: hidden; display: flex; flex-direction: column; - top: 0; - left: 0; + top: 0px; + left: 0px; pointer-events: all; box-shadow: black 5px 5px 5px; } @@ -46,7 +46,7 @@ float: right; height: 20px; width: 20px; - padding: 0; + padding: 0px; background-color: inherit; } @@ -62,6 +62,6 @@ .overlayView-doc { z-index: 9002; //so that it appears above chroma position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; } diff --git a/src/client/views/PreviewCursor.scss b/src/client/views/PreviewCursor.scss index 82488c750..eef120c58 100644 --- a/src/client/views/PreviewCursor.scss +++ b/src/client/views/PreviewCursor.scss @@ -2,8 +2,8 @@ color: black; position: absolute; transform-origin: left top; - top: 0; - left: 0; + top: 0px; + left: 0px; pointer-events: none; opacity: 1; z-index: 1001; diff --git a/src/client/views/PropertiesSection.tsx b/src/client/views/PropertiesSection.tsx index 12a46c7a4..9ea9c3a3d 100644 --- a/src/client/views/PropertiesSection.tsx +++ b/src/client/views/PropertiesSection.tsx @@ -1,4 +1,3 @@ -/* eslint-disable react/require-default-props */ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { action, computed } from 'mobx'; import { observer } from 'mobx-react'; diff --git a/src/client/views/PropertiesView.scss b/src/client/views/PropertiesView.scss index 280de4893..de3012948 100644 --- a/src/client/views/PropertiesView.scss +++ b/src/client/views/PropertiesView.scss @@ -5,7 +5,7 @@ } .propertiesView-presentationTrails-title-icon { position: absolute; - right: 4; + right: 4px; } .propertiesView-palette { cursor: pointer; @@ -24,7 +24,7 @@ } .propertiesView { height: 100%; - width: 250; + width: 250px; font-family: 'Roboto'; font-size: 12px; cursor: auto; @@ -61,7 +61,7 @@ } .propertiesView-info { - margin-top: -5; + margin-top: -5px; float: right; font-size: 20; path { @@ -78,10 +78,10 @@ display: flex; button { - width: 15; - height: 15; - padding: 0; - margin-top: -5; + width: 15px; + height: 15px; + padding: 0px; + margin-top: -5px; } } @@ -89,8 +89,8 @@ display: flex; button { - width: 5; - height: 5; + width: 5px; + height: 5px; } input { @@ -171,16 +171,16 @@ display: flex; button { - width: 15; - height: 15; - padding: 0; - margin-top: -5; + width: 15px; + height: 15px; + padding: 0px; + margin-top: -5px; } } button { - width: 5; - height: 5; + width: 5px; + height: 5px; } input { @@ -301,8 +301,8 @@ padding: 7px; border-radius: 7px; margin-right: 32px; - width: 32; - height: 32; + width: 32px; + height: 32px; padding-top: 9px; margin-left: 18px; @@ -318,8 +318,8 @@ padding: 7px; border-radius: 7px; margin-right: 32px; - width: 32; - height: 32; + width: 32px; + height: 32px; padding-top: 9px; padding-left: 10px; @@ -334,8 +334,8 @@ background-color: #333333; padding: 7px; border-radius: 7px; - width: 32; - height: 32; + width: 32px; + height: 32px; padding-top: 9px; padding-left: 10px; @@ -410,7 +410,7 @@ .color-palette { width: 160px; - height: 360; + height: 360px; } .strokeAndFill { @@ -465,7 +465,7 @@ .propertiesView-selectedList { min-width: max-content; width: 100%; - max-height: 180; + max-height: 180px; overflow: hidden; overflow-y: scroll; border-left: solid 1px darkgrey; @@ -475,7 +475,7 @@ .selectedList-items { font-size: 12; font-weight: 300; - margin-top: 1; + margin-top: 1px; } } } @@ -500,7 +500,7 @@ .width-range { margin-right: 1px; - margin-bottom: 6; + margin-bottom: 6px; } } diff --git a/src/client/views/SidebarAnnos.scss b/src/client/views/SidebarAnnos.scss index abfd04f11..c2b9dcce5 100644 --- a/src/client/views/SidebarAnnos.scss +++ b/src/client/views/SidebarAnnos.scss @@ -2,7 +2,7 @@ position: absolute; width: 100%; height: 100%; - right: 0; + right: 0px; .sidebarAnnos-stacking { width: 100%; position: relative; @@ -20,12 +20,12 @@ .sidebarAnnos-filterUser-active { font-weight: bold; font-size: 10px; - padding-left: 5; - padding-right: 5; + padding-left: 5px; + padding-right: 5px; box-shadow: black 1px 1px 3px; - border-radius: 5; - margin: 2; - height: 15; + border-radius: 5px; + margin: 2px; + height: 15px; background-color: lightgrey; } .sidebarAnnos-filterUser, diff --git a/src/client/views/StyleProvider.scss b/src/client/views/StyleProvider.scss index 99796f1fb..cbb1fd5d5 100644 --- a/src/client/views/StyleProvider.scss +++ b/src/client/views/StyleProvider.scss @@ -4,11 +4,11 @@ .styleProvider-lock { z-index: 2; // has to be above title which is z-index 1 font-size: 10; - width: 20; - height: 20; + width: 20px; + height: 20px; position: absolute; - right: -20; - top: 0; + right: -20px; + top: 0px; background: black; pointer-events: all; opacity: 0.3; @@ -20,10 +20,10 @@ cursor: default; } .styleProvider-filter { - right: 20; + right: 20px; .styleProvider-filterShift { - left: 0; - top: 0; + left: 0px; + top: 0px; position: absolute; } .dropdown-container { @@ -33,10 +33,10 @@ } .styleProvider-paint-selected, .styleProvider-paint { - top: 15; + top: 15px; } .styleProvider-paint-selected { - right: -40; + right: -40px; } .styleProvider-lock:hover, .styleProvider-filter:hover { @@ -45,8 +45,8 @@ .styleProvider-treeView-icon, .styleProvider-treeView-icon-active { - margin-left: 0; - margin-right: 0; + margin-left: 0px; + margin-right: 0px; } .styleProvider-treeView-icon { diff --git a/src/client/views/StyleProviderQuiz.scss b/src/client/views/StyleProviderQuiz.scss index 84b3f1fef..53ca34c1b 100644 --- a/src/client/views/StyleProviderQuiz.scss +++ b/src/client/views/StyleProviderQuiz.scss @@ -13,8 +13,8 @@ .check-icon { position: absolute; - right: 40; - bottom: 10; + right: 40px; + bottom: 10px; color: green; display: inline-block; font-size: 20px; @@ -23,8 +23,8 @@ .redo-icon { position: absolute; - right: 10; - bottom: 10; + right: 10px; + bottom: 10px; color: black; display: inline-block; font-size: 20px; diff --git a/src/client/views/animationtimeline/Timeline.scss b/src/client/views/animationtimeline/Timeline.scss index e1d3b190c..3a50183d2 100644 --- a/src/client/views/animationtimeline/Timeline.scss +++ b/src/client/views/animationtimeline/Timeline.scss @@ -112,8 +112,8 @@ $timelineDark: #77a1aa; input { position: absolute; opacity: 0; - height: 0; - width: 0; + height: 0px; + width: 0px; } .round-toggle-slider { diff --git a/src/client/views/animationtimeline/TimelineMenu.tsx b/src/client/views/animationtimeline/TimelineMenu.tsx index 0d7873931..79283479c 100644 --- a/src/client/views/animationtimeline/TimelineMenu.tsx +++ b/src/client/views/animationtimeline/TimelineMenu.tsx @@ -1,5 +1,3 @@ -/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */ -/* eslint-disable jsx-a11y/click-events-have-key-events */ import { IconLookup } from '@fortawesome/fontawesome-svg-core'; import { faChartLine, faClipboard } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; @@ -19,7 +17,7 @@ export class TimelineMenu extends React.Component { @observable private _y = 0; @observable private _currentMenu: JSX.Element[] = []; - constructor(props: any) { + constructor(props: object) { super(props); makeObservable(this); TimelineMenu.Instance = this; diff --git a/src/client/views/animationtimeline/TimelineOverview.tsx b/src/client/views/animationtimeline/TimelineOverview.tsx index 7bf685c9e..fff756980 100644 --- a/src/client/views/animationtimeline/TimelineOverview.tsx +++ b/src/client/views/animationtimeline/TimelineOverview.tsx @@ -1,4 +1,3 @@ -/* eslint-disable react/no-unused-prop-types */ import { action, IReactionDisposer, observable, reaction, runInAction } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; @@ -14,7 +13,7 @@ interface TimelineOverviewProps { isAuthoring: boolean; parent: Timeline; changeCurrentBarX: (pixel: number) => void; - movePanX: (pixel: number) => any; + movePanX: (pixel: number) => void; time: number; tickSpacing: number; tickIncrement: number; @@ -139,7 +138,7 @@ export class TimelineOverview extends React.Component<TimelineOverviewProps> { const percentVisible = this.visibleTime / this.props.time; const visibleBarWidth = percentVisible * this.activeOverviewWidth; - const percentScrubberStart = this.currentX / this.props.time; + // const percentScrubberStart = this.currentX / this.props.time; let scrubberStart = (this.props.currentBarX / this.props.totalLength) * this.activeOverviewWidth; if (scrubberStart > this.activeOverviewWidth) scrubberStart = this.activeOverviewWidth; diff --git a/src/client/views/collections/CollectionCardDeckView.scss b/src/client/views/collections/CollectionCardDeckView.scss index e6cc398af..981e528cc 100644 --- a/src/client/views/collections/CollectionCardDeckView.scss +++ b/src/client/views/collections/CollectionCardDeckView.scss @@ -18,7 +18,7 @@ } .collectionCardView-flashcardUI { - top: 0; + top: 0px; position: absolute; width: 100%; height: 100%; @@ -33,7 +33,7 @@ } .collectionCardView-cardSizeDragger { position: absolute; - top: 0; + top: 0px; width: 28px; height: 28px; > svg { diff --git a/src/client/views/collections/CollectionCarousel3DView.scss b/src/client/views/collections/CollectionCarousel3DView.scss index 13e6b54c2..361d88cb6 100644 --- a/src/client/views/collections/CollectionCarousel3DView.scss +++ b/src/client/views/collections/CollectionCarousel3DView.scss @@ -12,7 +12,7 @@ position: absolute; top: global.$CAROUSEL3D_TOP * 1%; height: (global.$CAROUSEL3D_SIDE_SCALE * 100) * 1%; - align-items: center; + //align-items: center; transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955); .collectionCarousel3DView-item, @@ -67,8 +67,8 @@ .carousel3DView-fwd-scroll-hidden { position: absolute; display: flex; - width: 30; - height: 30; + width: 30px; + height: 30px; align-items: center; border-radius: 5px; justify-content: center; @@ -78,7 +78,7 @@ .carousel3DView-fwd, .carousel3DView-back { - top: 0; + top: 0px; background: transparent; width: calc((1 - #{global.$CAROUSEL3D_CENTER_SCALE} * 0.33) / 2 * 100%); height: 100%; @@ -94,13 +94,13 @@ .carousel3DView-fwd, .carousel3DView-fwd-scroll, .carousel3DView-fwd-scroll-hidden { - right: 0; + right: 0px; } .carousel3DView-back, .carousel3DView-back-scroll, .carousel3DView-back-scroll-hidden { - left: 0; + left: 0px; } .carousel3DView-fwd-scroll-hidden, diff --git a/src/client/views/collections/CollectionCarouselView.scss b/src/client/views/collections/CollectionCarouselView.scss index 962b590c8..4c999b6dd 100644 --- a/src/client/views/collections/CollectionCarouselView.scss +++ b/src/client/views/collections/CollectionCarouselView.scss @@ -6,10 +6,10 @@ transform-origin: top left; .collectionCarouselView-caption { - height: 50; + height: 50px; display: inline-block; width: 100%; - bottom: 0; + bottom: 0px; position: absolute; } .collectionCarouselView-image { @@ -18,8 +18,8 @@ width: 100%; user-select: none; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; } } .collectionCarouselView-recentlyMissed { @@ -34,8 +34,8 @@ .carouselView-fwd { position: absolute; display: flex; - width: 30; - height: 30; + width: 30px; + height: 30px; align-items: center; border-radius: 5px; justify-content: center; @@ -47,12 +47,12 @@ } .carouselView-fwd { top: calc(50% - 15px); - right: 0; + right: 0px; transform-origin: right top; } .carouselView-back { top: calc(50% - 15px); - left: 0; + left: 0px; transform-origin: top left; } .carouselView-back:hover, diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss index 7c19d39da..de214e2ef 100644 --- a/src/client/views/collections/CollectionDockingView.scss +++ b/src/client/views/collections/CollectionDockingView.scss @@ -17,8 +17,8 @@ } .lm_maximised { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; z-index: 40; } .lm_maximise_placeholder { @@ -62,8 +62,8 @@ text-align: center; } .lm_header ul { - margin: 0; - padding: 0; + margin: 0px; + padding: 0px; list-style-type: none; } .lm_header .lm_tab { @@ -81,11 +81,11 @@ position: absolute; } .lm_header .lm_tab i.lm_left { - top: 0; + top: 0px; left: -2px; } .lm_header .lm_tab i.lm_right { - top: 0; + top: 0px; right: -2px; } .lm_header .lm_tab .lm_title { @@ -97,8 +97,8 @@ width: 14px; height: 14px; position: absolute; - top: 0; - right: 0; + top: 0px; + right: 0px; text-align: center; } .lm_stack.lm_left .lm_header, @@ -118,14 +118,14 @@ .lm_stack.lm_left .lm_header .lm_tabs, .lm_stack.lm_right .lm_header .lm_tabs { transform-origin: left top; - top: 0; + top: 0px; width: 1000px; } .lm_dragProxy.lm_left .lm_header .lm_controls, .lm_dragProxy.lm_right .lm_header .lm_controls, .lm_stack.lm_left .lm_header .lm_controls, .lm_stack.lm_right .lm_header .lm_controls { - bottom: 0; + bottom: 0px; } .lm_dragProxy.lm_left .lm_items, .lm_dragProxy.lm_right .lm_items, @@ -136,7 +136,7 @@ .lm_dragProxy.lm_left .lm_header .lm_tabs, .lm_stack.lm_left .lm_header .lm_tabs { transform: rotate(-90deg) scaleX(-1); - left: 0; + left: 0px; } .lm_dragProxy.lm_left .lm_header .lm_tabs .lm_tab, .lm_stack.lm_left .lm_header .lm_tabs .lm_tab { @@ -156,7 +156,7 @@ .lm_stack.lm_right .lm_header .lm_tabs { transform: rotate(90deg) scaleX(1); left: 100%; - margin-left: 0; + margin-left: 0px; } .lm_dragProxy.lm_right .lm_header .lm_controls, .lm_stack.lm_right .lm_header .lm_controls { @@ -169,7 +169,7 @@ } .lm_dragProxy.lm_bottom .lm_header .lm_tab, .lm_stack.lm_bottom .lm_header .lm_tab { - margin-top: 0; + margin-top: 0px; border-top: none; } .lm_dragProxy.lm_bottom .lm_header .lm_controls, @@ -189,8 +189,8 @@ } .lm_header .lm_controls .lm_tabdropdown:before { content: ''; - width: 0; - height: 0; + width: 0px; + height: 0px; vertical-align: middle; display: inline-block; border-top: 5px dashed; @@ -201,14 +201,14 @@ .lm_header .lm_tabdropdown_list { position: absolute; top: 20px; - right: 0; + right: 0px; z-index: 5; overflow: hidden; } .lm_header .lm_tabdropdown_list .lm_tab { clear: both; padding-right: 10px; - margin: 0; + margin: 0px; } .lm_header .lm_tabdropdown_list .lm_tab .lm_title { width: 100px; @@ -218,8 +218,8 @@ } .lm_dragProxy { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; z-index: 30; } .lm_dragProxy .lm_header { @@ -238,32 +238,32 @@ width: 100%; height: 100%; position: relative; - top: 0; - left: 0; + top: 0px; + left: 0px; } .lm_transition_indicator { display: none; width: 20px; height: 20px; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; z-index: 20; } .lm_popin { width: 20px; height: 20px; position: absolute; - bottom: 0; - right: 0; + bottom: 0px; + right: 0px; z-index: 9999; } .lm_popin > * { width: 100%; height: 100%; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; } .lm_popin > .lm_bg { z-index: 10; @@ -307,7 +307,7 @@ width: max-content; height: 100%; display: flex; - max-width: 100; + max-width: 100px; text-overflow: ellipsis; } @@ -328,7 +328,7 @@ ul.lm_tabs::before { content: ' '; position: absolute; - bottom: 0; + bottom: 0px; width: 100%; z-index: 1; pointer-events: none; @@ -349,9 +349,9 @@ ul.lm_tabs::before { } } .lm_header .lm_tab.lm_active { - padding: 0; + padding: 0px; opacity: 1; - margin: 0; + margin: 0px; box-shadow: none; height: 27px; margin-right: 2px; @@ -405,7 +405,7 @@ ul.lm_tabs::before { } .lm_drag_tab { - padding: 0; + padding: 0px; width: 15px !important; height: 15px !important; position: relative !important; @@ -418,7 +418,7 @@ ul.lm_tabs::before { .lm_close_tab { display: inline-flex !important; - padding: 0; + padding: 0px; opacity: 1 !important; align-self: center; margin-right: 5px; @@ -455,7 +455,7 @@ ul.lm_tabs::before { content: 'x'; margin: auto; position: relative; - top: -2; + top: -2px; font-size: medium; font-family: sans-serif; } @@ -478,8 +478,8 @@ ul.lm_tabs::before { width: 100%; height: 100%; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; .collectionDockingView-drag { touch-action: none; @@ -514,7 +514,7 @@ ul.lm_tabs::before { border-bottom-left-radius: 10px; background: #93939347; z-index: 100; - //left: -3; + //left: -3px; &:hover { background: gray; color: white !important; @@ -524,7 +524,7 @@ ul.lm_tabs::before { content: '+'; margin: auto; font-size: x-large; - top: -4; + top: -4px; position: relative; } .lm_maximise { @@ -548,10 +548,10 @@ ul.lm_tabs::before { } .flexlayout__layout { - left: 0; - top: 0; - right: 0; - bottom: 0; + left: 0px; + top: 0px; + right: 0px; + bottom: 0px; position: absolute; overflow: hidden; } @@ -691,8 +691,8 @@ ul.lm_tabs::before { .flexlayout__tabset_header { position: absolute; - left: 0; - right: 0; + left: 0px; + right: 0px; color: #eee; background-color: #212121; padding: 3px 3px 3px 5px; @@ -702,17 +702,17 @@ ul.lm_tabs::before { .flexlayout__tab_header_inner { position: absolute; - left: 0; - top: 0; - bottom: 0; + left: 0px; + top: 0px; + bottom: 0px; width: 10000px; } .flexlayout__tab_header_outer { background-color: global.$dark-gray; position: absolute; - left: 0; - right: 0; + left: 0px; + right: 0px; /*top: 0px;*/ /*height: 100px;*/ overflow: hidden; @@ -731,23 +731,23 @@ ul.lm_tabs::before { display: flex; flex-direction: row-reverse; align-items: center; - top: 0; - bottom: 0; - right: 0; + top: 0px; + bottom: 0px; + right: 0px; } .flexlayout__tab_toolbar_button-min { width: 20px; height: 20px; border: none; - outline-width: 0; + outline-width: 0px; } .flexlayout__tab_toolbar_button-max { width: 20px; height: 20px; border: none; - outline-width: 0; + outline-width: 0px; } .flexlayout__popup_menu_item { @@ -870,9 +870,9 @@ ul.lm_tabs::before { display: flex; flex-direction: column-reverse; align-items: center; - bottom: 0; - left: 0; - right: 0; + bottom: 0px; + left: 0px; + right: 0px; } .flexlayout__border_toolbar_right { @@ -880,9 +880,9 @@ ul.lm_tabs::before { display: flex; flex-direction: column-reverse; align-items: center; - bottom: 0; - left: 0; - right: 0; + bottom: 0px; + left: 0px; + right: 0px; } .flexlayout__border_toolbar_top { @@ -890,9 +890,9 @@ ul.lm_tabs::before { display: flex; flex-direction: row-reverse; align-items: center; - top: 0; - bottom: 0; - right: 0; + top: 0px; + bottom: 0px; + right: 0px; } .flexlayout__border_toolbar_bottom { @@ -900,8 +900,8 @@ ul.lm_tabs::before { display: flex; flex-direction: row-reverse; align-items: center; - top: 0; - bottom: 0; - right: 0; + top: 0px; + bottom: 0px; + right: 0px; } } diff --git a/src/client/views/collections/CollectionMasonryViewFieldRow.tsx b/src/client/views/collections/CollectionMasonryViewFieldRow.tsx index d1f7971d4..164c6e831 100644 --- a/src/client/views/collections/CollectionMasonryViewFieldRow.tsx +++ b/src/client/views/collections/CollectionMasonryViewFieldRow.tsx @@ -7,6 +7,7 @@ import { emptyFunction, numberRange } from '../../../Utils'; import { Doc } from '../../../fields/Doc'; import { PastelSchemaPalette, SchemaHeaderField } from '../../../fields/SchemaHeaderField'; import { ScriptField } from '../../../fields/ScriptField'; +import { StrCast } from '../../../fields/Types'; import { Docs } from '../../documents/Documents'; import { DragManager } from '../../util/DragManager'; import { CompileScript } from '../../util/Scripting'; @@ -16,6 +17,7 @@ import { undoBatch, undoable } from '../../util/UndoManager'; import { EditableView } from '../EditableView'; import { ObservableReactComponent } from '../ObservableReactComponent'; import { DocumentView } from '../nodes/DocumentView'; +import { ImportElementBox } from '../nodes/importBox/ImportElementBox'; import { CollectionStackingView } from './CollectionStackingView'; import './CollectionStackingView.scss'; @@ -254,7 +256,7 @@ export class CollectionMasonryViewFieldRow extends ObservableReactComponent<CMVF const rows = Math.max(1, Math.min(this._props.docList.length, Math.floor(this._props.panelWidth() / this._props.columnWidth()))); return this.collapsed ? null : ( <div style={{ position: 'relative' }}> - {!this._props.chromeHidden ? ( + {!this._props.chromeHidden && !StrCast(this._props.Doc.childLayoutString).includes(ImportElementBox.name) ? ( <div className="collectionStackingView-addDocumentButton"> <EditableView GetValue={returnEmptyString} SetValue={this.addDocument} textCallback={this.textCallback} contents="+ NEW" /> </div> diff --git a/src/client/views/collections/CollectionNoteTakingView.scss b/src/client/views/collections/CollectionNoteTakingView.scss index 0d24a56b5..231085338 100644 --- a/src/client/views/collections/CollectionNoteTakingView.scss +++ b/src/client/views/collections/CollectionNoteTakingView.scss @@ -82,7 +82,7 @@ height: 100%; width: 100%; position: absolute; - top: 0; + top: 0px; overflow-y: auto; overflow-x: hidden; transition: top 0.5s; @@ -130,8 +130,8 @@ display: flex; flex-direction: column; align-items: center; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; position: absolute; margin: auto; @@ -152,20 +152,20 @@ } .collectionNoteTakingView-columnDragger { - width: 15; - height: 15; + width: 15px; + height: 15px; position: absolute; - margin-left: -5; + margin-left: -5px; } .collectionNoteTakingView-sectionDelete { display: none; position: absolute; - right: 0; + right: 0px; width: max-content; height: max-content; - top: 10; - padding: 2; + top: 10px; + padding: 2px; } // Documents in NoteTaking view @@ -210,8 +210,8 @@ height: 5px; &.active { - margin-left: 0; - margin-right: 0; + margin-left: 0px; + margin-right: 0px; background: red; } } @@ -303,8 +303,8 @@ .collectionNoteTakingView-sectionColor { position: absolute; - left: 0; - top: 0; + left: 0px; + top: 0px; height: 100%; display: none; @@ -345,8 +345,8 @@ .collectionNoteTakingView-sectionOptions { position: absolute; - right: 0; - top: 0; + right: 0px; + top: 0px; height: 100%; display: none; diff --git a/src/client/views/collections/CollectionStackedTimeline.scss b/src/client/views/collections/CollectionStackedTimeline.scss index d05c0ffde..e71df2164 100644 --- a/src/client/views/collections/CollectionStackedTimeline.scss +++ b/src/client/views/collections/CollectionStackedTimeline.scss @@ -38,7 +38,7 @@ height: 100%; background-color: global.$dark-gray; opacity: 0.3; - top: 0; + top: 0px; } .collectionStackedTimeline-trim-controls { @@ -49,8 +49,8 @@ display: flex; justify-content: space-between; max-width: 100%; - top: 0; - left: 0; + top: 0px; + left: 0px; .collectionStackedTimeline-trim-handle { background-color: global.$medium-blue; @@ -106,18 +106,18 @@ .collectionStackedTimeline-resizer { background: global.$dark-gray; position: absolute; - top: 0; + top: 0px; height: 100%; width: 10px; pointer-events: all; z-index: 100; } .collectionStackedTimeline-resizer { - right: 0; + right: 0px; cursor: e-resize; } .collectionStackedTimeline-left-resizer { - left: 0; + left: 0px; cursor: w-resize; } } @@ -126,8 +126,8 @@ position: absolute; width: 100%; height: 100%; - top: 0; - left: 0; + top: 0px; + left: 0px; pointer-events: none; } } diff --git a/src/client/views/collections/CollectionStackingView.scss b/src/client/views/collections/CollectionStackingView.scss index d6e4943ff..2cf361847 100644 --- a/src/client/views/collections/CollectionStackingView.scss +++ b/src/client/views/collections/CollectionStackingView.scss @@ -16,10 +16,10 @@ width: 100%; .collectionStackingView-columnDragger { - width: 28; - height: 28; - position: absolute; - margin-left: -5; + width: 28px; + height: 28px; + position: relative; + margin-left: -5px; z-index: 10; > svg { width: 100%; @@ -55,7 +55,7 @@ height: 100%; width: 100%; position: absolute; - top: 0; + top: 0px; overflow-y: auto; overflow-x: hidden; transition: top 0.5s; @@ -93,8 +93,8 @@ .collectionStackingView-masonryGrid { width: 100%; display: grid; - top: 0; - left: 0; + top: 0px; + left: 0px; } .collectionStackingView-masonrySingle { @@ -115,8 +115,8 @@ position: absolute; display: flex; flex-direction: column; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; position: absolute; } @@ -159,12 +159,12 @@ width: 100%; display: none; position: absolute; - top: 0; + top: 0px; cursor: default; &.active { - margin-left: 0; - margin-right: 0; + margin-left: 0px; + margin-right: 0px; background: red; } } @@ -262,8 +262,8 @@ .collectionStackingView-sectionColor { position: absolute; - left: 0; - top: 0; + left: 0px; + top: 0px; height: 100%; display: none; @@ -304,8 +304,8 @@ .collectionStackingView-sectionOptions { position: absolute; - right: 0; - top: 0; + right: 0px; + top: 0px; height: 100%; display: none; @@ -339,7 +339,7 @@ .collectionStackingView-sectionDelete { position: absolute; right: 0px; - top: 0; + top: 0px; height: 100%; display: none; } diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx index 4a0ddc631..bdeb7d944 100644 --- a/src/client/views/collections/CollectionStackingView.tsx +++ b/src/client/views/collections/CollectionStackingView.tsx @@ -64,7 +64,7 @@ export class CollectionStackingView extends CollectionSubView<Partial<collection @observable _cursor: CSS.Property.Cursor = 'ew-resize'; // gets reset whenever we scroll. Not sure what it is @observable _scroll = 0; // used to force the document decoration to update when scrolling - // does this mean whether the browser is hidden? Or is chrome something else entirely? + // whether ui/editing controls are shown @computed get chromeHidden() { return this._props.chromeHidden || BoolCast(this.layoutDoc.chromeHidden); } @@ -566,7 +566,7 @@ export class CollectionStackingView extends CollectionSubView<Partial<collection return ( <div key={(heading?.heading ?? '') + 'head'}> {this._props.isContentActive() && !this.isStackingView && !this.chromeHidden ? this.columnDragger : null} - <div style={{ top: this.yMargin }}> + <div style={{ position: 'relative' }}> <CollectionMasonryViewFieldRow showHandle={first} Doc={this.Document} @@ -715,9 +715,7 @@ export class CollectionStackingView extends CollectionSubView<Partial<collection background: this._props.styleProvider?.(this.Document, this._props, StyleProp.BackgroundColor) as string, pointerEvents: this._props.pointerEvents?.() ?? this.backgroundEvents, }} - onScroll={action(e => { - this._scroll = e.currentTarget.scrollTop; - })} + onScroll={action(e => (this._scroll = e.currentTarget.scrollTop))} onDrop={this.onExternalDrop.bind(this)} onContextMenu={this.onContextMenu} onWheel={e => this.isContentActive() && e.stopPropagation()}> diff --git a/src/client/views/collections/CollectionStackingViewFieldColumn.tsx b/src/client/views/collections/CollectionStackingViewFieldColumn.tsx index 8c7cb8276..8c535534a 100644 --- a/src/client/views/collections/CollectionStackingViewFieldColumn.tsx +++ b/src/client/views/collections/CollectionStackingViewFieldColumn.tsx @@ -4,6 +4,7 @@ import { observer } from 'mobx-react'; import * as React from 'react'; import { DivHeight, DivWidth, returnEmptyString, returnTrue, setupMoveUpEvents } from '../../../ClientUtils'; import { Doc, DocListCast, Opt } from '../../../fields/Doc'; +import { DocData } from '../../../fields/DocSymbols'; import { RichTextField } from '../../../fields/RichTextField'; import { PastelSchemaPalette, SchemaHeaderField } from '../../../fields/SchemaHeaderField'; import { ScriptField } from '../../../fields/ScriptField'; @@ -26,7 +27,6 @@ import { EditableView } from '../EditableView'; import { DocumentView } from '../nodes/DocumentView'; import { ObservableReactComponent } from '../ObservableReactComponent'; import './CollectionStackingView.scss'; -import { DocData } from '../../../fields/DocSymbols'; // So this is how we are storing a column interface CSVFieldColumnProps { diff --git a/src/client/views/collections/CollectionTimeView.scss b/src/client/views/collections/CollectionTimeView.scss index d995cbcd2..d56999974 100644 --- a/src/client/views/collections/CollectionTimeView.scss +++ b/src/client/views/collections/CollectionTimeView.scss @@ -27,7 +27,7 @@ transform: rotate(45deg); display: inline-block; background: gray; - bottom: 0; + bottom: 0px; margin-bottom: -17px; border-radius: 9px; opacity: 0.25; @@ -67,9 +67,9 @@ pointer-events: all; padding: 5px; border: 1px solid black; - display:none; + display: none; span { - margin-left : 10px; + margin-left: 10px; } } @@ -86,8 +86,9 @@ } } -.collectionTimeView:hover, .collectionTimeView-pivot:hover { +.collectionTimeView:hover, +.collectionTimeView-pivot:hover { .pivotKeyEntry { - display:unset; + display: unset; } -}
\ No newline at end of file +} diff --git a/src/client/views/collections/CollectionTreeView.scss b/src/client/views/collections/CollectionTreeView.scss index 2a03ea708..95faaa3f0 100644 --- a/src/client/views/collections/CollectionTreeView.scss +++ b/src/client/views/collections/CollectionTreeView.scss @@ -11,7 +11,7 @@ height: 100%; width: 100%; position: relative; - top: 0; + top: 0px; // background: global.$light-gray; font-size: 13px; overflow: auto; @@ -33,12 +33,12 @@ } .no-indent { - padding-left: 0; + padding-left: 0px; //width: max-content; } .no-indent-outline { - padding-left: 0; + padding-left: 0px; width: 100%; } diff --git a/src/client/views/collections/CollectionView.scss b/src/client/views/collections/CollectionView.scss index 06c324bd0..837219e1d 100644 --- a/src/client/views/collections/CollectionView.scss +++ b/src/client/views/collections/CollectionView.scss @@ -1,7 +1,7 @@ @use '../global/globalCssVariables.module.scss' as global; .collectionView { - border-width: 0; + border-width: 0px; border-color: global.$light-gray; border-style: solid; border-radius: 0 0 global.$border-radius global.$border-radius; @@ -18,7 +18,7 @@ position: absolute; top: 55%; border: 1px black solid; - border-radius: 0; + border-radius: 0px; border-top-left-radius: 20px; border-bottom-left-radius: 20px; border-right: unset; @@ -31,8 +31,8 @@ width: 200px; height: 100%; position: absolute; - right: 0; - top: 0; + right: 0px; + top: 0px; border-left: solid 1px; z-index: 1; diff --git a/src/client/views/collections/FlashcardPracticeUI.scss b/src/client/views/collections/FlashcardPracticeUI.scss index 210c6798f..0cc4711b3 100644 --- a/src/client/views/collections/FlashcardPracticeUI.scss +++ b/src/client/views/collections/FlashcardPracticeUI.scss @@ -8,8 +8,8 @@ .FlashcardPracticeUI-check { position: absolute; display: flex; - width: 30; - height: 30; + width: 30px; + height: 30px; align-items: center; border-radius: 5px; justify-content: center; @@ -39,7 +39,7 @@ display: flex; top: 0px; left: 0px; - width: 30; + width: 30px; transform-origin: top left; border-radius: 5px; color: rgba(255, 255, 255, 0.5); @@ -49,7 +49,7 @@ width: 100%; display: flex; flex-direction: column; - top: 0; + top: 0px; position: relative; .FlashcardPracticeUI-quiz, .FlashcardPracticeUI-practice { diff --git a/src/client/views/collections/KeyRestrictionRow.tsx b/src/client/views/collections/KeyRestrictionRow.tsx deleted file mode 100644 index 7dc08389b..000000000 --- a/src/client/views/collections/KeyRestrictionRow.tsx +++ /dev/null @@ -1,72 +0,0 @@ -/* eslint-disable react/button-has-type */ -import { observable, runInAction } from 'mobx'; -import { observer } from 'mobx-react'; -import * as React from 'react'; - -interface IKeyRestrictionProps { - contains: boolean; - script: (value: string) => void; - field: string; - value: string; -} - -@observer -export default class KeyRestrictionRow extends React.Component<IKeyRestrictionProps> { - @observable private _key = this.props.field; - @observable private _value = this.props.value; - @observable private _contains = this.props.contains; - - render() { - if (this._key && this._value) { - let parsedValue: string | number = `"${this._value}"`; - const parsed = parseInt(this._value); - let type = 'string'; - if (!isNaN(parsed)) { - parsedValue = parsed; - type = 'number'; - } - const scriptText = `${this._contains ? '' : '!'}(((doc.${this._key} && (doc.${this._key} as ${type})${type === 'string' ? '.includes' : '<='}(${parsedValue}))) || - ((doc.data_ext && doc.data_ext.${this._key}) && (doc.data_ext.${this._key} as ${type})${type === 'string' ? '.includes' : '<='}(${parsedValue}))))`; - // let doc = new Doc(); - // ((doc.data_ext && doc.data_ext!.text) && (doc.data_ext!.text as string).includes("hello")); - this.props.script(scriptText); - } else { - this.props.script(''); - } - - return ( - <div className="collectionViewBaseChrome-viewSpecsMenu-row"> - <input - className="collectionViewBaseChrome-viewSpecsMenu-rowLeft" - value={this._key} - onChange={e => - runInAction(() => { - this._key = e.target.value; - }) - } - placeholder="KEY" - /> - <button - className="collectionViewBaseChrome-viewSpecsMenu-rowMiddle" - style={{ background: this._contains ? '#77dd77' : '#ff6961' }} - onClick={() => - runInAction(() => { - this._contains = !this._contains; - }) - }> - {this._contains ? 'CONTAINS' : 'DOES NOT CONTAIN'} - </button> - <input - className="collectionViewBaseChrome-viewSpecsMenu-rowRight" - value={this._value} - onChange={e => - runInAction(() => { - this._value = e.target.value; - }) - } - placeholder="VALUE" - /> - </div> - ); - } -} diff --git a/src/client/views/collections/TabDocView.scss b/src/client/views/collections/TabDocView.scss index 931cdac2b..b705d17f3 100644 --- a/src/client/views/collections/TabDocView.scss +++ b/src/client/views/collections/TabDocView.scss @@ -92,6 +92,6 @@ input.lm_title { .miniMap-hidden { cursor: pointer; position: absolute; - bottom: 5; - right: 5; + bottom: 5px; + right: 5px; } diff --git a/src/client/views/collections/TreeView.scss b/src/client/views/collections/TreeView.scss index 78794d112..542b0cc87 100644 --- a/src/client/views/collections/TreeView.scss +++ b/src/client/views/collections/TreeView.scss @@ -136,8 +136,8 @@ width: 100%; height: 100%; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; z-index: 0; filter: opacity(0); } diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.scss b/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.scss index 7951aff65..32cf3586f 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.scss +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.scss @@ -18,5 +18,5 @@ color: black; // fontStyle: "italic", margin-left: -12; - margin-top: 4; + margin-top: 4px; } diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss index 6c47a71b0..ac1ef7d65 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss @@ -2,8 +2,8 @@ .collectionfreeformview-none { position: inherit; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; transform-origin: left top; @@ -12,10 +12,10 @@ border-radius: inherit; } .collectionFreeForm-groupDropper { - width: 10000; - height: 10000; - left: -5000; - top: -5000; + width: 10000px; + height: 10000px; + left: -5000px; + top: -5000px; position: absolute; background: transparent; pointer-events: all; @@ -24,8 +24,8 @@ .collectionfreeformview-grid { transform-origin: top left; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; pointer-events: none; } @@ -219,8 +219,8 @@ border-radius: inherit; box-sizing: border-box; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; align-items: center; @@ -264,7 +264,7 @@ .collectionFreeform-infoUI { position: absolute; display: block; - top: 0; + top: 0px; color: white; background-color: #5075ef; @@ -275,19 +275,19 @@ padding: 10px; .collectionFreeform-infoUI-close { position: absolute; - top: -10; - left: -10; + top: -10px; + left: -10px; } .collectionFreeform-infoUI-msg { position: relative; - max-width: 500; - margin: 10; + max-width: 500px; + margin: 10px; } .collectionFreeform-infoUI-button { border-radius: 50px; font-size: 12px; - padding: 6; + padding: 6px; position: relative; } diff --git a/src/client/views/collections/collectionFreeForm/FaceCollectionBox.scss b/src/client/views/collections/collectionFreeForm/FaceCollectionBox.scss index 0a001d84c..d0685e419 100644 --- a/src/client/views/collections/collectionFreeForm/FaceCollectionBox.scss +++ b/src/client/views/collections/collectionFreeForm/FaceCollectionBox.scss @@ -2,7 +2,7 @@ display: flex; height: max-content; flex-direction: column; - top: 0; + top: 0px; position: absolute; width: 100%; height: 100%; @@ -31,9 +31,9 @@ } .face-document-top { position: relative; - top: 0; + top: 0px; width: 100%; - left: 0; + left: 0px; } .face-document-image-container { @@ -69,8 +69,8 @@ .remove-item { position: absolute; - bottom: -5; - right: -5; + bottom: -5px; + right: -5px; background-color: rgba(0, 0, 0, 0.5); // Optional: to add a background behind the icon for better visibility border-radius: 30%; width: 10px; // Adjust size as needed @@ -98,7 +98,7 @@ .faceCollectionBox { width: 100%; height: 100%; - top: 0; - left: 0; + top: 0px; + left: 0px; position: absolute; } diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.scss b/src/client/views/collections/collectionFreeForm/MarqueeView.scss index b514b0911..135f4deac 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.scss +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.scss @@ -1,7 +1,7 @@ .marqueeView { position: inherit; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; overflow: hidden; @@ -20,7 +20,7 @@ pointer-events: none; .marquee-legend { bottom: -18px; - left: 0; + left: 0px; position: absolute; font-size: 9; white-space: nowrap; diff --git a/src/client/views/collections/collectionGrid/CollectionGridView.scss b/src/client/views/collections/collectionGrid/CollectionGridView.scss index 4edaf9745..b95d3ea44 100644 --- a/src/client/views/collections/collectionGrid/CollectionGridView.scss +++ b/src/client/views/collections/collectionGrid/CollectionGridView.scss @@ -39,8 +39,8 @@ background: #d3d3d3; position: absolute; - height: 3; - left: 5; + height: 3px; + left: 5px; transform-origin: left; transform: rotate(90deg); outline: none; @@ -133,7 +133,7 @@ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; - margin: 0; + margin: 0px; } /* Firefox */ diff --git a/src/client/views/collections/collectionLinear/CollectionLinearView.scss b/src/client/views/collections/collectionLinear/CollectionLinearView.scss index 0dfaed38a..0053d3e60 100644 --- a/src/client/views/collections/collectionLinear/CollectionLinearView.scss +++ b/src/client/views/collections/collectionLinear/CollectionLinearView.scss @@ -47,7 +47,7 @@ background: global.$medium-blue; display: flex; border-radius: 10px; - height: 35; + height: 35px; transform: translate3d(6px, 0px, 0px); align-content: center; justify-content: center; @@ -95,11 +95,11 @@ pointer-events: all; cursor: pointer; background-color: global.$medium-blue; - padding: 5; + padding: 5px; border-radius: 2px; height: 100%; - min-width: 25; - margin: 0; + min-width: 25px; + margin: 0px; color: global.$white; display: flex; font-weight: 100; diff --git a/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.scss b/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.scss index 9ed247d50..1dc46102f 100644 --- a/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.scss +++ b/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.scss @@ -1,8 +1,8 @@ .collectionMulticolumnView_drop { height: 100%; width: 100%; - top: 0; - left: 0; + top: 0px; + left: 0px; position: absolute; .collectionMulticolumnView_contents { @@ -18,8 +18,8 @@ align-items: center; position: relative; > .iconButton-container { - top: 0; - left: 0; + top: 0px; + left: 0px; position: absolute; } diff --git a/src/client/views/collections/collectionMulticolumn/CollectionMultirowView.scss b/src/client/views/collections/collectionMulticolumn/CollectionMultirowView.scss index 91779065d..eb157d155 100644 --- a/src/client/views/collections/collectionMulticolumn/CollectionMultirowView.scss +++ b/src/client/views/collections/collectionMulticolumn/CollectionMultirowView.scss @@ -1,8 +1,8 @@ .collectionMultirowView_drop { height: 100%; width: 100%; - top: 0; - left: 0; + top: 0px; + left: 0px; position: absolute; .collectionMultirowView_contents { diff --git a/src/client/views/collections/collectionMulticolumn/MulticolumnResizer.tsx b/src/client/views/collections/collectionMulticolumn/MulticolumnResizer.tsx index 10a6fa2e9..2ff99f134 100644 --- a/src/client/views/collections/collectionMulticolumn/MulticolumnResizer.tsx +++ b/src/client/views/collections/collectionMulticolumn/MulticolumnResizer.tsx @@ -1,4 +1,3 @@ -/* eslint-disable react/require-default-props */ import { action } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; diff --git a/src/client/views/collections/collectionMulticolumn/MultirowHeightLabel.tsx b/src/client/views/collections/collectionMulticolumn/MultirowHeightLabel.tsx index 66215f109..4f57e1656 100644 --- a/src/client/views/collections/collectionMulticolumn/MultirowHeightLabel.tsx +++ b/src/client/views/collections/collectionMulticolumn/MultirowHeightLabel.tsx @@ -1,4 +1,3 @@ -/* eslint-disable react/require-default-props */ import { computed } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; diff --git a/src/client/views/collections/collectionMulticolumn/MultirowResizer.tsx b/src/client/views/collections/collectionMulticolumn/MultirowResizer.tsx index 918365700..1954b4743 100644 --- a/src/client/views/collections/collectionMulticolumn/MultirowResizer.tsx +++ b/src/client/views/collections/collectionMulticolumn/MultirowResizer.tsx @@ -1,4 +1,3 @@ -/* eslint-disable react/require-default-props */ import { action } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; @@ -66,7 +65,7 @@ export default class ResizeBar extends React.Component<ResizerProps> { style={{ pointerEvents: this.props.isContentActive?.() ? 'all' : 'none', height: this.props.height, - backgroundColor: !this.props.isContentActive?.() ? '' : this.props.styleProvider?.(undefined, undefined, StyleProp.WidgetColor) as string, + backgroundColor: !this.props.isContentActive?.() ? '' : (this.props.styleProvider?.(undefined, undefined, StyleProp.WidgetColor) as string), }}> <div className="multiRowResizer-hdl" onPointerDown={e => this.registerResizing(e)} /> </div> diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.scss b/src/client/views/collections/collectionSchema/CollectionSchemaView.scss index 53c0823ea..e975ae6f6 100644 --- a/src/client/views/collections/collectionSchema/CollectionSchemaView.scss +++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.scss @@ -18,7 +18,7 @@ .schema-add { position: relative; - height: 35; + height: 35px; display: flex; align-items: center; top: -10px; @@ -147,7 +147,7 @@ flex-direction: row; justify-content: space-between; align-items: center; - padding: 0; + padding: 0px; z-index: 1; border: 1px solid global.$medium-gray; @@ -231,7 +231,7 @@ overflow-x: hidden; overflow-y: auto; display: inline-flex; - padding: 0; + padding: 0px; align-items: center; input[type='text'] { border: unset; @@ -272,8 +272,8 @@ .row-menu-infos { position: absolute; - top: 3; - left: 3; + top: 3px; + left: 3px; z-index: 1; display: flex; justify-content: flex-end; diff --git a/src/client/views/global/globalCssVariables.module.scss b/src/client/views/global/globalCssVariables.module.scss index 82f6caa52..7641d4929 100644 --- a/src/client/views/global/globalCssVariables.module.scss +++ b/src/client/views/global/globalCssVariables.module.scss @@ -75,7 +75,7 @@ $CAROUSEL3D_CENTER_SCALE: 1.3; $CAROUSEL3D_SIDE_SCALE: 0.6; $CAROUSEL3D_TOP: 15; -$DATA_VIZ_TABLE_ROW_HEIGHT: 30; +$DATA_VIZ_TABLE_ROW_HEIGHT: 30px; :export { contextMenuZindex: $contextMenu-zindex; diff --git a/src/client/views/linking/LinkMenuItem.scss b/src/client/views/linking/LinkMenuItem.scss index 3cd60c87f..cc8c168cf 100644 --- a/src/client/views/linking/LinkMenuItem.scss +++ b/src/client/views/linking/LinkMenuItem.scss @@ -114,7 +114,7 @@ .linkMenu-deleteButton { width: 20px; height: 20px; - margin: 0; + margin: 0px; margin-right: 4px; padding-right: 6px; border-radius: 50%; @@ -134,7 +134,7 @@ } &:last-child { - margin-right: 0; + margin-right: 0px; } &:hover { diff --git a/src/client/views/linking/LinkPopup.scss b/src/client/views/linking/LinkPopup.scss index 4bfb4b0b9..f8d724767 100644 --- a/src/client/views/linking/LinkPopup.scss +++ b/src/client/views/linking/LinkPopup.scss @@ -1,7 +1,9 @@ .linkPopup-container { background: white; - box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); - top: 0; + box-shadow: + 0 10px 20px rgba(0, 0, 0, 0.19), + 0 6px 6px rgba(0, 0, 0, 0.23); + top: 0px; height: 200px; width: 200px; // padding: 15px; diff --git a/src/client/views/linking/LinkPopup.tsx b/src/client/views/linking/LinkPopup.tsx index b654f9bd0..760850241 100644 --- a/src/client/views/linking/LinkPopup.tsx +++ b/src/client/views/linking/LinkPopup.tsx @@ -1,4 +1,3 @@ -/* eslint-disable react/require-default-props */ import { observer } from 'mobx-react'; import * as React from 'react'; import { returnEmptyFilter, returnFalse, returnTrue } from '../../../ClientUtils'; diff --git a/src/client/views/newlightbox/NewLightboxView.scss b/src/client/views/newlightbox/NewLightboxView.scss index 76c34bcf9..c76a7d60d 100644 --- a/src/client/views/newlightbox/NewLightboxView.scss +++ b/src/client/views/newlightbox/NewLightboxView.scss @@ -2,8 +2,8 @@ .newLightboxView-frame { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; background: #474545bb; diff --git a/src/client/views/newlightbox/components/Recommendation/Recommendation.scss b/src/client/views/newlightbox/components/Recommendation/Recommendation.scss index cf6b5ccb1..09d3ccc62 100644 --- a/src/client/views/newlightbox/components/Recommendation/Recommendation.scss +++ b/src/client/views/newlightbox/components/Recommendation/Recommendation.scss @@ -135,7 +135,7 @@ font-size: 10px; width: 100%; background: newstyles.$blue-l1; - border-radius: 0; + border-radius: 0px; padding: 10px; .concepts-container { diff --git a/src/client/views/nodes/AudioBox.scss b/src/client/views/nodes/AudioBox.scss index 933a383ea..c25c09af9 100644 --- a/src/client/views/nodes/AudioBox.scss +++ b/src/client/views/nodes/AudioBox.scss @@ -138,7 +138,7 @@ input[type='range']::-webkit-slider-thumb { box-shadow: 0; - border: 0; + border: 0px; height: 10px; width: 10px; border-radius: 10px; @@ -168,7 +168,7 @@ .audiobox-button { width: 15px; height: 15px; - margin: 0; + margin: 0px; svg { width: 10px; diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.scss b/src/client/views/nodes/CollectionFreeFormDocumentView.scss index 7f0a39550..300533df8 100644 --- a/src/client/views/nodes/CollectionFreeFormDocumentView.scss +++ b/src/client/views/nodes/CollectionFreeFormDocumentView.scss @@ -3,7 +3,7 @@ position: absolute; background-color: transparent; touch-action: manipulation; - top: 0; - left: 0; + top: 0px; + left: 0px; pointer-events: none; } diff --git a/src/client/views/nodes/ComparisonBox.scss b/src/client/views/nodes/ComparisonBox.scss index d2ba9796b..cbbd6bde3 100644 --- a/src/client/views/nodes/ComparisonBox.scss +++ b/src/client/views/nodes/ComparisonBox.scss @@ -18,7 +18,7 @@ } .input-box { position: absolute; - top: 50; + top: 50px; padding: 10px; width: 100%; height: 70%; @@ -33,7 +33,7 @@ padding-right: 5px; border-radius: 2px; height: 17%; - bottom: 0; + bottom: 0px; overflow: hidden; display: flex; width: 100%; @@ -101,7 +101,7 @@ position: absolute; display: inline-block; margin-top: 150px; - bottom: 0; + bottom: 0px; } .dropup-content { @@ -145,8 +145,8 @@ .clip-div { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; height: 100%; overflow: hidden; @@ -180,8 +180,8 @@ .afterBox-cont { position: absolute; - top: 0; - right: 0; + top: 0px; + right: 0px; height: 100%; width: 100%; overflow: hidden; @@ -331,8 +331,8 @@ justify-content: space-between; height: max-content; position: absolute; - bottom: 0; - right: 2; + bottom: 0px; + right: 2px; flex-direction: row-reverse; display: flex; cursor: pointer; diff --git a/src/client/views/nodes/DataVizBox/DataVizBox.scss b/src/client/views/nodes/DataVizBox/DataVizBox.scss index 9825d926f..32a01355e 100644 --- a/src/client/views/nodes/DataVizBox/DataVizBox.scss +++ b/src/client/views/nodes/DataVizBox/DataVizBox.scss @@ -37,25 +37,25 @@ margin-left: 10px; margin-bottom: -10px; } - + .displaySchemaLive { margin-bottom: 20px; } .dataviz-sidebar { position: absolute; - right: 0; - top: 0; + right: 0px; + top: 0px; height: 100%; } .button-container { pointer-events: unset; } - .dataVizBox-annotationLayer{ + .dataVizBox-annotationLayer { position: absolute; transform-origin: left top; - top: 0; + top: 0px; width: 100%; pointer-events: none; mix-blend-mode: multiply; diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.scss b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.scss index 6eb7fa96a..e2261b9e2 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.scss +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.scss @@ -110,12 +110,12 @@ &::before { content: ''; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; border-bottom: 20px solid rgb(50, 50, 50); border-left: 12px solid transparent; border-right: 12px solid transparent; - height: 0; + height: 0px; width: 50px; } @@ -127,7 +127,7 @@ border-bottom: 22px solid rgb(180, 180, 180); border-left: 12px solid transparent; border-right: 12px solid transparent; - height: 0; + height: 0px; width: 52px; z-index: -1; } @@ -418,8 +418,8 @@ } .div { - width: 200; - height: 200; + width: 200px; + height: 200px; border: solid 1px white; } @@ -588,7 +588,7 @@ } .docCreatorMenu-configuration-bar { - width: 200; + width: 200px; gap: 5px; display: flex; flex-direction: row; @@ -709,8 +709,8 @@ width: 100%; aspect-ratio: 1; //height: auto; - // max-width: 240; - // max-height: 240; + // max-width: 240px; + // max-height: 240px; border: 1px solid rgb(180, 180, 180); border-radius: 5px; background-color: rgb(34, 34, 37); @@ -718,8 +718,8 @@ scrollbar-width: none; &.small { - max-width: 100; - max-height: 100; + max-width: 100px; + max-height: 100px; } .docCreatorMenu-layout-preview-item { @@ -1009,8 +1009,8 @@ } &:hover .operator-dropdown-current { - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; + border-bottom-right-radius: 0px; + border-bottom-left-radius: 0px; } &:hover .operator-dropdown-option { diff --git a/src/client/views/nodes/DataVizBox/SchemaCSVPopUp.scss b/src/client/views/nodes/DataVizBox/SchemaCSVPopUp.scss index 63a693918..0acc2c847 100644 --- a/src/client/views/nodes/DataVizBox/SchemaCSVPopUp.scss +++ b/src/client/views/nodes/DataVizBox/SchemaCSVPopUp.scss @@ -13,7 +13,7 @@ $highlightedText: #82e0ff; min-height: 200px; border-radius: 15px; padding: 15px; - padding-bottom: 0; + padding-bottom: 0px; z-index: 999; display: flex; flex-direction: column; @@ -40,7 +40,7 @@ $highlightedText: #82e0ff; font-size: 12px; font-weight: 400; letter-spacing: 1px; - margin: 0; + margin: 0px; padding-right: 5px; } @@ -124,8 +124,8 @@ $highlightedText: #82e0ff; .img-container::after { content: ''; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); diff --git a/src/client/views/nodes/DataVizBox/components/Chart.scss b/src/client/views/nodes/DataVizBox/components/Chart.scss index ff1fa343d..a22e1153c 100644 --- a/src/client/views/nodes/DataVizBox/components/Chart.scss +++ b/src/client/views/nodes/DataVizBox/components/Chart.scss @@ -91,7 +91,7 @@ margin: 5px; margin-left: 25px; margin-right: 10px; - margin-bottom: 0; + margin-bottom: 0px; .tableBox-table { height: 100%; width: 100%; @@ -101,7 +101,7 @@ text-overflow: ellipsis; width: 100%; white-space: pre; - max-width: 150; + max-width: 150px; overflow: hidden; margin-left: 2px; } diff --git a/src/client/views/nodes/DataVizBox/components/TableBox.tsx b/src/client/views/nodes/DataVizBox/components/TableBox.tsx index 9e0868cd5..cc08cf269 100644 --- a/src/client/views/nodes/DataVizBox/components/TableBox.tsx +++ b/src/client/views/nodes/DataVizBox/components/TableBox.tsx @@ -401,7 +401,7 @@ export class TableBox extends ObservableReactComponent<TableBoxProps> { } })}> <thead> - <tr style={{ height: this.startID * Number(DATA_VIZ_TABLE_ROW_HEIGHT) }} /> + <tr style={{ height: this.startID * Number(DATA_VIZ_TABLE_ROW_HEIGHT.replace("px","")) }} /> <tr> {this.columns.map((col, i) => ( <th @@ -470,7 +470,7 @@ export class TableBox extends ObservableReactComponent<TableBoxProps> { })} </tr> ))} - <tr style={{ display: this._tableDataIds.length - this.endID ? undefined : 'none', height: (this._tableDataIds.length - this.endID) * Number(DATA_VIZ_TABLE_ROW_HEIGHT) }} /> + <tr style={{ display: this._tableDataIds.length - this.endID ? undefined : 'none', height: (this._tableDataIds.length - this.endID) * Number(DATA_VIZ_TABLE_ROW_HEIGHT.replace("px","")) }} /> </tbody> </table> </div> diff --git a/src/client/views/nodes/DocumentLinksButton.scss b/src/client/views/nodes/DocumentLinksButton.scss index e1b83dc59..43b1e083f 100644 --- a/src/client/views/nodes/DocumentLinksButton.scss +++ b/src/client/views/nodes/DocumentLinksButton.scss @@ -17,8 +17,8 @@ } .documentLinksButton-cont { - min-width: 20; - min-height: 20; + min-width: 20px; + min-height: 20px; position: absolute; } diff --git a/src/client/views/nodes/DocumentView.scss b/src/client/views/nodes/DocumentView.scss index c4351a200..98ca76339 100644 --- a/src/client/views/nodes/DocumentView.scss +++ b/src/client/views/nodes/DocumentView.scss @@ -1,6 +1,7 @@ @use '../global/globalCssVariables.module.scss' as global; .documentView-effectsWrapper { + height: 100%; border-radius: inherit; transition: inherit; } @@ -14,13 +15,13 @@ width: 100%; height: 100%; position: absolute; - top: 0; + top: 0px; } .documentView-node { position: inherit; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; border-radius: inherit; @@ -55,7 +56,7 @@ .documentView-htmlOverlay { position: absolute; display: flex; - top: 0; + top: 0px; height: 100%; width: 100%; .documentView-htmlOverlayInner { @@ -79,9 +80,9 @@ .documentView-audioBackground { display: inline-block; width: 25px; - height: 25; + height: 25px; position: absolute; - top: 0; + top: 0px; left: 50%; border-radius: 25px; background: white; @@ -130,7 +131,7 @@ width: 30px; border-radius: 50%; position: absolute; - right: -15; + right: -15px; opacity: 0.9; pointer-events: auto; background-color: #9dca96; @@ -147,8 +148,8 @@ .documentView-anchorCont { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; display: inline-block; @@ -160,8 +161,8 @@ position: absolute; width: 100%; height: 100%; - top: 0; - left: 0; + top: 0px; + left: 0px; } .documentView-styleWrapper { @@ -183,9 +184,9 @@ .documentView-titleWrapper-hover { color: global.$black; transform-origin: top left; - top: 0; + top: 0px; width: 100%; - height: 14; + height: 14px; opacity: 0.5; text-align: center; text-overflow: ellipsis; @@ -211,7 +212,7 @@ .documentView-captionWrapper { position: absolute; - bottom: 0; + bottom: 0px; width: 100%; overflow-y: auto; transform-origin: bottom left; @@ -275,20 +276,20 @@ .documentView-noAIWidgets { transform-origin: top left; position: absolute; - bottom: 0; + bottom: 0px; pointer-events: none; } .documentView-widgetDecorations { transform-origin: top right; position: absolute; - top: 0; - right: 0; + top: 0px; + right: 0px; } .documentView-editorView-history { position: absolute; transform-origin: top right; - right: 0; + right: 0px; top: 0; overflow-y: scroll; scrollbar-width: thin; diff --git a/src/client/views/nodes/FontIconBox/FontIconBadge.scss b/src/client/views/nodes/FontIconBox/FontIconBadge.scss index 2ff5c651f..e741936db 100644 --- a/src/client/views/nodes/FontIconBox/FontIconBadge.scss +++ b/src/client/views/nodes/FontIconBox/FontIconBadge.scss @@ -6,7 +6,7 @@ color: black; display: block; position: absolute; - right: 5; + right: 5px; border-radius: 50%; text-align: center; } diff --git a/src/client/views/nodes/FontIconBox/FontIconBox.scss b/src/client/views/nodes/FontIconBox/FontIconBox.scss index 8bc68c131..52eebba54 100644 --- a/src/client/views/nodes/FontIconBox/FontIconBox.scss +++ b/src/client/views/nodes/FontIconBox/FontIconBox.scss @@ -42,7 +42,7 @@ letter-spacing: normal; background-color: inherit; border-radius: 8px; - padding: 0; + padding: 0px; width: 100%; font-family: 'system-ui'; text-transform: uppercase; @@ -96,22 +96,22 @@ display: inline-block; width: 100%; height: 25px; - margin: 0; + margin: 0px; } .switch input { opacity: 0; - width: 0; - height: 0; + width: 0px; + height: 0px; } .slider { position: absolute; cursor: pointer; - top: 0; - left: 0; - right: 0; - bottom: 0; + top: 0px; + left: 0px; + right: 0px; + bottom: 0px; background-color: lightgrey; -webkit-transition: 0.4s; transition: 0.4s; @@ -223,7 +223,7 @@ height: fit-content; color: black; top: 100%; - left: 0; + left: 0px; z-index: 21; background-color: #e3e3e3; box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.3); @@ -430,7 +430,7 @@ border-radius: 0px 7px 7px 0px; width: 13px; height: 100%; - right: 0; + right: 0px; } .menuButton-dropdown-header { diff --git a/src/client/views/nodes/IconTagBox.scss b/src/client/views/nodes/IconTagBox.scss index d6cf95958..c0977dfc5 100644 --- a/src/client/views/nodes/IconTagBox.scss +++ b/src/client/views/nodes/IconTagBox.scss @@ -15,7 +15,7 @@ width: 20px; height: 20px; margin: auto; - padding: 0; + padding: 0px; border-radius: 50%; background-color: global.$dark-gray; background-color: transparent; diff --git a/src/client/views/nodes/ImageBox.scss b/src/client/views/nodes/ImageBox.scss index 5a6292fab..90ede69dc 100644 --- a/src/client/views/nodes/ImageBox.scss +++ b/src/client/views/nodes/ImageBox.scss @@ -3,14 +3,14 @@ width: 100%; height: 100%; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; transform-origin: top left; .imageBox-annotationLayer { position: absolute; transform-origin: left top; - top: 0; + top: 0px; width: 100%; pointer-events: none; mix-blend-mode: multiply; // bcz: makes text fuzzy! @@ -24,8 +24,8 @@ #upload-icon { position: absolute; - bottom: 0; - right: 0; + bottom: 0px; + right: 0px; width: 20px; height: 20px; } @@ -51,8 +51,8 @@ .imageBox-dot { position: absolute; - bottom: 10; - left: 0; + bottom: 10px; + left: 0px; border-radius: 10px; width: 20px; height: 20px; @@ -131,8 +131,8 @@ position: absolute; color: white; background: black; - right: 0; - bottom: 0; + right: 0px; + bottom: 0px; z-index: 2; transform-origin: bottom right; cursor: default; @@ -142,13 +142,13 @@ } } .imageBox-regenerateDropTarget { - right: 35; + right: 35px; transform-origin: 70px 35px; } .imageBox-fader img { position: absolute; - left: 0; + left: 0px; } .imageBox-fadeBlocker-hover { @@ -223,7 +223,7 @@ max-width: 90%; width: 100%; .imageBox-aiView-similarity { - max-width: 65; + max-width: 65px; overflow: hidden; text-overflow: ellipsis; width: 100%; @@ -250,7 +250,7 @@ z-index: 10000; h3 { - margin-top: 0; + margin-top: 0px; } input { diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index a99421f6d..1714b7a3e 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -997,8 +997,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { rejectDrop = (de: DragManager.DropEvent, subView?: DocumentView | undefined) => (this.dataDoc[this.fieldKey] === undefined ? true : (this._props.rejectDrop?.(de, subView) ?? false)); render() { TraceMobx(); - const borderRad = this._props.styleProvider?.(this.layoutDoc, this._props, StyleProp.BorderRounding) as string; - const borderRadius = borderRad?.includes('px') ? `${Number(borderRad.split('px')[0]) / (this._props.NativeDimScaling?.() || 1)}px` : borderRad; + const borderRadius = this._props.styleProvider?.(this.layoutDoc, this._props, StyleProp.BorderRounding) as string; return ( <> <div diff --git a/src/client/views/nodes/KeyValueBox.scss b/src/client/views/nodes/KeyValueBox.scss index 441fceba4..80ace6ae0 100644 --- a/src/client/views/nodes/KeyValueBox.scss +++ b/src/client/views/nodes/KeyValueBox.scss @@ -93,9 +93,9 @@ $header-height: 30px; height: 30px; width: 5px; z-index: 20; - right: 0; - top: 0; - border-radius: 0; + right: 0px; + top: 0px; + border-radius: 0px; background: black; pointer-events: all; } @@ -105,8 +105,8 @@ $header-height: 30px; float: left; height: 37px; z-index: 20; - right: 0; - top: 0; + right: 0px; + top: 0px; background: transparent; pointer-events: none; } diff --git a/src/client/views/nodes/KeyValuePair.scss b/src/client/views/nodes/KeyValuePair.scss index 913ab641c..154fbdcfa 100644 --- a/src/client/views/nodes/KeyValuePair.scss +++ b/src/client/views/nodes/KeyValuePair.scss @@ -17,7 +17,7 @@ } .keyValuePair-td-key-check { position: relative; - margin: 0; + margin: 0px; } .keyValuePair-keyField { width: 100%; diff --git a/src/client/views/nodes/LabelBox.scss b/src/client/views/nodes/LabelBox.scss index 889cdc0ca..e1974d6a0 100644 --- a/src/client/views/nodes/LabelBox.scss +++ b/src/client/views/nodes/LabelBox.scss @@ -24,8 +24,8 @@ .answer-icon { position: absolute; - right: 8; - bottom: 5; + right: 8px; + bottom: 5px; color: black; display: inline-block; font-size: 10px; @@ -36,8 +36,8 @@ .q-icon { position: absolute; - right: 6; - bottom: 5; + right: 6px; + bottom: 5px; color: white; display: inline-block; font-size: 10px; @@ -48,8 +48,8 @@ .edit-icon { position: absolute; - right: 20; - bottom: 5; + right: 20px; + bottom: 5px; display: inline-block; font-size: 10px; cursor: pointer; diff --git a/src/client/views/nodes/LinkDocPreview.scss b/src/client/views/nodes/LinkDocPreview.scss index 28216394d..7d99247e7 100644 --- a/src/client/views/nodes/LinkDocPreview.scss +++ b/src/client/views/nodes/LinkDocPreview.scss @@ -42,7 +42,7 @@ .linkDocPreview-button { display: inline-flex; - margin: 0; + margin: 0px; margin-right: 3px; border-radius: 50%; pointer-events: auto; diff --git a/src/client/views/nodes/LoadingBox.scss b/src/client/views/nodes/LoadingBox.scss index cabd4de05..5a8f49000 100644 --- a/src/client/views/nodes/LoadingBox.scss +++ b/src/client/views/nodes/LoadingBox.scss @@ -26,7 +26,7 @@ } .loadingBox-spinner { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; } } diff --git a/src/client/views/nodes/MapBox/MapAnchorMenu.scss b/src/client/views/nodes/MapBox/MapAnchorMenu.scss index c36d98afe..217576203 100644 --- a/src/client/views/nodes/MapBox/MapAnchorMenu.scss +++ b/src/client/views/nodes/MapBox/MapAnchorMenu.scss @@ -6,19 +6,19 @@ } .anchorMenu-highlighter { padding-right: 5px; - .antimodeMenu-button { - padding: 0; - padding: 0; + .antimodeMenu-button { + padding: 0px; + padding: 0px; padding-right: 0px; padding-left: 0px; width: 5px; } } -.anchor-color-preview-button { - width: 25px !important; +.anchor-color-preview-button { + width: 25px !important; .anchor-color-preview { display: flex; - flex-direction: column; + flex-direction: column; padding-right: 3px; width: unset !important; .color-preview { @@ -72,12 +72,11 @@ } } - .MuiInputBase-input{ + .MuiInputBase-input { color: white !important; } - - - .css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input.Mui-disabled{ + + .css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input.Mui-disabled { -webkit-text-fill-color: #b3b2b2 !important; } @@ -91,7 +90,7 @@ gap: 5px; } - .selected-route-details-container{ + .selected-route-details-container { display: flex; flex-direction: column; gap: 3px; @@ -99,33 +98,25 @@ align-items: flex-start; padding: 5px; } - - } - .customized-marker-container{ + .customized-marker-container { display: flex; flex-direction: column; gap: 10px; - .current-marker-container{ + .current-marker-container { display: flex; align-items: center; gap: 5px; } - .all-markers-container{ + .all-markers-container { display: flex; - align-items: center; + align-items: center; gap: 10px; flex-wrap: wrap; max-width: 400px; } } - - - - } - - diff --git a/src/client/views/nodes/MapBox/MapBox.scss b/src/client/views/nodes/MapBox/MapBox.scss index bd4b51038..89d381070 100644 --- a/src/client/views/nodes/MapBox/MapBox.scss +++ b/src/client/views/nodes/MapBox/MapBox.scss @@ -21,7 +21,7 @@ .mapBox-infoWindow { background-color: white; opacity: 0.75; - padding: 12; + padding: 12px; font-size: 17; } .mapBox-searchbar { @@ -119,7 +119,7 @@ width: 100%; label { - margin-bottom: 0; + margin-bottom: 0px; } .speed-label { @@ -197,12 +197,12 @@ } .mapBox-sidebar { position: absolute; - right: 0; + right: 0px; height: 100%; } .mapBox-sidebar-handle { - top: 0; + top: 0px; //top: calc(50% - 17.5px); // use this to center vertically -- make sure it looks okay for slide views width: 10px; height: 100%; @@ -215,7 +215,7 @@ left: 50%; margin-left: 120px; right: unset !important; - margin-top: -10; + margin-top: -10px; height: max-content; } .searchbox { diff --git a/src/client/views/nodes/PDFBox.scss b/src/client/views/nodes/PDFBox.scss index f09a2630a..e34ca61d4 100644 --- a/src/client/views/nodes/PDFBox.scss +++ b/src/client/views/nodes/PDFBox.scss @@ -17,8 +17,8 @@ height: 100%; z-index: 1; pointer-events: none; - top: 0; - left: 0; + top: 0px; + left: 0px; // glr: This should really be the same component as text and PDFs .pdfBox-sidebarBtn { @@ -72,16 +72,16 @@ align-items: center; height: 20px; background: none; - padding: 0; + padding: 0px; position: absolute; pointer-events: all; color: white; - bottom: 0; - right: 0; + bottom: 0px; + right: 0px; .pdfBox-overlayButton-arrow { - width: 0; - height: 0; + width: 0px; + height: 0px; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-right: 15px solid #121721; @@ -122,8 +122,8 @@ .pdfBox-settingsCont { position: absolute; - right: 0; - top: 3; + right: 0px; + top: 3px; pointer-events: all; .pdfBox-settingsButton { @@ -133,11 +133,11 @@ align-items: center; height: 20px; background: none; - padding: 0; + padding: 0px; .pdfBox-settingsButton-arrow { - width: 0; - height: 0; + width: 0px; + height: 0px; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-right: 15px solid #121721; @@ -189,7 +189,7 @@ width: calc(100% - 40px); height: 20px; background: #121721; - bottom: 0; + bottom: 0px; display: flex; justify-content: center; align-items: center; @@ -253,13 +253,13 @@ .pdfBox-container { position: absolute; transform-origin: top left; - top: 0; + top: 0px; } .pdfBox-sidebarContainer { position: absolute; height: 100%; - right: 0; - top: 0; + right: 0px; + top: 0px; } .pdfBox-interactive { @@ -290,7 +290,7 @@ } .pdfBox-settingsButton-arrow { - height: 60; + height: 60px; border-top: 30px solid transparent; border-bottom: 30px solid transparent; border-right: 30px solid #121721; diff --git a/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.scss b/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.scss index ac2c611c7..78aa526bf 100644 --- a/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.scss +++ b/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.scss @@ -29,8 +29,8 @@ .wedge { pointer-events: none; position: absolute; - left: 0; - top: 0; + left: 0px; + top: 0px; } } diff --git a/src/client/views/nodes/RecordingBox/ProgressBar.scss b/src/client/views/nodes/RecordingBox/ProgressBar.scss index 28ad25ffa..ec01f0241 100644 --- a/src/client/views/nodes/RecordingBox/ProgressBar.scss +++ b/src/client/views/nodes/RecordingBox/ProgressBar.scss @@ -1,36 +1,34 @@ - .progressbar { - touch-action: none; - vertical-align: middle; - text-align: center; - - align-items: center; - cursor: default; - - - position: absolute; - display: flex; - justify-content: flex-start; - bottom: 2px; - width: 99%; - height: 30px; - background-color: gray; - - &.done { - top: 0; - width: 0px; - height: 5px; - background-color: red; - z-index: 2; - } - - &.mark { - top: 0; - background-color: transparent; - border-right: 2px solid white; - z-index: 3; - pointer-events: none; - } + touch-action: none; + vertical-align: middle; + text-align: center; + + align-items: center; + cursor: default; + + position: absolute; + display: flex; + justify-content: flex-start; + bottom: 2px; + width: 99%; + height: 30px; + background-color: gray; + + &.done { + top: 0px; + width: 0px; + height: 5px; + background-color: red; + z-index: 2; + } + + &.mark { + top: 0px; + background-color: transparent; + border-right: 2px solid white; + z-index: 3; + pointer-events: none; + } } .progressbar-disabled { @@ -43,37 +41,41 @@ // citation: https://codepen.io/_Master_/pen/PRdjmQ @keyframes blinker { - from {opacity: 1.0;} - to {opacity: 0.0;} + from { + opacity: 1; + } + to { + opacity: 0; + } } .blink { - text-decoration: blink; - animation-name: blinker; - animation-duration: 0.6s; - animation-iteration-count:infinite; - animation-timing-function:ease-in-out; - animation-direction: alternate; + text-decoration: blink; + animation-name: blinker; + animation-duration: 0.6s; + animation-iteration-count: infinite; + animation-timing-function: ease-in-out; + animation-direction: alternate; } .segment { - border: 3px solid black; - background-color: red; - margin: 1px; - padding: 0; - cursor: pointer; - transition-duration: .5s; - user-select: none; - - vertical-align: middle; - text-align: center; + border: 3px solid black; + background-color: red; + margin: 1px; + padding: 0px; + cursor: pointer; + transition-duration: 0.5s; + user-select: none; + + vertical-align: middle; + text-align: center; } .segment-expanding { -border-color: red; - background-color: white; - transition-duration: 0s; - opacity: .75; - pointer-events: none; + border-color: red; + background-color: white; + transition-duration: 0s; + opacity: 0.75; + pointer-events: none; } .segment-expanding:hover { @@ -82,10 +84,10 @@ border-color: red; } .segment-disabled { - pointer-events: none; - opacity: 0.5; - transition-duration: 0s; - /* Hide the text. */ + pointer-events: none; + opacity: 0.5; + transition-duration: 0s; + /* Hide the text. */ text-indent: 100%; white-space: nowrap; overflow: hidden; @@ -99,25 +101,26 @@ border-color: red; } .segment:first-child { - margin-left: 2px; + margin-left: 2px; } .segment:last-child { - margin-right: 2px; + margin-right: 2px; } .segment:hover { background-color: white; } -.segment:hover, .segment-selected { - margin: 0px; - border: 4px solid red; - border-radius: 2px; +.segment:hover, +.segment-selected { + margin: 0px; + border: 4px solid red; + border-radius: 2px; } .segment-selected { - border: 4px solid #202020; - background-color: red; - opacity: .75; - cursor: grabbing; + border: 4px solid #202020; + background-color: red; + opacity: 0.75; + cursor: grabbing; } diff --git a/src/client/views/nodes/RecordingBox/RecordingView.scss b/src/client/views/nodes/RecordingBox/RecordingView.scss index f2d5a980d..15b48c111 100644 --- a/src/client/views/nodes/RecordingBox/RecordingView.scss +++ b/src/client/views/nodes/RecordingBox/RecordingView.scss @@ -28,7 +28,7 @@ video { justify-content: center; // overflow: hidden; border-radius: 10px; - margin: 0; + margin: 0px; } .video-wrapper:hover .controls { @@ -108,7 +108,7 @@ video { .timer { font-size: 15px; color: white; - margin: 0; + margin: 0px; } .dot { @@ -148,7 +148,7 @@ video { height: 80%; width: 80%; align-self: center; - margin: 0; + margin: 0px; &:hover { height: 85%; @@ -163,7 +163,7 @@ video { height: 70%; width: 70%; align-self: center; - margin: 0; + margin: 0px; // &:hover { // width: 40px; @@ -178,8 +178,8 @@ video { flex-direction: row; align-content: center; position: relative; - top: 0; - bottom: 0; + top: 0px; + bottom: 0px; &.video-edit-wrapper { // right: 50% - 15; diff --git a/src/client/views/nodes/ScreenshotBox.scss b/src/client/views/nodes/ScreenshotBox.scss index 1e9b64a0b..1714d87c2 100644 --- a/src/client/views/nodes/ScreenshotBox.scss +++ b/src/client/views/nodes/ScreenshotBox.scss @@ -32,10 +32,10 @@ .screenshotBox-uiButtons { position: absolute; - right: 25; - top: 0; - width: 22; - height: 25; + right: 25px; + top: 0px; + width: 22px; + height: 25px; .screenshotBox-recorder { color: white; diff --git a/src/client/views/nodes/ScriptingBox.scss b/src/client/views/nodes/ScriptingBox.scss index 9789da55a..de70dbe74 100644 --- a/src/client/views/nodes/ScriptingBox.scss +++ b/src/client/views/nodes/ScriptingBox.scss @@ -82,14 +82,14 @@ } .rta__autocomplete--top { - margin-top: 0; + margin-top: 0px; margin-bottom: 1em; max-height: 100px; } .rta__list { - margin: 0; - padding: 0; + margin: 0px; + padding: 0px; background: #fff; border: 1px solid #dfe2e5; border-radius: 3px; diff --git a/src/client/views/nodes/VideoBox.scss b/src/client/views/nodes/VideoBox.scss index b5405f0fb..27f419198 100644 --- a/src/client/views/nodes/VideoBox.scss +++ b/src/client/views/nodes/VideoBox.scss @@ -3,8 +3,8 @@ .mini-viewer { cursor: grab; position: absolute; - right: 10; - top: 10; + right: 10px; + top: 10px; opacity: 0.1; transition: all 0.4s; color: white; @@ -38,7 +38,7 @@ .videoBox-annotationLayer { position: relative; transform-origin: left top; - top: 0; + top: 0px; width: 100%; pointer-events: none; mix-blend-mode: multiply; // bcz: makes text fuzzy! @@ -81,8 +81,8 @@ // } .videoBox-ui-wrapper { - width: 0; - height: 0; + width: 0px; + height: 0px; position: relative; z-index: 2000; } diff --git a/src/client/views/nodes/WebBox.scss b/src/client/views/nodes/WebBox.scss index 05d5babf9..e7c9cf095 100644 --- a/src/client/views/nodes/WebBox.scss +++ b/src/client/views/nodes/WebBox.scss @@ -3,8 +3,8 @@ .webBox { height: 100%; width: 100%; - top: 0; - left: 0; + top: 0px; + left: 0px; position: relative; display: flex; overflow: hidden; @@ -28,8 +28,8 @@ height: 100%; z-index: 1; pointer-events: none; - top: 0; - left: 0; + top: 0px; + left: 0px; overflow: hidden; .webBox-overlayButton { @@ -39,16 +39,16 @@ align-items: center; height: 20px; background: none; - padding: 0; + padding: 0px; position: absolute; pointer-events: all; color: white; - bottom: 0; - right: 0; + bottom: 0px; + right: 0px; .webBox-overlayButton-arrow { - width: 0; - height: 0; + width: 0px; + height: 0px; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-right: 15px solid #121721; @@ -92,7 +92,7 @@ width: calc(100% - 40px); height: 20px; background: #121721; - bottom: 0; + bottom: 0px; display: flex; justify-content: center; align-items: center; @@ -137,7 +137,7 @@ .webBox-annotationLayer { position: absolute; transform-origin: left top; - top: 0; + top: 0px; width: 100%; pointer-events: none; mix-blend-mode: multiply; // bcz: makes text fuzzy! @@ -156,8 +156,8 @@ .webBox-htmlSpan { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; cursor: text; padding: 15px; height: 100%; @@ -171,8 +171,8 @@ .webBox-cont-interactive { padding: 0vw; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; transform-origin: top left; @@ -181,8 +181,8 @@ width: 100%; height: 100%; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; body { ::selection { color: white; @@ -203,8 +203,8 @@ height: 100%; position: absolute; transform-origin: top left; - top: 0; - left: 0; + top: 0px; + left: 0px; overflow: auto; .webBox-innerContent { @@ -224,7 +224,7 @@ } .webBox-buttons { - margin-left: 44; + margin-left: 44px; background: lightGray; width: 100%; } @@ -232,8 +232,8 @@ .webBox-annotationToggle { z-index: 901; position: absolute; - top: 2; - left: 2; + top: 2px; + left: 2px; cursor: pointer; box-shadow: black 0.3em 0.3em 1em; border-radius: 5px; diff --git a/src/client/views/nodes/audio/AudioWaveform.scss b/src/client/views/nodes/audio/AudioWaveform.scss index 6cbd1759a..c6b0da9c8 100644 --- a/src/client/views/nodes/audio/AudioWaveform.scss +++ b/src/client/views/nodes/audio/AudioWaveform.scss @@ -1,17 +1,17 @@ -.audioWaveform { +.audioWaveform { position: relative; width: 100%; height: 200%; overflow: hidden; z-index: -1000; - bottom: 0; + bottom: 0px; pointer-events: none; div { height: 100% !important; - width: 100% !important; + width: 100% !important; } - canvas { + canvas { height: 100% !important; - width: 100% !important; + width: 100% !important; } } diff --git a/src/client/views/nodes/chatbot/chatboxcomponents/ChatBox.scss b/src/client/views/nodes/chatbot/chatboxcomponents/ChatBox.scss index 3d27fa887..4db5cec3d 100644 --- a/src/client/views/nodes/chatbot/chatboxcomponents/ChatBox.scss +++ b/src/client/views/nodes/chatbot/chatboxcomponents/ChatBox.scss @@ -28,7 +28,7 @@ $transition: all 0.2s ease-in-out; box-shadow: 0 1px 4px $shadow-color; h2 { - margin: 0; + margin: 0px; font-size: 1.5em; font-weight: 500; } @@ -126,7 +126,7 @@ $transition: all 0.2s ease-in-out; animation: fadeIn 0.3s ease-in-out; p { - margin: 0; + margin: 0px; font-size: 14px; } @@ -263,10 +263,10 @@ $transition: all 0.2s ease-in-out; .uploading-overlay { position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; + top: 0px; + left: 0px; + right: 0px; + bottom: 0px; background-color: rgba(255, 255, 255, 0.8); display: flex; justify-content: center; @@ -285,7 +285,7 @@ $transition: all 0.2s ease-in-out; @media (max-width: 768px) { .chat-box { - border-radius: 0; + border-radius: 0px; } .message { diff --git a/src/client/views/nodes/chatbot/chatboxcomponents/ProgressBar.scss b/src/client/views/nodes/chatbot/chatboxcomponents/ProgressBar.scss index ff5be4a38..77d452830 100644 --- a/src/client/views/nodes/chatbot/chatboxcomponents/ProgressBar.scss +++ b/src/client/views/nodes/chatbot/chatboxcomponents/ProgressBar.scss @@ -21,8 +21,8 @@ background-color: #4a90e2; opacity: 0.6; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; animation: bounce 2s infinite ease-in-out; } @@ -42,10 +42,10 @@ .uploading-overlay { position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; + top: 0px; + left: 0px; + right: 0px; + bottom: 0px; background-color: rgba(255, 255, 255, 0.8); display: flex; align-items: center; diff --git a/src/client/views/nodes/formattedText/DashFieldView.scss b/src/client/views/nodes/formattedText/DashFieldView.scss index 3734ad9cc..1b2f76bbe 100644 --- a/src/client/views/nodes/formattedText/DashFieldView.scss +++ b/src/client/views/nodes/formattedText/DashFieldView.scss @@ -17,7 +17,7 @@ min-width: 12px; position: relative; display: inline-block; - margin: 0; + margin: 0px; transform: scale(0.7); background-color: rgba(155, 155, 155, 0.24); } diff --git a/src/client/views/nodes/formattedText/EquationEditor.scss b/src/client/views/nodes/formattedText/EquationEditor.scss index b0c17e56e..602135a30 100644 --- a/src/client/views/nodes/formattedText/EquationEditor.scss +++ b/src/client/views/nodes/formattedText/EquationEditor.scss @@ -32,7 +32,7 @@ margin-left: -1px; position: relative; z-index: 1; - padding: 0; + padding: 0px; display: -moz-inline-box; display: inline-block; } @@ -128,8 +128,8 @@ .mq-math-mode * { font-size: inherit; line-height: inherit; - margin: 0; - padding: 0; + margin: 0px; + padding: 0px; border-color: black; -webkit-user-select: none; -moz-user-select: none; @@ -178,7 +178,7 @@ margin-left: 0.1em; } .mq-math-mode .mq-roman var.mq-f { - margin: 0; + margin: 0px; } .mq-math-mode big { font-size: 200%; @@ -323,7 +323,7 @@ padding: 0.1em; } .mq-math-mode .mq-sqrt-prefix { - padding-top: 0; + padding-top: 0px; position: relative; top: 0.1em; vertical-align: top; diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.scss b/src/client/views/nodes/formattedText/FormattedTextBox.scss index 547a2efa8..d5e566226 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.scss +++ b/src/client/views/nodes/formattedText/FormattedTextBox.scss @@ -46,7 +46,7 @@ } audiotag { - left: 0; + left: 0px; position: absolute; cursor: pointer; border-radius: 10px; @@ -62,7 +62,7 @@ audiotag:hover { .formattedTextBox { touch-action: none; background: inherit; - padding: 0; + padding: 0px; border-width: 0px; border-color: global.$medium-gray; box-sizing: border-box; @@ -77,14 +77,14 @@ audiotag:hover { width: 100%; position: relative; transform-origin: left top; - top: 0; - left: 0; + top: 0px; + left: 0px; } .formattedTextBox-cont { touch-action: none; background: inherit; - padding: 0; + padding: 0px; border-width: 0px; border-radius: inherit; border-color: global.$medium-gray; @@ -111,7 +111,7 @@ audiotag:hover { .answer-tooltip { font-size: 15px; padding: 2px; - max-width: 150; + max-width: 150px; line-height: 150%; position: relative; } @@ -122,10 +122,10 @@ audiotag:hover { position: absolute; color: white; background: black; - right: 0; - bottom: 0; - width: 15; - height: 22; + right: 0px; + bottom: 0px; + width: 15px; + height: 22px; cursor: default; } @@ -139,8 +139,8 @@ audiotag:hover { .formattedTextBox-sidebar-handle { position: absolute; - top: 0; - right: 0; + top: 0px; + right: 0px; width: 20px; height: 20px; font-size: 11px; @@ -168,7 +168,7 @@ audiotag:hover { height: 100%; display: inline-block; position: absolute; - right: 0; + right: 0px; overflow: hidden; .collectionfreeformview-container { @@ -302,8 +302,8 @@ footnote::before { position: absolute; top: -0.5em; content: ' '; - height: 0; - width: 0; + height: 0px; + width: 0px; } .formattedTextBox-inlineComment { @@ -346,7 +346,7 @@ footnote::before { .prosemirror-linkBtn { background: unset; color: unset; - padding: 0; + padding: 0px; text-transform: unset; letter-spacing: unset; font-size: unset; @@ -357,7 +357,7 @@ footnote::before { background-color: dimgray; margin-top: 1.5em; z-index: 1; - padding: 5; + padding: 5px; border-radius: 2px; } .prosemirror-hrefoptions { @@ -396,7 +396,7 @@ footnote::before { blockquote { padding: 10px 10px; font-size: smaller; - margin: 0; + margin: 0px; font-style: italic; background: lightgray; border-left: solid 2px dimgray; @@ -415,7 +415,7 @@ footnote::before { p { font-family: inherit; } - margin-left: 0; + margin-left: 0px; } .bullet1 { p { @@ -439,7 +439,7 @@ footnote::before { display: inline-block; font-family: inherit; } - margin-left: 0; + margin-left: 0px; background-color: inherit; } .decimal2-ol { @@ -506,7 +506,7 @@ footnote::before { display: inline-block; font-family: inherit; } - margin-left: 0; + margin-left: 0px; padding-left: 1.2em; background-color: inherit; } @@ -661,7 +661,7 @@ footnote::before { .formattedTextBox-cont { touch-action: none; background: inherit; - padding: 0; + padding: 0px; border-width: 0px; border-radius: inherit; border-color: global.$medium-gray; @@ -706,7 +706,7 @@ footnote::before { height: 100%; display: inline-block; position: absolute; - right: 0; + right: 0px; .collectionfreeformview-container { position: relative; @@ -832,8 +832,8 @@ footnote::before { position: absolute; top: -0.5em; content: ' '; - height: 0; - width: 0; + height: px; + width: 0px; } .formattedTextBox-inlineComment { @@ -892,7 +892,7 @@ footnote::before { display: inline; font-family: inherit; } - margin-left: 0; + margin-left: 0px; } .decimal2-ol { counter-reset: deci2; @@ -952,7 +952,7 @@ footnote::before { display: inline; font-family: inherit; } - margin-left: 0; + margin-left: 0px; padding-left: 1.2em; } .multi2-ol { diff --git a/src/client/views/nodes/formattedText/FormattedTextBoxComment.scss b/src/client/views/nodes/formattedText/FormattedTextBoxComment.scss index bc0810f22..92f3e3290 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBoxComment.scss +++ b/src/client/views/nodes/formattedText/FormattedTextBoxComment.scss @@ -11,8 +11,8 @@ -webkit-transform: translateX(-50%); transform: translateX(-50%); box-shadow: 3px 3px 1.5px grey; - max-width: 400; - max-height: 235; + max-width: 400px; + max-height: 235px; height: max-content; .formattedTextBox-tooltipText { height: max-content; @@ -22,26 +22,26 @@ .formattedTextBox-tooltip:before { content: ''; - height: 0; - width: 0; + height: 0px; + width: 0px; position: absolute; left: 50%; margin-left: -5px; bottom: -6px; border: 5px solid transparent; - border-bottom-width: 0; + border-bottom-width: 0px; border-top-color: silver; } .formattedTextBox-tooltip:after { content: ''; - height: 0; - width: 0; + height: 0px; + width: 0px; position: absolute; left: 50%; margin-left: -5px; bottom: -4.5px; border: 5px solid transparent; - border-bottom-width: 0; + border-bottom-width: 0px; border-top-color: white; } diff --git a/src/client/views/nodes/formattedText/RichTextMenu.scss b/src/client/views/nodes/formattedText/RichTextMenu.scss index fcc816447..7c747de1e 100644 --- a/src/client/views/nodes/formattedText/RichTextMenu.scss +++ b/src/client/views/nodes/formattedText/RichTextMenu.scss @@ -23,7 +23,7 @@ .dropdown { position: absolute; top: 35px; - left: 0; + left: 0px; background-color: #323232; color: global.$light-gray; border: 1px solid #4d4d4d; @@ -47,7 +47,7 @@ } &:last-child { - margin-bottom: 0; + margin-bottom: 0px; } } } diff --git a/src/client/views/nodes/formattedText/TooltipTextMenu.scss b/src/client/views/nodes/formattedText/TooltipTextMenu.scss index 87320943d..8980a93a2 100644 --- a/src/client/views/nodes/formattedText/TooltipTextMenu.scss +++ b/src/client/views/nodes/formattedText/TooltipTextMenu.scss @@ -195,7 +195,7 @@ left: 1px; width: 24px; height: 4px; - margin-top: 0; + margin-top: 0px; } } @@ -221,7 +221,7 @@ display: inline-block; width: 1em; height: 1em; - stroke-width: 0; + stroke-width: 0px; stroke: currentColor; fill: currentColor; margin-right: 15px; @@ -231,7 +231,7 @@ display: inline-block; width: 1em; height: 1em; - stroke-width: 3; + stroke-width: 3px; fill: greenyellow; margin-right: 15px; } @@ -270,7 +270,7 @@ &.ProseMirror-menu-dropdown { width: 10px; height: 25px; - margin: 0; + margin: 0px; padding: 0 2px; background-color: #323232; text-align: center; diff --git a/src/client/views/nodes/imageEditor/ImageEditor.scss b/src/client/views/nodes/imageEditor/ImageEditor.scss index c691e6a18..942a7d4c6 100644 --- a/src/client/views/nodes/imageEditor/ImageEditor.scss +++ b/src/client/views/nodes/imageEditor/ImageEditor.scss @@ -4,8 +4,8 @@ $scale: 0.5; .imageEditorContainer { position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; z-index: 9999; height: 100vh; width: 100vw; @@ -78,7 +78,7 @@ $scale: 0.5; .sideControlsContainer { width: 160px; position: absolute; - left: 0; + left: 0px; height: 100%; .sideControls { @@ -129,8 +129,8 @@ $scale: 0.5; .originalImageLabel { position: absolute; - bottom: 10; - left: 10; + bottom: 10px; + left: 10px; color: #ffffff; font-size: 0.8rem; letter-spacing: 1px; diff --git a/src/client/views/nodes/trails/PresBox.scss b/src/client/views/nodes/trails/PresBox.scss index e24b47bd1..8875f7012 100644 --- a/src/client/views/nodes/trails/PresBox.scss +++ b/src/client/views/nodes/trails/PresBox.scss @@ -229,7 +229,7 @@ .toolbar-transition { display: flex; font-size: 10; - width: 100; + width: 100px; background-color: rgba(0, 0, 0, 0); min-width: max-content; @@ -358,7 +358,7 @@ font-weight: 200; padding: 8px; border-radius: 4px; - // height: 20; + // height: 20px; // display: flex; // margin-left: 5px; // margin-top: 5px; @@ -371,8 +371,8 @@ } .ribbon-propertyUpDown { - height: 20; - width: 20; + height: 20px; + width: 20px; margin-top: 5px; display: grid; grid-template-rows: 10px 10px; @@ -486,7 +486,7 @@ -moz-user-select: none; -ms-user-select: none; user-select: none; - margin: 0; + margin: 0px; margin-right: 3px; border-radius: 100%; height: 15px; @@ -658,9 +658,9 @@ height: 25px; color: white; width: 100%; - max-width: 120; - padding-left: 10; - padding-right: 10; + max-width: 120px; + padding-left: 10px; + padding-right: 10px; border-radius: 10px; background-color: global.$medium-gray; } @@ -683,9 +683,9 @@ height: 25px; color: global.$light-gray; width: 100%; - max-width: 120; - padding-left: 10; - padding-right: 10; + max-width: 120px; + padding-left: 10px; + padding-right: 10px; border-radius: 10px; background-color: global.$black; } @@ -745,9 +745,9 @@ .selectedList { display: block; - min-width: 50; - max-width: 120; - height: 70; + min-width: 50px; + max-width: 120px; + height: 70px; overflow-y: scroll; .selectedList-items { @@ -760,7 +760,7 @@ cursor: pointer; font-size: 10.5; font-weight: 300; - height: 20; + height: 20px; background-color: global.$medium-gray; color: white; display: flex; @@ -788,7 +788,7 @@ cursor: pointer; font-size: 10.5; font-weight: 200; - height: 20; + height: 20px; background-color: global.$white; display: inline-flex; color: global.$black; @@ -813,7 +813,7 @@ } svg.svg-inline--fa.fa-thumbtack.fa-w-12.toolbar-thumbtack { - right: 40; + right: 40px; position: absolute; transform: rotate(45deg); } @@ -850,7 +850,7 @@ background-color: global.$light-gray; border-radius: 5px; font-size: 10; - height: 25; + height: 25px; color: global.$black; padding-left: 5px; align-items: center; @@ -868,8 +868,8 @@ display: block; padding-left: 10px; padding-right: 5px; - padding-top: 3; - padding-bottom: 3; + padding-top: 3px; + padding-bottom: 3px; opacity: 0.8; } @@ -959,8 +959,8 @@ border-radius: 4px; padding-left: 7px; padding-right: 7px; - border-bottom-right-radius: 0; - border-top-right-radius: 0; + border-bottom-right-radius: 0px; + border-top-right-radius: 0px; } .presBox-button-right { @@ -976,8 +976,8 @@ border-radius: 4px; padding-left: 7px; padding-right: 7px; - border-bottom-left-radius: 0; - border-top-left-radius: 0; + border-bottom-left-radius: 0px; + border-top-left-radius: 0px; } .presBox-button-right.active { @@ -1043,8 +1043,8 @@ cursor: pointer; align-self: center; justify-self: center; - margin-top: 5; - margin-bottom: 5; + margin-top: 5px; + margin-bottom: 5px; position: relative; height: 55px; min-width: 90px; @@ -1063,7 +1063,7 @@ padding-left: 3px; margin-left: 3px; margin-right: 3px; - height: 13; + height: 13px; font-size: 12; display: flex; background-color: global.$white; @@ -1076,7 +1076,7 @@ margin-left: 3px; margin-right: 3px; font-weight: 400; - height: 13; + height: 13px; font-size: 9; display: flex; background-color: global.$white; @@ -1089,11 +1089,11 @@ padding-left: 3px; margin-left: 3px; margin-right: 3px; - height: 13; + height: 13px; font-size: 10; display: flex; background-color: global.$white; - height: 33; + height: 33px; text-align: left; font-size: 8px; } @@ -1112,7 +1112,7 @@ .presBox-viewPicker { cursor: pointer; - height: 25; + height: 25px; position: relative; display: inline-block; grid-column: 1; @@ -1184,9 +1184,9 @@ } .collectionViewBaseChrome-viewPicker { - min-width: 50; + min-width: 50px; width: 5%; - height: 25; + height: 25px; position: relative; display: inline-block; left: 8px; @@ -1210,11 +1210,11 @@ } .presBox-backward { - left: 5; + left: 5px; } .presBox-forward { - right: 5; + right: 5px; } // CSS adjusted for mobile devices @@ -1233,8 +1233,8 @@ .presBox-button { margin-top: 5%; - height: 250; - width: 300; + height: 250px; + width: 300px; font-size: 100; display: flex; align-items: center; @@ -1256,7 +1256,7 @@ } .presBox-cont .presBox-listCont { - top: 50; + top: 50px; height: calc(100% - 80px); } @@ -1269,8 +1269,8 @@ .miniPres { cursor: grab; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; opacity: 0.5; transition: all 0.4s; color: global.$white; @@ -1298,7 +1298,7 @@ .presPanel-button-text { cursor: pointer; display: flex; - height: 20; + height: 20px; width: max-content; font-family: Roboto; font-weight: 400; @@ -1327,8 +1327,8 @@ grid-template-columns: auto auto auto; justify-content: space-around; font-size: 11; - margin-left: 7; - width: 30; + margin-left: 7px; + width: 30px; height: 85%; background-color: rgba(91, 157, 221, 0.4); border-radius: 5px; @@ -1337,8 +1337,8 @@ .presPanel-button { cursor: pointer; display: flex; - height: 20; - min-width: 20; + height: 20px; + min-width: 20px; margin-left: 3px; margin-right: 3px; border-radius: 100%; @@ -1361,8 +1361,8 @@ // cursor: grab; // position: absolute; // overflow: hidden; -// right: 10; -// top: 10; +// right: 10px; +// top: 10px; // opacity: 0.1; // transition: all 0.4s; // /* border: solid 1px; */ @@ -1380,7 +1380,7 @@ // .miniPres-button-text { // cursor: pointer; // display: flex; -// height: 20; +// height: 20px; // font-weight: 400; // min-width: 100%; // border-radius: 5px; @@ -1397,8 +1397,8 @@ // grid-template-columns: auto auto auto; // justify-content: space-around; // font-size: 11; -// margin-left: 7; -// width: 30; +// margin-left: 7px; +// width: 30px; // height: 85%; // background-color: rgba(91, 157, 221, 0.4); // border-radius: 5px; @@ -1413,8 +1413,8 @@ // .miniPres-button { // cursor: pointer; // display: flex; -// height: 20; -// min-width: 20; +// height: 20px; +// min-width: 20px; // border-radius: 100%; // align-items: center; // justify-content: center; diff --git a/src/client/views/nodes/trails/PresSlideBox.scss b/src/client/views/nodes/trails/PresSlideBox.scss index 9ac2b5a94..740bcae5f 100644 --- a/src/client/views/nodes/trails/PresSlideBox.scss +++ b/src/client/views/nodes/trails/PresSlideBox.scss @@ -117,8 +117,8 @@ $slide-active: #5b9fdd; height: 100%; position: absolute; border-radius: 3px; - top: 0; - left: 0; + top: 0px; + left: 0px; z-index: 1; overflow: hidden; } @@ -209,7 +209,7 @@ $slide-active: #5b9fdd; position: absolute; /* grid-row: 3; */ /* grid-column: 1/8; */ - top: 28; + top: 28px; display: block; background: #92adb9; width: 100%; @@ -276,7 +276,7 @@ $slide-active: #5b9fdd; cursor: pointer; position: absolute; border-radius: 100px; - bottom: 0; + bottom: 0px; left: -18; z-index: 300; width: 15px; @@ -302,7 +302,7 @@ $slide-active: #5b9fdd; color: #d5dce2; position: absolute; left: -15px; - top: 1; + top: 1px; font-weight: 600; font-size: 12; } diff --git a/src/client/views/pdf/AnchorMenu.scss b/src/client/views/pdf/AnchorMenu.scss index 6990bdcf1..98eeaf80e 100644 --- a/src/client/views/pdf/AnchorMenu.scss +++ b/src/client/views/pdf/AnchorMenu.scss @@ -6,19 +6,19 @@ } .anchorMenu-highlighter { padding-right: 5px; - .antimodeMenu-button { - padding: 0; - padding: 0; + .antimodeMenu-button { + padding: 0px; + padding: 0px; padding-right: 0px; padding-left: 0px; width: 5px; } } -.anchor-color-preview-button { - width: 25px !important; +.anchor-color-preview-button { + width: 25px !important; .anchor-color-preview { display: flex; - flex-direction: column; + flex-direction: column; padding-right: 3px; width: unset !important; .color-preview { @@ -51,4 +51,4 @@ border: 2px solid white; } } -}
\ No newline at end of file +} diff --git a/src/client/views/pdf/GPTPopup/GPTPopup.scss b/src/client/views/pdf/GPTPopup/GPTPopup.scss index f6fa45221..85c1f6759 100644 --- a/src/client/views/pdf/GPTPopup/GPTPopup.scss +++ b/src/client/views/pdf/GPTPopup/GPTPopup.scss @@ -20,8 +20,8 @@ $headingHeight: 32px; left: 75px; width: 100%; height: 100%; - top: 0; - left: 0; + top: 0px; + left: 0px; border-top: solid gray 20px; border-radius: 16px; z-index: 999; @@ -58,7 +58,7 @@ $headingHeight: 32px; font-size: 12px; font-weight: 400; letter-spacing: 1px; - margin: 0; + margin: 0px; padding-right: 5px; } @@ -214,8 +214,8 @@ $headingHeight: 32px; .img-container::after { content: ''; position: absolute; - top: 0; - left: 0; + top: 0px; + left: 0px; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); diff --git a/src/client/views/pdf/PDFViewer.scss b/src/client/views/pdf/PDFViewer.scss index a54505443..dafa908a2 100644 --- a/src/client/views/pdf/PDFViewer.scss +++ b/src/client/views/pdf/PDFViewer.scss @@ -3,8 +3,8 @@ width: 100%; position: absolute; display: inline-block; - top: 0; - left: 0; + top: 0px; + left: 0px; } :root { @@ -16,8 +16,8 @@ position: absolute; width: 100%; height: 100%; - top: 0; - left: 0; + top: 0px; + left: 0px; position: absolute; overflow-y: auto; overflow-x: hidden; @@ -99,7 +99,7 @@ .pdfViewerDash-annotationLayer { position: absolute; transform-origin: left top; - top: 0; + top: 0px; width: 100%; pointer-events: none; mix-blend-mode: multiply; // bcz: makes text fuzzy! diff --git a/src/client/views/topbar/TopBar.scss b/src/client/views/topbar/TopBar.scss index 35a3da312..ca177c746 100644 --- a/src/client/views/topbar/TopBar.scss +++ b/src/client/views/topbar/TopBar.scss @@ -125,7 +125,7 @@ .topbar-lozenge-user, .topbar-lozenge { - height: 23; + height: 23px; font-size: 12; color: white; font-family: 'Roboto'; diff --git a/src/debug/Viewer.tsx b/src/debug/Viewer.tsx index f3295a6c6..354ed11d6 100644 --- a/src/debug/Viewer.tsx +++ b/src/debug/Viewer.tsx @@ -1,8 +1,5 @@ /* eslint-disable react/no-unescaped-entities */ -/* eslint-disable react/button-has-type */ /* eslint-disable no-use-before-define */ -/* eslint-disable react/no-array-index-key */ -/* eslint-disable no-redeclare */ import { action, configure, observable } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; diff --git a/src/fields/FieldLoader.scss b/src/fields/FieldLoader.scss index 9a23c3e4f..62d85a763 100644 --- a/src/fields/FieldLoader.scss +++ b/src/fields/FieldLoader.scss @@ -1,7 +1,7 @@ .fieldLoader { z-index: 10000; width: 200px; - height: 30; + height: 30px; background: lightblue; position: absolute; left: calc(50% - 99px); diff --git a/src/server/ApiManagers/UploadManager.ts b/src/server/ApiManagers/UploadManager.ts index 7c55e4a42..1e68a4e30 100644 --- a/src/server/ApiManagers/UploadManager.ts +++ b/src/server/ApiManagers/UploadManager.ts @@ -18,7 +18,7 @@ export default class UploadManager extends ApiManager { protected initialize(register: Registration): void { register({ method: Method.POST, - subscription: '/ping', + subscription: '/DashPing', secureHandler: async ({ /* req, */ res }) => { _success(res, { message: DashVersion, date: new Date() }); }, diff --git a/src/server/PdfTypes.ts b/src/server/PdfTypes.ts index fb435a677..458df7b26 100644 --- a/src/server/PdfTypes.ts +++ b/src/server/PdfTypes.ts @@ -2,7 +2,7 @@ export interface PDFInfo { PDFFormatVersion: string; IsAcroFormPresent: boolean; IsXFAPresent: boolean; - [key: string]: any; + [key: string]: unknown; } export interface PDFMetadata { parse(): void; diff --git a/views/stylesheets/authentication.css b/views/stylesheets/authentication.css index ff1f4aace..dbd1043a4 100644 --- a/views/stylesheets/authentication.css +++ b/views/stylesheets/authentication.css @@ -110,10 +110,10 @@ body { text-align: center; position: absolute; margin: auto; - top: 0; - bottom: 0; - left: 0; - right: 0; + top: 0px; + bottom: 0px; + left: 0px; + right: 0px; width: 400px; background-color: white; border-radius: 8px; @@ -122,10 +122,10 @@ body { .inner { position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; + top: 0px; + bottom: 0px; + left: 0px; + right: 0px; width: 230px; margin: auto; } @@ -141,7 +141,8 @@ body { font-size: 16px; } -.outermost, .online-container { +.outermost, +.online-container { display: flex; flex-direction: row; height: 98vh; @@ -220,4 +221,4 @@ span.user-type { #inactive-inner { border-bottom-right-radius: 8px; -}
\ No newline at end of file +} |