From 89386ef1813547c44b1f4faab8d86a89e8a4ee2e Mon Sep 17 00:00:00 2001 From: drusepth Date: Mon, 5 Dec 2022 18:25:21 -0800 Subject: [PATCH] start on thredded-tailwind redesign & analyses homepage --- Gemfile | 4 +- Gemfile.lock | 16 +- .../stylesheets/thredded-overrides.scss | 231 +----------- .../document_analyses_controller.rb | 18 +- app/models/documents/document_analysis.rb | 4 + app/views/document_analyses/index.html.erb | 263 +++++++++++++ app/views/layouts/forum.html.erb | 345 ++++++++++++++++-- app/views/layouts/tailwind.html.erb | 6 +- app/views/thredded/posts/_post.html.erb | 14 +- .../thredded/posts_common/_header.html.erb | 12 +- .../thredded/redesigned/_breadcrumbs.html.erb | 19 + app/views/thredded/search/_form.html.erb | 1 + app/views/thredded/shared/_nav.html.erb | 4 +- app/views/thredded/topics/_followers.html.erb | 22 +- app/views/thredded/topics/_header.html.erb | 142 ++++--- app/views/thredded/topics/show.html.erb | 94 +++-- app/views/thredded/users/_badge.html.erb | 22 +- app/views/thredded/users/_link.html.erb | 5 - config/routes.rb | 4 + 19 files changed, 812 insertions(+), 414 deletions(-) create mode 100644 app/views/document_analyses/index.html.erb create mode 100644 app/views/thredded/redesigned/_breadcrumbs.html.erb create mode 100644 app/views/thredded/search/_form.html.erb diff --git a/Gemfile b/Gemfile index c675b26c..c892e9aa 100644 --- a/Gemfile +++ b/Gemfile @@ -73,8 +73,8 @@ gem 'barnes' #gem 'levenshtein-ffi' # Forum -gem 'thredded', git: 'https://github.com/indentlabs/thredded.git', branch: 'feature/report-posts' -# gem 'thredded', path: "../thredded" +# gem 'thredded', git: 'https://github.com/indentlabs/thredded.git', branch: 'feature/report-posts' +gem 'thredded', path: "../thredded" # gem 'thredded' # gem 'thredded', git: 'https://github.com/sudara/thredded', branch: 'master' diff --git a/Gemfile.lock b/Gemfile.lock index 223dfabb..1d65eb75 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -24,10 +24,8 @@ GIT specs: serendipitous (0.0.2) -GIT - remote: https://github.com/indentlabs/thredded.git - revision: edd58a785cd18fb2d7967c1f74aeaa92d3d82fbd - branch: feature/report-posts +PATH + remote: ../thredded specs: thredded (1.0.1) active_record_union (>= 1.3.0) @@ -1349,14 +1347,14 @@ GEM flamegraph (0.9.5) font-awesome-rails (4.7.0.8) railties (>= 3.2, < 8.0) - friendly_id (5.4.2) + friendly_id (5.5.0) activerecord (>= 4.0.0) globalid (1.0.0) activesupport (>= 5.0) haml (5.2.2) temple (>= 0.8.0) tilt - html-pipeline (2.14.2) + html-pipeline (2.14.3) activesupport (>= 2) nokogiri (>= 1.4) htmlentities (4.3.4) @@ -1418,9 +1416,6 @@ GEM language_filter (0.3.01) libv8-node (16.10.0.0) libv8-node (16.10.0.0-x86_64-linux) - listen (3.7.1) - rb-fsevent (~> 0.10, >= 0.10.3) - rb-inotify (~> 0.9, >= 0.9.10) loofah (2.18.0) crass (~> 1.0.2) nokogiri (>= 1.5.9) @@ -1545,9 +1540,6 @@ GEM rake (>= 12.2) thor (~> 1.0) rake (13.0.6) - rb-fsevent (0.11.0) - rb-inotify (0.10.1) - ffi (~> 1.0) react-rails (2.6.2) babel-transpiler (>= 0.7.0) connection_pool diff --git a/app/assets/stylesheets/thredded-overrides.scss b/app/assets/stylesheets/thredded-overrides.scss index 928cf365..5a937862 100644 --- a/app/assets/stylesheets/thredded-overrides.scss +++ b/app/assets/stylesheets/thredded-overrides.scss @@ -1,232 +1,9 @@ @import "thredded"; -#thredded--container { - .thredded--navigation--search { - - #q /* search input */ { - padding-left: 16px; - margin-top: 4.5em; - } - - @media only screen and (min-width: 600px) { - #q /* search input */ { - height: 17px; - margin-top: 0; - } - } - } - - .thredded--navigation-breadcrumbs { - margin-top: 0.4em; - padding-left: 0.1em; - overflow: hidden; - min-height: 3em; - max-height: 60px; - - width: 50%; - - li { - display: inline !important; - float: left; - padding-right: 4px; - margin-right: 8px; - } - - li a { - padding: 0; - line-height: 2rem; - } - } - - .thredded--scoped-navigation { - left: 1rem; - top: 1rem; - } - - .thredded--scoped-navigation li a { - padding: 0; - line-height: 2rem; - float: left; - } - - .thredded--user-navigation { - height: 2rem; - margin: 1rem; - border-bottom: 0; - - @media only screen and (max-width: 600px) { - .thredded--user-navigation--item { - padding-top: 0.5rem; - padding-right: 0.5rem; - } - } - - .thredded--user-navigation--item a { - padding: 8px 4px; - line-height: 2rem; - } - } - - @media only screen and (max-width: 600px) { - .thredded--user-navigation { - margin: 0; - } - } - - .thredded--post--user { - color: black; - - a { - color: #347a36; - } - } - - .thredded--currently-online { - right: 100px; - max-height: 80%; - overflow-y: hidden; - overflow-x: hidden; - border: 1px solid lightgrey; - } - - .thredded--currently-online.thredded--is-expanded { - overflow-y: auto; - overflow-x: hidden; - } - - .thredded--new-topic-form { - background: white; - padding: 10px; - padding-bottom: 0; - border: 1px solid lightgrey; - - margin-bottom: 20px; - } - - .thredded--topics--topic { - background: white; - padding: 4px 26px; - border: 1px solid lightgrey; - - margin-bottom: 0.7rem; - } - - .thredded--topics--posts-count { - left: -1rem; - top: 2px; - } - - .thredded--topics--follow-icon { - right: 0.2rem; - top: 6px; - } - - .thredded--pagination { - background: white; - padding: 0 0 10px 0; - } - - .thredded--topic .thredded--post { - background: white; - padding: 10px; - - margin-bottom: 20px; - border-bottom: 1px solid lightgrey; - } - - @media (min-width: 47.12501rem) { - .thredded--post--avatar { - top: 0; - } - } - - .thredded--messageboard { - background: white; - border-bottom: 1px solid lightgrey; - margin: 2px; - } +.thredded--topic-header--follow-info--follow { + position: static !important; } -.thredded--main-header { - nav { - background: white; - - margin-bottom: 4rem; - line-height: 3rem; - } - - - @media only screen and (min-width: 600px) { - nav { - height: 3rem; - } - } -} - -.thredded--topic-header { - .thredded--topic-header--title { - margin-bottom: 0.4em; - } -} - -.thredded--main-container { - // The padding and max-width are handled by the app's container. - min-width: 80%; - padding: 0; - @include thredded-media-tablet-and-up { - padding: 0; - } -} - -.thredded--form { - input[type="checkbox"] { - position: relative !important; - opacity: 1 !important; - pointer-events: inherit !important; - } -} - -.thredded--messageboard--byline { - i.material-icons { - font-size: 0.9em; - color: grey; - } -} - -.thredded--post--content { - padding-top: 0.6em !important; - - ul { - list-style-type: inherit !important; - padding-left: 40px !important; - - li { - list-style-type: disc !important; - } - } - ol { - list-style-type: inherit !important; - padding-left: 40px !important; - - li { - list-style-type: decimal !important; - } - } -} - -.muted-thredded-post { - color: #616161; - background-color: #f5f5f5 !important; - border-bottom: 0 !important; -} - -.thredded--post { - .card-content { - padding: 0 !important; - padding-top: 5px !important; - } -} -.thredded--topic-delete--wrapper { - margin-top: 0.5rem !important; - padding-top: 1rem !important; +.thredded--topic-header--follow-info--unfollow { + position: static !important; } diff --git a/app/controllers/document_analyses_controller.rb b/app/controllers/document_analyses_controller.rb index e36a0ccb..3247a28c 100644 --- a/app/controllers/document_analyses_controller.rb +++ b/app/controllers/document_analyses_controller.rb @@ -1,16 +1,18 @@ class DocumentAnalysesController < ApplicationController - before_action :authenticate_user! - before_action :set_document - before_action :authorize_user_for_document - before_action :set_document_analysis + before_action :authenticate_user!, except: [:index] + before_action :set_document, except: [:index] + before_action :authorize_user_for_document, except: [:index] + before_action :set_document_analysis, except: [:index] before_action :set_navbar_color before_action :set_sidenav_expansion - before_action :set_navbar_actions + # before_action :set_navbar_actions - # def index - # @document_analyses = DocumentAnalysis.all - # end + layout 'tailwind', only: [:index] + + def index + @document_analyses = DocumentAnalysis.all + end def show @navbar_actions = [] unless @analysis.present? diff --git a/app/models/documents/document_analysis.rb b/app/models/documents/document_analysis.rb index 6d8ee407..df3276ff 100644 --- a/app/models/documents/document_analysis.rb +++ b/app/models/documents/document_analysis.rb @@ -32,4 +32,8 @@ class DocumentAnalysis < ApplicationRecord def self.text_color 'text-orange-500' end + + def self.color + 'bg-orange-500' + end end \ No newline at end of file diff --git a/app/views/document_analyses/index.html.erb b/app/views/document_analyses/index.html.erb new file mode 100644 index 00000000..cfa30457 --- /dev/null +++ b/app/views/document_analyses/index.html.erb @@ -0,0 +1,263 @@ +
+
+
+

