From fa3d188a09621b9e38973a099735625e019b8ffd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mart=C3=ADn=20Gonz=C3=A1lez?= Date: Wed, 28 Dec 2016 18:59:12 +0100 Subject: [PATCH] Add draft editor markup and styles --- app/assets/stylesheets/_settings.scss | 1 + app/assets/stylesheets/admin.scss | 174 +++- .../sandbox/admin_legislation_draft.html.erb | 2 +- .../admin_legislation_draft_edit.html.erb | 971 ++++++++++++++++++ .../sandbox/legislation_debate_quiz.html.erb | 4 +- 5 files changed, 1143 insertions(+), 9 deletions(-) create mode 100644 app/views/sandbox/admin_legislation_draft_edit.html.erb diff --git a/app/assets/stylesheets/_settings.scss b/app/assets/stylesheets/_settings.scss index 3821f22c7..7704739af 100644 --- a/app/assets/stylesheets/_settings.scss +++ b/app/assets/stylesheets/_settings.scss @@ -163,6 +163,7 @@ $header-font-family: $body-font-family; $header-font-weight: $global-weight-normal; $header-font-style: normal; $font-family-monospace: Consolas, 'Liberation Mono', Courier, monospace; +$font-family-serif: Georgia, 'Times New Roman', Times, serif; $header-sizes: ( small: ( 'h1': 34, diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss index 53fc42083..c34eb3a10 100644 --- a/app/assets/stylesheets/admin.scss +++ b/app/assets/stylesheets/admin.scss @@ -434,6 +434,12 @@ table.investment-projects-summary { } } +.legislation-question-delete { + @include breakpoint(medium) { + text-align: right; + } +} + .legislation-process-index { .legislation-process-new { @@ -521,12 +527,6 @@ table.investment-projects-summary { font-style: italic; } - .legislation-question-delete { - @include breakpoint(medium) { - text-align: right; - } - } - .legislation-questions-answers { margin-bottom: 1rem; } @@ -568,4 +568,166 @@ table.investment-projects-summary { text-align: right; } } + + input[type]:not([type="submit"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]) { + background: $white; + } + + .control { + cursor: pointer; + margin-bottom: 1rem; + + small { + display: block; + margin-top: -1rem; + color: $text-medium; + + @include breakpoint(medium) { + margin-left: 0.25rem; + display: inline-block; + margin-top: 0; + } + } + } + + .fullscreen-container { + + .markdown-editor-header, + .markdown-editor-buttons { + display: none; + } + + a { + + @include breakpoint(medium) { + float: right; + } + + line-height: 3rem; + + span { + text-decoration: none; + font-size: $small-font-size; + } + + .icon-expand { + margin-left: 0.25rem; + vertical-align: sub; + text-decoration: none; + line-height: 0; + } + + &:active, + &:focus, + &:hover { + text-decoration: none; + } + } + } + + #legislation_draft_version_body { + font-family: $font-family-monospace; + background: #f5f5f5; + height: 16em; + + &:focus { + border: 1px solid #cacaca; + box-shadow: inset 0 1px 2px rgba(34, 34, 34, 0.1); + } + } + + #markdown-preview { + font-family: $font-family-serif; + border: 1px solid #cacaca; + margin-bottom: 2rem; + + h1, h2, h3, h4, h5, h6 { + font-family: $font-family-serif !important; + } + + h2 { + border-bottom: 1px solid $text-medium; + } + } + + .fullscreen { + + .column { + padding: 0; + } + + .fullscreen-container { + background: $admin-color; + padding: 0.5rem 1rem; + + .markdown-editor-header { + vertical-align: top; + display: inline-block; + color: $white; + + @include breakpoint(medium) { + line-height: 3rem; + } + } + + .truncate { + @include breakpoint(medium) { + width: 40vw; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + } + + .markdown-editor-buttons { + display: block; + + @include breakpoint(medium) { + display: inline-block; + float: right; + padding-left: 1rem; + } + + input { + font-size: $small-font-size; + padding: 0.5em 1em; + margin-left: 0; + margin-bottom: 0; + margin-top: 1rem; + + @include breakpoint(medium) { + margin: 0.5rem; + } + } + } + + a { + color: $white; + } + } + + #legislation_draft_version_body { + border-radius: 0; + padding: 1rem; + border: none; + + @include breakpoint(medium) { + padding: 1rem 2rem; + } + + &:focus { + border: none; + } + } + + #markdown-preview { + padding: 1rem; + border: none; + + @include breakpoint(medium) { + padding: 1rem 2rem; + } + } + } + } diff --git a/app/views/sandbox/admin_legislation_draft.html.erb b/app/views/sandbox/admin_legislation_draft.html.erb index b123c7b07..da4bc7f2c 100644 --- a/app/views/sandbox/admin_legislation_draft.html.erb +++ b/app/views/sandbox/admin_legislation_draft.html.erb @@ -42,7 +42,7 @@ - Versión 1 + Versión 1 2016-12-16 draft diff --git a/app/views/sandbox/admin_legislation_draft_edit.html.erb b/app/views/sandbox/admin_legislation_draft_edit.html.erb new file mode 100644 index 000000000..5deb77112 --- /dev/null +++ b/app/views/sandbox/admin_legislation_draft_edit.html.erb @@ -0,0 +1,971 @@ +
+
+ + + Volver + + +

Licencias urbanísticas, declaraciones responsables y comunicaciones previas

+ + + + +
+
+ +
+ Ojo, has editado el texto. Para conservar de forma permanente los cambios, no te olvides de hacer click en Guardar. +
+
+ +
+

Versión 1

+
+
+ Borrar +
+
+ +
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+ +
+
+ +
+
+ +
+
+
+ +
+ +
+
+ + Usa Markdown para formatear el texto +
+
+ +
+
+
Consul | Editando Versión 3 del proceso Licencias urbanísticas, declaraciones
+ +
+ + +
+ + Pantalla completa +
+
+ +
+
+
+ +
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+
diff --git a/app/views/sandbox/legislation_debate_quiz.html.erb b/app/views/sandbox/legislation_debate_quiz.html.erb index d4411b3bd..40f691094 100644 --- a/app/views/sandbox/legislation_debate_quiz.html.erb +++ b/app/views/sandbox/legislation_debate_quiz.html.erb @@ -30,8 +30,8 @@ No tengo información suficiente - - + +