Sutty/trabajo-afectivo
5
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Maintenance: Updated stylelint to version 14 and added prettier as a better preparation for future steps.

Browse source
This commit is contained in:
Bola Ahmed Buari 2021-10-26 14:52:42 +02:00 committed by Dominik Klein
parent d61932de6e
commit 5c333430ca
14 changed files with 1093 additions and 866 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
.prettierrc.json Normal file
View file

@ -0,0 +1,6 @@
{
"semi": false,
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "all"
}

25
.stylelintrc.json
View file

@ -1,21 +1,38 @@
{ {
"extends": ["stylelint-config-standard"], "extends": [
"plugins": ["stylelint-scss"], "stylelint-config-standard",
"stylelint-config-standard-scss",
"stylelint-prettier/recommended"
],
"rules": { "rules": {
"at-rule-no-unknown": null, "alpha-value-notation": null,
"block-no-empty": null, "block-no-empty": null,
"color-function-notation": "legacy",
"declaration-block-no-duplicate-properties": null, "declaration-block-no-duplicate-properties": null,
"declaration-block-no-redundant-longhand-properties": null,
"declaration-block-no-shorthand-property-overrides": null, "declaration-block-no-shorthand-property-overrides": null,
"declaration-block-single-line-max-declarations": null, "declaration-block-single-line-max-declarations": null,
"font-family-no-missing-generic-family-keyword": null, "font-family-no-missing-generic-family-keyword": null,
"function-calc-no-unspaced-operator": null, "function-calc-no-unspaced-operator": null,
"function-comma-space-after": null, "function-comma-space-after": null,
"hue-degree-notation": null,
"keyframes-name-pattern": null,
"max-empty-lines": null, "max-empty-lines": null,
"no-descending-specificity": null, "no-descending-specificity": null,
"no-duplicate-selectors": null, "no-duplicate-selectors": null,
"number-max-precision": null,
"selector-class-pattern": null,
"selector-list-comma-newline-after": null, "selector-list-comma-newline-after": null,
"selector-no-vendor-prefix": null,
"selector-pseudo-element-no-unknown": null,
"scss/at-extend-no-missing-placeholder": null,
"scss/at-rule-no-unknown": null, "scss/at-rule-no-unknown": null,
"property-no-unknown": [true, { "ignoreProperties": ["scroll-snap-mode"] }] "scss/dollar-variable-pattern": null,
"scss/double-slash-comment-whitespace-inside": null,
"scss/no-global-function-names": null,
"value-no-vendor-prefix": null,
"property-no-unknown": [true, { "ignoreProperties": ["scroll-snap-mode"] }],
"property-no-vendor-prefix": null
}, },
"ignoreFiles": [ "ignoreFiles": [
"public/assets/*.css", "public/assets/*.css",

2
app/assets/stylesheets/custom/chat.css
View file

@ -6,6 +6,6 @@
} }
#chat .well-chat { #chat .well-chat {
padding: 8px 15px 0 15px; padding: 8px 15px 0;
margin: 0; margin: 0;
} }

12
app/assets/stylesheets/font.css
View file

