mirrors/notebook
3
0
Fork 0
mirror of https://github.com/indentlabs/notebook.git synced 2025-10-26 11:19:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

start on thredded-tailwind redesign & analyses homepage

Browse Source
This commit is contained in:
drusepth 2022-12-05 18:25:21 -08:00
parent 193c1a5bf3
commit 89386ef181
19 changed files with 812 additions and 414 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
Gemfile
View File

@ -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'

16
Gemfile.lock
View File

@ -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

231
app/assets/stylesheets/thredded-overrides.scss
View File

@ -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;
}

18
app/controllers/document_analyses_controller.rb
View File

@ -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?

4
app/models/documents/document_analysis.rb
View File

@ -32,4 +32,8 @@ class DocumentAnalysis < ApplicationRecord
def self.text_color
'text-orange-500'
end
def self.color
'bg-orange-500'
end
end

263
app/views/document_analyses/index.html.erb Normal file
View File

@ -0,0 +1,263 @@
<section class="bg-white pt-6 pb-16 sm:pb-24 shadow-lg mb-8">
<div class="mt-16 mx-auto max-w-7xl px-4 sm:mt-24">
<div class="text-center">
<h1 class="text-4xl tracking-tight font-extrabold text-gray-900 sm:text-5xl md:text-6xl max-w-3xl mx-auto">
<span class="block xl:inline">Start your editing off right with powerful</span>
<span class="block <%= DocumentAnalysis.text_color %> xl:inline">AI analysis</span>
</h1>
<p class="mt-3 max-w-md mx-auto text-base text-gray-500 sm:text-lg md:mt-5 md:text-xl md:max-w-3xl">
Anim aute id magna aliqua ad ad non deserunt sunt. Qui irure qui lorem cupidatat commodo. Elit sunt amet fugiat veniam occaecat fugiat aliqua.
</p>
<div class="mt-5 max-w-md mx-auto sm:flex sm:justify-center md:mt-8">
<div class="rounded-md shadow">
<a href="#" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-white <%= DocumentAnalysis.color %> hover:bg-orange-600 md:py-4 md:text-lg md:px-10">
Get started
</a>
</div>
<div class="mt-3 rounded-md shadow sm:mt-0 sm:ml-3">
<a href="#" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md <%= DocumentAnalysis.text_color %> bg-white hover:bg-orange-50 md:py-4 md:text-lg md:px-10">
Live demo
</a>
</div>
</div>
</div>
</div>
</section>
<section class="p-8 bg-blue-50 border-t border-b border-gray-200">
<%=
line_chart (1..20).to_a.zip( (1..20).map { |n| (n + Math.sin(n) * -rand(n)).round } ),
library: { animation: { duration: 1400 } }
%>
</section>
<section class="bg-white">
<div class="max-w-7xl mx-auto py-16 px-4 sm:px-6 lg:py-24 lg:px-8 lg:grid lg:grid-cols-3 lg:gap-x-8">
<div>
<h2 class="text-base font-semibold text-notebook-blue uppercase tracking-wide">Everything you need</h2>
<p class="mt-2 text-3xl font-extrabold text-gray-900">All-in-one report</p>
<p class="mt-4 text-lg text-gray-500">
Be a better editor with a little help from our experienced AI. Improve your story by making your own decisions using actionable data.
</p>
<p class="mt-4 text-lg text-gray-500">
It's a great way to tackle a first round of edits before using a human editor, too!
</p>
</div>
<div class="mt-12 lg:mt-0 lg:col-span-2">
<dl class="space-y-10 sm:space-y-0 sm:grid sm:grid-cols-2 sm:grid-rows-4 sm:grid-flow-col sm:gap-x-6 sm:gap-y-10 lg:gap-x-8">
<div class="relative">
<dt>
<!-- Heroicon name: outline/check -->
<svg class="absolute h-6 w-6 text-green-500" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<p class="ml-9 text-lg leading-6 font-medium text-gray-900">Invite team members</p>
</dt>
<dd class="mt-2 ml-9 text-base text-gray-500">You can manage phone, email and chat conversations all from a single mailbox.</dd>
</div>
<div class="relative">
<dt>
<!-- Heroicon name: outline/check -->
<svg class="absolute h-6 w-6 text-green-500" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<p class="ml-9 text-lg leading-6 font-medium text-gray-900">List view</p>
</dt>
<dd class="mt-2 ml-9 text-base text-gray-500">You can manage phone, email and chat conversations all from a single mailbox.</dd>
</div>
<div class="relative">
<dt>
<!-- Heroicon name: outline/check -->
<svg class="absolute h-6 w-6 text-green-500" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<p class="ml-9 text-lg leading-6 font-medium text-gray-900">Keyboard shortcuts</p>
</dt>
<dd class="mt-2 ml-9 text-base text-gray-500">You can manage phone, email and chat conversations all from a single mailbox.</dd>
</div>
<div class="relative">
<dt>
<!-- Heroicon name: outline/check -->
<svg class="absolute h-6 w-6 text-green-500" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<p class="ml-9 text-lg leading-6 font-medium text-gray-900">Calendars</p>
</dt>
<dd class="mt-2 ml-9 text-base text-gray-500">You can manage phone, email and chat conversations all from a single mailbox.</dd>
</div>
<div class="relative">
<dt>
<!-- Heroicon name: outline/check -->
<svg class="absolute h-6 w-6 text-green-500" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<p class="ml-9 text-lg leading-6 font-medium text-gray-900">Notifications</p>
</dt>
<dd class="mt-2 ml-9 text-base text-gray-500">Find what you need with advanced filters, bulk actions, and quick views.</dd>
</div>
<div class="relative">
<dt>
<!-- Heroicon name: outline/check -->
<svg class="absolute h-6 w-6 text-green-500" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<p class="ml-9 text-lg leading-6 font-medium text-gray-900">Boards</p>
</dt>
<dd class="mt-2 ml-9 text-base text-gray-500">Find what you need with advanced filters, bulk actions, and quick views.</dd>
</div>
<div class="relative">
<dt>
<!-- Heroicon name: outline/check -->
<svg class="absolute h-6 w-6 text-green-500" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<p class="ml-9 text-lg leading-6 font-medium text-gray-900">Reporting</p>
</dt>
<dd class="mt-2 ml-9 text-base text-gray-500">Find what you need with advanced filters, bulk actions, and quick views.</dd>
</div>
<div class="relative">
<dt>
<!-- Heroicon name: outline/check -->
<svg class="absolute h-6 w-6 text-green-500" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<p class="ml-9 text-lg leading-6 font-medium text-gray-900">Mobile app</p>
</dt>
<dd class="mt-2 ml-9 text-base text-gray-500">Find what you need with advanced filters, bulk actions, and quick views.</dd>
</div>
</dl>
</div>
</div>
</section>
<section class="relative bg-white pt-16 pb-32 overflow-hidden">
<div class="relative">
<div class="lg:mx-auto lg:max-w-7xl lg:px-8 lg:grid lg:grid-cols-2 lg:grid-flow-col-dense lg:gap-24">
<div class="px-4 max-w-xl mx-auto sm:px-6 lg:py-16 lg:max-w-none lg:mx-0 lg:px-0">
<div>
<div>
<span class="h-12 w-12 rounded-md flex items-center justify-center <%= DocumentAnalysis.color %>">
<!-- Heroicon name: outline/inbox -->
<svg class="h-6 w-6 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4" />
</svg>
</span>
</div>
<div class="mt-6">
<h2 class="text-3xl font-extrabold tracking-tight text-gray-900">Stay on top of customer support</h2>
<p class="mt-4 text-lg text-gray-500">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.</p>
<div class="mt-6 ml-3 inline-flex rounded-md shadow">
<a href="#" class="inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md <%= DocumentAnalysis.text_color %> bg-white hover:bg-orange-50">
See examples
</a>
</div>
</div>
</div>
<div class="mt-8 border-t border-gray-200 pt-6">
<blockquote>
<div>
<p class="text-base text-gray-500">
&ldquo;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.&rdquo;
</p>
</div>
<footer class="mt-3">
<div class="flex items-center space-x-3">
<div class="flex-shrink-0">
<img class="h-6 w-6 rounded-full" src="https://images.unsplash.com/photo-1509783236416-c9ad59bae472?ixlib=rb-=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=8&w=1024&h=1024&q=80" alt="">
</div>
<div class="text-base font-medium text-gray-700">Joan Hallow, Author of XYZ</div>
</div>
</footer>
</blockquote>
</div>
</div>
<div class="mt-12 sm:mt-16 lg:mt-0">
<div class="pl-4 -mr-48 sm:pl-6 md:-mr-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
<img class="w-full rounded-xl shadow-xl ring-1 ring-black ring-opacity-5 lg:absolute lg:left-0 lg:h-full lg:w-auto lg:max-w-none" src="https://tailwindui.com/img/component-images/inbox-app-screenshot-1.jpg" alt="Inbox user interface">
</div>
</div>
</div>
</div>
<div class="mt-24">
<div class="lg:mx-auto lg:max-w-7xl lg:px-8 lg:grid lg:grid-cols-2 lg:grid-flow-col-dense lg:gap-24">
<div class="px-4 max-w-xl mx-auto sm:px-6 lg:py-32 lg:max-w-none lg:mx-0 lg:px-0 lg:col-start-2">
<div>
<div>
<span class="h-12 w-12 rounded-md flex items-center justify-center <%= DocumentAnalysis.color %>">
<!-- Heroicon name: outline/sparkles -->
<svg class="h-6 w-6 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 3v4M3 5h4M6 17v4m-2-2h4m5-16l2.286 6.857L21 12l-5.714 2.143L13 21l-2.286-6.857L5 12l5.714-2.143L13 3z" />
</svg>
</span>
</div>
<div class="mt-6">
<h2 class="text-3xl font-extrabold tracking-tight text-gray-900">Better understand your customers</h2>
<p class="mt-4 text-lg text-gray-500">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.</p>
<div class="mt-6 ml-3 inline-flex rounded-md shadow">
<a href="#" class="inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md <%= DocumentAnalysis.text_color %> bg-white hover:bg-orange-50">
See examples
</a>
</div>
</div>
</div>
</div>
<div class="mt-12 sm:mt-16 lg:mt-0 lg:col-start-1">
<div class="pr-4 -ml-48 sm:pr-6 md:-ml-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
<img class="w-full rounded-xl shadow-xl ring-1 ring-black ring-opacity-5 lg:absolute lg:right-0 lg:h-full lg:w-auto lg:max-w-none" src="https://tailwindui.com/img/component-images/inbox-app-screenshot-2.jpg" alt="Customer profile user interface">
</div>
</div>
</div>
</div>
</section>
<div class="bg-notebook-blue">
<div class="max-w-7xl mx-auto py-12 px-4 sm:py-16 sm:px-6 lg:px-8 lg:py-20">
<div class="max-w-4xl mx-auto text-center">
<h2 class="text-3xl font-extrabold text-white sm:text-4xl">Trusted by writers from over 80 planets</h2>
<p class="mt-3 text-xl text-indigo-200 sm:mt-4">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Repellendus repellat laudantium.</p>
</div>
<dl class="mt-10 text-center sm:max-w-3xl sm:mx-auto sm:grid sm:grid-cols-3 sm:gap-8">
<div class="flex flex-col">
<dt class="order-2 mt-2 text-lg leading-6 font-medium text-indigo-200">Pepperoni</dt>
<dd class="order-1 text-5xl font-extrabold text-white">100%</dd>
</div>
<div class="flex flex-col mt-10 sm:mt-0">
<dt class="order-2 mt-2 text-lg leading-6 font-medium text-indigo-200">Delivery</dt>
<dd class="order-1 text-5xl font-extrabold text-white">24/7</dd>
</div>
<div class="flex flex-col mt-10 sm:mt-0">
<dt class="order-2 mt-2 text-lg leading-6 font-medium text-indigo-200">Calories</dt>
<dd class="order-1 text-5xl font-extrabold text-white">100k+</dd>
</div>
</dl>
</div>
</div>
<section class="bg-gray-50">
<div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:py-16 lg:px-8 lg:flex lg:items-center lg:justify-between">
<h2 class="text-3xl font-extrabold tracking-tight text-gray-900 sm:text-4xl">
<span class="block">Ready to dive in?</span>
<span class="block <%= DocumentAnalysis.text_color %>">Analyze your writing instantly.</span>
</h2>
<div class="mt-8 flex lg:mt-0 lg:flex-shrink-0">
<div class="inline-flex rounded-md shadow">
<a href="#" class="inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-white <%= DocumentAnalysis.color %> hover:bg-orange-600">
Get started
</a>
</div>
<div class="ml-3 inline-flex rounded-md shadow">
<a href="#" class="inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md <%= DocumentAnalysis.text_color %> bg-white hover:bg-orange-50">
Learn more
</a>
</div>
</div>
</div>
</section>

