F
Filament•3mo ago
Citizen

Why are my dashboard panels so small?

I've got a new setup and added a few plugins and added my first User resource. My dashboard panels look like this attachment. Kinda funky right? Do I need to do something?
No description
5 Replies
Dennis Koch
Dennis Koch•3mo ago
No worries. Size doesn't matter. Jokes aside: Looks like some CSS is missing/broken. Did you run php filament:assets or php filament:upgrade ? Did you check DevTools for errors? Can you share php artisan about --only=filament output?
Citizen
CitizenOP•3mo ago
No worries. Size doesn't matter. I tried explaining this to my wife but apparently she's not a filament expert. I did run both assets and upgrade, and they're part of my composer.json scripts. I just realized that these widgets are generated by overlook. I think I did follow the steps and I made a custom theme. That theme file is just this: 
@import '/vendor/filament/filament/resources/css/theme.css';

@config 'tailwind.config.js';
@import '/vendor/filament/filament/resources/css/theme.css';

@config 'tailwind.config.js';
and my tailwind config: 
import preset from '../../../../vendor/filament/filament/tailwind.config.preset'

export default {
    presets: [preset],
    content: [
        './app/Filament/**/*.php',
        './resources/views/filament/**/*.blade.php',
        './vendor/filament/**/*.blade.php',
    ],
}
import preset from '../../../../vendor/filament/filament/tailwind.config.preset'

export default {
    presets: [preset],
    content: [
        './app/Filament/**/*.php',
        './resources/views/filament/**/*.blade.php',
        './vendor/filament/**/*.blade.php',
    ],
}
about yields this: 
Filament .......................................................................................  
  Blade Icons ............................................................................. CACHED  
  Packages ....................................... filament, forms, notifications, support, tables  
  Panel Components ........................................................................ CACHED  
  Version ............................................................................... v3.2.139  
  Views ............................................................................ NOT PUBLISHED
Filament .......................................................................................  
  Blade Icons ............................................................................. CACHED  
  Packages ....................................... filament, forms, notifications, support, tables  
  Panel Components ........................................................................ CACHED  
  Version ............................................................................... v3.2.139  
  Views ............................................................................ NOT PUBLISHED
KingStalker
KingStalker•3mo ago
@Citizen lol "No worries. Size doesn't matter. I tried explaining this to my wife but apparently she's not a filament expert."
Dennis Koch
Dennis Koch•3mo ago
You are missing this part from the Overlook install docs then:
No description
Citizen
CitizenOP•3mo ago
My bad, the tailwind config I pasted was the one from my admin panel, not the overall, I'll check the real one Here's my actual tailwind config: 
import defaultTheme from 'tailwindcss/defaultTheme';
import forms from '@tailwindcss/forms';
import typography from '@tailwindcss/typography';

/** @type {import('tailwindcss').Config} */
export default {
    content: [
        './vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
        './vendor/laravel/jetstream/**/*.blade.php',
        './storage/framework/views/*.php',
        './resources/views/**/*.blade.php',
        './vendor/awcodes/overlook/resources/**/*.blade.php',
    ],

    theme: {
        extend: {
            fontFamily: {
                sans: ['Figtree', ...defaultTheme.fontFamily.sans],
            },
        },
    },

    plugins: [forms, typography],
};
import defaultTheme from 'tailwindcss/defaultTheme';
import forms from '@tailwindcss/forms';
import typography from '@tailwindcss/typography';

/** @type {import('tailwindcss').Config} */
export default {
    content: [
        './vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
        './vendor/laravel/jetstream/**/*.blade.php',
        './storage/framework/views/*.php',
        './resources/views/**/*.blade.php',
        './vendor/awcodes/overlook/resources/**/*.blade.php',
    ],

    theme: {
        extend: {
            fontFamily: {
                sans: ['Figtree', ...defaultTheme.fontFamily.sans],
            },
        },
    },

    plugins: [forms, typography],
};
Oh snap, you were right but in the other direction. I needed to add it to my admin tailwind config, not the project root one. Thank you!!!

Did you find this page helpful?