diff --git a/app/Filament/Resources/TicketResource/Pages/ViewTicket.php b/app/Filament/Resources/TicketResource/Pages/ViewTicket.php index 1f05eb78..e1caf40d 100644 --- a/app/Filament/Resources/TicketResource/Pages/ViewTicket.php +++ b/app/Filament/Resources/TicketResource/Pages/ViewTicket.php @@ -4,8 +4,8 @@ namespace App\Filament\Resources\TicketResource\Pages; -use App\Filament\Resources\InterventionResource\Actions\ToggleStatusAction; use App\Filament\Resources\TicketResource; +use App\Filament\Resources\TicketResource\Actions\ToggleStatusAction; use Filament\Resources\Pages\ViewRecord; class ViewTicket extends ViewRecord diff --git a/app/Models/User.php b/app/Models/User.php index 985a06ca..1e69eb9e 100644 --- a/app/Models/User.php +++ b/app/Models/User.php @@ -36,7 +36,7 @@ class User extends Authenticatable implements FilamentUser 'phone', 'organization_id', 'source_of_information', - 'created_by' + 'created_by', ]; /** diff --git a/postcss.config.js b/postcss.config.js index 67cdf1a5..bfc1a9a8 100644 --- a/postcss.config.js +++ b/postcss.config.js @@ -1,5 +1,6 @@ module.exports = { plugins: { + 'tailwindcss/nesting': {}, tailwindcss: {}, autoprefixer: {}, }, diff --git a/resources/css/app.css b/resources/css/app.css index 125d1b72..f8001a0c 100644 --- a/resources/css/app.css +++ b/resources/css/app.css @@ -1,2 +1,3 @@ @import '../../vendor/filament/filament/resources/css/app.css'; +@import './tiptap.css'; @import "./typography.css"; diff --git a/resources/css/tiptap.css b/resources/css/tiptap.css new file mode 100644 index 00000000..3d28387d --- /dev/null +++ b/resources/css/tiptap.css @@ -0,0 +1,256 @@ +.prose { + .filament-tiptap-hurdle { + width: 100%; + max-width: 100vw; + padding-block: 1rem; + background-color: theme('colors.gray.100'); + position: relative; + + &::before, + &::after { + content: ''; + position: absolute; + display: block; + width: 100%; + top: 0; + bottom: 0; + background-color: inherit; + } + + &::before { + left: -100%; + } + + &::after { + right: -100%; + } + + &[data-color="gray_light"] { + color: theme('colors.gray.900'); + background-color: theme('colors.gray.300'); + } + + &[data-color="gray"] { + color: white; + background-color: theme('colors.gray.500'); + } + + &[data-color="gray_dark"] { + color: white; + background-color: theme('colors.gray.800'); + } + + &[data-color="primary"] { + color: theme('colors.gray.900'); + background-color: theme('colors.primary.500'); + } + + &[data-color="secondary"] { + color: theme('colors.gray.900'); + background-color: theme('colors.warning.500'); + } + + &[data-color="tertiary"] { + color: white; + background-color: theme('colors.success.500'); + } + + &[data-color="accent"] { + color: white; + background-color: theme('colors.danger.500'); + } + } + + .filament-tiptap-grid, + .filament-tiptap-grid-builder { + display: grid; + gap: 1rem; + box-sizing: border-box; + + .filament-tiptap-grid__column, + .filament-tiptap-grid-builder__column { + box-sizing: border-box; + border-style: dashed; + border-width: 1px; + border-color: theme("colors.gray.400"); + padding: 0.5rem; + border-radius: theme("borderRadius.DEFAULT"); + + > * + * { + margin-block-start: 1rem; + } + } + + &.ProseMirror-selectednode { + border-radius: theme("borderRadius.DEFAULT"); + outline-offset: 2px; + outline: theme("colors.gray.900") dashed 2px; + } + } + + .filament-tiptap-grid[type^="asymetric"] { + grid-template-columns: 1fr; + grid-template-rows: auto; + } + + @media (max-width: theme('screens.sm')) { + .filament-tiptap-grid-builder[data-stack-at="sm"] { + grid-template-columns: 1fr !important; + + .filament-tiptap-grid-builder__column { + grid-column: span 1 !important; + } + } + } + + @media (max-width: theme('screens.md')) { + .filament-tiptap-grid-builder[data-stack-at="md"] { + grid-template-columns: 1fr !important; + + .filament-tiptap-grid-builder__column { + grid-column: span 1 !important; + } + } + } + + @media (max-width: theme('screens.lg')) { + .filament-tiptap-grid-builder[data-stack-at="lg"] { + grid-template-columns: 1fr !important; + + .filament-tiptap-grid-builder__column { + grid-column: span 1 !important; + } + } + } + + .filament-tiptap-grid[type="asymetric-right-thirds"] { + @screen md { + grid-template-columns: 1fr 2fr; + } + } + + .filament-tiptap-grid[type="asymetric-left-thirds"] { + @screen md { + grid-template-columns: 2fr 1fr; + } + } + + .filament-tiptap-grid[type="asymetric-right-fourths"] { + @screen md { + grid-template-columns: 1fr 3fr; + } + } + + .filament-tiptap-grid[type="asymetric-left-fourths"] { + @screen md { + grid-template-columns: 3fr 1fr; + } + } + + .filament-tiptap-grid[type="responsive"] { + grid-template-columns: 1fr; + grid-template-rows: auto; + + &[cols="2"] { + @screen md { + grid-template-columns: repeat(2, 1fr); + } + } + + &[cols="3"] { + @screen md { + grid-template-columns: repeat(3, 1fr); + } + } + + &[cols="4"] { + @screen md { + grid-template-columns: repeat(2, 1fr); + } + + @screen lg { + grid-template-columns: repeat(4, 1fr); + } + } + + &[cols="5"] { + @screen md { + grid-template-columns: repeat(5, 1fr); + } + } + } + + .filament-tiptap-grid[type="fixed"] { + &[cols="2"] { + grid-template-columns: repeat(2, 1fr); + } + + &[cols="3"] { + grid-template-columns: repeat(3, 1fr); + } + + &[cols="4"] { + grid-template-columns: repeat(4, 1fr); + } + + &[cols="5"] { + grid-template-columns: repeat(5, 1fr); + } + } + + [data-youtube-video], + [data-vimeo-video], + [data-native-video] { + border: dashed 1px transparent; + + &.ProseMirror-selectednode { + border-radius: theme("borderRadius.DEFAULT"); + outline-offset: 2px; + outline: theme("colors.gray.900") dashed 2px; + } + + iframe, + video { + pointer-events: none; + } + } + + div[data-type="details"] { + box-sizing: border-box; + border-style: dashed; + border-width: 1px; + border-color: theme("colors.gray.400"); + border-radius: theme("borderRadius.DEFAULT"); + position: relative; + + button { + position: absolute; + z-index: 1; + top: 0.125rem; + right: 0.25rem; + color: theme("colors.gray.400"); + } + + summary { + padding: 0.375rem 0.5rem; + font-weight: 700; + border-bottom-style: solid; + border-bottom-width: 1px; + border-bottom-color: theme("colors.gray.200"); + + &::marker { + content: ""; + display: none; + } + } + + div[data-type="details-content"] { + padding: 0.5rem; + height: auto; + + > * + * { + margin-block-start: 1rem; + } + } + } +}