+ Start your editing off right with powerful + AI analysis +

+

+ Anim aute id magna aliqua ad ad non deserunt sunt. Qui irure qui lorem cupidatat commodo. Elit sunt amet fugiat veniam occaecat fugiat aliqua. +

+
+
+ + Get started + +
+
+ + Live demo + +
+
+
+
+
+ +
+ <%= + line_chart (1..20).to_a.zip( (1..20).map { |n| (n + Math.sin(n) * -rand(n)).round } ), + library: { animation: { duration: 1400 } } + %> +
+ +
+
+
+

Everything you need

+

All-in-one report

+

+ Be a better editor with a little help from our experienced AI. Improve your story by making your own decisions using actionable data. +

+

+ It's a great way to tackle a first round of edits before using a human editor, too! +

+
+
+
+
+
+ + +

Invite team members

+
+
You can manage phone, email and chat conversations all from a single mailbox.
+
+ +
+
+ + +

List view

+
+
You can manage phone, email and chat conversations all from a single mailbox.
+
+ +
+
+ + +

Keyboard shortcuts

+
+
You can manage phone, email and chat conversations all from a single mailbox.
+
+ +
+
+ + +

Calendars

+
+
You can manage phone, email and chat conversations all from a single mailbox.
+
+ +
+
+ + +

