refactor: removed icon fonts in ace editor

This commit is contained in:
Fabio Di Stasio 2023-09-25 18:14:21 +02:00
parent 12825c69d4
commit 98c1f43a4d
20 changed files with 91 additions and 40 deletions

6
package-lock.json generated
View File

@ -13,7 +13,6 @@
"@electron/remote": "~2.0.1",
"@faker-js/faker": "~6.1.2",
"@jamescoyle/vue-icon": "~0.1.2",
"@mdi/font": "~7.2.96",
"@mdi/js": "~7.2.96",
"@turf/helpers": "~6.5.0",
"@vueuse/core": "~10.4.1",
@ -2107,11 +2106,6 @@
"node": ">= 10"
}
},
"node_modules/@mdi/font": {
"version": "7.2.96",
"resolved": "https://registry.npmjs.org/@mdi/font/-/font-7.2.96.tgz",
"integrity": "sha512-e//lmkmpFUMZKhmCY9zdjRe4zNXfbOIJnn6xveHbaV2kSw5aJ5dLXUxcRt1Gxfi7ZYpFLUWlkG2MGSFAiqAu7w=="
},
"node_modules/@mdi/js": {
"version": "7.2.96",
"resolved": "https://registry.npmjs.org/@mdi/js/-/js-7.2.96.tgz",

View File

@ -121,7 +121,6 @@
"@electron/remote": "~2.0.1",
"@faker-js/faker": "~6.1.2",
"@jamescoyle/vue-icon": "~0.1.2",
"@mdi/font": "~7.2.96",
"@mdi/js": "~7.2.96",
"@turf/helpers": "~6.5.0",
"@vueuse/core": "~10.4.1",

View File

@ -136,9 +136,4 @@ onMounted(() => {
width: 100%;
}
}
.ace_.mdi {
display: inline-block;
width: 17px;
}
</style>

View File

@ -403,11 +403,6 @@ defineExpose({ editor });
}
}
.ace_.mdi {
display: inline-block;
width: 17px;
}
.ace_gutter-cell.ace_breakpoint {
&::before {
content: '\F0403';

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 7A2 2 0 0 0 1 9V17H3V13H5V17H7V9A2 2 0 0 0 5 7H3M3 9H5V11H3M15 10.5V9A2 2 0 0 0 13 7H9V17H13A2 2 0 0 0 15 15V13.5A1.54 1.54 0 0 0 13.5 12A1.54 1.54 0 0 0 15 10.5M13 15H11V13H13V15M13 11H11V9H13M19 7A2 2 0 0 0 17 9V15A2 2 0 0 0 19 17H21A2 2 0 0 0 23 15V14H21V15H19V9H21V10H23V9A2 2 0 0 0 21 7Z" /></svg>

After

Width:  |  Height:  |  Size: 374 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3,19V5A2,2 0 0,1 5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19M17,12L12,7V10H8V14H12V17L17,12Z" /></svg>

After

Width:  |  Height:  |  Size: 186 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15,13H16.5V15.82L18.94,17.23L18.19,18.53L15,16.69V13M19,8H5V19H9.67C9.24,18.09 9,17.07 9,16A7,7 0 0,1 16,9C17.07,9 18.09,9.24 19,9.67V8M5,21C3.89,21 3,20.1 3,19V5C3,3.89 3.89,3 5,3H6V1H8V3H16V1H18V3H19A2,2 0 0,1 21,5V11.1C22.24,12.36 23,14.09 23,16A7,7 0 0,1 16,23C14.09,23 12.36,22.24 11.1,21H5M16,11.15A4.85,4.85 0 0,0 11.15,16C11.15,18.68 13.32,20.85 16,20.85A4.85,4.85 0 0,0 20.85,16C20.85,13.32 18.68,11.15 16,11.15Z" /></svg>

After

Width:  |  Height:  |  Size: 501 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z" /></svg>

After

Width:  |  Height:  |  Size: 155 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8,3A2,2 0 0,0 6,5V9A2,2 0 0,1 4,11H3V13H4A2,2 0 0,1 6,15V19A2,2 0 0,0 8,21H10V19H8V14A2,2 0 0,0 6,12A2,2 0 0,0 8,10V5H10V3M16,3A2,2 0 0,1 18,5V9A2,2 0 0,0 20,11H21V13H20A2,2 0 0,0 18,15V19A2,2 0 0,1 16,21H14V19H16V14A2,2 0 0,1 18,12A2,2 0 0,1 16,10V5H14V3H16Z" /></svg>

After

Width:  |  Height:  |  Size: 339 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21,16.5C21,16.88 20.79,17.21 20.47,17.38L12.57,21.82C12.41,21.94 12.21,22 12,22C11.79,22 11.59,21.94 11.43,21.82L3.53,17.38C3.21,17.21 3,16.88 3,16.5V7.5C3,7.12 3.21,6.79 3.53,6.62L11.43,2.18C11.59,2.06 11.79,2 12,2C12.21,2 12.41,2.06 12.57,2.18L20.47,6.62C20.79,6.79 21,7.12 21,7.5V16.5M12,4.15L6.04,7.5L12,10.85L17.96,7.5L12,4.15Z" /></svg>

After

Width:  |  Height:  |  Size: 412 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C11.5 2 11 2.19 10.59 2.59L2.59 10.59C1.8 11.37 1.8 12.63 2.59 13.41L10.59 21.41C11.37 22.2 12.63 22.2 13.41 21.41L21.41 13.41C22.2 12.63 22.2 11.37 21.41 10.59L13.41 2.59C13 2.19 12.5 2 12 2M12 4L15.29 7.29L12 10.59L8.71 7.29L12 4M7.29 8.71L10.59 12L7.29 15.29L4 12L7.29 8.71M16.71 8.71L20 12L16.71 15.29L13.41 12L16.71 8.71M12 13.41L15.29 16.71L12 20L8.71 16.71L12 13.41Z" /></svg>

After

Width:  |  Height:  |  Size: 457 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M2 12A10 10 0 1 0 12 2A10 10 0 0 0 2 12M15.6 13.72A4 4 0 0 0 16 12A4 4 0 0 0 12 8V10L8.88 7L12 4V6A6 6 0 0 1 18 12A5.9 5.9 0 0 1 17.07 15.19M6 12A5.9 5.9 0 0 1 6.93 8.81L8.4 10.28A4 4 0 0 0 8 12A4 4 0 0 0 12 16V14L15 17L12 20V18A6 6 0 0 1 6 12Z" /></svg>

After

Width:  |  Height:  |  Size: 323 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 3H17C18.11 3 19 3.9 19 5V12.08C17.45 11.82 15.92 12.18 14.68 13H11V17H12.08C11.97 17.68 11.97 18.35 12.08 19H3C1.9 19 1 18.11 1 17V5C1 3.9 1.9 3 3 3M3 7V11H9V7H3M11 7V11H17V7H11M3 13V17H9V13H3M22.78 19.32L21.71 18.5C21.73 18.33 21.75 18.17 21.75 18S21.74 17.67 21.71 17.5L22.77 16.68C22.86 16.6 22.89 16.47 22.83 16.36L21.83 14.63C21.77 14.5 21.64 14.5 21.5 14.5L20.28 15C20 14.82 19.74 14.65 19.43 14.53L19.24 13.21C19.23 13.09 19.12 13 19 13H17C16.88 13 16.77 13.09 16.75 13.21L16.56 14.53C16.26 14.66 15.97 14.82 15.71 15L14.47 14.5C14.36 14.5 14.23 14.5 14.16 14.63L13.16 16.36C13.1 16.47 13.12 16.6 13.22 16.68L14.28 17.5C14.26 17.67 14.25 17.83 14.25 18S14.26 18.33 14.28 18.5L13.22 19.32C13.13 19.4 13.1 19.53 13.16 19.64L14.16 21.37C14.22 21.5 14.35 21.5 14.47 21.5L15.71 21C15.97 21.18 16.25 21.35 16.56 21.47L16.75 22.79C16.77 22.91 16.87 23 17 23H19C19.12 23 19.23 22.91 19.25 22.79L19.44 21.47C19.74 21.34 20 21.18 20.28 21L21.5 21.5C21.64 21.5 21.77 21.5 21.84 21.37L22.84 19.64C22.9 19.53 22.87 19.4 22.78 19.32M18 19.5C17.17 19.5 16.5 18.83 16.5 18S17.18 16.5 18 16.5 19.5 17.17 19.5 18 18.84 19.5 18 19.5Z" /></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17 16.88C17.56 16.88 18 17.32 18 17.88S17.56 18.88 17 18.88 16 18.43 16 17.88 16.44 16.88 17 16.88M17 13.88C19.73 13.88 22.06 15.54 23 17.88C22.06 20.22 19.73 21.88 17 21.88S11.94 20.22 11 17.88C11.94 15.54 14.27 13.88 17 13.88M17 15.38C15.62 15.38 14.5 16.5 14.5 17.88S15.62 20.38 17 20.38 19.5 19.26 19.5 17.88 18.38 15.38 17 15.38M18 3H4C2.9 3 2 3.9 2 5V17C2 18.1 2.9 19 4 19H9.42C9.26 18.68 9.12 18.34 9 18C9.12 17.66 9.26 17.32 9.42 17H4V13H10V15.97C10.55 15.11 11.23 14.37 12 13.76V13H13.15C14.31 12.36 15.62 12 17 12C18.06 12 19.07 12.21 20 12.59V5C20 3.9 19.1 3 18 3M10 11H4V7H10V11M18 11H12V7H18V11Z" /></svg>

After

Width:  |  Height:  |  Size: 688 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5,4H19A2,2 0 0,1 21,6V18A2,2 0 0,1 19,20H5A2,2 0 0,1 3,18V6A2,2 0 0,1 5,4M5,8V12H11V8H5M13,8V12H19V8H13M5,14V18H11V14H5M13,14V18H19V14H13Z" /></svg>

After

Width:  |  Height:  |  Size: 218 B

View File

@ -1,5 +1,4 @@
'use strict';
import '@mdi/font/css/materialdesignicons.css';
import 'floating-vue/dist/style.css';
import 'leaflet/dist/leaflet.css';
import '@/scss/main.scss';

View File

@ -1227,42 +1227,42 @@ ace.define('ace/autocomplete/popup', ['require', 'exports', 'module', 'ace/virtu
switch (meta) {
case 'table':
iconClass = 'mdi-table';
iconClass = 'editor-icon-table';
break;
case 'column':
iconClass = 'mdi-rhombus-split-outline';
iconClass = 'editor-icon-rhombus-split-outline';
break;
case 'view':
iconClass = 'mdi-table-eye';
iconClass = 'editor-icon-table-eye';
break;
case 'trigger':
iconClass = 'mdi-table-cog';
iconClass = 'editor-icon-table-cog';
break;
case 'routine':
iconClass = 'mdi-sync-circle';
iconClass = 'editor-icon-sync-circle';
break;
case 'function':
iconClass = 'mdi-arrow-right-bold-box';
iconClass = 'editor-icon-arrow-right-bold-box';
break;
case 'scheduler':
iconClass = 'mdi-calendar-clock';
iconClass = 'editor-icon-calendar-clock';
break;
case 'keyword':
iconClass = 'mdi-cube';
iconClass = 'editor-icon-cube';
break;
case 'snippet':
iconClass = 'mdi-code-braces';
iconClass = 'editor-icon-code-braces';
break;
case 'local':
iconClass = 'mdi-alphabetical-variant';
iconClass = 'editor-icon-alphabetical-variant';
break;
default:
iconClass = 'mdi-circle';
iconClass = 'editor-icon-circle';
break;
}
iconClass && tokens.push({
type: ` mdi ${iconClass}`,
type: ` editor-icon ${iconClass}`,
value: ' '
});
}

View File

@ -0,0 +1,67 @@
/* stylelint-disable selector-class-pattern */
/* Only used in ext-language_tools.js */
.editor-icon {
display: inline-block;
width: 17px;
height: 17px;
background-size: cover;
position: relative;
top: 2px;
margin-right: 1px;
opacity: 0.7;
&.editor-icon-table {
background-image: url("../images/svg/table.svg");
}
&.editor-icon-rhombus-split-outline {
background-image: url("../images/svg/rhombus-split-outline.svg");
}
&.editor-icon-table-eye {
background-image: url("../images/svg/table-eye.svg");
}
&.editor-icon-table-cog {
background-image: url("../images/svg/table-cog.svg");
}
&.editor-icon-sync-circle {
background-image: url("../images/svg/sync-circle.svg");
}
&.editor-icon-arrow-right-bold-box {
background-image: url("../images/svg/arrow-right-bold-box.svg");
}
&.editor-icon-calendar-clock {
background-image: url("../images/svg/calendar-clock.svg");
}
&.editor-icon-cube {
background-image: url("../images/svg/cube.svg");
}
&.editor-icon-code-braces {
background-image: url("../images/svg/code-braces.svg");
}
&.editor-icon-alphabetical-variant {
background-image: url("../images/svg/alphabetical-variant.svg");
}
&.editor-icon-circle {
background-image: url("../images/svg/circle.svg");
}
&::before {
line-height: 1;
}
}
.ace_dark {
.editor-icon {
filter: invert(100%);
}
}

View File

@ -1,9 +0,0 @@
.mdi {
display: flex;
align-items: center;
justify-content: center;
&::before {
line-height: 1;
}
}

View File

@ -5,7 +5,7 @@
@import "data-types";
@import "table-keys";
@import "fake-tables";
@import "mdi-additions";
@import "editor-icons";
@import "db-icons";
@import "themes/dark-theme";
@import "themes/light-theme";