From b6b23a787cba68ec0b99a081c6842210e557156f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Fri, 31 Jan 2025 11:52:46 +0100 Subject: [PATCH 1/7] upadte notification popup to handle markdown --- .../notificationPopup/notificationPopup.jsx | 5 ++- .../notificationPopup/notificationPopup.less | 40 ++++++++++++++++--- 2 files changed, 38 insertions(+), 7 deletions(-) diff --git a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx index b2045f13d..49ac57994 100644 --- a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx +++ b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx @@ -1,6 +1,7 @@ require('./notificationPopup.less'); import React, { useEffect, useState } from 'react'; import request from '../../utils/request-middleware.js'; +import Markdown from 'naturalcrit/markdown.js'; import Dialog from '../../../components/dialog.jsx'; @@ -40,11 +41,11 @@ const NotificationPopup = ()=>{ const renderNotificationsList = ()=>{ if(error) return
{error}
; - + notifications.map((notification) =>console.log(Markdown.render(notification.text, 1))); return notifications.map((notification)=>(
  • {notification.title}
    -

    +

    • )); }; diff --git a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less index 79edf37b2..61f79e501 100644 --- a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less +++ b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less @@ -8,6 +8,7 @@ } .notificationPopup { + font-size:17px; position : relative; width : 100%; padding : 15px; @@ -48,17 +49,46 @@ } ul { margin-top : 15px; - font-size : 0.8em; + font-size : 0.9em; list-style-position : outside; list-style-type : disc; li { - margin-top : 1.4em; - font-size : 0.8em; - line-height : 1.4em; + margin-top : 1.2em; + font-size : 0.9em; + line-height : 1.2em; + padding-left: 1em; em { text-transform:capitalize; font-weight : 800; } + li { list-style-type: square;} + } + ul ul,ol ol,ul ol,ol ul { + margin-bottom : 0px; + margin-left : 1.5em; } } -} + + /*Markdown styling*/ + code { + background:#08115a; + padding: 0.1em 0.5em; + border-radius:2px; + font-family : 'Courier New', "Courier", monospace; + overflow-wrap : break-word; + white-space : pre-wrap; + } + pre code { + display : inline-block; + width : 100%; + } + .blank { + height : 1em; + margin-top : 0; + & + * { margin-top : 0; } + } + + + + +} \ No newline at end of file From 057abcda0d85d1e8821ea1c13c39f14bdfee3152 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Fri, 31 Jan 2025 12:04:40 +0100 Subject: [PATCH 2/7] reduce style between li elements --- .../notificationPopup/notificationPopup.less | 14 ++++++-------- 1 file changed, 6 insertions(+), 8 deletions(-) diff --git a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less index 61f79e501..4f5a0a2de 100644 --- a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less +++ b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less @@ -8,7 +8,6 @@ } .notificationPopup { - font-size:17px; position : relative; width : 100%; padding : 15px; @@ -53,15 +52,14 @@ list-style-position : outside; list-style-type : disc; li { - margin-top : 1.2em; font-size : 0.9em; - line-height : 1.2em; + line-height : 1.5em; padding-left: 1em; em { text-transform:capitalize; font-weight : 800; } - li { list-style-type: square;} + li { list-style-type: square; line-height : 1.2em;} } ul ul,ol ol,ul ol,ol ul { margin-bottom : 0px; @@ -79,12 +77,12 @@ white-space : pre-wrap; } pre code { - display : inline-block; - width : 100%; + display : inline-block; + width : 100%; } .blank { - height : 1em; - margin-top : 0; + height : 1em; + margin-top : 0; & + * { margin-top : 0; } } From 518924d72590e5ba11ae237391811a4118c92107 Mon Sep 17 00:00:00 2001 From: Trevor Buckner Date: Fri, 31 Jan 2025 13:36:42 -0500 Subject: [PATCH 3/7] Use import, run eslint --- ...ation-block-multi-line-min-declarations.js | 28 ++++---- stylelint_plugins/declaration-colon-align.js | 67 ++++++++++--------- .../declaration-colon-min-space-before.js | 21 +++--- 3 files changed, 58 insertions(+), 58 deletions(-) diff --git a/stylelint_plugins/declaration-block-multi-line-min-declarations.js b/stylelint_plugins/declaration-block-multi-line-min-declarations.js index ba40ab5f6..517fd27ec 100644 --- a/stylelint_plugins/declaration-block-multi-line-min-declarations.js +++ b/stylelint_plugins/declaration-block-multi-line-min-declarations.js @@ -1,5 +1,5 @@ -const stylelint = require('stylelint'); -const { isNumber } = require('stylelint/lib/utils/validateTypes.cjs'); +import stylelint from 'stylelint'; +import { isNumber } from 'stylelint/lib/utils/validateTypes.mjs'; const { report, ruleMessages, validateOptions } = stylelint.utils; const ruleName = 'naturalcrit/declaration-block-multi-line-min-declarations'; @@ -7,9 +7,8 @@ const messages = ruleMessages(ruleName, { expected : (decls)=>`Rule with ${decls} declaration${decls == 1 ? '' : 's'} should be single line`, }); - -module.exports = stylelint.createPlugin(ruleName, function getPlugin(primaryOption, secondaryOptionObject, context) { - return function lint(postcssRoot, postcssResult) { +const ruleFunction = (primaryOption, secondaryOptionObject, context)=>{ + return (postcssRoot, postcssResult)=>{ const validOptions = validateOptions( postcssResult, @@ -20,26 +19,23 @@ module.exports = stylelint.createPlugin(ruleName, function getPlugin(primaryOpti } ); - if(!validOptions) { //If the options are invalid, don't lint + if(!validOptions) //If the options are invalid, don't lint return; - } + const isAutoFixing = Boolean(context.fix); postcssRoot.walkRules((rule)=>{ //Iterate CSS rules //Apply rule only if all children are decls (no further nested rules) - if(rule.nodes.length > primaryOption || !rule.nodes.every((node)=>node.type === 'decl')) { + if(rule.nodes.length > primaryOption || !rule.nodes.every((node)=>node.type === 'decl')) return; - } //Ignore if already one line if(!rule.nodes.some((node)=>node.raws.before.includes('\n')) && !rule.raws.after.includes('\n')) return; if(isAutoFixing) { //We are in “fix” mode - rule.each((decl)=>{ - decl.raws.before = ' '; - }); + rule.each((decl)=>decl.raws.before = ' '); rule.raws.after = ' '; } else { report({ @@ -52,7 +48,9 @@ module.exports = stylelint.createPlugin(ruleName, function getPlugin(primaryOpti } }); }; -}); +}; -module.exports.ruleName = ruleName; -module.exports.messages = messages; +ruleFunction.ruleName = ruleName; +ruleFunction.messages = messages; + +export default stylelint.createPlugin(ruleName, ruleFunction); diff --git a/stylelint_plugins/declaration-colon-align.js b/stylelint_plugins/declaration-colon-align.js index f1f5269d3..aeb92fcd8 100644 --- a/stylelint_plugins/declaration-colon-align.js +++ b/stylelint_plugins/declaration-colon-align.js @@ -1,32 +1,29 @@ -const stylelint = require('stylelint'); - +import stylelint from 'stylelint'; const { report, ruleMessages, validateOptions } = stylelint.utils; + const ruleName = 'naturalcrit/declaration-colon-align'; const messages = ruleMessages(ruleName, { expected : (rule)=>`Expected colons aligned within rule "${rule}"`, }); - -module.exports = stylelint.createPlugin(ruleName, function getPlugin(primaryOption, secondaryOptionObject, context) { - return function lint(postcssRoot, postcssResult) { +const ruleFunction = (primaryOption, secondaryOptionObject, context)=>{ + return (postcssRoot, postcssResult)=>{ const validOptions = validateOptions( postcssResult, ruleName, { actual : primaryOption, - possible : [ - true, - false - ] + possible : [true, false] } ); - if(!validOptions) { //If the options are invalid, don't lint + if(!validOptions) // If the options are invalid, don't lint return; - } + const isAutoFixing = Boolean(context.fix); - postcssRoot.walkRules((rule)=>{ //Iterate CSS rules + + postcssRoot.walkRules((rule)=>{ // Iterate CSS rules let maxColonPos = 0; let misaligned = false; @@ -36,33 +33,37 @@ module.exports = stylelint.createPlugin(ruleName, function getPlugin(primaryOpti return; const colonPos = declaration.prop.length + declaration.raws.between.indexOf(':'); - if(maxColonPos > 0 && colonPos != maxColonPos) { + + if(maxColonPos > 0 && colonPos != maxColonPos) misaligned = true; - } + maxColonPos = Math.max(maxColonPos, colonPos); }); - if(misaligned) { - if(isAutoFixing) { //We are in “fix” mode - rule.each((declaration)=>{ - if(declaration.type != 'decl') - return; + if(!misaligned) + return; - declaration.raws.between = `${' '.repeat(maxColonPos - declaration.prop.length)}:${declaration.raws.between.split(':')[1]}`; - }); - } else { //We are in “report only” mode - report({ - ruleName, - result : postcssResult, - message : messages.expected(rule.selector), // Build the reported message - node : rule, // Specify the reported node - word : rule.selector, // Which exact word caused the error? This positions the error properly - }); - } + if(isAutoFixing) { // We are in “fix” mode + rule.each((declaration)=>{ + if(declaration.type != 'decl') + return; + + declaration.raws.between = `${' '.repeat(maxColonPos - declaration.prop.length)}:${declaration.raws.between.split(':')[1]}`; + }); + } else { // We are in “report only” mode + report({ + ruleName, + result : postcssResult, + message : messages.expected(rule.selector), // Build the reported message + node : rule, // Specify the reported node + word : rule.selector, // Which exact word caused the error? This positions the error properly + }); } }); }; -}); +}; -module.exports.ruleName = ruleName; -module.exports.messages = messages; +ruleFunction.ruleName = ruleName; +ruleFunction.messages = messages; + +export default stylelint.createPlugin(ruleName, ruleFunction); \ No newline at end of file diff --git a/stylelint_plugins/declaration-colon-min-space-before.js b/stylelint_plugins/declaration-colon-min-space-before.js index e75c035a6..7776c6fef 100644 --- a/stylelint_plugins/declaration-colon-min-space-before.js +++ b/stylelint_plugins/declaration-colon-min-space-before.js @@ -1,5 +1,5 @@ -const stylelint = require('stylelint'); -const { isNumber } = require('stylelint/lib/utils/validateTypes.cjs'); +import stylelint from 'stylelint'; +import { isNumber } from 'stylelint/lib/utils/validateTypes.mjs'; const { report, ruleMessages, validateOptions } = stylelint.utils; const ruleName = 'naturalcrit/declaration-colon-min-space-before'; @@ -7,9 +7,8 @@ const messages = ruleMessages(ruleName, { expected : (num)=>`Expected at least ${num} space${num == 1 ? '' : 's'} before ":"` }); - -module.exports = stylelint.createPlugin(ruleName, function getPlugin(primaryOption, secondaryOptionObject, context) { - return function lint(postcssRoot, postcssResult) { +const ruleFunction = (primaryOption, secondaryOptionObject, context)=>{ + return (postcssRoot, postcssResult)=>{ const validOptions = validateOptions( postcssResult, @@ -30,9 +29,9 @@ module.exports = stylelint.createPlugin(ruleName, function getPlugin(primaryOpti const between = decl.raws.between; const colonIndex = between.indexOf(':'); - if(between.slice(0, colonIndex).length >= primaryOption) { + if(between.slice(0, colonIndex).length >= primaryOption) return; - } + if(isAutoFixing) { //We are in “fix” mode decl.raws.between = between.slice(0, colonIndex).replace(/\s*$/, ' '.repeat(primaryOption)) + between.slice(colonIndex); } else { @@ -46,7 +45,9 @@ module.exports = stylelint.createPlugin(ruleName, function getPlugin(primaryOpti } }); }; -}); +}; -module.exports.ruleName = ruleName; -module.exports.messages = messages; +ruleFunction.ruleName = ruleName; +ruleFunction.messages = messages; + +export default stylelint.createPlugin(ruleName, ruleFunction); \ No newline at end of file From 2f1ade84636857fde18832e795e4cfc81b55ef61 Mon Sep 17 00:00:00 2001 From: Trevor Buckner Date: Fri, 31 Jan 2025 13:38:25 -0500 Subject: [PATCH 4/7] lint --- .stylelintrc.json | 92 +++++++++++++++++++++++------------------------ 1 file changed, 46 insertions(+), 46 deletions(-) diff --git a/.stylelintrc.json b/.stylelintrc.json index 2c7a9afdf..b5f2e7712 100644 --- a/.stylelintrc.json +++ b/.stylelintrc.json @@ -1,48 +1,48 @@ { - "extends": [ - "stylelint-config-recess-order", - "stylelint-config-recommended"], - "plugins": [ - "@stylistic/stylelint-plugin", - "./stylelint_plugins/declaration-colon-align.js", - "./stylelint_plugins/declaration-colon-min-space-before", - "./stylelint_plugins/declaration-block-multi-line-min-declarations" - ], - "customSyntax": "postcss-less", - "rules": { - "no-descending-specificity" : null, - "at-rule-no-unknown" : null, - "function-no-unknown" : null, - "font-family-no-missing-generic-family-keyword" : null, - "font-weight-notation" : "named-where-possible", - "font-family-name-quotes" : "always-unless-keyword", - "@stylistic/indentation" : "tab", - "no-duplicate-selectors" : true, - "@stylistic/color-hex-case" : "upper", - "color-hex-length" : "long", - "@stylistic/selector-combinator-space-after" : "always", - "@stylistic/selector-combinator-space-before" : "always", - "@stylistic/selector-attribute-operator-space-before" : "never", - "@stylistic/selector-attribute-operator-space-after" : "never", - "@stylistic/selector-attribute-brackets-space-inside" : "never", - "selector-attribute-quotes" : "always", - "selector-pseudo-element-colon-notation" : "double", - "@stylistic/selector-pseudo-class-parentheses-space-inside" : "never", - "@stylistic/block-opening-brace-space-before" : "always", - "naturalcrit/declaration-colon-min-space-before" : 1, - "@stylistic/declaration-block-trailing-semicolon" : "always", - "@stylistic/declaration-colon-space-after" : "always", - "@stylistic/number-leading-zero" : "always", - "function-url-quotes" : ["always", { "except": ["empty"] }], - "function-url-scheme-disallowed-list" : ["data","http"], - "comment-whitespace-inside" : "always", - "@stylistic/string-quotes" : "single", - "@stylistic/media-feature-range-operator-space-before" : "always", - "@stylistic/media-feature-range-operator-space-after" : "always", - "@stylistic/media-feature-parentheses-space-inside" : "never", - "@stylistic/media-feature-colon-space-before" : "always", - "@stylistic/media-feature-colon-space-after" : "always", - "naturalcrit/declaration-colon-align" : true, - "naturalcrit/declaration-block-multi-line-min-declarations": 1 - } + "extends": [ + "stylelint-config-recess-order", + "stylelint-config-recommended"], + "plugins": [ + "@stylistic/stylelint-plugin", + "./stylelint_plugins/declaration-colon-align.js", + "./stylelint_plugins/declaration-colon-min-space-before", + "./stylelint_plugins/declaration-block-multi-line-min-declarations" + ], + "customSyntax": "postcss-less", + "rules": { + "no-descending-specificity" : null, + "at-rule-no-unknown" : null, + "function-no-unknown" : null, + "font-family-no-missing-generic-family-keyword" : null, + "font-weight-notation" : "named-where-possible", + "font-family-name-quotes" : "always-unless-keyword", + "@stylistic/indentation" : "tab", + "no-duplicate-selectors" : true, + "@stylistic/color-hex-case" : "upper", + "color-hex-length" : "long", + "@stylistic/selector-combinator-space-after" : "always", + "@stylistic/selector-combinator-space-before" : "always", + "@stylistic/selector-attribute-operator-space-before" : "never", + "@stylistic/selector-attribute-operator-space-after" : "never", + "@stylistic/selector-attribute-brackets-space-inside" : "never", + "selector-attribute-quotes" : "always", + "selector-pseudo-element-colon-notation" : "double", + "@stylistic/selector-pseudo-class-parentheses-space-inside" : "never", + "@stylistic/block-opening-brace-space-before" : "always", + "naturalcrit/declaration-colon-min-space-before" : 1, + "@stylistic/declaration-block-trailing-semicolon" : "always", + "@stylistic/declaration-colon-space-after" : "always", + "@stylistic/number-leading-zero" : "always", + "function-url-quotes" : ["always", { "except": ["empty"] }], + "function-url-scheme-disallowed-list" : ["data","http"], + "comment-whitespace-inside" : "always", + "@stylistic/string-quotes" : "single", + "@stylistic/media-feature-range-operator-space-before" : "always", + "@stylistic/media-feature-range-operator-space-after" : "always", + "@stylistic/media-feature-parentheses-space-inside" : "never", + "@stylistic/media-feature-colon-space-before" : "always", + "@stylistic/media-feature-colon-space-after" : "always", + "naturalcrit/declaration-colon-align" : true, + "naturalcrit/declaration-block-multi-line-min-declarations" : 1 + } } From 19660272898744fde1210805b3789d1663c910a6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Fri, 31 Jan 2025 20:02:31 +0100 Subject: [PATCH 5/7] linting & suggested changes --- .../notificationPopup/notificationPopup.jsx | 3 +-- .../notificationPopup/notificationPopup.less | 24 +++++++++---------- 2 files changed, 13 insertions(+), 14 deletions(-) diff --git a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx index 49ac57994..38a85e0c7 100644 --- a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx +++ b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx @@ -41,11 +41,10 @@ const NotificationPopup = ()=>{ const renderNotificationsList = ()=>{ if(error) return
    {error}
    ; - notifications.map((notification) =>console.log(Markdown.render(notification.text, 1))); return notifications.map((notification)=>(
  • {notification.title}
    -

    +

    • )); }; diff --git a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less index 4f5a0a2de..8c32f037f 100644 --- a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less +++ b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less @@ -52,14 +52,14 @@ list-style-position : outside; list-style-type : disc; li { - font-size : 0.9em; - line-height : 1.5em; - padding-left: 1em; - em { - text-transform:capitalize; - font-weight : 800; + padding-left : 1em; + font-size : 0.9em; + line-height : 1.5em; + em { + font-weight : 800; + text-transform : capitalize; } - li { list-style-type: square; line-height : 1.2em;} + li { line-height : 1.2em; list-style-type : square;} } ul ul,ol ol,ul ol,ol ul { margin-bottom : 0px; @@ -67,14 +67,14 @@ } } - /*Markdown styling*/ + /* Markdown styling */ code { - background:#08115a; - padding: 0.1em 0.5em; - border-radius:2px; - font-family : 'Courier New', "Courier", monospace; + padding : 0.1em 0.5em; + font-family : 'Courier New', 'Courier', monospace; overflow-wrap : break-word; white-space : pre-wrap; + background : #08115A; + border-radius : 2px; } pre code { display : inline-block; From be1742d01d52c7e5be960482daf7dbdf118846d1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Fri, 31 Jan 2025 20:08:10 +0100 Subject: [PATCH 6/7] remove unnecessary spaces --- .../notificationPopup/notificationPopup.less | 28 ++++++++----------- 1 file changed, 12 insertions(+), 16 deletions(-) diff --git a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less index 8c32f037f..8383920a5 100644 --- a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less +++ b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less @@ -52,14 +52,14 @@ list-style-position : outside; list-style-type : disc; li { - padding-left : 1em; - font-size : 0.9em; - line-height : 1.5em; - em { - font-weight : 800; - text-transform : capitalize; + font-size : 0.9em; + line-height : 1.5em; + padding-left: 1em; + em { + text-transform:capitalize; + font-weight : 800; } - li { line-height : 1.2em; list-style-type : square;} + li { list-style-type: square; line-height : 1.2em;} } ul ul,ol ol,ul ol,ol ul { margin-bottom : 0px; @@ -67,14 +67,14 @@ } } - /* Markdown styling */ + /*Markdown styling*/ code { - padding : 0.1em 0.5em; - font-family : 'Courier New', 'Courier', monospace; + background:#08115a; + padding: 0.1em 0.5em; + border-radius:2px; + font-family : 'Courier New', "Courier", monospace; overflow-wrap : break-word; white-space : pre-wrap; - background : #08115A; - border-radius : 2px; } pre code { display : inline-block; @@ -85,8 +85,4 @@ margin-top : 0; & + * { margin-top : 0; } } - - - - } \ No newline at end of file From 460fb655d82127a46ac715d0d04993ab77bd532d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Fri, 31 Jan 2025 20:11:57 +0100 Subject: [PATCH 7/7] bring margin back --- .../notificationPopup/notificationPopup.less | 29 +++++++++++-------- 1 file changed, 17 insertions(+), 12 deletions(-) diff --git a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less index 8383920a5..be642f0fe 100644 --- a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less +++ b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less @@ -52,14 +52,19 @@ list-style-position : outside; list-style-type : disc; li { - font-size : 0.9em; - line-height : 1.5em; - padding-left: 1em; - em { - text-transform:capitalize; - font-weight : 800; + padding-left : 1em; + margin-top : 1.5em; + font-size : 0.9em; + line-height : 1.5em; + em { + font-weight : 800; + text-transform : capitalize; + } + li { + margin-top : 0; + line-height : 1.2em; + list-style-type : square; } - li { list-style-type: square; line-height : 1.2em;} } ul ul,ol ol,ul ol,ol ul { margin-bottom : 0px; @@ -67,14 +72,14 @@ } } - /*Markdown styling*/ + /* Markdown styling */ code { - background:#08115a; - padding: 0.1em 0.5em; - border-radius:2px; - font-family : 'Courier New', "Courier", monospace; + padding : 0.1em 0.5em; + font-family : 'Courier New', 'Courier', monospace; overflow-wrap : break-word; white-space : pre-wrap; + background : #08115A; + border-radius : 2px; } pre code { display : inline-block;