@ -1,8 +1,7 @@
@font-face { @font-face {
font-family: 'Fira Sans'; font-family: 'Fira Sans';
src: url('fonts/FiraSans-Bold.eot'); src: url('fonts/FiraSans-Bold.eot');
src: src: url('fonts/FiraSans-Bold.woff2') format('woff2'),
url('fonts/FiraSans-Bold.woff2') format('woff2'),
url('fonts/FiraSans-Bold.woff') format('woff'), url('fonts/FiraSans-Bold.woff') format('woff'),
url('fonts/FiraSans-Bold.ttf') format('truetype'); url('fonts/FiraSans-Bold.ttf') format('truetype');
font-weight: bold; font-weight: bold;
@ -12,8 +11,7 @@
@font-face { @font-face {
font-family: 'Fira Sans'; font-family: 'Fira Sans';
src: url('fonts/FiraSans-Regular.eot'); src: url('fonts/FiraSans-Regular.eot');
src: src: url('fonts/FiraSans-Regular.woff2') format('woff2'),
url('fonts/FiraSans-Regular.woff2') format('woff2'),
url('fonts/FiraSans-Regular.woff') format('woff'), url('fonts/FiraSans-Regular.woff') format('woff'),
url('fonts/FiraSans-Regular.ttf') format('truetype'); url('fonts/FiraSans-Regular.ttf') format('truetype');
font-weight: normal; font-weight: normal;
@ -23,8 +21,7 @@
@font-face { @font-face {
font-family: 'Fira Sans'; font-family: 'Fira Sans';
src: url('fonts/FiraSans-Medium.eot'); src: url('fonts/FiraSans-Medium.eot');
src: src: url('fonts/FiraSans-Medium.woff2') format('woff2'),
url('fonts/FiraSans-Medium.woff2') format('woff2'),
url('fonts/FiraSans-Medium.woff') format('woff'), url('fonts/FiraSans-Medium.woff') format('woff'),
url('fonts/FiraSans-Medium.ttf') format('truetype'); url('fonts/FiraSans-Medium.ttf') format('truetype');
font-weight: 500; font-weight: 500;
@ -34,8 +31,7 @@
@font-face { @font-face {
font-family: 'Fira Sans'; font-family: 'Fira Sans';
src: url('fonts/FiraSans-Light.eot'); src: url('fonts/FiraSans-Light.eot');
src: src: url('fonts/FiraSans-Light.woff2') format('woff2'),
url('fonts/FiraSans-Light.woff2') format('woff2'),
url('fonts/FiraSans-Light.woff') format('woff'), url('fonts/FiraSans-Light.woff') format('woff'),
url('fonts/FiraSans-Light.ttf') format('truetype'); url('fonts/FiraSans-Light.ttf') format('truetype');
font-weight: 300; font-weight: 300;

2
app/assets/stylesheets/highlighter-github.css
View file

@ -10,7 +10,7 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
padding: 0.5em; padding: 0.5em;
color: #333; color: #333;
background: #f8f8f8; background: #f8f8f8;
-webkit-text-size-adjust: none; text-size-adjust: none;
} }
.hljs-comment, .hljs-comment,

58
app/assets/stylesheets/knowledge_base.scss
View file

@ -1,5 +1,5 @@
@import "svg-dimensions"; @import 'svg-dimensions';
@import "font"; @import 'font';
$highlight-color: hsl(205, 90%, 60%); $highlight-color: hsl(205, 90%, 60%);
$color: hsl(207, 7%, 29%); $color: hsl(207, 7%, 29%);
@ -40,7 +40,7 @@ $dark-border: hsl(210,14%,91%);
@mixin bidi-style($prop, $value, $inverse-prop, $default-value) { @mixin bidi-style($prop, $value, $inverse-prop, $default-value) {
#{$prop}: $value; #{$prop}: $value;
html[dir=rtl] & { html[dir='rtl'] & {
#{$inverse-prop}: $value; #{$inverse-prop}: $value;
#{$prop}: $default-value; #{$prop}: $default-value;
} }
@ -48,14 +48,14 @@ $dark-border: hsl(210,14%,91%);
/* adds a property only in RTL */ /* adds a property only in RTL */
@mixin rtl($prop, $value) { @mixin rtl($prop, $value) {
html[dir=rtl] & { html[dir='rtl'] & {
#{$prop}: $value; #{$prop}: $value;
} }
} }
/* adds a property only in LTR */ /* adds a property only in LTR */
@mixin ltr($prop, $value) { @mixin ltr($prop, $value) {
html[dir=ltr] & { html[dir='ltr'] & {
#{$prop}: $value; #{$prop}: $value;
} }
} }
@ -84,7 +84,7 @@ $dark-border: hsl(210,14%,91%);
} }
html { html {
font-family: "Fira Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: 'Fira Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 16px; font-size: 16px;
line-height: 1.5; line-height: 1.5;
color: $light-color; color: $light-color;
@ -179,22 +179,22 @@ b {
padding: 0 17px; padding: 0 17px;
box-shadow: 0 -1px hsla(0, 0%, 0%, 0.1) inset; box-shadow: 0 -1px hsla(0, 0%, 0%, 0.1) inset;
&[data-color="yellow"] { &[data-color='yellow'] {
color: hsl(45, 98%, 17%); color: hsl(45, 98%, 17%);
background: hsl(45, 98%, 63%); background: hsl(45, 98%, 63%);
} }
&[data-color="green"] { &[data-color='green'] {
color: white; color: white;
background: hsl(145, 52%, 45%); background: hsl(145, 52%, 45%);
} }
&[data-color="red"] { &[data-color='red'] {
color: white; color: white;
background: hsl(19, 90%, 51%); background: hsl(19, 90%, 51%);
} }
&[data-color="grey"] { &[data-color='grey'] {
color: hsl(45, 98%, 17%); color: hsl(45, 98%, 17%);
background: hsl(0, 0%, 80%); background: hsl(0, 0%, 80%);
} }
@ -308,7 +308,7 @@ b {
position: relative; position: relative;
font-size: 17px; font-size: 17px;
input[type="search"] { input[type='search'] {
appearance: none; appearance: none;
width: 100%; width: 100%;
font-size: inherit; font-size: inherit;
@ -415,7 +415,7 @@ b {
display: inline-block; display: inline-block;
&::after { &::after {
content: " — "; content: ' — ';
} }
} }
@ -555,7 +555,7 @@ b {
&::after, &::after,
&::before { &::before {
content: ""; content: '';
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 40%; height: 40%;
@ -798,7 +798,7 @@ b {
&-preview { &-preview {
&::before { &::before {
content: " — "; content: ' — ';
color: initial; color: initial;
} }
} }
@ -836,7 +836,8 @@ b {
} }
} }
.sections--list, .sections--compact-text { .sections--list,
.sections--compact-text {
.icon, .icon,
[data-font] { [data-font] {
@include ltr(margin, 4px 9px 0 3px); @include ltr(margin, 4px 9px 0 3px);
@ -888,7 +889,9 @@ b {
margin: 0 0 1em; margin: 0 0 1em;
} }
table, pre, blockquote { table,
pre,
blockquote {
margin-bottom: 16px; margin-bottom: 16px;
&:first-child { &:first-child {
@ -906,9 +909,7 @@ b {
border-style: hidden; border-style: hidden;
border-collapse: collapse; border-collapse: collapse;
font-variant-numeric: lining-nums tabular-nums; font-variant-numeric: lining-nums tabular-nums;
box-shadow: box-shadow: 0 0 0 1px hsl(210, 5%, 92%), 0 2px hsl(210, 5%, 92%);
0 0 0 1px hsl(210,5%,92%),
0 2px hsl(210,5%,92%);
border-radius: 2px; border-radius: 2px;
} }
@ -936,7 +937,8 @@ b {
} }
} }
td, th { td,
th {
padding: 6px 10px; padding: 6px 10px;
border: 1px solid hsl(210, 5%, 92%); border: 1px solid hsl(210, 5%, 92%);
} }
@ -946,7 +948,7 @@ b {
} }
td { td {
text-align: "." center; text-align: '.' center;
} }
table col { table col {
@ -1172,7 +1174,7 @@ b {
} }
} }
.btn[data-toggle="dropdown"] { .btn[data-toggle='dropdown'] {
text-decoration: none; text-decoration: none;
} }
@ -1188,10 +1190,8 @@ b {
list-style: none; list-style: none;
font-size: 14px; font-size: 14px;
border-radius: 3px; border-radius: 3px;
box-shadow: box-shadow: 0 50px 100px hsla(200, 30%, 30%, 0.1),
0 50px 100px hsla(200,30%,30%,0.1), 0 15px 35px hsla(200, 30%, 30%, 0.15), 0 5px 15px hsla(0, 0%, 0%, 0.1);
0 15px 35px hsla(200,30%,30%,0.15),
0 5px 15px hsla(0,0%,0%,0.1);
background: white; background: white;
padding: 10px; padding: 10px;
@ -1200,7 +1200,7 @@ b {
} }
&::before { &::before {
content: ""; content: '';
position: absolute; position: absolute;
top: -6px; top: -6px;
left: 30px; left: 30px;
@ -1208,7 +1208,7 @@ b {
height: 20px; height: 20px;
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
transform: rotate(45deg); transform: rotate(45deg);
border-radius: 3px 0 20px 0; border-radius: 3px 0 20px;
background: white; background: white;
} }
@ -1231,7 +1231,7 @@ b {
&::before { &::before {
top: auto; top: auto;
bottom: -6px; bottom: -6px;
border-radius: 20px 0 3px 0; border-radius: 20px 0 3px;
} }
} }

13
app/assets/stylesheets/print.scss
View file

@ -65,7 +65,14 @@ main {
padding: 0; padding: 0;
} }
h1, .popover-notificationsHeader .popover-title, .ticket-title-update, h2, h3, h4, h5, h6 { h1,
.popover-notificationsHeader .popover-title,
.ticket-title-update,
h2,
h3,
h4,
h5,
h6 {
color: inherit; color: inherit;
} }
@ -88,7 +95,7 @@ td a {
display: none; display: none;
} }
th.js-tableHead:not([data-column-key="icon"]) { th.js-tableHead:not([data-column-key='icon']) {
width: auto !important; width: auto !important;
} }
@ -232,8 +239,6 @@ th.js-tableHead:not([data-column-key="icon"]) {
} }
} }
/* /*
Modal Modal

615
app/assets/stylesheets/zammad.scss
View file

File diff suppressed because it is too large Load diff

13
package.json
View file

@ -1,13 +1,16 @@
{ {
"name": "zammad",
"version": "1.0.0",
"scripts": { "scripts": {
"lint:css": "stylelint \"**/*.{css,scss}\"", "lint:css": "stylelint \"**/*.{css,scss}\"",
"lint:css:fix": "stylelint \"**/*.{css,scss}\" --fix" "lint:css:fix": "stylelint \"**/*.{css,scss}\" --fix"
}, },
"devDependencies": { "devDependencies": {
"stylelint": "13.x", "postcss": "^8.3.9",
"stylelint-config-standard": "22.x", "postcss-html": "^1.0.1",
"stylelint-scss": "3.x" "prettier": "2.4.1",
"stylelint": "^14.0.0",
"stylelint-config-prettier": "^9.0.3",
"stylelint-config-standard": "^23.0.0",
"stylelint-config-standard-scss": "^2.0.0",
"stylelint-prettier": "^1.2.0"
} }
} }

21
public/assets/chat/chat.css
View file

@ -63,7 +63,8 @@
color: white; color: white;
line-height: 2.5em; line-height: 2.5em;
height: 3.5em; height: 3.5em;
box-shadow: 0 -1px rgba(0, 0, 0, 0.1), 0 1px rgba(255, 255, 255, 0.3) inset, 0 -1px rgba(0, 0, 0, 0.1) inset, 0 1px 1px rgba(0, 0, 0, 0.13); box-shadow: 0 -1px rgba(0, 0, 0, 0.1), 0 1px rgba(255, 255, 255, 0.3) inset,
0 -1px rgba(0, 0, 0, 0.1) inset, 0 1px 1px rgba(0, 0, 0, 0.13);
position: relative; position: relative;
border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0;
overflow: hidden; overflow: hidden;
@ -96,7 +97,7 @@
} }
.zammad-chat-header-icon::before { .zammad-chat-header-icon::before {
content: ""; content: '';
display: inline-block; display: inline-block;
} }
@ -151,7 +152,7 @@
} }
.zammad-chat-agent-status::before { .zammad-chat-agent-status::before {
content: ""; content: '';
background: #f35912; background: #f35912;
display: inline-block; display: inline-block;
height: 0.9em; height: 0.9em;
@ -163,11 +164,11 @@
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04) inset; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04) inset;
} }
.zammad-chat-agent-status[data-status="online"]::before { .zammad-chat-agent-status[data-status='online']::before {
background: #52c782; background: #52c782;
} }
.zammad-chat-agent-status[data-status="connecting"]::before { .zammad-chat-agent-status[data-status='connecting']::before {
animation: linear connect-fade 600ms infinite alternate; animation: linear connect-fade 600ms infinite alternate;
background: #faab00; background: #faab00;
} }
@ -299,7 +300,8 @@
background: #ededed; background: #ededed;
display: inline-block; display: inline-block;
max-width: 70%; max-width: 70%;
box-shadow: 0 2px rgba(255, 255, 255, 0.15) inset, 0 0 0 1px rgba(0, 0, 0, 0.08) inset, 0 1px rgba(0, 0, 0, 0.02); box-shadow: 0 2px rgba(255, 255, 255, 0.15) inset,
0 0 0 1px rgba(0, 0, 0, 0.08) inset, 0 1px rgba(0, 0, 0, 0.02);
} }
.zammad-chat-status-inner { .zammad-chat-status-inner {
@ -346,7 +348,9 @@
animation-delay: 0.13s; animation-delay: 0.13s;
} }
.zammad-chat-loading-circle + .zammad-chat-loading-circle + .zammad-chat-loading-circle { .zammad-chat-loading-circle
+ .zammad-chat-loading-circle
+ .zammad-chat-loading-circle {
animation-delay: 0.26s; animation-delay: 0.26s;
} }
@ -421,7 +425,8 @@
cursor: pointer; cursor: pointer;
border: none; border: none;
border-radius: 1.5em; border-radius: 1.5em;
box-shadow: 0 2px rgba(255, 255, 255, 0.25) inset, 0 0 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px rgba(0, 0, 0, 0.1); box-shadow: 0 2px rgba(255, 255, 255, 0.25) inset,
0 0 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px rgba(0, 0, 0, 0.1);
outline: none; outline: none;
display: inline-block; display: inline-block;
} }