345
app/views/layouts/forum.html.erb
View File

@ -1,49 +1,330 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title><%= yield :thredded_page_title %> | Notebook.ai</title>
<%= render 'layouts/common_head' %>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<%= 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' %>
<!--
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" integrity="sha256-rByPlHULObEjJ6XQxW/flG2r+22R5dKiAoef+aXWfik=" crossorigin="anonymous" />
-->
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<%= render 'layouts/favicon' %>
<%= javascript_include_tag 'application' %>
<%= javascript_pack_tag 'application' %>
<%= render 'layouts/seo' %>
<!-- todo mirror this in-repo? -->
<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
</head>
<body data-in-app="true" class="<%= 'has-fixed-sidenav' if user_signed_in? %> <%= 'dark' if user_signed_in? && current_user.dark_mode_enabled? %>">
<%= render 'layouts/sidenav' if user_signed_in? %>
<%= render 'layouts/recent_edits_sidenav' if user_signed_in? %>
<%= render 'layouts/navbar' %>
<body data-in-app="true"
class="<%= controller_name %> <%= action_name %> <%= 'dark' if user_signed_in? && current_user.dark_mode_enabled? %>"
x-data="{ showSidebar: true }"
>
<header class="flex sticky top-0 z-50 w-full bg-notebook-blue border-b border-blue-400 h-14 shadow">
<%= 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' %>
<span class="text-2xl font-bold text-notebook-blue tracking-wide">
Notebook.ai
</span>
<% end %>
<main>
<%= yield :full_width_page_header %>
<div class="container-fluid">
<div class="row">
<div class="col s12">
<%# todo: move these to toasts and/or make dismissable %>
<%= render 'cards/ui/alert' %>
<%= render 'cards/ui/notice' %>
</div>
</div>
<div class="row">
<div class="col s12">
<%= yield %>
</div>
<div x-cloak x-show="!showSidebar">
<span class="sr-only">Menu</span>
<div @click.stop="showSidebar = true" class="mt-2 mr-1 p-1 border-2 border-notebook-blue hover:border-blue-200 rounded-full">
<svg class="w-6 h-6 text-white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z" clip-rule="evenodd" />
</svg>
</div>
</div>
<%= render 'layouts/ganalytics' %>
<!-- left-hand side of navbar -->
<div class="flex-grow pt-2 pl-1">
<!-- no universe picker on the forums -->
</div>
<!-- right-hand side of navbar -->
<div class="pr-2">
<div x-data="{ notificationsDropdownOpen: false }" class="inline-block mt-2.5 mr-2">
<button @click="notificationsDropdownOpen = !notificationsDropdownOpen" class="z-10 block p-1 border-2 border-notebook-blue hover:border-blue-200 rounded-full">
<svg class="h-6 w-6 <%= @user_notifications.reject { |n| n.viewed_at? }.any? ? 'text-white' : 'text-blue-300' %>" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
<path d="M10 2a6 6 0 00-6 6v3.586l-.707.707A1 1 0 004 14h12a1 1 0 00.707-1.707L16 11.586V8a6 6 0 00-6-6zM10 18a3 3 0 01-3-3h6a3 3 0 01-3 3z" />
</svg>
</button>
<div x-show="notificationsDropdownOpen" @click="notificationsDropdownOpen = false" class="fixed inset-0 h-full w-full z-10"></div>
<div x-show="notificationsDropdownOpen" class="absolute right-8 bg-white rounded-md shadow-lg overflow-hidden z-20 w-2/5">
<div class="pt-2">
<% @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 %>
<i class="material-icons bg-<%= notification.icon_color %>-500 text-white rounded-full p-1 h-8 w-8 mx-1"><%= notification.icon %></i>
<div class="text-black text-sm mx-2 flex-grow <%= 'font-bold' unless notification.viewed_at? %>">
<%= notification.message_html.html_safe %>
</div>
<div class="text-gray-400 text-xs">
<%= time_ago_in_words notification.happened_at %> ago
</div>
<% end %>
<% end %>
</div>
<%= 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 %>
</div>
</div>
<%= form_tag main_app.search_path, method: :get, class: 'inline-block relative -top-2' do %>
<input class="w-96 border-2 border-blue-400 text-notebook-blue focus:border-notebook-blue bg-white h-10 px-3 text-sm rounded focus:outline-none"
type="search" name="q" placeholder="Search discussions">
<!--
<button type="submit" class="relative right-8 top-0.5 mt-4 mr-4">
<svg class="text-gray-600 hover:text-notebook-blue h-4 w-4 fill-current" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px"
viewBox="0 0 56.966 56.966" style="enable-background:new 0 0 56.966 56.966;" xml:space="preserve"
width="512px" height="512px">
<path
d="M55.146,51.887L41.588,37.786c3.486-4.144,5.396-9.358,5.396-14.786c0-12.682-10.318-23-23-23s-23,10.318-23,23 s10.318,23,23,23c4.761,0,9.298-1.436,13.177-4.162l13.661,14.208c0.571,0.593,1.339,0.92,2.162,0.92 c0.779,0,1.518-0.297,2.079-0.837C56.255,54.982,56.293,53.08,55.146,51.887z M23.984,6c9.374,0,17,7.626,17,17s-7.626,17-17,17 s-17-7.626-17-17S14.61,6,23.984,6z" />
</svg>
</button>
-->
<% end %>
<div x-data="{ accountDropdownOpen: false }" class="inline-block mt-2.5">
<button @click="accountDropdownOpen = !accountDropdownOpen" class="z-10 block p-1 border-2 border-notebook-blue hover:border-blue-200 rounded-full">
<%= image_tag current_user.image_url(size=26), class: 'rounded-full' %>
</button>
<div x-show="accountDropdownOpen" @click="accountDropdownOpen = false" class="fixed inset-0 h-full w-full z-10"></div>
<div x-show="accountDropdownOpen" class="absolute right-2 bg-white rounded-md shadow-lg overflow-hidden z-20 w-64">
<div class="flex my-2 pt-4 pb-6 px-4 border-b border-gray-300 shadow">
<%= 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 %>
<div>
<div class="text-xs text-gray-500">You're signed in as</div>
<div class="text-sm <%= User.text_color %> font-bold">
<%= link_to current_user.display_name, current_user %>
</div>
</div>
</div>
<%= 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 %>
<i class="material-icons <%= User.text_color %> shrink-0 w-8 h-8 mr-2 bg-white rounded-full p-1"><%= User.icon %></i>
<span class="flex-grow text-sm">Profile</span>
<% 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 %>
<i class="material-icons text-notebook-blue shrink-0 w-8 h-8 mr-2 bg-white rounded-full p-1">credit_card</i>
<span class="flex-grow text-sm">Billing</span>
<span class="bg-notebook-blue text-white rounded px-1 text-xs group-hover:bg-notebook-blue">
PREMIUM
</span>
<% 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 %>
<i class="material-icons text-black shrink-0 w-8 h-8 mr-2 bg-white rounded-full p-1">settings</i>
<span class="flex-grow text-sm">Settings</span>
<% 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 %>
<i class="material-icons text-brown-600 shrink-0 w-8 h-8 mr-2 bg-white rounded-full p-1">lock</i>
<span class="flex-grow text-sm">Data Vault</span>
<% 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 %>
<i class="material-icons text-pink-400 shrink-0 w-8 h-8 mr-2 bg-white rounded-full p-1">help</i>
<span class="flex-grow text-sm">Help Center</span>
<% 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 %>
<i class="material-icons text-black shrink-0 w-8 h-8 mr-2 bg-white rounded-full p-1">power_settings_new</i>
<span class="flex-grow text-sm">Sign Out</span>
<% end %>
</div>
</div>
</div>
</header>
<!-- sidebar -->
<!-- todo put this in shared partial with real design -->
<nav x-show="showSidebar" class="fixed top-0 pt-16 flex flex-col left-0 z-20 h-screen overflow-x-hidden transition origin-left transform bg-white border-r w-56 md:translate-x-0" :class="{ '-translate-x-full' : !showSidebar, 'translate-x-0' : showSidebar }" <%# @click.away="showSidebar = false" %>>
<nav class="text-sm font-medium text-gray-600 pt-1 overflow-y-auto flex-grow border-b border-gray-300 shadow" aria-label="Main Navigation">
<!--
<%= link_to main_app.table_of_contents_path, class: 'flex items-center px-2 py-3 transition cursor-pointer group hover:bg-gray-100' do %>
<i class="material-icons text-gray-400 shrink-0 w-6 h-6 mr-2 <%= Universe.text_color %>">dashboard</i>
<span class="group-hover:text-gray-900">Table of Contents</span>
<% end %>
-->
<div x-data="{ expandedWorldbuildingSidebar: false }">
<div class="flex items-center justify-between px-2 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900" role="button" @click="expandedWorldbuildingSidebar = !expandedWorldbuildingSidebar" >
<div class="flex items-center">
<i class="material-icons text-notebook-blue shrink-0 w-6 h-6 mr-2">book</i>
<span>Worldbuilding</span>
</div>
<svg :class="{ 'rotate-90': expandedWorldbuildingSidebar }" class="shrink-0 w-4 h-4 ml-2 transition transform" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd" />
</svg>
</div>
<div x-show="expandedWorldbuildingSidebar" x-cloak class="mb-1 pl-1">
<% @activated_content_types.each do |content_type| %>
<% content_type_klass = content_class_from_name(content_type) %>
<%= link_to main_app.polymorphic_path(content_type_klass), class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white rounded-l-full' do %>
<i class="material-icons <%= content_type_klass.text_color %> shrink-0 w-6 h-6 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full"><%= content_type_klass.icon %></i>
<span class="flex-grow text-sm"><%= content_type.pluralize %></span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:bg-notebook-blue">
<%= number_with_delimiter @current_user_content.fetch(content_type, []).count %>
</span>
<% end %>
<% end %>
</div>
</div>
<div x-data="{ expandedWritingSidebar: false }">
<div class="flex items-center justify-between px-2 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900" role="button" @click="expandedWritingSidebar = !expandedWritingSidebar" >
<div class="flex items-center">
<i class="material-icons text-notebook-blue shrink-0 w-6 h-6 mr-2">book</i>
<span>Writing</span>
</div>
<svg :class="{ 'rotate-90': expandedWritingSidebar }" class="shrink-0 w-4 h-4 ml-2 transition transform" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd" />
</svg>
</div>
<div x-show="expandedWritingSidebar" x-cloak class="pl-1 mb-2">
<%= link_to main_app.prompts_path, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white rounded-l-full' do %>
<i class="material-icons text-orange-400 shrink-0 w-6 h-6 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full">lightbulb</i>
<span class="flex-grow text-sm">Prompts</span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:bg-notebook-blue">
0
</span>
<% end %>
<%= link_to main_app.timelines_path, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white rounded-l-full' do %>
<i class="material-icons <%= Timeline.text_color %> shrink-0 w-6 h-6 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full"><%= Timeline.icon %></i>
<span class="flex-grow text-sm">Timelines</span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:bg-notebook-blue">
0
</span>
<% end %>
<%= link_to main_app.documents_path, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white rounded-l-full' do %>
<i class="material-icons <%= Document.text_color %> shrink-0 w-6 h-6 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full"><%= Document.icon %></i>
<span class="flex-grow text-sm">Documents</span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:bg-notebook-blue">
0
</span>
<% end %>
<%= link_to '#new-analysis-onboarding', class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white rounded-l-full' do %>
<i class="material-icons <%= DocumentAnalysis.text_color %> shrink-0 w-6 h-6 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full"><%= DocumentAnalysis.icon %></i>
<span class="flex-grow text-sm">Analysis</span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:bg-notebook-blue">
0
</span>
<% end %>
</div>
</div>
<div x-data="{ expandedWritingSidebar: false }">
<div class="flex items-center justify-between px-2 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900" role="button" @click="expandedWritingSidebar = !expandedWritingSidebar" >
<div class="flex items-center">
<i class="material-icons text-notebook-blue shrink-0 w-6 h-6 mr-2">book</i>
<span>Community</span>
</div>
<svg :class="{ 'rotate-90': expandedWritingSidebar }" class="shrink-0 w-4 h-4 ml-2 transition transform" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd" />
</svg>
</div>
<div x-show="expandedWritingSidebar" x-cloak class="pl-1 mb-2">
<%= link_to main_app.stream_path, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white rounded-l-full' do %>
<i class="material-icons text-purple-400 shrink-0 w-6 h-6 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full">ballot</i>
<span class="flex-grow text-sm">Activity</span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:bg-notebook-blue">
0
</span>
<% end %>
<%= link_to main_app.page_collections_path, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white rounded-l-full' do %>
<i class="material-icons <%= PageCollection.text_color %> shrink-0 w-6 h-6 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full"><%= PageCollection.icon %></i>
<span class="flex-grow text-sm">Collections</span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:bg-notebook-blue">
0
</span>
<% end %>
<%= link_to main_app.thredded_path, class: 'flex items-center px-4 py-2 cursor-pointer group hover:bg-notebook-blue hover:text-white rounded-l-full' do %>
<i class="material-icons text-blue-500 shrink-0 w-6 h-6 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full">forum</i>
<span class="flex-grow text-sm">Discussions</span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:bg-notebook-blue">
0
</span>
<% end %>
</div>
</div>
</nav>
<div @click="showSidebar = false" class="flex items-center px-4 py-1 cursor-pointer group hover:bg-notebook-blue hover:text-white">
<i class="material-icons text-blue-500 shrink-0 w-6 h-6 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full p-1">arrow_left</i>
<span class="flex-grow text-sm">Hide Sidebar</span>
</div>
</nav>
<!-- forum navigation breadcrumbs -->
<nav class="bg-white border-b border-gray-200 flex" aria-label="Breadcrumb">
<ol role="list" class="max-w-screen-xl w-full mx-auto px-4 flex space-x-4 sm:px-6 lg:px-8">
<%= render('thredded/redesigned/breadcrumbs') %>
</ol>
</nav>
<!-- sidebar backdrop on mobile -->
<div class="fixed inset-0 z-10 w-screen h-screen bg-black bg-opacity-25 md:hidden" x-show.transition="showSidebar" x-cloak></div>
<main :class="{ 'ml-56': showSidebar }">
<%= yield %>
</main>
<%= 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' %>
<footer :class="{ 'ml-56': showSidebar }">
<div class="max-w-7xl mx-auto pt-24 px-4 sm:px-6 md:flex md:items-center md:justify-between lg:px-8">
<div class="flex justify-center space-x-6 md:order-2">
<%= link_to 'https://www.facebook.com/notebookai/', class: 'text-gray-400 hover:text-gray-500' do %>
<span class="sr-only">Facebook</span>
<svg class="h-6 w-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path fill-rule="evenodd" d="M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z" clip-rule="evenodd" />
</svg>
<% end %>
<%= link_to 'https://twitter.com/indentlabs', class: 'text-gray-400 hover:text-gray-500' do %>
<span class="sr-only">Twitter</span>
<svg class="h-6 w-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84" />
</svg>
<% end %>
<%= link_to 'https://github.com/indentlabs/notebook', class: 'text-gray-400 hover:text-gray-500' do %>
<span class="sr-only">GitHub</span>
<svg class="h-6 w-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd" />
</svg>
<% end %>
</div>
<div class="mt-8 md:mt-0 md:order-1">
<p class="text-center text-base text-gray-400">Notebook.ai &copy; 2016-2022 Indent Labs, LLC</p>
</div>
</div>
</footer>
<%# react_component("Footer") unless defined?(@show_footer) && !@show_footer %>
<%# render 'layouts/quick_add_fab' unless defined?(@show_footer) && !@show_footer %>
<script type="text/javascript">
<%= yield :javascript %>
<% if user_signed_in? %>
DISABLE_KEYBOARD_SHORTCUTS = <%= !current_user.keyboard_shortcuts_preference %>;
<% end %>
$(document).ready(function() {
<%= yield :javascript %>
});
</script>
<%= render 'layouts/ganalytics' %>
</body>
</html>