Notifications

+
+
Find what you need with advanced filters, bulk actions, and quick views.
+
+ +
+
+ + +

Boards

+
+
Find what you need with advanced filters, bulk actions, and quick views.
+
+ +
+
+ + +

Reporting

+
+
Find what you need with advanced filters, bulk actions, and quick views.
+
+ +
+
+ + +

Mobile app

+
+
Find what you need with advanced filters, bulk actions, and quick views.
+
+
+
+
+
+ +
+
+
+
+
+
+ + + + +
+
+

Stay on top of customer support

+

Semper curabitur ullamcorper posuere nunc sed. Ornare iaculis bibendum malesuada faucibus lacinia porttitor. Pulvinar laoreet sagittis viverra duis. In venenatis sem arcu pretium pharetra at. Lectus viverra dui tellus ornare pharetra.

+
+ + See examples + +
+
+
+
+
+
+

+ “I always do a few rounds of AI editing before submitting to a human editor. Knocking out all the low-hanging fruit lets them focus on big-picture edits.” +

+
+
+
+
+ +
+
Joan Hallow, Author of XYZ
+
+
+
+
+
+
+
+ Inbox user interface +
+
+
+
+
+
+
+
+
+ + + + +
+
+

Better understand your customers

+

Semper curabitur ullamcorper posuere nunc sed. Ornare iaculis bibendum malesuada faucibus lacinia porttitor. Pulvinar laoreet sagittis viverra duis. In venenatis sem arcu pretium pharetra at. Lectus viverra dui tellus ornare pharetra.

+
+ + See examples + +
+
+
+
+
+
+ Customer profile user interface +
+
+
+
+
+ +
+
+
+

Trusted by writers from over 80 planets

+

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Repellendus repellat laudantium.

+
+
+
+
Pepperoni
+
100%
+
+
+
Delivery
+
24/7
+
+
+
Calories
+
100k+
+
+
+
+
+ + +
+
+

+ Ready to dive in? + Analyze your writing instantly. +