60
public/assets/chat/chat.scss
View file

@ -57,11 +57,8 @@
color: white; color: white;
line-height: 2.5em; line-height: 2.5em;
height: 3.5em; height: 3.5em;
box-shadow: box-shadow: 0 -1px rgba(0, 0, 0, 0.1), 0 1px rgba(255, 255, 255, 0.3) inset,
0 -1px rgba(0,0,0,0.1), 0 -1px rgba(0, 0, 0, 0.1) inset, 0 1px 1px rgba(0, 0, 0, 0.13);
0 1px rgba(255,255,255,0.3) inset,
0 -1px rgba(0,0,0,0.1) inset,
0 1px 1px rgba(0,0,0,0.13);
position: relative; position: relative;
border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0;
overflow: hidden; overflow: hidden;
@ -90,8 +87,9 @@
line-height: 3.4em; line-height: 3.4em;
cursor: pointer; cursor: pointer;
&::before { // force the icon to align to center &::before {
content: ""; // force the icon to align to center
content: '';
display: inline-block; display: inline-block;
} }
} }
@ -147,7 +145,7 @@
} }
.zammad-chat-agent-status::before { .zammad-chat-agent-status::before {
content: ""; content: '';
background: hsl(19, 90%, 51%); background: hsl(19, 90%, 51%);
display: inline-block; display: inline-block;
height: 0.9em; height: 0.9em;
@ -159,18 +157,25 @@
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04) inset; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04) inset;
} }
.zammad-chat-agent-status[data-status="online"]::before { .zammad-chat-agent-status[data-status='online']::before {
background: hsl(145, 51%, 55%); background: hsl(145, 51%, 55%);
} }
.zammad-chat-agent-status[data-status="connecting"]::before { .zammad-chat-agent-status[data-status='connecting']::before {
animation: linear connect-fade 600ms infinite alternate; animation: linear connect-fade 600ms infinite alternate;
background: hsl(41, 100%, 49%); background: hsl(41, 100%, 49%);
} }
@keyframes connect-fade { @keyframes connect-fade {
from { opacity: 0.5; transform: scale(0.6); } from {
to { opacity: 1; transform: scale(1); } opacity: 0.5;
transform: scale(0.6);
}
to {
opacity: 1;
transform: scale(1);
}
} }
.zammad-chat-modal { .zammad-chat-modal {
@ -279,10 +284,8 @@
background: hsl(0, 0%, 93%); background: hsl(0, 0%, 93%);
display: inline-block; display: inline-block;
max-width: 70%; max-width: 70%;
box-shadow: box-shadow: 0 2px rgba(255, 255, 255, 0.15) inset,
0 2px rgba(255,255,255,0.15) inset, 0 0 0 1px rgba(0, 0, 0, 0.08) inset, 0 1px rgba(0, 0, 0, 0.02);
0 0 0 1px rgba(0,0,0,0.08) inset,
0 1px rgba(0,0,0,0.02);
} }
.zammad-chat-status-inner { .zammad-chat-status-inner {
@ -329,13 +332,22 @@
animation-delay: 0.13s; animation-delay: 0.13s;
} }
.zammad-chat-loading-circle + .zammad-chat-loading-circle + .zammad-chat-loading-circle { .zammad-chat-loading-circle
+ .zammad-chat-loading-circle
+ .zammad-chat-loading-circle {
animation-delay: 0.26s; animation-delay: 0.26s;
} }
@keyframes load-fade { @keyframes load-fade {
from { opacity: 0.5; transform: scale(0.6); } from {
67% { opacity: 1; transform: scale(1); } opacity: 0.5;
transform: scale(0.6);
}
67% {
opacity: 1;
transform: scale(1);
}
} }
.zammad-chat-controls { .zammad-chat-controls {
@ -346,9 +358,7 @@
padding: 0; padding: 0;
margin: 0; margin: 0;
line-height: 1.4em; line-height: 1.4em;
box-shadow: box-shadow: 0 1px rgba(0, 0, 0, 0.01), 0 -1px rgba(0, 0, 0, 0.02);
0 1px rgba(0,0,0,0.01),
0 -1px rgba(0,0,0,0.02);
position: relative; position: relative;
background: white; background: white;
} }
@ -392,10 +402,8 @@
cursor: pointer; cursor: pointer;
border: none; border: none;
border-radius: 1.5em; border-radius: 1.5em;
box-shadow: box-shadow: 0 2px rgba(255, 255, 255, 0.25) inset,
0 2px rgba(255,255,255,0.25) inset, 0 0 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px rgba(0, 0, 0, 0.1);
0 0 0 1px rgba(0,0,0,0.1) inset,
0 1px rgba(0,0,0,0.1);
outline: none; outline: none;
display: inline-block; display: inline-block;
} }