6
app/views/layouts/tailwind.html.erb
View File

@ -49,7 +49,7 @@
<div class="flex-grow pt-2 pl-1">
<% if @universe_scope %>
<div class="inline-flex rounded-md shadow-sm mt-0.5" role="group">
<%= link_to multiverse_path do %>
<%= link_to main_app.multiverse_path do %>
<button type="button" class="px-2 h-9 text-white <%= Universe.color %> rounded-l-lg border border-purple-800 hover:bg-purple-500 focus:z-10 focus:ring-2 focus:ring-purple-700 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:hover:text-white dark:hover:bg-gray-600 dark:focus:ring-blue-500 dark:focus:text-white">
<i class="material-icons text-2xl"><%= Universe.icon %></i>
</button>
@ -61,7 +61,7 @@
<% end %>
</div>
<% 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 @@
<nav x-show="showSidebar" class="fixed top-0 pt-16 flex flex-col left-0 z-20 h-screen overflow-x-hidden transition origin-left transform bg-white border-r w-56 md:translate-x-0" :class="{ '-translate-x-full' : !showSidebar, 'translate-x-0' : showSidebar }" <%# @click.away="showSidebar = false" %>>
<nav class="text-sm font-medium text-gray-600 pt-1 overflow-y-auto flex-grow border-b border-gray-300 shadow" aria-label="Main Navigation">
<!--
<%= link_to table_of_contents_path, class: 'flex items-center px-2 py-3 transition cursor-pointer group hover:bg-gray-100' do %>
<%= link_to main_app.table_of_contents_path, class: 'flex items-center px-2 py-3 transition cursor-pointer group hover:bg-gray-100' do %>
<i class="material-icons text-gray-400 shrink-0 w-6 h-6 mr-2 <%= Universe.text_color %>">dashboard</i>
<span class="group-hover:text-gray-900">Table of Contents</span>
<% end %>