+
+
+ + Get started + +
+
+ + Learn more + +
+
+
+
\ No newline at end of file diff --git a/app/views/layouts/forum.html.erb b/app/views/layouts/forum.html.erb index 9a1b075e..413bf395 100644 --- a/app/views/layouts/forum.html.erb +++ b/app/views/layouts/forum.html.erb @@ -1,49 +1,330 @@ - <%= yield :thredded_page_title %> | Notebook.ai - <%= render 'layouts/common_head' %> + + <%= csrf_meta_tags %> - <%= stylesheet_link_tag 'thredded', 'data-turbolinks-track': 'reload' %> - <%= csrf_meta_tag %> - <%# javascript_include_tag :application %> - <%= javascript_include_tag 'thredded', - async: !Rails.application.config.assets.debug, - defer: true %> - <%== RailsGravatar.prefetch_dns_tag %> + <%= stylesheet_link_tag 'application', media: 'all' %> + + + + <%= render 'layouts/favicon' %> + <%= javascript_include_tag 'application' %> + <%= javascript_pack_tag 'application' %> + <%= render 'layouts/seo' %> + + + - - <%= render 'layouts/sidenav' if user_signed_in? %> - <%= render 'layouts/recent_edits_sidenav' if user_signed_in? %> - <%= render 'layouts/navbar' %> + +
+ <%= link_to root_path, class: 'flex items-center mr-2 px-6 py-4 border-b border-gray-300 shadow hover:shadow-md transition bg-white rounded-br-lg' do %> + <%= image_tag 'logos/book-small.webp', class: 'h-8 mr-3' %> + + Notebook.ai + + <% end %> -
- <%= yield :full_width_page_header %> -
-
-
- <%# todo: move these to toasts and/or make dismissable %> - <%= render 'cards/ui/alert' %> - <%= render 'cards/ui/notice' %> -
-
-
-
- <%= yield %> -
+
+ Menu +
+ + +
- <%= render 'layouts/ganalytics' %> + +
+ +
+ + +
+
+ +
+ +
+
+ <% @user_notifications.each do |notification| %> + <%= link_to main_app.notification_path(notification), class: 'flex items-center px-4 py-3 border-b hover:bg-gray-100 -mx-2' do %> + <%= notification.icon %> +
+ <%= notification.message_html.html_safe %> +
+
+ <%= time_ago_in_words notification.happened_at %> ago +
+ <% end %> + <% end %> +
+ <%= link_to main_app.mark_all_read_path, class: 'block bg-blue-100 hover:bg-blue-50 text-black text-center py-2' do %> + Mark all notifications read + <% end %> + <%= link_to main_app.notifications_path, class: 'block bg-notebook-blue hover:bg-blue-500 text-white text-center font-bold py-2' do %> + See all notifications + <% end %> +
+
+ + <%= form_tag main_app.search_path, method: :get, class: 'inline-block relative -top-2' do %> + + + <% end %> + +
+ +
+ +
+
+ <%= link_to current_user do %> + <%= image_tag current_user.image_url(size=32), class: 'rounded-full mr-2 p-1 border-2 border-notebook-blue' %> + <% end %> +
+
You're signed in as
+
+ <%= link_to current_user.display_name, current_user %> +
+
+
+ + <%= link_to current_user.profile_url, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white' do %> + <%= User.icon %> + Profile + <% end %> + <%= link_to main_app.subscription_path, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white' do %> + credit_card + Billing + + PREMIUM + + <% end %> + <%= link_to main_app.edit_user_registration_path, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white border-b border-gray-300' do %> + settings + Settings + <% end %> + <%= link_to main_app.data_vault_path, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white' do %> + lock + Data Vault + <% end %> + <%= link_to main_app.help_center_path, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white border-b border-gray-300' do %> + help + Help Center + <% end %> + <%= link_to main_app.destroy_user_session_path, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white' do %> + power_settings_new + Sign Out + <% end %> +
+
+
+
+ + + + + + + + + +
+ +
+ <%= yield %>
- <%= react_component("Footer") unless defined?(@show_footer) && !@show_footer %> - <%= render 'layouts/quick_add_fab' unless defined?(@show_footer) && !@show_footer %> - <%= render partial: 'content/keyboard_controls_help_modal' %> + + + <%# react_component("Footer") unless defined?(@show_footer) && !@show_footer %> + <%# render 'layouts/quick_add_fab' unless defined?(@show_footer) && !@show_footer %> + <%= render 'layouts/ganalytics' %> diff --git a/app/views/layouts/tailwind.html.erb b/app/views/layouts/tailwind.html.erb index 66702dad..1b38c1aa 100644 --- a/app/views/layouts/tailwind.html.erb +++ b/app/views/layouts/tailwind.html.erb @@ -49,7 +49,7 @@
<% if @universe_scope %>
- <%= link_to multiverse_path do %> + <%= link_to main_app.multiverse_path do %> @@ -61,7 +61,7 @@ <% end %>
<% else %> - <%= link_to multiverse_path, class: "px-3 py-2 inline-block text-base #{Universe.text_color} bg-purple-50 hover:bg-purple-200 rounded" do %> + <%= link_to main_app.multiverse_path, class: "px-3 py-2 inline-block text-base #{Universe.text_color} bg-purple-50 hover:bg-purple-200 rounded" do %> Choose a universe <% end %> <% end %> @@ -171,7 +171,7 @@