fix: add underline and semibold font weight for prose links to have them stand out

+ fix typo: "whitespace-no-wrap" --> "whitespace-nowrap"
This commit is contained in:
Yassine Doghri 2022-07-22 16:45:11 +00:00
parent fab916ee8a
commit d4d867121c
5 changed files with 29 additions and 4 deletions

View File

@ -55,7 +55,7 @@ if (! function_exists('data_table')) {
$table = new Table();
$template = [
'table_open' => '<table class="w-full whitespace-no-wrap">',
'table_open' => '<table class="w-full whitespace-nowrap">',
'thead_open' =>
'<thead class="text-xs font-semibold text-left uppercase text-skin-muted">',

View File

@ -53,7 +53,7 @@ class DropdownMenu extends Component
return <<<HTML
<nav id="{$this->id}"
class="absolute z-50 flex flex-col py-2 whitespace-no-wrap rounded-lg text-skin-base border-contrast bg-elevated border-3"
class="absolute z-50 flex flex-col py-2 rounded-lg whitespace-nowrap text-skin-base border-contrast bg-elevated border-3"
aria-labelledby="{$this->labelledby}"
data-dropdown="menu"
data-dropdown-placement="{$this->placement}"

View File

@ -1,5 +1,6 @@
/* eslint-disable */
const defaultTheme = require("tailwindcss/defaultTheme");
const { nodeModuleNameResolver } = require("typescript");
/** @type {import('tailwindcss').Config} */
module.exports = {
@ -113,6 +114,30 @@ module.exports = {
ringWidth: {
3: "3px",
},
typography: {
DEFAULT: {
css: {
a: {
textDecoration: "underline",
fontWeight: 600,
"&:hover": {
textDecoration: "none",
},
},
},
},
sm: {
css: {
a: {
textDecoration: "underline",
fontWeight: 600,
"&:hover": {
textDecoration: "none",
},
},
},
},
},
},
},
variants: {},

View File

@ -72,7 +72,7 @@
[
'type' => 'html',
'content' => esc(<<<CODE_SAMPLE
<nav class="flex flex-col py-2 whitespace-no-wrap">
<nav class="flex flex-col py-2 whitespace-nowrap">
<span class="px-4 mb-2 text-xs font-semibold tracking-wider uppercase text-skin-muted">{$interactAsText}</span>
<form action="{$route}" method="POST" class="flex flex-col">
{$csrfField}

View File

@ -67,7 +67,7 @@
[
'type' => 'html',
'content' => esc(<<<CODE_SAMPLE
<nav class="flex flex-col py-2 whitespace-no-wrap">
<nav class="flex flex-col py-2 whitespace-nowrap">
<span class="px-4 mb-2 text-xs font-semibold tracking-wider uppercase text-skin-muted">{$interactAsText}</span>
<form action="{$route}" method="POST" class="flex flex-col">
{$csrfField}