From 7c6ab321cbfe49baf1efb9bf7c265d80f07b837f Mon Sep 17 00:00:00 2001 From: vinu tv Date: Wed, 15 May 2019 19:39:45 +0530 Subject: [PATCH] Replace primary to primary-500 --- .../courses/components/Layouts__CoursesShow.re | 2 +- app/javascript/layouts/tailwind.css | 6 +++--- app/javascript/schools/components/SchoolCustomize.re | 2 +- .../components/SchoolCustomize__ImagesEditor.re | 2 +- .../components/SchoolCustomize__LinksEditor.re | 2 +- app/javascript/schools/shared/shared.css | 12 ++++++------ app/views/home/styleguide.html.erb | 8 ++++---- postcss.config.js | 2 +- tailwind.config.js | 1 + 9 files changed, 19 insertions(+), 18 deletions(-) diff --git a/app/javascript/layouts/courses/components/Layouts__CoursesShow.re b/app/javascript/layouts/courses/components/Layouts__CoursesShow.re index 49a1a68763..1de63e08ac 100644 --- a/app/javascript/layouts/courses/components/Layouts__CoursesShow.re +++ b/app/javascript/layouts/courses/components/Layouts__CoursesShow.re @@ -43,7 +43,7 @@ let make = (~courses, ~currentCourse, _children) => { ) |> List.map(course => Course.id |> string_of_int} href={course |> Course.path}> {course |> Course.name |> str} diff --git a/app/javascript/layouts/tailwind.css b/app/javascript/layouts/tailwind.css index e2e9892dec..12f09783ac 100644 --- a/app/javascript/layouts/tailwind.css +++ b/app/javascript/layouts/tailwind.css @@ -28,7 +28,7 @@ body { /* Button Styles */ .btn-default { - @apply bg-grey-200 text-grey-dark; + @apply bg-gray-200 text-gray-600; } .btn-default:hover { @@ -36,11 +36,11 @@ body { } .btn-default:focus { - @apply bg-primary-100 text-primary; + @apply bg-primary-100 text-primary-500; } .btn-primary { - @apply bg-primary text-white shadow; + @apply bg-primary-500 text-white shadow; } .btn-primary:hover { diff --git a/app/javascript/schools/components/SchoolCustomize.re b/app/javascript/schools/components/SchoolCustomize.re index 047a799a9b..2bb89c87c3 100644 --- a/app/javascript/schools/components/SchoolCustomize.re +++ b/app/javascript/schools/components/SchoolCustomize.re @@ -144,7 +144,7 @@ let footerLogo = (schoolName, logoOnDarkBg) => let editIcon = (additionalClasses, clickHandler, title) =>
type_="submit" key="sc-images-editor__update-button" disabled={updateButtonDisabled(state)} - className="btn btn-primary btn-large mt-6"> + className="btn btn-primary-500 btn-large mt-6"> {updateButtonText(state.updating) |> str}
diff --git a/app/javascript/schools/components/SchoolCustomize__LinksEditor.re b/app/javascript/schools/components/SchoolCustomize__LinksEditor.re index 9ef965a212..edf47fa636 100644 --- a/app/javascript/schools/components/SchoolCustomize__LinksEditor.re +++ b/app/javascript/schools/components/SchoolCustomize__LinksEditor.re @@ -143,7 +143,7 @@ let kindClasses = selected => { classes ++ ( selected ? - " nav-tab-item--selected text-primary bg-white hover:bg-white hover:text-primary" : + " nav-tab-item--selected text-primary-500 bg-white hover:bg-white hover:text-primary-500" : " text-grey-dark" ); }; diff --git a/app/javascript/schools/shared/shared.css b/app/javascript/schools/shared/shared.css index d573864cc6..e7eff63618 100644 --- a/app/javascript/schools/shared/shared.css +++ b/app/javascript/schools/shared/shared.css @@ -47,7 +47,7 @@ button:disabled, .disabled { } .toggle-input:checked+.toggle-label span { - @apply bg-primary; + @apply bg-primary-500; transform: translateX(20px); transition: all 0.2s cubic-bezier(0.8, 0.4, 0.3, 1.25), background 0.15s ease; box-shadow: 0 3px 8px rgba(79, 46, 220, 0.2); @@ -96,7 +96,7 @@ button:disabled, .disabled { .checkbox-label span:first-child:before { content: ""; - @apply bg-primary w-full h-full block opacity-100 rounded-full; + @apply bg-primary-500 w-full h-full block opacity-100 rounded-full; transform: scale(0); } @@ -105,11 +105,11 @@ button:disabled, .disabled { } .checkbox-label:hover span:first-child { - @apply bg-primary-100 border-primary; + @apply bg-primary-100 border-primary-500; } .checkbox-input:checked+.checkbox-label span:first-child { - @apply bg-primary border-primary; + @apply bg-primary-500 border-primary-500; animation: wave 0.4s ease; } @@ -281,7 +281,7 @@ button:disabled, .disabled { } .global-sidebar__primary-nav-link--active { - @apply .bg-grey-200 .text-primary; + @apply .bg-gray-200 .text-primary-500; box-shadow: inset 4px 0 0 0 theme('colors.yellow'); background-image: linear-gradient(to right, theme('colors.white'), theme('colors.grey-200')); } @@ -311,7 +311,7 @@ button:disabled, .disabled { } .global-sidebar__primary-nav-link--active:hover { - @apply .bg-grey-200 .text-primary; + @apply .bg-gray-200 .text-primary-500; } .blanket { diff --git a/app/views/home/styleguide.html.erb b/app/views/home/styleguide.html.erb index 95805bf3a7..0a70fafd8d 100644 --- a/app/views/home/styleguide.html.erb +++ b/app/views/home/styleguide.html.erb @@ -150,18 +150,18 @@
-
    -
  • +
  • Dropdown list text
    • -
  • +
  • Dropdown list text long
    • -
  • +
  • Dropdown list text looooong
diff --git a/postcss.config.js b/postcss.config.js index 614015d148..83271f942d 100644 --- a/postcss.config.js +++ b/postcss.config.js @@ -2,7 +2,7 @@ module.exports = { plugins: [ require("postcss-import"), require("postcss-flexbugs-fixes"), - require("tailwindcss")("./tailwind.config.js"), + require("tailwindcss"), require("postcss-preset-env")({ autoprefixer: { flexbox: "no-2009" diff --git a/tailwind.config.js b/tailwind.config.js index 2d7d53e987..fbec8773d1 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -3,6 +3,7 @@ const defaultTheme = require('tailwindcss/defaultTheme') module.exports = { theme: { colors: { + ...defaultTheme.colors, primary: { 100: '#F0EAFB', 200: '#D3BFF3',