CHANGELOG.md

@@ -5,8 +5,6 @@
 - Add language in user settings. The `LOCALE` environment variable will continue
   to set the default locale for the application.
 - Add involvement links to home page
-- Fix button text-wrapping
-- Update dependencies
 
 # v0.5.1
 - Add French translation: Thank you [duponin](https://udongein.xyz/users/duponin)!

assets/css/components.scss

@@ -25,7 +25,7 @@
   }
 
   .btn {
-    @apply inline-block break-words min-w-4;
+    @apply inline-block break-all min-w-4;
     @apply focus:outline-none px-4 py-2 rounded-lg;
     @apply shadow-sm focus:shadow-lg;
     @apply transition-all duration-300 ease-in-out;

assets/package.json

@@ -19,7 +19,7 @@
   "devDependencies": {
     "@babel/core": "^7.15.0",
     "@babel/preset-env": "^7.15.0",
-    "autoprefixer": "^10.4.7",
+    "autoprefixer": "^10.2.6",
     "babel-loader": "^8.2.2",
     "copy-webpack-plugin": "^9.0.0",
     "css-loader": "^5.2.7",
@@ -28,14 +28,14 @@
     "hard-source-webpack-plugin": "^0.13.1",
     "mini-css-extract-plugin": "^1.6.0",
     "node-sass": "^7.0.1",
-    "postcss": "^8.4.13",
+    "postcss": "^8.3.6",
     "postcss-import": "^14.0.2",
     "postcss-loader": "^6.1.1",
     "postcss-preset-env": "^7.3.1",
     "sass-loader": "^12.1.0",
     "standard": "^16.0.4",
     "style-loader": "^3.2.1",
-    "tailwindcss": "^3.0.24",
+    "tailwindcss": "^2.2.7",
     "terser-webpack-plugin": "^5.1.3",
     "webpack": "^5.67.0",
     "webpack-cli": "^4.8.0",

assets/tailwind.config.js

@@ -1,18 +1,24 @@
 const colors = require('tailwindcss/colors')
 
 module.exports = {
-  content: [
-    '../lib/**/*.{ex,heex,leex,eex}',
+  purge: [
+    '../lib/**/*.ex',
+    '../lib/**/*.heex',
+    '../lib/**/*.leex',
+    '../lib/**/*.eex',
     './js/**/*.js'
   ],
+  darkMode: 'media',
   theme: {
     colors: {
       transparent: 'transparent',
       current: 'currentColor',
+
       primary: colors.gray,
+
       black: colors.black,
       white: colors.white,
-      gray: colors.neutral,
+      gray: colors.trueGray,
       indigo: colors.indigo,
       red: colors.rose,
       yellow: colors.amber
@@ -39,5 +45,11 @@ module.exports = {
       }
     }
   },
+  variants: {
+    extend: {
+      backgroundColor: ['active'],
+      borderColor: ['active']
+    }
+  },
   plugins: []
 }