switch to scss in customCSS

This commit is contained in:
Barış Soner Uşaklı
2022-09-13 09:37:24 -04:00
parent 401aaf1757
commit d2e972cf6c
5 changed files with 9 additions and 12 deletions

View File

@@ -30,7 +30,7 @@
"dependencies": {
"@adactive/bootstrap-tagsinput": "0.8.2",
"@isaacs/ttlcache": "1.2.0",
"ace-builds": "1.9.5",
"ace-builds": "1.10.1",
"archiver": "5.3.1",
"async": "3.2.4",
"autoprefixer": "10.4.8",

View File

@@ -1,7 +1,7 @@
{
"custom-css": "Custom CSS/LESS",
"custom-css.description": "Enter your own CSS/LESS declarations here, which will be applied after all other styles.",
"custom-css.enable": "Enable Custom CSS/LESS",
"custom-css": "Custom CSS/SASS",
"custom-css.description": "Enter your own CSS/SASS declarations here, which will be applied after all other styles.",
"custom-css.enable": "Enable Custom CSS/SASS",
"custom-js": "Custom Javascript",
"custom-js.description": "Enter your own javascript here. It will be executed after the page is loaded completely.",

View File

@@ -9,7 +9,7 @@ define('admin/appearance/customise', ['admin/settings', 'ace/ace'], function (Se
$('#customJS').text($('#customJS-holder').val());
$('#customHTML').text($('#customHTML-holder').val());
initACE('customCSS', 'less', '#customCSS-holder');
initACE('customCSS', 'scss', '#customCSS-holder');
initACE('customJS', 'javascript', '#customJS-holder');
initACE('customHTML', 'html', '#customHTML-holder');

View File

@@ -2,7 +2,7 @@ export * from 'ace-builds';
// only import the modes and theme we use
import 'ace-builds/src-noconflict/mode-javascript';
import 'ace-builds/src-noconflict/mode-less';
import 'ace-builds/src-noconflict/mode-scss';
import 'ace-builds/src-noconflict/mode-html';
import 'ace-builds/src-noconflict/ext-searchbox';
import 'ace-builds/src-noconflict/theme-twilight';

View File

@@ -240,12 +240,9 @@ async function saveRenderedCss(data) {
if (!data.customCSS) {
return;
}
const less = require('less');
const lessObject = await less.render(data.customCSS, {
compress: true,
javascriptEnabled: false,
});
data.renderedCustomCSS = lessObject.css;
const sass = require('sass');
const scssOutput = await sass.compileStringAsync(data.customCSS, {});
data.renderedCustomCSS = scssOutput.css.toString();
}
async function getLogoSize(data) {