5
public/assets/error/style.css
View file

@ -1,8 +1,7 @@
@font-face { @font-face {
font-family: 'Fira Sans'; font-family: 'Fira Sans';
src: url('firasans-regular-webfont.eot'); src: url('firasans-regular-webfont.eot');
src: src: url('firasans-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('firasans-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('firasans-regular-webfont.woff') format('woff'), url('firasans-regular-webfont.woff') format('woff'),
url('firasans-regular-webfont.ttf') format('truetype'); url('firasans-regular-webfont.ttf') format('truetype');
font-weight: normal; font-weight: normal;
@ -10,7 +9,7 @@
} }
html { html {
font-family: "Fira Sans"; font-family: 'Fira Sans';
height: 100%; height: 100%;
color: #8c959c; color: #8c959c;
background: #f8f9fa; background: #f8f9fa;

5
public/assets/form/form.css
View file

@ -2,7 +2,8 @@
width: 100%; width: 100%;
} }
.zammad-form h1, .zammad-form h2 { .zammad-form h1,
.zammad-form h2 {
margin-top: 0; margin-top: 0;
} }
@ -41,7 +42,7 @@
} }
.zammad-form-modal::before { .zammad-form-modal::before {
content: ""; content: '';
display: inline-block; display: inline-block;
height: 100%; height: 100%;
vertical-align: middle; vertical-align: middle;