Datebadge
Datebadge
20
Feb
<!-- datebadge.blade.php -->
<div class="c-datebadge c-datebadge--md" data-uid="67b77e4c1a444">
<div class="c-datebadge__daymonth">
<!-- typography.blade.php original: span -->
<span class="c-typography c-datebadge__date c-typography__variant--h1" data-uid="67b77e4c1a4a8">
20
</span> <!-- typography.blade.php original: span -->
<span class="c-typography c-datebadge__month c-typography__variant--h4" data-uid="67b77e4c1a4f6">
Feb
</span> </div>
</div>
@datebadge([
'date' => date("Y-m-d")
])
@enddatebadge
Datebadge
20
Feb
<!-- datebadge.blade.php -->
<div class="c-datebadge c-datebadge--sm" data-uid="67b77e4c1a6e9">
<div class="c-datebadge__daymonth">
<!-- typography.blade.php original: span -->
<span class="c-typography c-datebadge__date c-typography__variant--h1" data-uid="67b77e4c1a717">
20
</span> <!-- typography.blade.php original: span -->
<span class="c-typography c-datebadge__month c-typography__variant--h4" data-uid="67b77e4c1a743">
Feb
</span> </div>
</div>
@datebadge([
'date' => date("Y-m-d"),
'size' => 'sm'
])
@enddatebadge
Datebadge with time
20
Feb
<!-- datebadge.blade.php -->
<div class="c-datebadge c-datebadge--md" data-uid="67b77e4c1a910">
<div class="c-datebadge__daymonth">
<!-- typography.blade.php original: span -->
<span class="c-typography c-datebadge__date c-typography__variant--h1" data-uid="67b77e4c1a93a">
20
</span> <!-- typography.blade.php original: span -->
<span class="c-typography c-datebadge__month c-typography__variant--h4" data-uid="67b77e4c1a96e">
Feb
</span> </div>
<div class="c-datebadge__time">
<!-- icon.blade.php -->
<span class="c-icon c-icon--access-time c-icon--material c-icon--material-access_time material-symbols material-symbols-rounded material-symbols-sharp material-symbols-outlined c-icon--size-inherit" material-symbol="access_time" role="img" data-nosnippet="" translate="no" aria-label="Icon: Undefined" alt="Icon: Undefined" aria-hidden="false" data-uid="67b77e4c1aa81">
</span>
<!-- typography.blade.php original: span -->
<span class="c-typography c-typography__variant--meta" data-uid="67b77e4c1aace">
19:11
</span> </div>
</div>
@datebadge([
'date' => date("Y-m-d H:i:s"),
'includeTime' => true
])
@enddatebadge
Datebadge with time, small variant
20
Feb
<!-- datebadge.blade.php -->
<div class="c-datebadge c-datebadge--sm" data-uid="67b77e4c1ad84">
<div class="c-datebadge__daymonth">
<!-- typography.blade.php original: span -->
<span class="c-typography c-datebadge__date c-typography__variant--h1" data-uid="67b77e4c1addf">
20
</span> <!-- typography.blade.php original: span -->
<span class="c-typography c-datebadge__month c-typography__variant--h4" data-uid="67b77e4c1ae2f">
Feb
</span> </div>
<div class="c-datebadge__time">
<!-- icon.blade.php -->
<span class="c-icon c-icon--access-time c-icon--material c-icon--material-access_time material-symbols material-symbols-rounded material-symbols-sharp material-symbols-outlined c-icon--size-inherit" material-symbol="access_time" role="img" data-nosnippet="" translate="no" aria-label="Icon: Undefined" alt="Icon: Undefined" aria-hidden="false" data-uid="67b77e4c1ae91">
</span>
<!-- typography.blade.php original: span -->
<span class="c-typography c-typography__variant--meta" data-uid="67b77e4c1aef3">
19:11
</span> </div>
</div>
@datebadge([
'date' => date("Y-m-d H:i:s"),
'includeTime' => true,
'size' => 'sm'
])
@enddatebadge
Blade component parameters
Key | Default value | Type | Available values | Description |
date | false | boolean | - | A date string in any format. |
includeTime | false | boolean | - | Will add a box with timestamp below the date. |
size | md | string | - | The size of the datebadge. Can be either 'sm' or 'md'. |
id | string | - | The DOM id of the component. | |
classList | [] | array | - | Array containing wrapping classes array |
attributeList | [] | array | - | Array containing keys and values rendered as attributes |
containerAware | false | boolean | true/false | Makes the component container aware. Appends modifiers --size--xs/sm/md/lg to the component. |