Setup tailwind; create base template #554
Conversation
|
Shouldn't this be against a new branch? |
| @@ -44,7 +48,10 @@ module.exports = { | |||
| loader: 'postcss-loader', | |||
| options: { | |||
| postcssOptions: { | |||
| plugins: ['postcss-preset-env', 'autoprefixer', 'pixrem'], | |||
There was a problem hiding this comment.
Are we no longer using the removed plugins?
There was a problem hiding this comment.
Both pixrem and postcss-preset-env are relevant when we had raw css. With tailwindcss there should be no need for these. All the UI pages that got built by yume-labs used this config and no issue tied to this was observed. So I think it's a safe change
| { | ||
| test: /\.js$/, | ||
| exclude: /node_modules/, |
There was a problem hiding this comment.
what does this change do?
There was a problem hiding this comment.
note_modules is generated by npm/yarn and are already prebuilt, so this just excludes running babel-loader on them in the build process. So, it it should just improve the build speed without affecting anything
| @@ -30,9 +34,9 @@ module.exports = { | |||
| ], | |||
| module: { | |||
| rules: [ | |||
| // we pass the output from babel loader to react-hot loader | |||
There was a problem hiding this comment.
Is this no longer true?
There was a problem hiding this comment.
We do, I think I removed some comments as I edited the file. I can add back
| <div class="h-5 w-full mt-16"></div> | ||
| <main id="content" class="md:max-w-screen-2xl mx-auto"> | ||
| {% block content %} | ||
| {% endblock %} |
There was a problem hiding this comment.
Our current base template includes blocks for messages, modals, and inline js. Do we no longer need those, will they be added elsewhere, or just added later to the base?
There was a problem hiding this comment.
They will be added in the PRs that need it.
| </div> | ||
|
|
||
| <!-- Selected --> | ||
| <!-- {% if sidenav_active == name %} --> |
There was a problem hiding this comment.
Should this be commented out?
There was a problem hiding this comment.
I commented it out when I tried to test active state, forgot to uncomment. Done that
| <div x-show="open" x-transition.opacity x-cloak class="absolute top-12 right-0 min-w-56 bg-white shadow rounded-lg z-50"> | ||
| <ul class="p-2 w-full"> | ||
| <li class="p-2 hover:bg-gray-100 rounded cursor-pointer text-left"> | ||
| <p class="text-brand-deep-purple text-sm font-medium">Meca Healthcare</p> |
There was a problem hiding this comment.
Looks like there is hardcoded data here
There was a problem hiding this comment.
These are added as placeholder here, they are getting overridden in #555
|
|
||
| <!-- User Profile Selector --> | ||
| <div x-show="open" x-transition.opacity x-cloak class="absolute top-12 right-0 min-w-56 w-56 bg-white shadow rounded-lg z-50"> | ||
| <ul class="p-2 w-full"> |
There was a problem hiding this comment.
Where do these items go?
| {% url 'program:home' request.org.slug as program_home_url %} | ||
| {% include "tailwind/components/sidenav-items.html" with name='Programs' icon='table-columns' target=program_home_url %} | ||
| {% include "tailwind/components/sidenav-items.html" with name='Opportunities' icon='table-cells-large' target='/opportunities' %} | ||
| {% include "tailwind/components/sidenav-items.html" with name='Analytics' icon='chart-pie' target='/analytics' %} |
There was a problem hiding this comment.
I thought we were skipping this one?
There was a problem hiding this comment.
I didn't get a confirmation yet on this. I can remove it once Rama confirms
| </div> | ||
|
|
||
| <!-- Bottom Section --> | ||
| <div> |
There was a problem hiding this comment.
Where do these items go?
There was a problem hiding this comment.
Bottom left in the attached screenshot, perhaps the settings need to be removed.
Is it possible to include a screenshot of this? |
|
Updated. |
Product Description
This sets up
Technical Summary
Safety Assurance
Safety story
Automated test coverage
QA Plan
Labels & Review