deprecar trix

This commit is contained in:
f 2020-11-14 12:10:55 -03:00
parent ff59e169cd
commit 8ff1a43791
7 changed files with 69 additions and 65 deletions

View file

@ -1,38 +0,0 @@
//
// Provides a drop-in pointer for the default Trix stylesheet that will
// format the toolbar and the trix-editor content (whether displayed or
// under editing). Feel free to incorporate this inclusion directly in
// any other asset bundle and remove this file.
//
//= require trix/dist/trix
// We need to override trix.csss image gallery styles to accommodate
// the <action-text-attachment> element we wrap around attachments.
// Otherwise, images in galleries will be squished by the max-width:
// 33%; rule.
.trix-content {
.attachment-gallery {
> action-text-attachment,
> .attachment {
flex: 1 0 33%;
padding: 0 0.5em;
max-width: 33%;
}
&.attachment-gallery--2,
&.attachment-gallery--4 {
> action-text-attachment,
> .attachment {
flex-basis: 50%;
max-width: 50%;
}
}
}
action-text-attachment {
.attachment {
padding: 0 !important;
max-width: 100% !important;
}
}
}

View file

@ -22,7 +22,6 @@ $component-active-bg: $magenta;
@import "bootstrap"; @import "bootstrap";
@import "editor"; @import "editor";
@import "actiontext";
@import "helpers"; @import "helpers";
:root { :root {
@ -37,18 +36,6 @@ $component-active-bg: $magenta;
--background: #{$black}; --background: #{$black};
--color: #{$cyan}; --color: #{$cyan};
} }
trix-toolbar {
.trix-button--icon {
background-color: var(--color);
}
}
}
trix-toolbar {
background-color: var(--background);
position: sticky;
top: 0;
} }
// TODO: Encontrar la forma de generar esto desde los locales de Rails // TODO: Encontrar la forma de generar esto desde los locales de Rails

View file

@ -15,9 +15,6 @@
// const images = require.context('../images', true) // const images = require.context('../images', true)
// const imagePath = (name) => images(name, true) // const imagePath = (name) => images(name, true)
require("trix")
require("@rails/actiontext")
import tableDragger from 'table-dragger' import tableDragger from 'table-dragger'
import {EditorState} from "prosemirror-state" import {EditorState} from "prosemirror-state"

View file

