mirror of
https://github.com/indentlabs/notebook.git
synced 2025-10-26 11:19:22 +00:00
tailwind color palette on all content types
This commit is contained in:
drusepth
parent
6550ded52a
commit
bcf030cd97
@ -23,11 +23,11 @@ class Building < ActiveRecord::Base
|
||||
relates :district_schools, with: :building_schools
|
||||
|
||||
def self.color
|
||||
'blue-grey'
|
||||
'blue-grey bg-gray-600'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'blue-grey-text'
|
||||
'blue-grey-text text-gray-600'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -49,11 +49,11 @@ class Character < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'red'
|
||||
'red red-500'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'red-text'
|
||||
'red-text text-red-500'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -14,11 +14,11 @@ class Condition < ActiveRecord::Base
|
||||
self.authorizer_name = 'ExtendedContentAuthorizer'
|
||||
|
||||
def self.color
|
||||
'text-darken-1 lime'
|
||||
'text-darken-1 lime bg-lime-600'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-darken-1 lime-text'
|
||||
'text-darken-1 lime-text text-lime-600'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -30,11 +30,11 @@ class Continent < ActiveRecord::Base
|
||||
end
|
||||
|
||||
def self.color
|
||||
'lighten-1 text-lighten-1 green'
|
||||
'lighten-1 text-lighten-1 green bg-green-700'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-lighten-1 green-text'
|
||||
'text-lighten-1 green-text text-green-700'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -34,11 +34,11 @@ class Country < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'lighten-2 text-lighten-2 brown'
|
||||
'lighten-2 text-lighten-2 brown bg-brown-700'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-lighten-2 brown-text'
|
||||
'text-lighten-2 brown-text text-brown-700'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -33,11 +33,11 @@ class Creature < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'brown'
|
||||
'brown bg-amber-900'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'brown-text'
|
||||
'brown-text text-amber text-amber-900'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -34,11 +34,11 @@ class Deity < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'text-lighten-4 blue'
|
||||
'text-lighten-4 blue bg-blue-300'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-lighten-4 blue-text'
|
||||
'text-lighten-4 blue-text text-blue-300'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -29,11 +29,11 @@ class Flora < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'text-lighten-2 lighten-2 teal'
|
||||
'text-lighten-2 lighten-2 teal bg-lime-700'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-lighten-2 teal-text'
|
||||
'text-lighten-2 teal-text text-lime-700'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -14,11 +14,11 @@ class Food < ActiveRecord::Base
|
||||
self.authorizer_name = 'ExtendedContentAuthorizer'
|
||||
|
||||
def self.color
|
||||
'red'
|
||||
'red bg-red-400'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'red-text'
|
||||
'red-text text-red-400'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -24,11 +24,11 @@ class Government < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'darken-2 green'
|
||||
'darken-2 green bg-amber-600'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'green-text'
|
||||
'green-text text-amber-600'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -37,11 +37,11 @@ class Group < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'cyan'
|
||||
'cyan bg-cyan-500'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'cyan-text'
|
||||
'cyan-text text-cyan-500'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -31,11 +31,11 @@ class Item < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'text-darken-2 amber'
|
||||
'text-darken-2 amber bg-amber-500'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-darken-2 amber-text'
|
||||
'text-darken-2 amber-text text-amber-500'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -14,11 +14,11 @@ class Job < ActiveRecord::Base
|
||||
self.authorizer_name = 'ExtendedContentAuthorizer'
|
||||
|
||||
def self.color
|
||||
'text-lighten-1 brown'
|
||||
'text-lighten-1 brown bg-yellow-700'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-lighten-1 brown-text'
|
||||
'text-lighten-1 brown-text text-yellow-700'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -28,11 +28,11 @@ class Landmark < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'text-lighten-1 lighten-1 orange'
|
||||
'text-lighten-1 lighten-1 orange bg-orange-600'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-lighten-1 orange-text'
|
||||
'text-lighten-1 orange-text text-orange-600'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -21,11 +21,11 @@ class Language < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'blue'
|
||||
'blue bg-cyan-700'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'blue-text'
|
||||
'blue-text text-cyan-700'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -43,11 +43,11 @@ class Location < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'green'
|
||||
'green bg-green-500'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'green-text'
|
||||
'green-text text-green-500'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -44,11 +44,11 @@ class Lore < ActiveRecord::Base
|
||||
relates :related_lores, with: :lore_related_lores
|
||||
|
||||
def self.color
|
||||
'text-lighten-2 lighten-1 orange'
|
||||
'text-lighten-2 lighten-1 orange bg-teal-600'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-lighten-2 orange-text'
|
||||
'text-lighten-2 orange-text text-teal-600'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -22,11 +22,11 @@ class Magic < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'orange'
|
||||
'orange bg-yellow-500'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'orange-text'
|
||||
'orange-text text-yellow-500'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -31,11 +31,11 @@ class Planet < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'text-lighten-2 blue'
|
||||
'text-lighten-2 blue bg-lime-500'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-lighten-2 blue-text'
|
||||
'text-lighten-2 blue-text text-lime-500'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -28,11 +28,11 @@ class Race < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'darken-2 light-green'
|
||||
'darken-2 light-green bg-indigo-500'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-darken-2 light-green-text'
|
||||
'text-darken-2 light-green-text text-indigo-500'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -35,11 +35,11 @@ class Religion < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'indigo'
|
||||
'indigo bg-amber-600'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'indigo-text'
|
||||
'indigo-text text-amber-600'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -27,11 +27,11 @@ class Scene < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'grey'
|
||||
'grey bg-gray-400'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'grey-text'
|
||||
'grey-text text-gray-400'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -14,11 +14,11 @@ class School < ActiveRecord::Base
|
||||
self.authorizer_name = 'ExtendedContentAuthorizer'
|
||||
|
||||
def self.color
|
||||
'cyan'
|
||||
'cyan bg-rose-800'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'cyan-text'
|
||||
'cyan-text text-rose-800'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -15,11 +15,11 @@ class Sport < ActiveRecord::Base
|
||||
self.authorizer_name = 'ExtendedContentAuthorizer'
|
||||
|
||||
def self.color
|
||||
'orange'
|
||||
'orange bg-orange-300'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'orange-text'
|
||||
'orange-text text-orange-300'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -28,11 +28,11 @@ class Technology < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'text-darken-2 red'
|
||||
'text-darken-2 red bg-fuchsia-500'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-darken-2 red-text'
|
||||
'text-darken-2 red-text text-fuchsia-500'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -31,11 +31,11 @@ class Town < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'text-lighten-3 lighten-3 purple'
|
||||
'text-lighten-3 lighten-3 purple bg-purple-500'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-lighten-3 purple-text'
|
||||
'text-lighten-3 purple-text text-purple-500'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -14,11 +14,11 @@ class Tradition < ActiveRecord::Base
|
||||
self.authorizer_name = 'ExtendedContentAuthorizer'
|
||||
|
||||
def self.color
|
||||
'text-lighten-3 lighten-3 red'
|
||||
'text-lighten-3 lighten-3 red bg-rose-300'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-lighten-3 red-text'
|
||||
'text-lighten-3 red-text text-rose-300'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -75,11 +75,11 @@ class Universe < ApplicationRecord
|
||||
end
|
||||
|
||||
def self.color
|
||||
'purple'
|
||||
'purple bg-purple-800'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'purple-text'
|
||||
'purple-text text-purple-800'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -14,11 +14,11 @@ class Vehicle < ActiveRecord::Base
|
||||
self.authorizer_name = 'ExtendedContentAuthorizer'
|
||||
|
||||
def self.color
|
||||
'text-lighten-2 lighten-2 green'
|
||||
'text-lighten-2 lighten-2 green bg-cyan-400'
|
||||
end
|
||||
|
||||
def self.text_color
|
||||
'text-lighten-2 green-text'
|
||||
'text-lighten-2 green-text text-cyan-400'
|
||||
end
|
||||
|
||||
def self.hex_color
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
<%= link_to send("#{content_name}_worldbuilding_info_path"), class: 'black-text' do %>
|
||||
<div class="bg-white p-6 rounded-lg hover:shadow-lg">
|
||||
<%= image_tag "card-headers/#{content_name.pluralize}.webp", height: 300, width: 300, class: 'h-64 rounded w-full object-cover object-center mb-6' %>
|
||||
<h3 class="tracking-widest text-indigo-500 text-xs font-medium title-font">
|
||||
<h3 class="tracking-widest text-notebook-blue text-xs font-medium title-font">
|
||||
FREE FOR ALL USERS
|
||||
</h3>
|
||||
<h2 class="text-lg text-gray-900 font-medium title-font mb-4">
|
||||
|
||||
@ -71,7 +71,7 @@
|
||||
end
|
||||
%>
|
||||
|
||||
<%= f.submit "Sign up", class: 'block w-full px-4 py-4 mt-4 text-sm font-medium leading-5 text-center text-white transition-colors duration-150 bg-notebook-blue border border-transparent rounded-lg active:bg-blue-500 hover:bg-blue-500 hover:bg-blue-700 focus:outline-none focus:shadow-outline-blue cursor-pointer' %>
|
||||
<%= f.submit "Sign up", class: 'block w-full px-4 py-4 mt-4 text-sm font-medium leading-5 text-center text-white transition-colors duration-150 bg-notebook-blue border border-transparent rounded-lg active:bg-notebook-blue hover:bg-notebook-blue hover:bg-blue-700 focus:outline-none focus:shadow-outline-blue cursor-pointer' %>
|
||||
<% end %>
|
||||
|
||||
<div class="mt-4 text-center text-sm font-bold">
|
||||
|
||||
@ -23,6 +23,5 @@
|
||||
</div>
|
||||
<div class="text-center mt-4 text-sm hover:text-notebook-blue">
|
||||
<%= link_to 'Forgot your password?', new_user_password_path, class: 'text-notebook-blue hover:border-notebook-blue border-b-2' %>
|
||||
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
@ -208,7 +208,7 @@
|
||||
<div class="bg-blue-100 my-2 rounded flex p-4 items-center">
|
||||
<span class="title-font font-medium">
|
||||
<i class="material-icons float-left mr-4 mt-6 mb-4">check</i>
|
||||
If you <span class="text-blue-500">customize</span> a page's template, the fields you change are automatically synced across all of your
|
||||
If you <span class="text-notebook-blue">customize</span> a page's template, the fields you change are automatically synced across all of your
|
||||
pages of that type. For example, adding a field for an item's damage type will instantly create that field for <em>all</em> of your
|
||||
items!
|
||||
</span>
|
||||
@ -216,14 +216,14 @@
|
||||
<div class="bg-blue-100 my-2 rounded flex p-4 items-center">
|
||||
<span class="title-font font-medium">
|
||||
<i class="material-icons float-left mr-4 mt-2">check</i>
|
||||
Whenever you <span class="text-blue-500">mention</span> another page, a two-way link is automatically created that you can click
|
||||
Whenever you <span class="text-notebook-blue">mention</span> another page, a two-way link is automatically created that you can click
|
||||
through, from either page.
|
||||
</span>
|
||||
</div>
|
||||
<div class="bg-blue-100 my-2 rounded flex p-4 items-center">
|
||||
<span class="title-font font-medium">
|
||||
<i class="material-icons float-left mr-4 mt-5 mb-4">check</i>
|
||||
Whenever you <span class="text-blue-500">link</span> one page to another, you may notice the inverse link also created automatically. For example,
|
||||
Whenever you <span class="text-notebook-blue">link</span> one page to another, you may notice the inverse link also created automatically. For example,
|
||||
creating a "subgroup" link on a Group page will automatically create a "supergroup" link back.
|
||||
</span>
|
||||
</div>
|
||||
@ -302,7 +302,7 @@
|
||||
</section>
|
||||
|
||||
<div class="text-center my-24">
|
||||
<%= link_to 'Ready to start building a new world?', new_user_registration_path, class: 'bg-blue-500 hover:bg-blue-400 shadow-lg rounded-lg white-text py-4 px-8 mx-auto text-xl border border-blue-400' %>
|
||||
<%= link_to 'Ready to start building a new world?', new_user_registration_path, class: 'bg-notebook-blue hover:bg-blue-400 shadow-lg rounded-lg white-text py-4 px-8 mx-auto text-xl border border-blue-400' %>
|
||||
<div class="mt-6 text-gray-500">
|
||||
Empower your entire writing process with a new kind of tool.
|
||||
</div>
|
||||
@ -316,10 +316,10 @@
|
||||
</h1>
|
||||
<p class="text-base leading-relaxed xl:w-2/4 lg:w-3/4 mx-auto">
|
||||
Have another question? Feel free to ask it in the
|
||||
<%= link_to 'Site Support forums', 'https://www.notebook.ai/forum/site-support', class: 'text-blue-500' %>,
|
||||
tweet <%= link_to '@IndentLabs', 'https://www.twitter.com/indentlabs', class: 'text-blue-500' %>,
|
||||
<%= link_to 'Site Support forums', 'https://www.notebook.ai/forum/site-support', class: 'text-notebook-blue' %>,
|
||||
tweet <%= link_to '@IndentLabs', 'https://www.twitter.com/indentlabs', class: 'text-notebook-blue' %>,
|
||||
or
|
||||
<%= link_to 'PM @andrew', 'https://www.notebook.ai/@andrew', class: 'text-blue-500' %>!
|
||||
<%= link_to 'PM @andrew', 'https://www.notebook.ai/@andrew', class: 'text-notebook-blue' %>!
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex flex-wrap lg:w-4/5 sm:mx-auto sm:mb-2 -mx-2">
|
||||
|
||||
@ -4,8 +4,8 @@
|
||||
<div class="text-center w-full">
|
||||
<div class="text-black py-4 px-5 my-5">
|
||||
<div class="mb-3 text-4xl md:text-6xl" style="text-shadow: white 0px 0px 18px;">
|
||||
The <span class="text-blue-500">smart</span> notebook<br class="hidden sm:block" />
|
||||
for <span class="text-blue-500">smart</span> writers
|
||||
The <span class="text-notebook-blue">smart</span> notebook<br class="hidden sm:block" />
|
||||
for <span class="text-notebook-blue">smart</span> writers
|
||||
</div>
|
||||
<div class="leading-normal text-3xl" style="text-shadow: white 0px 0px 10px;">
|
||||
Novel planning software that's fun <em>and</em> effective.
|
||||
@ -201,7 +201,7 @@
|
||||
<div class="bg-blue-100 my-2 rounded flex p-4 items-center">
|
||||
<span class="title-font font-medium">
|
||||
<i class="material-icons float-left mr-4 mt-6 mb-4">check</i>
|
||||
If you <span class="text-blue-500">customize</span> a page's template, the fields you change are automatically synced across all of your
|
||||
If you <span class="text-notebook-blue">customize</span> a page's template, the fields you change are automatically synced across all of your
|
||||
pages of that type. For example, adding a field for an item's damage type will instantly create that field for <em>all</em> of your
|
||||
items!
|
||||
</span>
|
||||
@ -209,14 +209,14 @@
|
||||
<div class="bg-blue-100 my-2 rounded flex p-4 items-center">
|
||||
<span class="title-font font-medium">
|
||||
<i class="material-icons float-left mr-4 mt-2">check</i>
|
||||
Whenever you <span class="text-blue-500">mention</span> another page, a two-way link is automatically created that you can click
|
||||
Whenever you <span class="text-notebook-blue">mention</span> another page, a two-way link is automatically created that you can click
|
||||
through, from either page.
|
||||
</span>
|
||||
</div>
|
||||
<div class="bg-blue-100 my-2 rounded flex p-4 items-center">
|
||||
<span class="title-font font-medium">
|
||||
<i class="material-icons float-left mr-4 mt-5 mb-4">check</i>
|
||||
Whenever you <span class="text-blue-500">link</span> one page to another, you may notice the inverse link also created automatically. For example,
|
||||
Whenever you <span class="text-notebook-blue">link</span> one page to another, you may notice the inverse link also created automatically. For example,
|
||||
creating a "subgroup" link on a Group page will automatically create a "supergroup" link back.
|
||||
</span>
|
||||
</div>
|
||||
@ -337,7 +337,7 @@
|
||||
</section>
|
||||
|
||||
<div class="text-center my-24">
|
||||
<%= link_to 'Ready to start building a new world?', new_user_registration_path, class: 'bg-blue-500 hover:bg-blue-400 shadow-lg rounded-lg white-text py-4 px-8 mx-auto text-xl border border-blue-400' %>
|
||||
<%= link_to 'Ready to start building a new world?', new_user_registration_path, class: 'bg-notebook-blue hover:bg-blue-400 shadow-lg rounded-lg white-text py-4 px-8 mx-auto text-xl border border-blue-400' %>
|
||||
<div class="mt-6 text-gray-500">
|
||||
Empower your entire writing process with a new kind of tool.
|
||||
</div>
|
||||
@ -351,10 +351,10 @@
|
||||
</h1>
|
||||
<p class="text-base leading-relaxed xl:w-2/4 lg:w-3/4 mx-auto">
|
||||
Have another question? Feel free to ask it in the
|
||||
<%= link_to 'Site Support forums', 'https://www.notebook.ai/forum/site-support', class: 'text-blue-500' %>,
|
||||
tweet <%= link_to '@IndentLabs', 'https://www.twitter.com/indentlabs', class: 'text-blue-500' %>,
|
||||
<%= link_to 'Site Support forums', 'https://www.notebook.ai/forum/site-support', class: 'text-notebook-blue' %>,
|
||||
tweet <%= link_to '@IndentLabs', 'https://www.twitter.com/indentlabs', class: 'text-notebook-blue' %>,
|
||||
or
|
||||
<%= link_to 'PM @andrew', 'https://www.notebook.ai/@andrew', class: 'text-blue-500' %>!
|
||||
<%= link_to 'PM @andrew', 'https://www.notebook.ai/@andrew', class: 'text-notebook-blue' %>!
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex flex-wrap lg:w-4/5 sm:mx-auto sm:mb-2 -mx-2">
|
||||
|
||||
@ -4,17 +4,17 @@
|
||||
<div class="text-center w-full">
|
||||
<div class="text-black py-4 px-5 my-5">
|
||||
<div class="mb-3 text-4xl md:text-6xl" style="text-shadow: white 0px 0px 10px;">
|
||||
The <span class="text-blue-500">smart</span> notebook<br class="hidden sm:block" />
|
||||
for <span class="text-blue-500">smart</span> worldbuilders
|
||||
The <span class="text-notebook-blue">smart</span> notebook<br class="hidden sm:block" />
|
||||
for <span class="text-notebook-blue">smart</span> worldbuilders
|
||||
</div>
|
||||
<div class="leading-normal text-2xl" style="text-shadow: white 0px 0px 10px;">
|
||||
<%= t('marketing.landing_page.promo_subheader') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cta clear-left px-5">
|
||||
<%= link_to new_user_registration_path, class: 'no-underline btn block sm:inline-block global-transition text-white bg-blue-500 hover:bg-blue-400' do %>
|
||||
<%= link_to new_user_registration_path, class: 'no-underline px-4 py-4 rounded-lg block sm:inline-block global-transition text-white bg-notebook-blue hover:bg-blue-400 hover:shadow-lg' do %>
|
||||
<div class="flex justify-center items-center">
|
||||
<span>Start worldbuilding now</span>
|
||||
<span>Start worldbuilding</span>
|
||||
<span class="fa fa-xs fa-arrow-right ml-4"></span>
|
||||
</div>
|
||||
<% end %>
|
||||
@ -34,7 +34,7 @@
|
||||
<div class="flex flex-wrap sm:-m-4 -mx-4 -mb-10 -mt-4 md:space-y-0 space-y-6">
|
||||
<div class="p-4 md:w-1/2 flex">
|
||||
<div class="flex flex-row items-center mb-2">
|
||||
<div class="w-12 h-12 inline-flex items-center justify-center rounded-full bg-blue-100 text-blue-500 flex-shrink-0">
|
||||
<div class="w-12 h-12 inline-flex items-center justify-center rounded-full bg-blue-100 text-notebook-blue flex-shrink-0">
|
||||
<i class="material-icons text-3xl mb-1">create</i>
|
||||
</div>
|
||||
<div class="ml-4 text-2xl font-bold">
|
||||
@ -45,7 +45,7 @@
|
||||
<p class="leading-relaxed text-base">
|
||||
<%= t('marketing.landing_page.cta.writers.body') %>
|
||||
</p>
|
||||
<%= link_to writers_landing_path, class: 'mt-3 text-indigo-500 inline-flex items-center' do %>
|
||||
<%= link_to writers_landing_path, class: 'mt-3 text-notebook-blue inline-flex items-center' do %>
|
||||
<%= t('marketing.landing_page.cta.writers.button') %>
|
||||
<svg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="w-4 h-4 ml-2" viewBox="0 0 24 24">
|
||||
<path d="M5 12h14M12 5l7 7-7 7"></path>
|
||||
@ -56,7 +56,7 @@
|
||||
|
||||
<div class="p-4 md:w-1/2 flex">
|
||||
<div class="flex flex-row items-center mb-2">
|
||||
<div class="w-12 h-12 inline-flex items-center justify-center rounded-full bg-blue-100 text-blue-500 flex-shrink-0">
|
||||
<div class="w-12 h-12 inline-flex items-center justify-center rounded-full bg-blue-100 text-notebook-blue flex-shrink-0">
|
||||
<i class="material-icons text-3xl mb-1">gavel</i>
|
||||
</div>
|
||||
<div class="ml-4 text-2xl font-bold">
|
||||
@ -67,7 +67,7 @@
|
||||
<p class="leading-relaxed text-base">
|
||||
<%= t('marketing.landing_page.cta.roleplayers.body') %>
|
||||
</p>
|
||||
<%= link_to roleplayers_landing_path, class: 'mt-3 text-indigo-500 inline-flex items-center' do %>
|
||||
<%= link_to roleplayers_landing_path, class: 'mt-3 text-notebook-blue inline-flex items-center' do %>
|
||||
<%= t('marketing.landing_page.cta.roleplayers.button') %>
|
||||
<svg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="w-4 h-4 ml-2" viewBox="0 0 24 24">
|
||||
<path d="M5 12h14M12 5l7 7-7 7"></path>
|
||||
@ -297,13 +297,13 @@
|
||||
<%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
|
||||
<div class="relative mb-4">
|
||||
<%= f.label 'Your name', class: 'leading-7 text-sm text-gray-600' %>
|
||||
<%= f.text_field :name, class: 'w-full bg-white rounded border border-gray-300 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-200 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out' %>
|
||||
<%= f.text_field :name, class: 'w-full bg-white rounded border border-gray-300 focus:border-notebook-blue focus:ring-2 focus:ring-notebook-blue text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out' %>
|
||||
</div>
|
||||
|
||||
<div class="relative mb-4">
|
||||
<%= f.label :email, class: 'leading-7 text-sm text-gray-600' %>
|
||||
<em class="text-sm">(This is the email you will log in with)</em>
|
||||
<%= f.email_field :email, class: 'w-full bg-white rounded border border-gray-300 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-200 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out' %>
|
||||
<%= f.email_field :email, class: 'w-full bg-white rounded border border-gray-300 focus:border-notebook-blue focus:ring-2 focus:ring-notebook-blue text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out' %>
|
||||
</div>
|
||||
|
||||
<div class="relative mb-4">
|
||||
@ -311,12 +311,12 @@
|
||||
<% if @minimum_password_length %>
|
||||
<em>(<%= @minimum_password_length %> characters minimum)</em>
|
||||
<% end %><br />
|
||||
<%= f.password_field :password, autocomplete: "off", class: 'w-full bg-white rounded border border-gray-300 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-200 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out' %>
|
||||
<%= f.password_field :password, autocomplete: "off", class: 'w-full bg-white rounded border border-gray-300 focus:border-notebook-blue focus:ring-2 focus:ring-notebook-blue text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out' %>
|
||||
</div>
|
||||
|
||||
<div class="relative mb-4">
|
||||
<%= f.label :password_confirmation, class: 'leading-7 text-sm text-gray-600' %><br />
|
||||
<%= f.password_field :password_confirmation, autocomplete: "off", class: 'w-full bg-white rounded border border-gray-300 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-200 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out' %>
|
||||
<%= f.password_field :password_confirmation, autocomplete: "off", class: 'w-full bg-white rounded border border-gray-300 focus:border-notebook-blue focus:ring-2 focus:ring-notebook-blue text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out' %>
|
||||
</div>
|
||||
|
||||
<div class="relative mb-4">
|
||||
@ -352,7 +352,7 @@
|
||||
end
|
||||
%>
|
||||
|
||||
<%= f.submit "Sign up", class: 'w-full text-white bg-blue-500 border-0 py-2 px-8 focus:outline-none hover:bg-blue-600 rounded text-lg cursor-pointer' %>
|
||||
<%= f.submit "Sign up", class: 'w-full text-white bg-notebook-blue border-0 py-2 px-8 focus:outline-none hover:bg-blue-600 rounded text-lg cursor-pointer' %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
@ -393,7 +393,7 @@
|
||||
<p class="text-gray-500 my-2">
|
||||
<%= t('marketing.landing_page.benefits.locations.text') %>
|
||||
</p>
|
||||
<p class="text-gray-500 my-2 text-blue-500">
|
||||
<p class="text-gray-500 my-2 text-notebook-blue">
|
||||
See the full list below.
|
||||
</p>
|
||||
</div>
|
||||
@ -455,9 +455,6 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@ -471,7 +468,7 @@
|
||||
<div class="block relative h-48 rounded overflow-hidden hover:shadow-lg">
|
||||
<%= image_tag "card-headers/#{content_type.name.downcase.pluralize}.webp", class: 'h-full w-full rounded w-full object-cover object-center' %>
|
||||
</div>
|
||||
<div class="text-gray-900 title-font text-lg font-medium text-center <%= content_type.text_color %>">
|
||||
<div class="title-font text-lg font-medium text-center <%= content_type.text_color %>">
|
||||
<%= content_type.name.pluralize %>
|
||||
</div>
|
||||
<% end %>
|
||||
@ -500,7 +497,7 @@
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex flex-wrap -m-4">
|
||||
<div class="p-4 xl:w-1/4 md:w-1/2 w-full">
|
||||
<div class="p-4 xl:w-1/4 w-full">
|
||||
<div class="h-3/4 mt-16 p-6 rounded-lg border-2 border-gray-300 bg-white flex flex-col relative overflow-hidden">
|
||||
<h2 class="text-sm tracking-widest title-font mb-1 font-medium">STARTER</h2>
|
||||
<h1 class="text-5xl text-gray-900 pb-4 mb-4 border-b border-gray-200 leading-none">Free forever</h1>
|
||||
@ -634,8 +631,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-4 xl:w-1/3 md:w-1/2 w-full mx-auto">
|
||||
<div class="h-full p-6 rounded-lg border-2 border-indigo-500 flex flex-col bg-white relative overflow-hidden">
|
||||
<span class="bg-indigo-500 text-white px-3 py-1 tracking-widest text-xs absolute right-0 top-0 rounded-bl">MOST POPULAR</span>
|
||||
<div class="h-full p-6 rounded-lg border-2 border-notebook-blue flex flex-col bg-white relative overflow-hidden">
|
||||
<span class="bg-notebook-blue text-white px-3 py-1 tracking-widest text-xs absolute right-0 top-0 rounded-bl">MOST POPULAR</span>
|
||||
<h2 class="text-sm tracking-widest title-font mb-1 font-medium">PREMIUM</h2>
|
||||
<h1 class="text-5xl text-gray-900 leading-none flex items-center pb-4 mb-4 border-b border-gray-200">
|
||||
<span>$24</span>
|
||||
@ -699,7 +696,7 @@
|
||||
Create collections
|
||||
</p>
|
||||
<%= link_to new_user_registration_path, class: 'mt-auto' do %>
|
||||
<button class="flex items-center mt-auto text-white bg-indigo-500 border-0 py-2 px-4 w-full focus:outline-none hover:bg-indigo-600 rounded">
|
||||
<button class="flex items-center mt-auto text-white bg-notebook-blue border-0 py-2 px-4 w-full focus:outline-none hover:bg-blue-500 rounded">
|
||||
Sign up
|
||||
<svg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="w-4 h-4 ml-auto" viewBox="0 0 24 24">
|
||||
<path d="M5 12h14M12 5l7 7-7 7"></path>
|
||||
|
||||
@ -5,7 +5,41 @@ module.exports = {
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
'notebook-blue': '#2196F3'
|
||||
'notebook-blue': '#2196F3',
|
||||
slate: colors.slate,
|
||||
gray: colors.gray,
|
||||
zinc: colors.zinc,
|
||||
neutral: colors.neutral,
|
||||
stone: colors.stone,
|
||||
red: colors.red,
|
||||
orange: colors.orange,
|
||||
amber: colors.amber,
|
||||
yellow: colors.yellow,
|
||||
lime: colors.lime,
|
||||
green: colors.green,
|
||||
emerald: colors.emerald,
|
||||
teal: colors.teal,
|
||||
cyan: colors.cyan,
|
||||
sky: colors.sky,
|
||||
blue: colors.blue,
|
||||
indigo: colors.indigo,
|
||||
violet: colors.violet,
|
||||
purple: colors.purple,
|
||||
fuchsia: colors.fuchsia,
|
||||
pink: colors.pink,
|
||||
rose: colors.rose,
|
||||
brown: {
|
||||
50: '#fdf8f6',
|
||||
100: '#f2e8e5',
|
||||
200: '#eaddd7',
|
||||
300: '#e0cec7',
|
||||
400: '#d2bab0',
|
||||
500: '#bfa094',
|
||||
600: '#a18072',
|
||||
700: '#977669',
|
||||
800: '#846358',
|
||||
900: '#43302b',
|
||||
},
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user