14
app/views/thredded/posts/_post.html.erb
View File

@ -3,20 +3,18 @@
blocked_post = user_signed_in? && post.user.present? && post.user.blocked_by?(current_user)
%>
<% if blocked_post %>
<div class='grey-text text-lighten-2'>
<em class="tooltipped" data-tooltip="This message is hidden because you've blocked the user it's from.">1 message hidden.</em>
</div>
<% else %>
<% unless blocked_post %>
<%
common_post_classes = 'p-4'
unmuted_post_classes = 'bg-white rounded shadow' + ' ' + common_post_classes
muted_post_classes = '' + ' ' + common_post_classes
# Mute the post if it's one line that starts with ( and ends with )
muted_post = post.present? && post.to_model.content.split("\n").reject(&:empty?).all? { |paragraph| paragraph.strip.start_with?('(') && paragraph.strip.end_with?(')') }
muted_post_classes = 'muted-thredded-post'
%>
<%= render 'thredded/posts_common/before_first_unread_post', post: post if post.first_unread_in_page? %>
<%= content_tag :article, id: dom_id(post), class: "thredded--post thredded--#{post.read_state}--post #{muted_post ? muted_post_classes : 'card'}" do %>
<%= content_tag :article, id: dom_id(post), class: "thredded--post thredded--#{post.read_state}--post #{muted_post ? muted_post_classes : unmuted_post_classes}" do %>
<%= render 'thredded/posts_common/actions', post: post, actions: local_assigns[:actions] %>
<%= render 'thredded/posts_common/header', post: post %>
<%= ForumReplacementService.replace_for(content, current_user) || render('thredded/posts/content', post: post) %>

