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

more work on dark mode

Browse Source
This commit is contained in:
Andrew Brown 2020-05-16 16:04:21 -05:00
parent 5e90d8fedd
commit ff6d8a96d8
21 changed files with 194 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
app/assets/stylesheets/content.css.scss
View File

@ -68,7 +68,10 @@ p.long-form {
margin-right: -5px;
margin-bottom: 20px;
position: relative;
background: white;
background: rgba(255, 255, 255, 0.15);
background-blend-mode: darken;
z-index: 1;
textarea {

164
app/assets/stylesheets/dark-mode.scss
View File

@ -8,18 +8,50 @@ body {
background-color: #202123;
color: #fff;
nav {
background-color: #26A69A;
background-color: #2196F3;
}
.card {
background-color: rgba(255,255,255,0.2);
background-color: rgba(255, 255, 255, 0.2);
}
.card-reveal {
background-color: #2D2D31;
.card-title {
color: #fff;
}
}
.dropdown-content {
background-color: #2D2D31;
a {
color: #ccc;
&:hover {
background-color: #3B4043;
}
}
}
.modal {
background-color: #2D2D31;
}
.btn {
background-color: #EE6F73;
background-color: #000000;
border: 1px solid #aaa;
border-top: 1px solid #ccc;
border-bottom: 1px solid #888;
}
.divider {
opacity: 0.2;
}
.sidenav {
}
textarea, input {
color: #fff;
&::placeholder {
color: #aaa;
}
}
.collapsible-header {
background-color: #3B4043;
}
.sidenav, .collapsible-body {
background-color: #2D2D31;
li {
a {
@ -45,5 +77,127 @@ body {
border-bottom: 1px solid rgba(255,255,255,0.2);;
}
}
#editor {
background-color: #3B4043;
color: white;
}
#thredded--container {
input {
color: white;
}
.thredded--form.thredded--navigation--search.thredded--navigation--search-topics input {
background-color: #2196F3;
}
.thredded--form {
input, textarea {
color: white;
background-color: #3B4043;
&::placeholder {
color: #ddd;
}
}
.thredded--preview-area {
color: #ddd;
}
.thredded--form--submit {
background-color: #2196F3;
color: white;
}
}
.thredded--messageboard, .thredded--form {
background-color: #3B4043;
}
.thredded--messageboard--description {
color: white;
}
.thredded--messageboard--byline, .thredded--messageboard--meta--counts, .thredded--navigation-breadcrumbs li a {
color: #9AA0A6;
}
.thredded--nav-text {
color: #ddd;
}
.thredded--post--created-at {
color: #9AA0A6;
}
.thredded--topic-header {
.thredded--topic-header--title {
color: white;
}
.thredded--topic-header--started-by, .thredded--topic-followers, .thredded--topic-header--follow-info--reason {
color: #9AA0A6;
a {
color: #4CAF50;
}
}
}
.thredded--post--user {
color: black;
a {
color: #4CAF50;
}
}
.thredded--post {
background: #3B4043;
color: white;
border-bottom: 1px solid #333;
border-top: 1px solid #666;
}
.thredded--topics--topic {
background-color: #3B4043;
.thredded--topics--title a {
color: white;
}
.thredded--topics--updated-by {
color: #9AA0A6;
a {
color: #4CAF50;
}
}
.thredded--topics--posts-count {
border: 1px solid #555;
}
}
.thredded--currently-online {
background-color: #3B4043;
.thredded--currently-online--title {
color: #9AA0A6;
}
}
.thredded--user-navigation--item a {
&:hover {
color: #000;
}
}
}
.thredded--post-form--title {
color: #9AA0A6;
}
}
}

4
app/views/cards/serendipitous/_content_question.html.erb
View File

@ -15,7 +15,7 @@
)
%>
</div>
<div class="collapsible-body white">
<div class="collapsible-body">
<%= form_for content do |f| %>
<%= hidden_field(:override, :redirect_path, value: redirect_path) if defined?(redirect_path) %>
@ -30,7 +30,7 @@
Save answer to <%= content.name_field_value.downcase %>
<% end %>
<% if !defined?(show_view_button) || !!show_view_button %>
<%= link_to content, class: 'btn white black-text', target: '_new' do %>
<%= link_to content, class: 'btn', target: '_new' do %>
<i class="material-icons left <%= content.class.color %>-text"><%= content.class.icon %></i>
View <%= content.name_field_value %>
<% end %>

4
app/views/content/cards/_content_relation_list.html.erb
View File

