feat: Dark Mode (#7471)
This commit is contained in:
Sivin Varghese
@@ -2,13 +2,7 @@
|
||||
<div v-on-clickaway="onCloseAgentList" class="bulk-action__agents">
|
||||
<div class="triangle">
|
||||
<svg height="12" viewBox="0 0 24 12" width="24">
|
||||
<path
|
||||
d="M20 12l-8-8-12 12"
|
||||
fill="var(--white)"
|
||||
fill-rule="evenodd"
|
||||
stroke="var(--s-50)"
|
||||
stroke-width="1px"
|
||||
/>
|
||||
<path d="M20 12l-8-8-12 12" fill-rule="evenodd" stroke-width="1px" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="header flex-between">
|
||||
@@ -190,110 +184,73 @@ export default {
|
||||
|
||||
<style scoped lang="scss">
|
||||
.bulk-action__agents {
|
||||
background-color: var(--white);
|
||||
border-radius: var(--border-radius-large);
|
||||
border: 1px solid var(--s-50);
|
||||
box-shadow: var(--shadow-dropdown-pane);
|
||||
max-width: 75%;
|
||||
position: absolute;
|
||||
right: var(--space-small);
|
||||
top: var(--space-larger);
|
||||
transform-origin: top right;
|
||||
width: auto;
|
||||
z-index: var(--z-index-twenty);
|
||||
min-width: var(--space-giga);
|
||||
@apply max-w-[75%] absolute right-2 top-12 origin-top-right w-auto z-20 min-w-[15rem] bg-white dark:bg-slate-800 rounded-lg border border-solid border-slate-50 dark:border-slate-700 shadow-md;
|
||||
.header {
|
||||
padding: var(--space-one);
|
||||
@apply p-2.5;
|
||||
|
||||
span {
|
||||
font-size: var(--font-size-small);
|
||||
font-weight: var(--font-weight-medium);
|
||||
@apply text-sm font-medium;
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
max-height: var(--space-giga);
|
||||
overflow-y: auto;
|
||||
@apply overflow-y-auto max-h-[15rem];
|
||||
.agent__list-container {
|
||||
height: 100%;
|
||||
@apply h-full;
|
||||
}
|
||||
.agent-list-search {
|
||||
padding: 0 var(--space-one);
|
||||
border: 1px solid var(--s-100);
|
||||
border-radius: var(--border-radius-medium);
|
||||
background-color: var(--s-50);
|
||||
@apply py-0 px-2.5 bg-slate-50 dark:bg-slate-900 border border-solid border-slate-100 dark:border-slate-600/70 rounded-md;
|
||||
.search-icon {
|
||||
color: var(--s-400);
|
||||
@apply text-slate-400 dark:text-slate-200;
|
||||
}
|
||||
|
||||
.agent--search_input {
|
||||
border: 0;
|
||||
font-size: var(--font-size-mini);
|
||||
margin: 0;
|
||||
background-color: transparent;
|
||||
height: unset;
|
||||
@apply border-0 text-xs m-0 dark:bg-transparent bg-transparent h-[unset];
|
||||
}
|
||||
}
|
||||
}
|
||||
.triangle {
|
||||
display: block;
|
||||
z-index: var(--z-index-one);
|
||||
position: absolute;
|
||||
top: var(--space-minus-slab);
|
||||
right: var(--triangle-position);
|
||||
text-align: left;
|
||||
@apply block z-10 absolute -top-3 text-left;
|
||||
|
||||
svg path {
|
||||
@apply fill-white dark:fill-slate-800 stroke-slate-50 dark:stroke-slate-600/50;
|
||||
}
|
||||
}
|
||||
}
|
||||
ul {
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
@apply m-0 list-none;
|
||||
|
||||
li {
|
||||
&:last-child {
|
||||
.agent-list-item {
|
||||
@apply last:rounded-b-lg;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.agent-list-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: var(--space-one);
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background-color: var(--s-50);
|
||||
}
|
||||
@apply flex items-center p-2.5 cursor-pointer hover:bg-slate-50 dark:hover:bg-slate-900;
|
||||
span {
|
||||
font-size: var(--font-size-small);
|
||||
@apply text-sm;
|
||||
}
|
||||
}
|
||||
|
||||
.agent-confirmation-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
padding: var(--space-one);
|
||||
@apply flex flex-col h-full p-2.5;
|
||||
p {
|
||||
flex-grow: 1;
|
||||
@apply flex-grow;
|
||||
}
|
||||
.agent-confirmation-actions {
|
||||
width: 100%;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: var(--space-one);
|
||||
@apply w-full grid grid-cols-2 gap-2.5;
|
||||
}
|
||||
}
|
||||
.search-container {
|
||||
padding: 0 var(--space-one);
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: var(--z-index-twenty);
|
||||
background-color: var(--white);
|
||||
@apply py-0 px-2.5 sticky top-0 z-20 bg-white dark:bg-slate-800;
|
||||
}
|
||||
|
||||
.agent__list-loading {
|
||||
height: calc(95% - var(--space-one));
|
||||
margin: var(--space-one);
|
||||
border-radius: var(--border-radius-medium);
|
||||
background-color: var(--s-50);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
padding: var(--space-two);
|
||||
@apply m-2.5 rounded-md bg-slate-25 dark:bg-slate-900 flex items-center justify-center flex-col p-5 h-[calc(95%-6.25rem)];
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -194,33 +194,23 @@ export default {
|
||||
}
|
||||
|
||||
.bulk-action__container {
|
||||
border-bottom: 1px solid var(--s-100);
|
||||
padding: var(--space-normal);
|
||||
position: relative;
|
||||
@apply p-4 relative border-b border-solid border-slate-100 dark:border-slate-600/70;
|
||||
}
|
||||
|
||||
.bulk-action__panel {
|
||||
cursor: pointer;
|
||||
@apply cursor-pointer;
|
||||
|
||||
span {
|
||||
font-size: var(--font-size-mini);
|
||||
margin: 0 var(--space-smaller);
|
||||
@apply text-xs my-0 mx-1;
|
||||
}
|
||||
|
||||
input[type='checkbox'] {
|
||||
cursor: pointer;
|
||||
margin: var(--space-zero);
|
||||
@apply cursor-pointer m-0;
|
||||
}
|
||||
}
|
||||
|
||||
.bulk-action__alert {
|
||||
background-color: var(--y-50);
|
||||
border-radius: var(--border-radius-small);
|
||||
border: 1px solid var(--y-300);
|
||||
color: var(--y-700);
|
||||
font-size: var(--font-size-mini);
|
||||
margin-top: var(--space-small);
|
||||
padding: var(--space-smaller) var(--space-small);
|
||||
@apply bg-yellow-50 text-yellow-700 rounded text-xs mt-2 py-1 px-2 border border-solid border-yellow-300 dark:border-yellow-300/10 dark:bg-yellow-200/20 dark:text-yellow-400;
|
||||
}
|
||||
|
||||
.popover-animation-enter-active,
|
||||
@@ -229,23 +219,23 @@ export default {
|
||||
}
|
||||
|
||||
.popover-animation-enter {
|
||||
opacity: 0;
|
||||
transform: scale(0.95);
|
||||
@apply opacity-0;
|
||||
}
|
||||
|
||||
.popover-animation-enter-to {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
@apply opacity-100;
|
||||
}
|
||||
|
||||
.popover-animation-leave {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
@apply opacity-100;
|
||||
}
|
||||
|
||||
.popover-animation-leave-to {
|
||||
opacity: 0;
|
||||
transform: scale(0.95);
|
||||
@apply opacity-0;
|
||||
}
|
||||
|
||||
.label-actions-box {
|
||||
|
||||
@@ -2,13 +2,7 @@
|
||||
<div v-on-clickaway="onClose" class="labels-container">
|
||||
<div class="triangle">
|
||||
<svg height="12" viewBox="0 0 24 12" width="24">
|
||||
<path
|
||||
d="M20 12l-8-8-12 12"
|
||||
fill="var(--white)"
|
||||
fill-rule="evenodd"
|
||||
stroke="var(--s-50)"
|
||||
stroke-width="1px"
|
||||
/>
|
||||
<path d="M20 12l-8-8-12 12" fill-rule="evenodd" stroke-width="1px" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="header flex-between">
|
||||
@@ -50,7 +44,11 @@
|
||||
:value="label.title"
|
||||
class="label-checkbox"
|
||||
/>
|
||||
<span class="label-title text-truncate">{{ label.title }}</span>
|
||||
<span
|
||||
class="label-title overflow-hidden whitespace-nowrap text-ellipsis"
|
||||
>
|
||||
{{ label.title }}
|
||||
</span>
|
||||
<span
|
||||
class="label-pill"
|
||||
:style="{ backgroundColor: label.color }"
|
||||
@@ -61,6 +59,7 @@
|
||||
<footer class="labels-list__footer">
|
||||
<woot-button
|
||||
size="small"
|
||||
is-expanded
|
||||
color-scheme="primary"
|
||||
:disabled="!selectedLabels.length"
|
||||
@click="$emit('assign', selectedLabels)"
|
||||
@@ -108,178 +107,115 @@ export default {
|
||||
|
||||
<style scoped lang="scss">
|
||||
.labels-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-height: var(--space-giga);
|
||||
min-height: auto;
|
||||
@apply flex flex-col max-h-[15rem] min-h-[auto];
|
||||
|
||||
.labels-list__header {
|
||||
background-color: var(--white);
|
||||
padding: 0 var(--space-one);
|
||||
@apply bg-white dark:bg-slate-800 py-0 px-2.5;
|
||||
}
|
||||
|
||||
.labels-list__body {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: var(--space-one) 0;
|
||||
@apply flex-1 overflow-y-auto py-2.5 mx-0;
|
||||
}
|
||||
|
||||
.labels-list__footer {
|
||||
padding: var(--space-small);
|
||||
@apply p-2;
|
||||
|
||||
button {
|
||||
width: 100%;
|
||||
@apply w-full;
|
||||
|
||||
.button__content {
|
||||
@apply text-center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.label-list-search {
|
||||
background-color: var(--s-50);
|
||||
border-radius: var(--border-radius-medium);
|
||||
border: 1px solid var(--s-100);
|
||||
padding: 0 var(--space-one);
|
||||
@apply bg-slate-50 dark:bg-slate-900 py-0 px-2.5 border border-solid border-slate-100 dark:border-slate-600/70 rounded-md;
|
||||
|
||||
.search-icon {
|
||||
color: var(--s-400);
|
||||
@apply text-slate-400 dark:text-slate-200;
|
||||
}
|
||||
|
||||
.label--search_input {
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
font-size: var(--font-size-mini);
|
||||
height: unset;
|
||||
margin: 0;
|
||||
@apply border-0 text-xs m-0 dark:bg-transparent bg-transparent h-[unset];
|
||||
}
|
||||
}
|
||||
|
||||
.labels-container {
|
||||
background-color: var(--white);
|
||||
border-radius: var(--border-radius-large);
|
||||
border: 1px solid var(--s-50);
|
||||
box-shadow: var(--shadow-dropdown-pane);
|
||||
max-width: var(--space-giga);
|
||||
min-width: var(--space-giga);
|
||||
position: absolute;
|
||||
right: var(--space-small);
|
||||
top: var(--space-larger);
|
||||
transform-origin: top right;
|
||||
width: auto;
|
||||
z-index: var(--z-index-twenty);
|
||||
@apply absolute right-2 top-12 origin-top-right w-auto z-20 max-w-[15rem] min-w-[15rem] bg-white dark:bg-slate-800 rounded-lg border border-solid border-slate-50 dark:border-slate-700 shadow-md;
|
||||
|
||||
.header {
|
||||
padding: var(--space-one);
|
||||
@apply p-2.5;
|
||||
|
||||
span {
|
||||
font-size: var(--font-size-small);
|
||||
font-weight: var(--font-weight-medium);
|
||||
@apply text-sm font-medium;
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
max-height: var(--space-giga);
|
||||
overflow-y: auto;
|
||||
@apply max-h-[15rem] overflow-y-auto;
|
||||
|
||||
.label__list-container {
|
||||
height: 100%;
|
||||
}
|
||||
.label-list-search {
|
||||
padding: 0 var(--space-one);
|
||||
border: 1px solid var(--s-100);
|
||||
border-radius: var(--border-radius-medium);
|
||||
background-color: var(--s-50);
|
||||
.search-icon {
|
||||
color: var(--s-400);
|
||||
}
|
||||
|
||||
.label--search_input {
|
||||
border: 0;
|
||||
font-size: var(--font-size-mini);
|
||||
margin: 0;
|
||||
background-color: transparent;
|
||||
height: unset;
|
||||
}
|
||||
@apply h-full;
|
||||
}
|
||||
}
|
||||
|
||||
.triangle {
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: var(--triangle-position);
|
||||
text-align: left;
|
||||
top: var(--space-minus-slab);
|
||||
z-index: var(--z-index-one);
|
||||
@apply block z-10 absolute text-left -top-3;
|
||||
|
||||
svg path {
|
||||
@apply fill-white dark:fill-slate-800 stroke-slate-50 dark:stroke-slate-600/50;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
@apply m-0 list-none;
|
||||
}
|
||||
|
||||
.labels-placeholder {
|
||||
padding: var(--space-small);
|
||||
@apply p-2;
|
||||
}
|
||||
|
||||
.label__list-item {
|
||||
margin: var(--space-smaller) 0;
|
||||
padding: 0 var(--space-one);
|
||||
@apply my-1 mx-0 py-0 px-2.5;
|
||||
|
||||
.item {
|
||||
align-items: center;
|
||||
border-radius: var(--border-radius-medium);
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
padding: var(--space-smaller) var(--space-one);
|
||||
|
||||
&:hover {
|
||||
background-color: var(--s-50);
|
||||
}
|
||||
@apply items-center rounded-md cursor-pointer flex py-1 px-2.5 hover:bg-slate-50 dark:hover:bg-slate-900;
|
||||
|
||||
&.label-selected {
|
||||
background-color: var(--s-50);
|
||||
@apply bg-slate-50 dark:bg-slate-900;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: var(--font-size-small);
|
||||
@apply text-sm;
|
||||
}
|
||||
|
||||
.label-checkbox {
|
||||
margin: 0 var(--space-one) 0 0;
|
||||
@apply my-0 mr-2.5 ml-0;
|
||||
}
|
||||
|
||||
.label-title {
|
||||
flex-grow: 1;
|
||||
width: 100%;
|
||||
@apply flex-grow w-full;
|
||||
}
|
||||
|
||||
.label-pill {
|
||||
background-color: var(--s-50);
|
||||
border-radius: var(--border-radius-medium);
|
||||
height: var(--space-slab);
|
||||
width: var(--space-slab);
|
||||
flex-shrink: 0;
|
||||
border: 1px solid var(--color-border-light);
|
||||
@apply bg-slate-50 rounded-md h-3 w-3 flex-shrink-0 border border-solid border-slate-50 dark:border-slate-900;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-container {
|
||||
background-color: var(--white);
|
||||
padding: 0 var(--space-one);
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: var(--z-index-twenty);
|
||||
@apply bg-white py-0 px-2.5 sticky top-0 z-20;
|
||||
}
|
||||
|
||||
.actions-container {
|
||||
background-color: var(--white);
|
||||
bottom: 0;
|
||||
padding: var(--space-small);
|
||||
position: sticky;
|
||||
z-index: var(--z-index-twenty);
|
||||
@apply bg-white dark:bg-slate-900 bottom-0 p-2 sticky z-20;
|
||||
|
||||
button {
|
||||
width: 100%;
|
||||
@apply w-full;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -2,13 +2,7 @@
|
||||
<div v-on-clickaway="onClose" class="bulk-action__teams">
|
||||
<div class="triangle">
|
||||
<svg height="12" viewBox="0 0 24 12" width="24">
|
||||
<path
|
||||
d="M20 12l-8-8-12 12"
|
||||
fill="var(--white)"
|
||||
fill-rule="evenodd"
|
||||
stroke="var(--s-50)"
|
||||
stroke-width="1px"
|
||||
/>
|
||||
<path d="M20 12l-8-8-12 12" fill-rule="evenodd" stroke-width="1px" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="header flex-between">
|
||||
@@ -91,83 +85,60 @@ export default {
|
||||
|
||||
<style scoped lang="scss">
|
||||
.bulk-action__teams {
|
||||
background-color: var(--white);
|
||||
border-radius: var(--border-radius-large);
|
||||
border: 1px solid var(--s-50);
|
||||
box-shadow: var(--shadow-dropdown-pane);
|
||||
max-width: 75%;
|
||||
position: absolute;
|
||||
right: var(--space-small);
|
||||
top: var(--space-larger);
|
||||
transform-origin: top right;
|
||||
width: auto;
|
||||
z-index: var(--z-index-twenty);
|
||||
min-width: var(--space-giga);
|
||||
@apply max-w-[75%] absolute right-2 top-12 origin-top-right w-auto z-20 min-w-[15rem] bg-white dark:bg-slate-800 rounded-lg border border-solid border-slate-50 dark:border-slate-700 shadow-md;
|
||||
.header {
|
||||
padding: var(--space-one);
|
||||
@apply p-2.5;
|
||||
|
||||
span {
|
||||
font-size: var(--font-size-small);
|
||||
font-weight: var(--font-weight-medium);
|
||||
@apply text-sm font-medium;
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
max-height: var(--space-giga);
|
||||
overflow-y: auto;
|
||||
@apply overflow-y-auto max-h-[15rem];
|
||||
.team__list-container {
|
||||
height: 100%;
|
||||
@apply h-full;
|
||||
}
|
||||
.agent-list-search {
|
||||
padding: 0 var(--space-one);
|
||||
border: 1px solid var(--s-100);
|
||||
border-radius: var(--border-radius-medium);
|
||||
background-color: var(--s-50);
|
||||
@apply py-0 px-2.5 bg-slate-50 dark:bg-slate-900 border border-solid border-slate-100 dark:border-slate-600/70 rounded-md;
|
||||
.search-icon {
|
||||
color: var(--s-400);
|
||||
@apply text-slate-400 dark:text-slate-200;
|
||||
}
|
||||
|
||||
.agent--search_input {
|
||||
border: 0;
|
||||
font-size: var(--font-size-mini);
|
||||
margin: 0;
|
||||
background-color: transparent;
|
||||
height: unset;
|
||||
@apply border-0 text-xs m-0 dark:bg-transparent bg-transparent h-[unset];
|
||||
}
|
||||
}
|
||||
}
|
||||
.triangle {
|
||||
display: block;
|
||||
z-index: var(--z-index-one);
|
||||
position: absolute;
|
||||
top: var(--space-minus-slab);
|
||||
right: var(--triangle-position);
|
||||
text-align: left;
|
||||
@apply block z-10 absolute text-left -top-3;
|
||||
|
||||
svg path {
|
||||
@apply fill-white dark:fill-slate-800 stroke-slate-50 dark:stroke-slate-600/50;
|
||||
}
|
||||
}
|
||||
}
|
||||
ul {
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
@apply m-0 list-none;
|
||||
|
||||
li {
|
||||
&:last-child {
|
||||
.agent-list-item {
|
||||
@apply last:rounded-b-lg;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.team__list-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: var(--space-one);
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background-color: var(--s-50);
|
||||
}
|
||||
@apply flex items-center p-2.5 cursor-pointer hover:bg-slate-50 dark:hover:bg-slate-900;
|
||||
span {
|
||||
font-size: var(--font-size-small);
|
||||
@apply text-sm;
|
||||
}
|
||||
}
|
||||
|
||||
.search-container {
|
||||
padding: 0 var(--space-one);
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: var(--z-index-twenty);
|
||||
background-color: var(--white);
|
||||
@apply py-0 px-2.5 sticky top-0 z-20 bg-white dark:bg-slate-800;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -2,13 +2,7 @@
|
||||
<div v-on-clickaway="onClose" class="actions-container">
|
||||
<div class="triangle">
|
||||
<svg height="12" viewBox="0 0 24 12" width="24">
|
||||
<path
|
||||
d="M20 12l-8-8-12 12"
|
||||
fill="var(--white)"
|
||||
fill-rule="evenodd"
|
||||
stroke="var(--s-50)"
|
||||
stroke-width="1px"
|
||||
/>
|
||||
<path d="M20 12l-8-8-12 12" fill-rule="evenodd" stroke-width="1px" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="header flex-between">
|
||||
@@ -126,42 +120,30 @@ export default {
|
||||
|
||||
<style scoped lang="scss">
|
||||
.actions-container {
|
||||
background-color: var(--white);
|
||||
border-radius: var(--border-radius-large);
|
||||
border: 1px solid var(--s-50);
|
||||
box-shadow: var(--shadow-dropdown-pane);
|
||||
position: absolute;
|
||||
right: var(--space-small);
|
||||
top: var(--space-larger);
|
||||
transform-origin: top right;
|
||||
width: auto;
|
||||
z-index: var(--z-index-twenty);
|
||||
@apply absolute right-2 top-12 origin-top-right w-auto z-20 bg-white dark:bg-slate-800 rounded-lg border border-solid border-slate-50 dark:border-slate-700 shadow-md;
|
||||
|
||||
.header {
|
||||
padding: var(--space-one);
|
||||
@apply p-2.5;
|
||||
|
||||
span {
|
||||
font-size: var(--font-size-small);
|
||||
font-weight: var(--font-weight-medium);
|
||||
@apply text-sm font-medium;
|
||||
}
|
||||
}
|
||||
.container {
|
||||
padding: var(--space-one);
|
||||
padding-top: var(--space-zero);
|
||||
@apply px-2.5 pt-0 pb-2.5;
|
||||
}
|
||||
|
||||
.triangle {
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: var(--triangle-position);
|
||||
text-align: left;
|
||||
top: var(--space-minus-slab);
|
||||
z-index: var(--z-index-one);
|
||||
@apply block z-10 absolute text-left -top-3;
|
||||
|
||||
svg path {
|
||||
@apply fill-white dark:fill-slate-800 stroke-slate-50 dark:stroke-slate-600/50;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
@apply m-0 list-none;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user