12
app/views/thredded/posts_common/_header.html.erb
View File

@ -1,5 +1,15 @@
<header>
<%= image_tag post.avatar_url, class: 'thredded--post--avatar' if post.user %>
<div>
<%= image_tag post.avatar_url, class: 'thredded--post--avatar mt-8' if post.user %>
<%# TODO add moderator badge to avatar instead of next to name %>
<% if false && post.user.forum_moderator? %>
<i class="material-icons tooltipped float-left text-notebook-blue" data-tooltip="Forum Moderator" style="position: relative; top: 2px">
health_and_safety
</i>
<% end %>
</div>
<h2 class="thredded--post--user"><%= user_link post.user %></h2>
<a href="<%= post.permalink_path %>" rel="nofollow" class="thredded--link thredded--post--created-at right">
<%= time_ago post.created_at %>

19
app/views/thredded/redesigned/_breadcrumbs.html.erb Normal file
View File

@ -0,0 +1,19 @@
<li class="flex">
<div class="flex items-center">
<%= link_to main_app.thredded_path, class: 'text-gray-400 hover:text-blue-500' do %>
<i class="material-icons flex-shrink-0 relative top-2">forum</i>
<span class="sr-only">Home</span>
<% end %>
</div>
</li>
<% if messageboard_or_nil.try(:persisted?) %>
<li class="flex">
<div class="flex items-center">
<svg class="flex-shrink-0 w-6 h-full text-gray-200" viewBox="0 0 24 44" preserveAspectRatio="none" fill="currentColor" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
<path d="M.293 0l22 22-22 22h1.414l22-22-22-22H.293z" />
</svg>
<%= link_to messageboard.name, messageboard_topics_path(messageboard), class: 'ml-4 text-sm font-medium text-gray-500 hover:text-blue-500' %>
</div>
</li>
<% end %>