@ -16,7 +16,7 @@ render partial: 'content/cards/content_relation_list', locals: { content_type: :
<% end %>
</div>
<div class="card-content">
<span class="card-title activator grey-text text-darken-4">
<span class="card-title activator">
<% if defined? card_title %>
<%
formatted_card_title = card_title.dup
@ -36,7 +36,7 @@ render partial: 'content/cards/content_relation_list', locals: { content_type: :
</p>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">
<span class="card-title">
<% if relations.any? %>
<i class="material-icons <%= content_type_class.color %>-text" style="position: relative; top: 3px">
<%= content_type_class.icon %>

2
app/views/content/cards/_in_universe_content_list.html.erb
View File

@ -76,7 +76,7 @@
<div class="card-content">
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">
<span class="card-title">
<% if content_list.any? %>
<i class="material-icons <%= content_type_class.color %>-text" style="position: relative; top: 3px">
<%= content_type_class.icon %>

6
app/views/content/components/_list_filter_bar.html.erb
View File

@ -9,7 +9,7 @@
<% if content_type.new.respond_to?(:universe) %>
<div class="btn-group card">
<a
class='dropdown-trigger btn white black-text tooltipped <%= @universe_scope.present? ? Universe.color : 'white' %> lighten-5'
class='dropdown-trigger btn tooltipped <%= Universe.color if @universe_scope.present? %> lighten-5'
href='#'
data-position="bottom"
data-delay="500"
@ -43,7 +43,7 @@
<% if @page_tags.present? && @page_tags.any? %>
<div class="btn-group card">
<a
class='dropdown-trigger btn <%= @filtered_page_tags.nil? ? 'white' : content_type.color %> lighten-4 black-text tooltipped'
class='dropdown-trigger btn <%= content_type.color if @filtered_page_tags.present? %> lighten-4 black-text tooltipped'
href='#'
data-target='tag-filter-dropdown'
data-position="bottom"
@ -78,7 +78,7 @@
</div>
<% end %>
<a class='btn <%= params.key?(:favorite_only) ? 'yellow lighten-3' : 'white' %> black-text tooltipped'
<a class='btn <%= 'yellow lighten-3' if params.key?(:favorite_only) %> black-text tooltipped'
href="<%= url_for(params.permit(:universe, :favorite_only).merge({favorite_only: params.key?(:favorite_only) ? nil : 1})) %>"
data-position="bottom"
data-delay="500"

4
app/views/content/list/_cards.html.erb
View File

@ -14,7 +14,7 @@
<div class="activator" style="height: 265px; background: url('<%= content_image %>'); background-size: cover;"></div>
</div>
<div class="card-content fixed-card-content" style="overflow: hidden">
<span class="card-title js-content-name activator grey-text text-darken-4">
<span class="card-title js-content-name activator">
<%= ContentFormatterService.show(text: content.name.presence || 'Untitled', viewing_user: current_user) %>
</span>
<p>
@ -36,7 +36,7 @@
<% end %>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">
<span class="card-title">
<%= content.name.presence || 'Document preview' %>
<i class="material-icons right">close</i>
</span>

2
app/views/content_page_shares/_form.html.erb
View File

@ -4,7 +4,7 @@
<i class="material-icons">share</i>
Click here to share a page
</div>
<div class="collapsible-body white">
<div class="collapsible-body">
<%= form_for [current_user, ContentPageShare.new(user: current_user)] do |f| %>
<div class="row">
<div class="col s12 m6 l6">

4
app/views/data/collaboration.html.erb
View File

@ -22,7 +22,7 @@
<%= universe.name %>
(<%= pluralize universe.contributors.count, 'collaborator' %>)
</div>
<div class="collapsible-body white">
<div class="collapsible-body">
<%= render partial: 'content/display/contributors', locals: { content: universe } %>
</div>
</li>
@ -41,7 +41,7 @@
<i class="material-icons"><%= Universe.icon %></i>
<%= universe.name %>
</div>
<div class="collapsible-body white">
<div class="collapsible-body">
<%= render partial: 'content/display/contributors', locals: { content: universe } %>
</div>
</li>

2
app/views/data/uploads.html.erb
View File

@ -75,7 +75,7 @@
</ul>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">
<span class="card-title">
Image details
<i class="material-icons right">close</i>
</span>

6
app/views/documents/analysis/sections/_readability.html.erb
View File

@ -24,7 +24,7 @@
</a>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">
<span class="card-title">
Readability scales
<i class="material-icons right">close</i>
</span>
@ -133,7 +133,7 @@
</a>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">
<span class="card-title">
Why is this important?
<i class="material-icons right">close</i>
</span>
@ -172,7 +172,7 @@
</a>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">
<span class="card-title">
Why is this important?
<i class="material-icons right">close</i>
</span>

2
app/views/documents/analysis/sections/_style.html.erb
View File

@ -27,7 +27,7 @@
</a>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">
<span class="card-title">
Words per sentence
<i class="material-icons right">close</i>
</span>

2
app/views/layouts/_document_navbar.html.erb
View File

@ -31,7 +31,7 @@
<ul id="about-this-document-dropdown" class="dropdown-content">
<li style="padding: 0 20px" class="<%= Document.color %> lighten-5">
<h5 class="grey-text text-darken-4">
<h5>
About this document
</h5>
<p>

2
app/views/layouts/_navbar.html.erb
View File

@ -18,7 +18,7 @@
<ul id='notifications-dropdown' class='dropdown-content'>
<% @user_notifications.each do |notification| %>
<li class="<%= 'blue lighten-5' unless notification.viewed_at? %>">
<%= link_to main_app.notification_path(notification), class: 'black-text text-lighten-3' do %>
<%= link_to main_app.notification_path(notification), class: 'text-lighten-3' do %>
<i class="material-icons <%= notification.icon_color %>-text"><%= notification.icon %></i>
<%= notification.message_html.html_safe %>
<div>

2
app/views/layouts/application.html.erb
View File

@ -4,7 +4,7 @@
<%= render 'layouts/common_head' %>
</head>
<body data-in-app="true"
class="<%= controller_name %> <%= action_name %> <%= 'has-fixed-sidenav' if user_signed_in? %>"
class="<%= controller_name %> <%= action_name %> <%= 'has-fixed-sidenav' if user_signed_in? %> dark"
>
<%= render 'layouts/sidenav' if user_signed_in? %>
<%= render 'layouts/recent_edits_sidenav' if user_signed_in? %>

2
app/views/layouts/editor.html.erb
View File

@ -3,7 +3,7 @@
<head>
<%= render 'layouts/common_head' %>
</head>
<body data-in-app="true" class="<%= controller_name %> <%= action_name %>">
<body data-in-app="true" class="<%= controller_name %> <%= action_name %> dark">
<%= render 'layouts/sidenav', locals: { fixed: false } if user_signed_in? %>
<%= render 'layouts/document_navbar' %>

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

@ -13,7 +13,7 @@
'data-turbolinks-track': 'reload'%>
<%== Gravatar.prefetch_dns %>
</head>
<body data-in-app="true" class="<%= 'has-fixed-sidenav' if user_signed_in? %>">
<body data-in-app="true" class="<%= 'has-fixed-sidenav' if user_signed_in? %> dark">
<%= render 'layouts/sidenav' if user_signed_in? %>
<%= render 'layouts/recent_edits_sidenav' if user_signed_in? %>
<%= render 'layouts/navbar' %>

4
app/views/main/index.html.erb
View File

@ -254,7 +254,7 @@
<div class="card card-avatar center">
<div class="center brown-text"><br /><i class="material-icons" style="font-size: 250%">class</i></div>
<div class="card-content">
<span class="card-title activator grey-text text-darken-4">
<span class="card-title activator">
<%= t('marketing.landing_page.pricing.starter_plan.title') %>
<br />
<small><em><a class="red-text text-darken-1">
@ -290,7 +290,7 @@
<i class="material-icons" style="font-size: 250%">book</i>
</div>
<div class="card-content center">
<span class="card-title activator grey-text text-darken-4">
<span class="card-title activator">
<%= t('marketing.landing_page.pricing.premium_plan.title') %>
<br />
<small><em class="red-text text-darken-1">

8
app/views/page_collections/explore.html.erb
View File

@ -8,7 +8,7 @@
<i class="material-icons">layers</i>
Explore our shared worlds, etc
</div>
<div class="collapsible-body white">
<div class="collapsible-body">
<p>
How does this all work, etc.
</p>
@ -19,7 +19,7 @@
<div class="collapsible-header">
<i class="material-icons">help</i> Some FAQ #1
</div>
<div class="collapsible-body white">
<div class="collapsible-body">
<p>
Answer
</p>
@ -29,7 +29,7 @@
<div class="collapsible-header">
<i class="material-icons">help</i> Some FAQ #2
</div>
<div class="collapsible-body white">
<div class="collapsible-body">
<p>
Answer
</p>
@ -39,7 +39,7 @@
<div class="collapsible-header">
<i class="material-icons">help</i> Some FAQ #3
</div>
<div class="collapsible-body white">
<div class="collapsible-body">
<p>
Answer
</p>

2
app/views/page_collections/show.html.erb
View File

@ -28,7 +28,7 @@
<i class="material-icons <%= PageCollection.color %>-text text-darken-2"><%= PageCollection.icon %></i>
<%= @page_collection.user == current_user ? 'Add' : 'Submit' %> a page
</div>
<div class="collapsible-body white">
<div class="collapsible-body">
<%= form_for PageCollectionSubmission.new do |f| %>
<%= f.hidden_field :page_collection_id, value: @page_collection.id %>
<div class="input-field">

2
app/views/subscriptions/prepay.html.erb
View File

@ -229,7 +229,7 @@
<% end %>
<% if invoice.page_unlock_promo_code.present? %>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">
<span class="card-title">
Share this code
<i class="material-icons right">close</i>
</span>