Rework documentation URLs as inline markdown.
Redesign documentations with markdown text.
Redesign way to document scripts/categories and present the
documentation.
Documentation is showed in an expandable box instead of tooltip. This is
to allow writing longer documentation (tooltips are meant to be used for
short text) and have better experience on mobile.
If a node (script/category) has documentation it's now shown with single
information icon (ℹ) aligned to right.
Add support for rendering documentation as markdown. It automatically
converts plain URLs to URLs with display names (e.g.
https://docs.microsoft.com/..) will be rendered automatically like
"docs.microsoft.com - Windows 11 Privacy...".
Disable selecting clickables as text. Selecting buttons leads to
unintended selection. This is seen when touching on clickables using
mobile devices.
Prevent blue highlight when touching on clickables. This is seen on
mobile webkit browsers. It looks ugly and the visual clue provided is
not needed beacuse all clickables on mobile already have visual clues.
This commit improves mobile support. `:hover` CSS selector is not mobile
friendly because there is typically no mouse support on mobile. This
commit make hover behavior to become active during touch on mobile.
`:hover` selector is emulated on mobile devices. But this emulated
behavior is not desired. When emulated, the CSS style gets attached when
starting touching but does not get removed after stopping touching. This
sticky behavior is undesired.
This commit solve this issue by using Saas mixing that uses `:active`
selector instead of `:hover` when `:hover` is not really supported but
emulated.
- Unify test data for nonexistence of an object/string and collection.
- Introduce more test through adding missing test data to existing tests.
- Improve logic for checking absence of values to match tests.
- Add missing tests for absent value validation.
- Update documentation to include shared test functionality.
- Use function abstractions (such as map, reduce, filter etc.) over
for-of loops to gain benefits of having less side effects and easier
readability.
- Enable `downLevelIterations` for writing modern code with lazy evaluation.
- Refactor for of loops to named abstractions to clearly express their
intentions without needing to analyse the loop itself.
- Add missing cases for changes that had no tests.
Major refactoring using ESLint with rules from AirBnb and Vue.
Enable most of the ESLint rules and do necessary linting in the code.
Also add more information for rules that are disabled to describe what
they are and why they are disabled.
Allow logging (`console.log`) in test files, and in development mode
(e.g. when working with `npm run serve`), but disable it when
environment is production (as pre-configured by Vue). Also add flag
(`--mode production`) in `lint:eslint` command so production linting is
executed earlier in lifecycle.
Disable rules that requires a separate work. Such as ESLint rules that
are broken in TypeScript: no-useless-constructor (eslint/eslint#14118)
and no-shadow (eslint/eslint#13014).
Using more granular interfaces adds to expressiveness of the code.
Knowing what needs to mutate the state explicitly helps easier
understanding of the code and therefore increases the maintainability.
- Add more documentation.
- Use `main.scss` instead of importing components individually. This
improves productivity without compilation errors due to missing
imports and allows for easier future file/folder changes and
refactorings inside `./styles`.
- Use partials with underscored naming. Because it documents that the
files should not be individually imported.
- Introduce `third-party-extensions` folder to group styles that
overwrites third party components.
- Refactor variable names from generic to specific.
- Use Sass modules (`@use` and `@forward`) over depreciated `@import`
syntax.
- Separate font assets from Sass files (`styles/`). Create `assets/`
folder that will contain both.
- Create `_globals.css` for global styling of common element instead of
using `App.vue`.
Remove convention where Async suffix is added to functions that returns
a Promise. It was a habit from C#, but is not widely used in JavaScript
/ TypeScript world, also bloats the code. The code is more consistent
with third party dependencies/frameworks without the suffix.
- Bump dependencies to latest.
- Remove unused inversify dependency.
- Lock sass-loader to a version that's compatible to 10. Because later
versions (>=11) require Webpack v5 while Vue CLI v4 uses Webpack v4.
- Changes slashes as division to `math.div` as it's depreciated by SASS
https://sass-lang.com/documentation/breaking-changes/slash
1. Renames color names in palette. Using names such as "primary" and
"secondary" that are in consistent with designs such as material,
bootstrap and metro UI palettes. It adds `color-` prefix on color
variables in line with Vue Design System.
2. Introduces necessary changes to follow the system color system
everywhere without using any other color:
- It changes tooltip background from black to darker primary
colors.
- It overrides unset styles from tree component
- It ensures footer has same color as top menu.
3. Removes opacity CSS changes to have better control on choices. To
achieve that:
- It introduces new "light" variants of main colors
- It switches to colors with different variants (e.g. in Dialogs it
uses primary color as button as it has variants that can be
activated on hover meanwhile on-surface color is single).
4. Styles a tags (anchor elements) globally for consistency
1. It vertically centers top script menu (including selectors for view,
OS and recommendation levels). Before, it did not utilize the empty
space on smaller screens when of the menu items overflowed to a new
line. This commit fixes it, also adds margin on top selectors on
small screens.
2. It adds vertical margin between slider items on vertical view. It
also refactors slider component so that the `v-deep` is no longer
used, instead style is set through properties.
3. It ensures symmetrical margin on both sides of the handle in slider
during horizontal view. Before, the left margin did not exist and
right margin was too wide. This commit balances right and left margin
of the arrow.
4. It changes the way margining is done for the card list. It removes
internal margin from cards, because when they have them they also add
that to the outer card list. This commit solves it in a way that
unifies setting gap between cards and setting gap between cards.
The styles are controlled on card list instead. This way same margins
and paddings is also applied to non-card view (i.e. scripts tree).
Before margining was done separately and those views looked
diferently.
5. It improves styling of cards. It uses variables instead of hardcoded
values and also refactors and renames variables for simpler
understanding.
Detects clickable elements automatically and exempts them from
collapsing cards, also interacting with code area does no longer
collapse cards.
This commit also fixes subscribing to clicks on document every time card
list is loaded, but never unsubscribing. This impacts performance and
causes memory leaks. Now, registered event listener is removed every
time card list component is destroyed.
1. *Grouping* becomes *view*. Because *view* is more clear and extensible than *grouping*. It increases flexibility to extend by e.g. adding *flat* as a new view as discussed in #50, in this case "flat *view*" would make more sense than "flat *grouping*".
2. *None* becomes *tree*. Because *tree* is more descriptive than *none*.
Updates labels on top menu. As labels are updated, the file structure/names are refactored to follow the same concept. `TheScriptsList` is renamed to `TheScriptsView`. Also refactors `ViewChanger` so view types are presented in same way.
