mirror of
https://github.com/Lastorder-DC/rhymix.git
synced 2026-01-04 17:21:39 +09:00
Support automatic switching to dark skin in CKEditor and SimpleEditor
This commit is contained in:
Kijin Sung
parent
c80a80f986
commit
e7b49baf13
12 changed files with 41 additions and 4 deletions
|
|
@ -231,6 +231,7 @@ class editorAdminController extends editor
|
|||
$config->content_word_break = $configVars->content_word_break;
|
||||
$config->content_word_break = in_array($config->content_word_break, array('normal', 'keep-all', 'break-all', 'none')) ? $config->content_word_break : 'normal';
|
||||
$config->enable_autosave = $configVars->enable_autosave ?: 'Y';
|
||||
$config->auto_dark_mode = $configVars->auto_dark_mode ?: 'Y';
|
||||
$config->allow_html = $configVars->allow_html ?: 'Y';
|
||||
$config->autoinsert_types = array();
|
||||
foreach ($configVars->autoinsert_types as $type)
|
||||
|
|
|
|||
|
|
@ -48,6 +48,7 @@ class editor extends ModuleObject
|
|||
'content_paragraph_spacing' => '0px',
|
||||
'content_word_break' => 'normal',
|
||||
'enable_autosave' => 'Y',
|
||||
'auto_dark_mode' => 'Y',
|
||||
'allow_html' => 'Y',
|
||||
'editor_focus' => 'N',
|
||||
'autoinsert_types' => array('image' => true, 'audio' => true, 'video' => true),
|
||||
|
|
|
|||
|
|
@ -155,6 +155,7 @@ class editorController extends editor
|
|||
|
||||
$config->content_font_size = trim($vars->content_font_size);
|
||||
$config->enable_autosave = $vars->enable_autosave ?: 'Y';
|
||||
$config->auto_dark_mode = $vars->auto_dark_mode ?: 'Y';
|
||||
$config->allow_html = $vars->allow_html ?: 'Y';
|
||||
|
||||
// Apply module-specific permissions.
|
||||
|
|
|
|||
|
|
@ -203,6 +203,7 @@ class editorModel extends editor
|
|||
// Set allow html and focus
|
||||
Context::set('allow_html', ($option->allow_html === false || $option->allow_html === 'N') ? false : true);
|
||||
Context::set('editor_focus', toBool($option->editor_focus));
|
||||
Context::set('editor_auto_dark_mode', $option->auto_dark_mode !== 'N');
|
||||
|
||||
// Load editor components.
|
||||
if($option->enable_component)
|
||||
|
|
|
|||
|
|
@ -76,6 +76,7 @@ $lang->enable_default_component_grant = 'Permission to use default components';
|
|||
$lang->enable_extra_component_grant = 'Permission to use extra components';
|
||||
$lang->enable_html_grant = 'Permission to edit HTML';
|
||||
$lang->enable_autosave = 'Enable Auto-Save';
|
||||
$lang->editor_auto_dark_mode = 'Automatic dark mode';
|
||||
$lang->allow_html = 'allow HTML';
|
||||
$lang->height_resizable = 'Height Resizable';
|
||||
$lang->editor_height = 'Height of Editor';
|
||||
|
|
@ -83,6 +84,7 @@ $lang->about_default_editor_settings = 'Follow the default settings from the Edi
|
|||
$lang->about_content_font = 'Please use comma for multiple input.';
|
||||
$lang->about_content_font_size = 'Please input units such as px or em.';
|
||||
$lang->about_enable_autosave = 'You may decide whether the auto-save function will be used.';
|
||||
$lang->about_editor_auto_dark_mode = 'Automatically switch to a dark skin if dark mode is used.';
|
||||
$lang->edit['fontname'] = 'Font';
|
||||
$lang->edit['fontsize'] = 'Size';
|
||||
$lang->edit['use_paragraph'] = 'Paragraph Function';
|
||||
|
|
|
|||
|
|
@ -74,6 +74,7 @@ $lang->enable_default_component_grant = '기본 컴포넌트 사용 권한';
|
|||
$lang->enable_extra_component_grant = '확장 컴포넌트 사용 권한';
|
||||
$lang->enable_html_grant = 'HTML 편집 권한';
|
||||
$lang->enable_autosave = '자동저장 사용';
|
||||
$lang->editor_auto_dark_mode = '다크모드 자동 감지';
|
||||
$lang->allow_html = 'HTML 허용';
|
||||
$lang->height_resizable = '높이 조절 가능';
|
||||
$lang->editor_height = '에디터 높이';
|
||||
|
|
@ -81,6 +82,7 @@ $lang->about_default_editor_settings = '에디터 모듈의 기본 설정을 따
|
|||
$lang->about_content_font = '콤마(,)로 여러 폰트를 지정할 수 있습니다.';
|
||||
$lang->about_content_font_size = '12px, 1em등 단위까지 포함해서 입력해주세요.';
|
||||
$lang->about_enable_autosave = '글 작성 시 자동 저장 기능을 활성화 시킬 수 있습니다.';
|
||||
$lang->about_editor_auto_dark_mode = '다크모드 사용시 자동으로 어두운 스킨을 사용합니다.';
|
||||
$lang->edit['fontname'] = '글꼴';
|
||||
$lang->edit['fontsize'] = '크기';
|
||||
$lang->edit['use_paragraph'] = '문단기능';
|
||||
|
|
|
|||
|
|
@ -33,18 +33,23 @@
|
|||
}
|
||||
|
||||
.light_dark(@cs) when (@cs = moono-dark) {
|
||||
background-color: #494949;
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
}
|
||||
.light_dark(@cs) when not (@cs = moono-dark) {
|
||||
background-color: #fff;
|
||||
color: #000;
|
||||
&.color_scheme_dark {
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.light_dark_top(@cs) when (@cs = moono-dark) {
|
||||
border-bottom-color: #1b1b1b;
|
||||
}
|
||||
.light_dark_top(@cs) when not (@cs = moono-dark) {
|
||||
border-bottom-color: #555;
|
||||
}
|
||||
|
||||
html {
|
||||
|
|
|
|||
|
|
@ -92,11 +92,19 @@ var auto_saved_msg = "{$lang->msg_auto_saved}";
|
|||
return val + "/" + val + "px";
|
||||
}).join(";");
|
||||
|
||||
// Apply auto dark mode.
|
||||
var editor_skin = '{$colorset}';
|
||||
<!--@if($editor_auto_dark_mode)-->
|
||||
if (getColorScheme() === 'dark') {
|
||||
editor_skin = 'moono-dark';
|
||||
}
|
||||
<!--@endif-->
|
||||
|
||||
// Initialize CKEditor settings.
|
||||
var settings = {
|
||||
ckeconfig: {
|
||||
height: '{$editor_height}',
|
||||
skin: '{$colorset}',
|
||||
skin: editor_skin,
|
||||
contentsCss: {json_encode($css_file_list)},
|
||||
xe_editor_sequence: {$editor_sequence},
|
||||
font_defaultLabel: default_font_name,
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
background: #fff;
|
||||
padding: 10px;
|
||||
}
|
||||
&.dark {
|
||||
&.dark, .color_scheme_dark & {
|
||||
border-color: #111;
|
||||
background: #333;
|
||||
color: #fff;
|
||||
|
|
|
|||
|
|
@ -256,6 +256,14 @@
|
|||
<p class="x_help-block">{$lang->about_enable_autosave}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="x_control-group">
|
||||
<label class="x_control-label">{$lang->editor_auto_dark_mode}</label>
|
||||
<div class="x_controls">
|
||||
<label class="x_inline"><input type="radio" name="auto_dark_mode" value="Y" checked="checked"|cond="$editor_config->auto_dark_mode != 'N'" /> {$lang->cmd_yes}</label>
|
||||
<label class="x_inline"><input type="radio" name="auto_dark_mode" value="N" checked="checked"|cond="$editor_config->auto_dark_mode == 'N'" /> {$lang->cmd_no}</label>
|
||||
<p class="x_help-block">{$lang->about_editor_auto_dark_mode}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="x_control-group">
|
||||
<label class="x_control-label">{$lang->allow_html}</label>
|
||||
<div class="x_controls">
|
||||
|
|
|
|||
|
|
@ -167,6 +167,14 @@
|
|||
<p class="x_help-inline">{$lang->about_enable_autosave}</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="editor_skin">
|
||||
<th scope="row" style="text-align:right">{$lang->editor_auto_dark_mode}</th>
|
||||
<td colspan="2">
|
||||
<label class="x_inline"><input type="radio" name="auto_dark_mode" value="Y" checked="checked"|cond="$editor_config->auto_dark_mode != 'N'" /> {$lang->cmd_yes}</label>
|
||||
<label class="x_inline"><input type="radio" name="auto_dark_mode" value="N" checked="checked"|cond="$editor_config->auto_dark_mode == 'N'" /> {$lang->cmd_no}</label>
|
||||
<p class="x_help-inline">{$lang->about_editor_auto_dark_mode}</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="editor_skin">
|
||||
<th scope="row" style="text-align:right">{$lang->allow_html}</th>
|
||||
<td colspan="2">
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ function getAutoSavedSrl(ret_obj, response_tags, c) {
|
|||
(function($){
|
||||
"use strict";
|
||||
var default_ckeconfig = {
|
||||
bodyClass: 'rhymix_content xe_content editable',
|
||||
bodyClass: 'rhymix_content xe_content editable color_scheme_' + getColorScheme(),
|
||||
toolbarCanCollapse: true,
|
||||
toolbarGroups: [
|
||||
{ name: 'clipboard', groups: [ 'undo', 'clipboard' ] },
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue