generated from francoischasseur/matrix-template
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
add tailwind support and refactor dashboard to functional components
- Loading branch information
1 parent
a452e42
commit a9d5cfc
Showing
11 changed files
with
2,387 additions
and
1,225 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
| /** @type {import('postcss-load-config').Config} */ | ||
| const config = { | ||
| plugins: [ | ||
| require("postcss-import"), | ||
| require("postcss-prefix-selector")({ | ||
| prefix: ".addon", | ||
| transform: function (prefix, selector, prefixedSelector) { | ||
| if (selector.startsWith("html") || selector.startsWith("body")) { | ||
| return selector; | ||
| } | ||
| return prefixedSelector; | ||
| }, | ||
| }), | ||
| require("tailwindcss"), | ||
| require("autoprefixer"), | ||
| ], | ||
| }; | ||
|
|
||
| module.exports = config; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,22 +1,13 @@ | ||
| import { Component } from "react"; | ||
| import { DashboardProps, IProjectSettings } from "../../Interfaces"; | ||
| import { PageTitle } from "./PageTitle"; | ||
| import { DashboardProps } from "../../Interfaces"; | ||
| import { DashboardPageTitle } from "./DashboardPageTitle"; | ||
| import { Dashboard } from "../DashboardPage"; | ||
|
|
||
| export class DashboardPageContainer extends Component<DashboardProps> { | ||
| settings: IProjectSettings; | ||
| export const DashboardPageContainer = ({ dashboard }: DashboardProps) => ( | ||
| <> | ||
| <DashboardPageTitle title={dashboard.header.title} showFullScreen={dashboard.header.showFullScreen} /> | ||
|
|
||
| render() { | ||
| return ( | ||
| <div> | ||
| <div id="itemDetails" className="layoutContainer"> | ||
| <PageTitle | ||
| title={this.props.dashboard.header.title} | ||
| showFullScreen={this.props.dashboard.header.showFullScreen} | ||
| /> | ||
| <Dashboard settings={this.props.dashboard.dashboardContent.settings}></Dashboard> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } | ||
| } | ||
| <div className="overflow-y-auto overflow-x-hidden" style={{ height: "calc(100% - 50px)" }}> | ||
| <Dashboard settings={dashboard.dashboardContent.settings} /> | ||
| </div> | ||
| </> | ||
| ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| import { IHeader } from "../../Interfaces"; | ||
|
|
||
| export const DashboardPageTitle = ({ title, showFullScreen }: IHeader) => ( | ||
| <div className="py-2.5 px-4 rounded-tl-sm rounded-tr-sm w-full flex justify-between border-b border-gray-200"> | ||
| <div className="max-w-full flex flex-col gap-2 flex-grow-2"> | ||
| <span data-cy="title" className="font-light break-words text-[28px]"> | ||
| {title} | ||
| </span> | ||
| </div> | ||
|
|
||
| <div className="pull-right hidden-print tools-pull-right"> | ||
| <div className="btn-group toolbarButtons"> | ||
| {showFullScreen && ( | ||
| <div className="btn-group btn-dashboard-fullscreen"> | ||
| <button title="" data-original-title="Fullscreen" className="btn btn-item btn-fullscreen"> | ||
| <span className="fal fa-expand-arrows-alt"></span> | ||
| </button> | ||
| </div> | ||
| )} | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| /* You can add global styles to this file, and also import other style files */ | ||
|
|
||
| @tailwind base; | ||
| @tailwind components; | ||
| @tailwind utilities; | ||
|
|
||
| /* just a hack to rewrite the bootstrap 10px base font-size */ | ||
| /* don't even know why it's 10px cause in bootstrap v3 it was also 16px */ | ||
| /* looks like a bug in bootstrap file */ | ||
| /* looks like it's not breaking any styles in the app */ | ||
| html { | ||
| font-size: 16px; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| const plugin = require("tailwindcss/plugin"); | ||
|
|
||
| /** @type {import('tailwindcss').Config} */ | ||
| module.exports = { | ||
| content: ["src/**/*!(*.stories|*.spec).{ts,tsx,html}"], | ||
| theme: { | ||
| extend: {}, | ||
| }, | ||
| plugins: [require("@tailwindcss/forms")], | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters