From 53d7e74e31732f5574d30a93d94f2b1c768d8bfb Mon Sep 17 00:00:00 2001 From: f Date: Thu, 12 Sep 2019 15:10:01 -0300 Subject: [PATCH] estructura a dos columnas y esquema de colores --- app/assets/stylesheets/application.scss | 86 +++++++----------- app/models/site.rb | 12 +++ app/views/layouts/_breadcrumb.haml | 3 +- app/views/layouts/application.html.haml | 4 + app/views/posts/index.haml | 24 ++--- app/views/sites/_build.haml | 15 ++++ app/views/sites/index.haml | 113 ++++++++++-------------- config/locales/es.yml | 7 +- 8 files changed, 130 insertions(+), 134 deletions(-) create mode 100644 app/views/sites/_build.haml diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index 568994a..776a61f 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -1,19 +1,33 @@ //= require_tree . +@import "bootstrap"; + $black: black; $white: white; $grey: grey; $cyan: #13fefe; $magenta: #f206f9; +:root { + --foreground: #{$black}; + --background: #{$white}; + --color: #{$magenta}; +} + +@media (prefers-color-scheme: dark) { + :root { + --foreground: #{$white}; + --background: #{$black}; + --color: #{$cyan}; + } +} + // TODO: Encontrar la forma de generar esto desde los locales de Rails $custom-file-text: ( en: 'Browse', es: 'Buscar archivo' ); -@import "bootstrap"; - @font-face { font-family: 'Saira'; font-style: normal; @@ -34,9 +48,17 @@ $custom-file-text: ( body { font-family: Saira, sans-serif; + background-color: var(--background); + color: var(--foreground); } a { + color: var(--color); + + &:hover { + color: var(--color); + } + &[target=_blank] { /* TODO: Convertir a base64 para no hacer peticiones extra */ &:after { @@ -145,52 +167,6 @@ textarea.post-content { transition: all 3s; } -/* Select2 Bootstrap4 Validation */ - -.was-validated { - .form-control { - &:invalid { - ~ .select2-container--bootstrap { - border: 1px solid #dc3545; - border-radius: 0.25rem; - - .select2-dropdown { - border: 1px solid #dc3545; - border-radius: 0.25rem; - } - } - } - &:valid { - ~ .select2-container--bootstrap { - border: 1px solid #28a745; - border-radius: 0.25rem; - - .select2-dropdown { - border: 1px solid #28a745; - border-radius: 0.25rem; - } - } - } - } -} - -.field-groups { - .field-group { - .remove-group { - display: none - } - } - - .extra { - border-top: 1px solid lightgray; - padding-top: 1rem; - - .remove-group { - display: inline-block; - } - } -} - .taggable { .input-tag { legend { @@ -223,27 +199,27 @@ textarea.post-content { svg { .is-path-magenta { - fill: $black + fill: var(--foreground); } } .btn { - background-color: $black; - color: $white; + background-color: var(--foreground); + color: var(--background); border: none; border-radius: 0; &:hover { - color: $white; - background-color: $magenta; + color: var(--background); + background-color: var(--color); } &:active { - background-color: $magenta; + background-color: var(--color); } &:focus { - box-shadow: 0 0 0 0.2rem $magenta; + box-shadow: 0 0 0 0.2rem var(--color); } } diff --git a/app/models/site.rb b/app/models/site.rb index 69e3451..227fddd 100644 --- a/app/models/site.rb +++ b/app/models/site.rb @@ -60,6 +60,18 @@ class Site < ApplicationRecord @repository ||= Site::Repository.new path end + def hostname + if name.ends_with? '.' + name.gsub(/\.\Z/, '') + else + "#{name}.#{Site.domain}" + end + end + + def url + "https://#{hostname}/" + end + # TODO: Mover esta consulta a la base de datos para no traer un montón # de cosas a la memoria def invitade?(usuarie) diff --git a/app/views/layouts/_breadcrumb.haml b/app/views/layouts/_breadcrumb.haml index 0c5ae27..f94e329 100644 --- a/app/views/layouts/_breadcrumb.haml +++ b/app/views/layouts/_breadcrumb.haml @@ -22,7 +22,8 @@ - if current_usuarie %ul.navbar-nav %li.nav-item - = link_to t('.mutual_aid'), mutual_aid_url(local_channel) + = link_to t('.mutual_aid'), mutual_aid_url(local_channel), + class: 'btn' %li.nav-item = link_to t('.logout'), destroy_usuarie_session_path, method: :delete, role: 'button', class: 'btn' diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml index 9913a4c..bd5007e 100644 --- a/app/views/layouts/application.html.haml +++ b/app/views/layouts/application.html.haml @@ -1,8 +1,12 @@ !!! %html{ lang: I18n.locale, dir: t('dir') } %head + %meta{ charset: 'UTF-8' }/ %meta{ content: 'text/html; charset=UTF-8', 'http-equiv': 'Content-Type' }/ + %meta{ name: 'color-scheme', content: 'light dark' }/ + %meta{ name: 'viewport', + content: 'width=device-width, initial-scale=1.0' }/ %title Sutty = csrf_meta_tags diff --git a/app/views/posts/index.haml b/app/views/posts/index.haml index f49b89d..c1d9e4d 100644 --- a/app/views/posts/index.haml +++ b/app/views/posts/index.haml @@ -5,18 +5,22 @@ site_posts_path(@site)), @category] -.row - .col - %h1= @site.title +%main.row + %aside.col-md-3 + %h1 + = link_to @site.title, @site.url + %p.lead= @site.description -.row - .col - .btn-group - = link_to t('posts.new'), new_site_post_path(@site), - class: 'btn' + = link_to t('posts.new'), new_site_post_path(@site), + class: 'btn' -.row - .col + - if policy(@site).edit? + = link_to t('sites.edit.btn', site: @site.title), + edit_site_path(@site), class: 'btn' + + = render 'sites/build', site: @site + + %section.col = render 'layouts/flash' - if @posts.present? .row diff --git a/app/views/sites/_build.haml b/app/views/sites/_build.haml new file mode 100644 index 0000000..d85e83c --- /dev/null +++ b/app/views/sites/_build.haml @@ -0,0 +1,15 @@ +- if policy(site).build? + - if site.enqueued? + = render 'layouts/btn_with_tooltip', + tooltip: t('help.sites.enqueued'), + text: t('.enqueued'), + type: 'secondary', + link: nil + - else + = form_tag site_enqueue_path(site), + method: :post, class: 'form-inline' do + = button_tag type: 'submit', + class: 'btn no-border-radius', + title: t('help.sites.enqueue'), + data: { toggle: 'tooltip' } do + = t('sites.enqueue') diff --git a/app/views/sites/index.haml b/app/views/sites/index.haml index aba2f2d..6a7027b 100644 --- a/app/views/sites/index.haml +++ b/app/views/sites/index.haml @@ -1,13 +1,14 @@ = render 'layouts/breadcrumb', crumbs: [t('sites.index.title')] -.row - .col - %h1 - = t('.title') - - if policy(Site).new? - = link_to t('sites.new.title'), new_site_path, - class: 'btn' +%main.row + %aside.col-md-3 + %h1= t('.title') + %p.lead= t('.help') + - if policy(Site).new? + = link_to t('sites.new.title'), new_site_path, + class: 'btn' + %section.col %table.table.table-condensed %tbody - @sites.each do |site| @@ -18,63 +19,43 @@ = link_to site.name, site_path(site) - else = site.name - - if site.invitade? current_usuarie - %span.badge.badge-warning{ data: { toggle: 'tooltip' }, - title: t('help.sites.invitade') } - = t('.invitade') %br - .btn-group{ role: 'group', - 'aria-label': t('sites.actions') } - - if current_usuarie.rol_for_site(site).temporal - = button_to t('sites.invitations.accept'), - site_usuaries_accept_invitation_path(site), - data: { toggle: 'tooltip' }, - title: t('help.sites.invitations.accept'), - method: :patch, - class: 'btn' - = button_to t('sites.invitations.reject'), - site_usuaries_reject_invitation_path(site), - data: { toggle: 'tooltip' }, - title: t('help.sites.invitations.reject'), - method: :patch, - class: 'btn' - - else - - if policy(site).show? - = render 'layouts/btn_with_tooltip', - tooltip: t('help.sites.edit_posts'), - type: 'success', - link: site_path(site), - text: t('sites.posts') - - if policy(SiteTranslation.new(site)).edit? - = render 'layouts/btn_with_tooltip', - tooltip: t('help.sites.edit_translations'), - text: t('i18n.edit'), - type: 'info', - link: site_i18n_edit_path(site) - - if policy(SiteUsuarie.new(site, current_usuarie)).index? - = render 'layouts/btn_with_tooltip', - tooltip: t('usuaries.index.help.self'), - text: t('usuaries.index.title'), - type: 'info', - link: site_usuaries_path(site) - - if policy(site).pull? && site.repository.needs_pull? - = render 'layouts/btn_with_tooltip', - tooltip: t('help.sites.pull'), - text: t('.pull'), - type: 'info', - link: site_pull_path(site) - - if policy(site).build? - - if site.enqueued? - = render 'layouts/btn_with_tooltip', - tooltip: t('help.sites.enqueued'), - text: t('.enqueued'), - type: 'secondary', - link: nil - - else - = form_tag site_enqueue_path(site), - method: :post, class: 'form-inline' do - = button_tag type: 'submit', - class: 'btn no-border-radius', - title: t('help.sites.enqueue'), - data: { toggle: 'tooltip' } do - = t('sites.enqueue') + - if current_usuarie.rol_for_site(site).temporal + = button_to t('sites.invitations.accept'), + site_usuaries_accept_invitation_path(site), + data: { toggle: 'tooltip' }, + title: t('help.sites.invitations.accept'), + method: :patch, + class: 'btn' + = button_to t('sites.invitations.reject'), + site_usuaries_reject_invitation_path(site), + data: { toggle: 'tooltip' }, + title: t('help.sites.invitations.reject'), + method: :patch, + class: 'btn' + - else + - if policy(site).show? + = render 'layouts/btn_with_tooltip', + tooltip: t('help.sites.edit_posts'), + type: 'success', + link: site_path(site), + text: t('sites.posts') + - if policy(SiteTranslation.new(site)).edit? + = render 'layouts/btn_with_tooltip', + tooltip: t('help.sites.edit_translations'), + text: t('i18n.edit'), + type: 'info', + link: site_i18n_edit_path(site) + - if policy(SiteUsuarie.new(site, current_usuarie)).index? + = render 'layouts/btn_with_tooltip', + tooltip: t('usuaries.index.help.self'), + text: t('usuaries.index.title'), + type: 'info', + link: site_usuaries_path(site) + - if policy(site).pull? && site.repository.needs_pull? + = render 'layouts/btn_with_tooltip', + tooltip: t('help.sites.pull'), + text: t('.pull'), + type: 'info', + link: site_pull_path(site) + = render 'sites/build', site: site diff --git a/config/locales/es.yml b/config/locales/es.yml index 9346d96..72030ba 100644 --- a/config/locales/es.yml +++ b/config/locales/es.yml @@ -161,6 +161,7 @@ es: invitations: accept: 'Alguien te invitó a colaborar en su sitio. Si aceptas la invitación, tendrás acceso a este sitio.' reject: 'Si rechazas la invitación, no tendrás acceso.' + pull: 'Tienes actualizaciones pendientes :)' close: 'Cerrar ayuda' markdown: intro: 'El formato del texto se llama Markdown. Es un formato @@ -234,13 +235,14 @@ es: index: title: 'Sitios' pull: 'Actualizar' + help: 'Este es el listado de sitios que puedes editar' repository: config: 'Cambios en la configuración' actions: 'Acciones' posts: 'Ver y editar artículos' title: 'Sitios' - enqueued: 'Esperando compilación' - enqueue: 'Compilar' + enqueued: 'Esperando publicación' + enqueue: 'Publicar todos los cambios' failed: '¡Falló!' build_log: 'Ver registro' invitations: @@ -252,6 +254,7 @@ es: edit: title: 'Editar %{site}' submit: 'Guardar cambios' + btn: 'Configuración' form: errors: title: Hay errores y no pudimos guardar tus cambios :(