1
app/views/thredded/search/_form.html.erb Normal file
View File

@ -0,0 +1 @@
<!-- Intentionally left blank because we don't want to show search on the forums -->

4
app/views/thredded/shared/_nav.html.erb
View File

@ -1,6 +1,4 @@
<%= yield :thredded_breadcrumbs %>
<nav class="thredded--navigation">
<nav class="thredded--navigation -mt-8 mb-8">
<ul class="thredded--user-navigation<%= ' thredded--user-navigation-standalone' if Thredded.standalone_layout? %>">
<%= render 'thredded/shared/nav/moderation' %>
<%= render 'thredded/shared/nav/notification_preferences', messageboard: messageboard_or_nil %>

22
app/views/thredded/topics/_followers.html.erb
View File

@ -1,16 +1,20 @@
<% if Thredded.show_topic_followers %>
<div class="thredded--topic-followers">
<div class="text-gray-400 font-medium uppercase pt-4">
<i class="material-icons float-left text-sm mr-1">people_alt</i>
<%= pluralize topic.followers.count, 'follower' %>
</div>
<% if topic.followers.present? %>
<%# t('thredded.topics.followed_by') %>
<span class="tooltipped" data-tooltip="<%= pluralize topic.followers.count, 'person' %> will be notified of any updates to this thread." data-position="right">
<i class="material-icons tiny" style="position: relative; top: 2px;">people_alt</i>
<%= pluralize topic.followers.count, 'follower' %>
</span>
<%# topic.followers.each do |user| %>
<%#= user_link(user) %>
<%# end %>
<ul class="divide-y">
<% topic.followers.each do |user| %>
<li class="text-xs py-1">
<%= link_to user.display_name, user, class: User.text_color %>
</li>
<% end %>
</ul>
<% else %>
<%= t('thredded.topics.followed_by_noone')%>
<% end %>
</div>
<% end %>
<% end %>

142
app/views/thredded/topics/_header.html.erb
View File

