diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index 415c23f9e..822e4cd4c 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -10,4 +10,5 @@ @import "c3"; @import "annotator.min"; @import "annotator_overrides"; -@import "jquery-ui/datepicker"; \ No newline at end of file +@import "jquery-ui/datepicker"; +@import "datepicker_overrides"; \ No newline at end of file diff --git a/app/assets/stylesheets/datepicker_overrides.scss b/app/assets/stylesheets/datepicker_overrides.scss new file mode 100644 index 000000000..abab720e0 --- /dev/null +++ b/app/assets/stylesheets/datepicker_overrides.scss @@ -0,0 +1,94 @@ +// Overrides styles of jquery-ui/datepicker +// + +.ui-datepicker-header { + background: $brand; + color: white; + font-weight: bold; +} + +.ui-datepicker-calendar { + + .ui-state-default { + background: $highlight; + color: $text; + } + + .ui-state-hover, .ui-state-active { + background: $brand; + color: white; + } +} + +.ui-datepicker { + padding: 0; + z-index: 4 !important; + + .ui-datepicker-prev { + left: 12px; + } + + .ui-datepicker-next { + right: 12px; + } + + .ui-datepicker-prev, .ui-datepicker-next { + color: white; + cursor: pointer; + font-weight: normal; + font-size: $small-font-size; + line-height: $line-height; + top: 0; + } + + table { + border: 1px solid $border; + border-top: 0; + + thead { + background: $dark; + border-left: 1px solid $dark; + border-right: 1px solid $dark; + + tr th { + color: white; + } + } + + tr { + border-bottom: 1px solid $border; + + &:last-child { + border-bottom: 0px; + } + + &:nth-child(odd) { + background: none; + } + } + + td { + padding: 0; + border-right: 1px solid $border; + + &:last-child { + border-right: 0px; + } + + span, a { + text-align: center; + line-height: $line-height; + color: $text; + } + + &.ui-datepicker-unselectable.ui-state-disabled { + background: white; + + .ui-state-default { + background: $input-bg; + color: $text-medium; + } + } + } + } +} diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index 749c009b0..26aeebfcc 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -482,6 +482,7 @@ header { @media (min-width: $small-breakpoint) { background: white; + min-height: rem-calc(50); } a { diff --git a/app/views/shared/_advanced_search.html.erb b/app/views/shared/_advanced_search.html.erb index 68cf1441d..03c1a4319 100644 --- a/app/views/shared/_advanced_search.html.erb +++ b/app/views/shared/_advanced_search.html.erb @@ -29,12 +29,14 @@ <%= text_field_tag 'advanced_search[date_min]', params[:advanced_search].try(:[], :date_min), + placeholder: t("shared.advanced_search.date_placeholder"), class: 'js-calendar' %>
<%= text_field_tag 'advanced_search[date_max]', params[:advanced_search].try(:[], :date_max), + placeholder: t("shared.advanced_search.date_placeholder"), class: 'js-calendar' %>
@@ -46,4 +48,4 @@ <% end %> - \ No newline at end of file + diff --git a/config/locales/en.yml b/config/locales/en.yml index 0e31c1261..2cb4a93f5 100755 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -336,6 +336,7 @@ en: author_type_4: 'City councillor' author_type_5: 'Mayoress' date: 'By date' + date_placeholder: 'DD/MM/YYYY' date_range_blank: 'Choose a date' date_1: 'Last 24 hours' date_2: 'Last week' diff --git a/config/locales/es.yml b/config/locales/es.yml index cbd7c5789..9a2ca6a4b 100644 --- a/config/locales/es.yml +++ b/config/locales/es.yml @@ -261,7 +261,7 @@ es: proposal_video_url_note: Puedes añadir un enlace a YouTube o Vimeo tags_instructions: Etiqueta esta propuesta. Puedes elegir entre nuestras sugerencias o introducir las que desees. tags_label: Temas - tags_placeholder: Escribe las etiquetas que desees separadas por una coma (',') + tags_placeholder: "Escribe las etiquetas que desees separadas por una coma (',')" index: featured_proposals: Destacadas filter_topic: @@ -336,6 +336,7 @@ es: author_type_4: 'Concejal' author_type_5: 'Alcaldesa' date: 'Por fecha' + date_placeholder: 'DD/MM/AAAA' date_range_blank: 'Elige una fecha' date_1: 'Últimas 24 horas' date_2: 'Última semana'