@ -4,7 +4,6 @@
# #
# TODO: Validar el tipo de valor pasado a value= según el :type # TODO: Validar el tipo de valor pasado a value= según el :type
# #
# rubocop:disable Metrics/BlockLength
MetadataTemplate = Struct.new(:site, :document, :name, :label, :type, MetadataTemplate = Struct.new(:site, :document, :name, :label, :type,
:value, :help, :required, :errors, :post, :value, :help, :required, :errors, :post,
:layout, keyword_init: true) do :layout, keyword_init: true) do
@ -123,7 +122,7 @@ MetadataTemplate = Struct.new(:site, :document, :name, :label, :type,
sanitizer.sanitize(string.tr("\r", ''), sanitizer.sanitize(string.tr("\r", ''),
tags: allowed_tags, tags: allowed_tags,
attributes: allowed_attributes + %w[data-trix-attachment], attributes: allowed_attributes,
scrubber: scrubber).strip.html_safe scrubber: scrubber).strip.html_safe
end end
@ -156,4 +155,3 @@ MetadataTemplate = Struct.new(:site, :document, :name, :label, :type,
@box ||= Lockbox.new key: site.private_key, padding: true, encode: true @box ||= Lockbox.new key: site.private_key, padding: true, encode: true
end end
end end
# rubocop:enable Metrics/BlockLength

View file

@ -2,6 +2,71 @@
= label_tag "post_#{attribute}", post_label_t(attribute, post: post) = label_tag "post_#{attribute}", post_label_t(attribute, post: post)
= render 'posts/attribute_feedback', = render 'posts/attribute_feedback',
post: post, attribute: attribute, metadata: metadata post: post, attribute: attribute, metadata: metadata
= rich_text_area_tag "post[#{attribute}]", metadata.value,
**field_options(attribute, metadata), class: '', dir: dir, .editor
lang: locale = text_area_tag "post[#{attribute}]", metadata.value,
dir: dir, lang: locale,
**field_options(attribute, metadata), class: 'd-none'
.editor-toolbar
.editor-primary-toolbar.scrollbar-black
%button.btn{ data: { button: 'bold' } }= t('editor.bold')
%button.btn{ data: { button: 'italic' } }= t('editor.italic')
%button.btn{ data: { button: 'deleted' } }= t('editor.deleted')
%button.btn{ data: { button: 'underline' } }= t('editor.underline')
%button.btn{ data: { button: 'mark' } }= t('editor.mark')
%button.btn{ data: { button: 'h1' } }= t('editor.h1')
%button.btn{ data: { button: 'h2' } }= t('editor.h2')
%button.btn{ data: { button: 'h3' } }= t('editor.h3')
%button.btn{ data: { button: 'h4' } }= t('editor.h4')
%button.btn{ data: { button: 'h5' } }= t('editor.h5')
%button.btn{ data: { button: 'h6' } }= t('editor.h6')
%button.btn{ data: { button: 'ul' } }= t('editor.ul')
%button.btn{ data: { button: 'ol' } }= t('editor.ol')
%button.btn{ data: { button: 'left' } }= t('editor.left')
%button.btn{ data: { button: 'center' } }= t('editor.center')
%button.btn{ data: { button: 'right' } }= t('editor.right')
%button.btn{ data: { button: 'img' } }= t('editor.img')
%button.btn{ data: { button: 'video' } }= t('editor.video')
%button.btn{ data: { button: 'audio' } }= t('editor.audio')
%button.btn{ data: { button: 'pdf' } }= t('editor.pdf')
-#
HAML cringe
TODO: generar IDs para labels
.editor-auxiliary-toolbar.scrollbar-black{ data: { editor: { auxiliary: { toolbar: '' } } } }
.form-group{ data: { editor: { auxiliary: 'mark' } } }
%label{ for: 'mark-color' }= t('editor.color')
%input{ type: 'color', data: { prop: 'mark-color' } }/
%div{ data: { editor: { auxiliary: 'img' } } }
.row
.col.form-group.d-flex.align-items-end
.custom-file
%input.custom-file-input{ type: 'file', data: { prop: 'img-file' }, accept: 'image/*' }/
%label.custom-file-label{ for: 'img-file' }= t('editor.file.img')
.col.form-group
%label{ for: 'img-alt' }= t('editor.description')
%input.form-control{ type: 'text', data: { prop: 'img-alt' } }/
-# https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Containers
.form-group{ data: { editor: { auxiliary: 'audio' } } }
.custom-file
%input.custom-file-input{ type: 'file', data: { prop: 'audio-file' }, accept: 'audio/flac,audio/mp4,audio/ogg,audio/webm,audio/mp3' }/
%label.custom-file-label{ for: 'audio-file' }= t('editor.file.audio')
.form-group{ data: { editor: { auxiliary: 'video' } } }
.custom-file
%input.custom-file-input{ type: 'file', data: { prop: 'video-file' }, accept: 'video/mp4,video/ogg,video/webm' }/
%label.custom-file-label{ for: 'video-file' }= t('editor.file.video')
.form-group{ data: { editor: { auxiliary: 'pdf' } } }
.custom-file
%input.custom-file-input{ type: 'file', data: { prop: 'pdf-file' }, accept: 'application/pdf' }/
%label.custom-file-label{ for: 'pdf-file' }= t('editor.file.pdf')
.form-group{ data: { editor: { auxiliary: 'link' } } }
%label{ for: 'link-href' }= t('editor.url')
%input.form-control{ type: 'url', data: { prop: 'link-href' } }/
.editor-content.form-control.h-auto{ contenteditable: 'true' }

View file

@ -11,7 +11,6 @@
"prosemirror-markdown": "^1.4.5", "prosemirror-markdown": "^1.4.5",
"prosemirror-schema-basic": "^1.1.2", "prosemirror-schema-basic": "^1.1.2",
"table-dragger": "git+https://0xacab.org/sutty/table-dragger.git", "table-dragger": "git+https://0xacab.org/sutty/table-dragger.git",
"trix": "git+https://0xacab.org/sutty/trix.git",
"zepto": "^1.2.0" "zepto": "^1.2.0"
}, },
"devDependencies": { "devDependencies": {

View file

@ -6953,10 +6953,6 @@ trim-right@^1.0.1:
resolved "https://registry.yarnpkg.com/trim-right/-/trim-right-1.0.1.tgz#cb2e1203067e0c8de1f614094b9fe45704ea6003" resolved "https://registry.yarnpkg.com/trim-right/-/trim-right-1.0.1.tgz#cb2e1203067e0c8de1f614094b9fe45704ea6003"
integrity sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM= integrity sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM=
"trix@git+https://0xacab.org/sutty/trix.git":
version "1.2.0"
resolved "git+https://0xacab.org/sutty/trix.git#0a53f75dbef0d650acbd73344f7d50ac4aedbe16"
"true-case-path@^1.0.2": "true-case-path@^1.0.2":
version "1.0.3" version "1.0.3"
resolved "https://registry.yarnpkg.com/true-case-path/-/true-case-path-1.0.3.tgz#f813b5a8c86b40da59606722b144e3225799f47d" resolved "https://registry.yarnpkg.com/true-case-path/-/true-case-path-1.0.3.tgz#f813b5a8c86b40da59606722b144e3225799f47d"