diff --git a/packages/javascript-fun/package.json b/packages/javascript-fun/package.json index 8c90a1d..24603b6 100644 --- a/packages/javascript-fun/package.json +++ b/packages/javascript-fun/package.json @@ -23,7 +23,7 @@ "@types/react": "^18.2.7", "@types/react-dom": "^18.2.4", "app-constant": "1.0.0", - "autoprefixer": "^10.4.14", + "autoprefixer": "^10.4.16", "classnames": "^2.3.1", "clean-webpack-plugin": "^4.0.0", "css-loader": "^6.8.1", @@ -34,11 +34,12 @@ "less-loader": "^11.1.1", "mini-css-extract-plugin": "^2.7.6", "numeral": "^2.0.6", - "postcss": "^8.4.24", + "postcss": "^8.4.31", "postcss-loader": "^7.3.2", - "purecss": "^3.0.0", "react": "^18.2.0", "react-dom": "^18.2.0", + "style-loader": "^3.3.3", + "tailwindcss": "^3.3.5", "ts-loader": "^9.4.3", "typed.js": "^2.0.16", "webpack": "^5.84.1", diff --git a/packages/javascript-fun/src/client/layout/tw.css b/packages/javascript-fun/src/client/layout/tw.css new file mode 100644 index 0000000..6d0843a --- /dev/null +++ b/packages/javascript-fun/src/client/layout/tw.css @@ -0,0 +1,42 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +@layer base { + h1 { + font-size: 2.4em; + } + + h2 { + font-size: 1.25em; + } + h3 { + font-size: 1.125em; + } + a, + p, + span { + font-size: 0.875em; + } + @media only screen and (min-width: 768px) and (max-width: 1023px) { + h1 { + font-size: 1.3em; + } + } + @media (max-width: 767px) { + h1 { + font-size: 1.1em; + } + h2 { + font-size: 1em; + } + h3 { + font-size: 0.875em; + } + a, + p, + span { + font-size: 0.75em; + } + } +} diff --git a/packages/javascript-fun/src/components/AppContainer/Layout/components/AdUnit/index.tsx b/packages/javascript-fun/src/components/AppContainer/Layout/components/AdUnit/index.tsx index 97598b0..5b74a46 100644 --- a/packages/javascript-fun/src/components/AppContainer/Layout/components/AdUnit/index.tsx +++ b/packages/javascript-fun/src/components/AppContainer/Layout/components/AdUnit/index.tsx @@ -1,5 +1,4 @@ import { FC } from 'react'; -import style from './style.less'; interface AdUnitProps { slot: string; @@ -7,7 +6,7 @@ interface AdUnitProps { } const AdUnit: FC = ({ client, slot }) => ( -
+