@ -1,68 +1,92 @@
<header class="thredded--topic-header">
<%= view_hooks.topic_page.title.render self, topic: topic do %>
<h1 class="thredded--topic-header--title">
<i class="material-icons left blue-text">forum</i>
<%= topic.title %>
<div>
<small>
<cite class="thredded--topic-header--started-by">
<%= t 'thredded.topics.started_by_html',
time_ago: time_ago(topic.created_at),
user: user_link(topic.user) %>
</cite>
</small>
</div>
<div class="thredded--post--dropdown">
<i class="material-icons thredded--post--dropdown--toggle">tune</i>
<div class="thredded--post--dropdown--actions">
<% if topic.can_update? %>
<%= link_to t('thredded.topics.edit'), topic.edit_path,
class: 'thredded--post--dropdown--actions--item',
rel: 'nofollow' %>
<% end %>
<% if user_signed_in? && params.key?(:id) %>
<%= link_to main_app.documentize_topic_path(params[:id]), class: 'thredded--post--dropdown--actions--item' do %>
Export to document
<% end %>
<%= link_to main_app.plaintext_topic_path(params[:id]), class: 'thredded--post--dropdown--actions--item', rel: 'nofollow' do %>
View as plaintext
<% end %>
<%= link_to main_app.irc_log_topic_path(params[:id]), class: 'thredded--post--dropdown--actions--item', rel: 'nofollow' do %>
View as chat log
<% end %>
<% end %>
<% if topic.can_destroy? %>
<div class="thredded--topic-delete--wrapper">
<%= button_to t('thredded.topics.delete_topic'), topic.destroy_path, method: :delete,
form_class: 'thredded--topic-delete-form',
class: 'thredded--button thredded--post--dropdown--actions--item',
'data-confirm' => t('thredded.topics.delete_confirm') %>
</div>
<% end %>
</div>
</div>
</h1>
<% end %>
<% if thredded_current_user %>
<% if topic.followed? %>
<div class="thredded--topic-header--follow-info">
<span class="thredded--topic-header--follow-info--reason">
<%= topic_follow_reason_text topic.follow_reason %>
</span>
<%= button_to topic.unfollow_path, form: {class: 'thredded--topic-header--follow-info--unfollow'} do %>
<%= t('thredded.topics.unfollow') %>
<%= inline_svg_tag 'thredded/follow.svg', class: 'thredded--topic-header--follow-icon' %>
<div class="thredded--topic-header--started-by">
<div class="bg-blue-100 text-black p-2 my-2 ml-1 text-sm">
<i class="material-icons text-blue-500 float-left mr-2">forum</i>
<div>by <%= link_to topic.user.display_name, topic.user %></div>
</div>
</div>
<% if thredded_current_user %>
<% if topic.followed? %>
<div class="thredded--topic-header--follow-info w-full">
<div class="thredded--topic-header--follow-info--reason block">
<%=
button_to topic.unfollow_path,
form: {
class: 'thredded--topic-header--follow-info--unfollow ' +
'w-full bg-blue-400 hover:bg-blue-500 cursor-pointer rounded py-2 mb-2 text-center'
} do
%>
<span class="text-white">
<%= t('thredded.topics.unfollow') %>
<%= inline_svg_tag 'thredded/follow.svg', class: 'thredded--topic-header--follow-icon' %>
</span>
<% end %>
<p class="text-xs text-left">
<%= topic_follow_reason_text topic.follow_reason %>
</p>
</div>
</div>
<% else %>
<div class="thredded--topic-header--follow-info w-full">
<%=
button_to topic.follow_path,
form: {
class: 'thredded--topic-header--follow-info--follow ' +
'w-full bg-blue-400 hover:bg-blue-500 cursor-pointer rounded py-2 mb-2 text-center'
} do
%>
<span class="text-white">
<%= t('thredded.topics.follow') %>
<%= inline_svg_tag 'thredded/follow.svg', class: 'thredded--topic-header--follow-icon' %>
</span>
<% end %>
</div>
<% end %>
<% end %>
<div class="clear-both">
<%= render partial: 'thredded/topics/followers', locals: {topic: topic} %>
</div>
<div class="mt-32">thread actions todo</div>
<div class="thredded--post--dropdown">
<i class="material-icons thredded--post--dropdown--toggle">tune</i>
<div class="thredded--post--dropdown--actions">
<% if topic.can_update? %>
<%= link_to t('thredded.topics.edit'), topic.edit_path,
class: 'thredded--post--dropdown--actions--item',
rel: 'nofollow' %>
<% end %>
<% if user_signed_in? && params.key?(:id) %>
<%= link_to main_app.documentize_topic_path(params[:id]), class: 'thredded--post--dropdown--actions--item' do %>
Export to document
<% end %>
<%= link_to main_app.plaintext_topic_path(params[:id]), class: 'thredded--post--dropdown--actions--item', rel: 'nofollow' do %>
View as plaintext
<% end %>
<%= link_to main_app.irc_log_topic_path(params[:id]), class: 'thredded--post--dropdown--actions--item', rel: 'nofollow' do %>
View as chat log
<% end %>
<% end %>
<% if topic.can_destroy? %>
<div class="thredded--topic-delete--wrapper">
<%= button_to t('thredded.topics.delete_topic'), topic.destroy_path, method: :delete,
form_class: 'thredded--topic-delete-form',
class: 'thredded--button thredded--post--dropdown--actions--item',
'data-confirm' => t('thredded.topics.delete_confirm') %>
</div>
<% end %>
</div>
<% else %>
<div class="thredded--topic-header--follow-info">
<%= button_to t('thredded.topics.follow'), topic.follow_path,
form: {class: 'thredded--topic-header--follow-info--follow'} %>
</div>
<% end %>
</div>
<% end %>
<%= render partial: 'thredded/topics/followers', locals: {topic: topic} %>
</header>

94
app/views/thredded/topics/show.html.erb
View File

@ -1,41 +1,59 @@
<% topic = @posts.topic %>
<% content_for :thredded_page_title, topic.title %>
<% content_for :thredded_page_id, 'thredded--topic-show' %>
<% content_for :thredded_breadcrumbs, render('thredded/shared/breadcrumbs') %>
<%= thredded_page do %>
<%= content_tag :section,
id: dom_id(topic),
class: ['thredded--main-section', 'thredded--topic', *topic_css_classes(topic)] do %>
<%= render 'thredded/topics/header', topic: topic %>
<%= view_hooks.posts_common.pagination_top.render(self, posts: @posts) do %>
<footer class="thredded--pagination-top"><%= paginate @posts %></footer>
<% end %>
<%= render_posts @posts,
partial: 'thredded/posts/post',
content_partial: 'thredded/posts/content',
locals: { actions: { quote: true } } %>
<%= view_hooks.posts_common.pagination_bottom.render(self, posts: @posts) do %>
<footer class="thredded--pagination-bottom"><%= paginate @posts %></footer>
<% end %>
<% if topic.locked? %>
<p class="thredded--topic--locked-notice"><%= t 'thredded.topics.locked.message'%></p>
<% end %>
<% if policy(@new_post.post).create? %>
<div class="thredded--post-form--wrapper">
<h3 class="thredded--post-form--title"><%= t('thredded.posts.form.title_label') %></h3>
<%= render 'thredded/posts/form',
post: @new_post,
button_text: t('thredded.posts.form.create_btn'),
button_submitting_text: t('thredded.posts.form.create_btn_submitting') %>
</div>
<% end %>
<% if false && topic.can_destroy? %>
<div class="thredded--topic-delete--wrapper">
<%= button_to t('thredded.topics.delete_topic'), topic.destroy_path, method: :delete,
form_class: 'thredded--topic-delete-form',
class: 'thredded--button',
'data-confirm' => t('thredded.topics.delete_confirm') %>
</div>
<% end %>
<% end %>
<% end %>
<div class="flex-1 relative z-0 flex" :class="{ 'ml-56': showSidebar }">
<aside class="hidden relative xl:flex xl:flex-col flex-shrink-0 w-96 border-r border-gray-200 overflow-y-auto">
<!-- side panel (hidden on small screens; todo: probably just stack it) -->
<div class="py-6 px-4 sm:px-6 lg:px-8">
<%= content_tag :section,
class: ['thredded--main-section', 'thredded--topic', *topic_css_classes(topic)] do %>
<%= render 'thredded/topics/header', topic: topic %>
<% end %>
</div>
</aside>
<main class="flex-1 relative z-0 focus:outline-none">
<!-- main panel-->
<div class="py-6 px-4 sm:px-6 lg:px-8">
<%= thredded_page do %>
<%= content_tag :section,
id: dom_id(topic),
class: ['thredded--main-section', 'thredded--topic', *topic_css_classes(topic)] do %>
<%= view_hooks.posts_common.pagination_top.render(self, posts: @posts) do %>
<footer class="thredded--pagination-top"><%= paginate @posts %></footer>
<% end %>
<%= render_posts @posts,
partial: 'thredded/posts/post',
content_partial: 'thredded/posts/content',
locals: { actions: { quote: true } } %>
<%= view_hooks.posts_common.pagination_bottom.render(self, posts: @posts) do %>
<footer class="thredded--pagination-bottom"><%= paginate @posts %></footer>
<% end %>
<% if topic.locked? %>
<p class="thredded--topic--locked-notice"><%= t 'thredded.topics.locked.message'%></p>
<% end %>
<% if policy(@new_post.post).create? %>
<div class="thredded--post-form--wrapper">
<h3 class="thredded--post-form--title"><%= t('thredded.posts.form.title_label') %></h3>
<%= render 'thredded/posts/form',
post: @new_post,
button_text: t('thredded.posts.form.create_btn'),
button_submitting_text: t('thredded.posts.form.create_btn_submitting') %>
</div>
<% end %>
<% if topic.can_destroy? %>
<div class="thredded--topic-delete--wrapper">
<%= button_to t('thredded.topics.delete_topic'), topic.destroy_path, method: :delete,
form_class: 'thredded--topic-delete-form',
class: 'thredded--button bg-red-500',
'data-confirm' => t('thredded.topics.delete_confirm') %>
</div>
<% end %>
<% end %>
<% end %>
</div>
</main>
</div>

22
app/views/thredded/users/_badge.html.erb
View File

@ -1,10 +1,10 @@
<%
badge_style = 'padding: 3px 5px; font-size: 70%; font-weight: normal;'
badge_text = user.forums_badge_text
badge_classes = 'text-xs'
badge_text = user.forums_badge_text
if user.favorite_page_type?
favorite_link = link_to main_app.send("#{user.favorite_page_type.downcase.pluralize}_user_path", { id: user.id }) do
content_tag(:i, class: "material-icons tiny #{content_class_from_name(user.favorite_page_type).try(:text_color)}", style: 'position: relative; top: 4px') do
content_tag(:i, class: "material-icons text-sm mr-1 #{content_class_from_name(user.favorite_page_type).try(:text_color)}") do
"#{content_class_from_name(user.favorite_page_type).try(:icon)}"
end
end
@ -15,13 +15,21 @@
<% if user.respond_to?(:selected_billing_plan_id) %>
<% if user.id == 5 %>
<span style="<%= badge_style %>; background: #2196F3; color: white"><%= badge_text.presence || 'Admin' %></span>
<span class="<%= badge_classes %>" style="background: #2196F3; color: white">
<%= badge_text.presence || 'Admin' %>
</span>
<% elsif user.selected_billing_plan_id == 2 %>
<span style="<%= badge_style %>; background: #dedeff"><%= badge_text.presence || 'Beta Tester' %></span>
<span class="<%= badge_classes %>" style="background: #dedeff">
<%= badge_text.presence || 'Beta Tester' %>
</span>
<% elsif user.selected_billing_plan_id == 3 %>
<span style="<%= badge_style %>; background: #ffdede"><%= badge_text.presence || 'Early Adopter' %></span>
<span class="<%= badge_classes %>" style="background: #ffdede">
<%= badge_text.presence || 'Early Adopter' %>
</span>
<% elsif user.on_premium_plan? %>
<span style="<%= badge_style %>; background: #ffffaa"><%= badge_text.presence || 'Premium Supporter' %></span>
<span class="<%= badge_classes %>" style="background: #ffffaa">
<%= badge_text.presence || 'Premium Supporter' %>
</span>
<% else %>
<%= favorite_link %>
<% end %>

5
app/views/thredded/users/_link.html.erb
View File

@ -9,11 +9,6 @@
<a href="<%= user_path %>">
<%= user.thredded_display_name %>
<% if user.forum_moderator? %>
<i class="material-icons tooltipped tiny blue-text" data-tooltip="Forum Moderator" style="position: relative; top: 2px">
health_and_safety
</i>
<% end %>
</a>
<%= render partial: 'thredded/users/badge', locals: { user: user } %>
<% end %>

4
config/routes.rb
View File

@ -65,6 +65,10 @@ Rails.application.routes.draw do
get '/@:username/followers', to: 'users#followers'
get '/@:username/following', to: 'users#following'
scope '/analysis' do
get '/', to: 'document_analyses#index'
end
resources :documents do
# Document Analysis routes
get '/analysis/', to: 'document_analyses#show', on: :member