You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
862 lines
15 KiB
862 lines
15 KiB
@use "./tailwind" as *;
|
|
@use "./scss" as *;
|
|
|
|
@import '~cropper/dist/cropper.css';
|
|
//@import "~flag-icons/sass/flag-icons.scss";
|
|
@import "~select2/dist/css/select2.css";
|
|
@import "~bootstrap-daterangepicker/daterangepicker.css";
|
|
//@import '~jquery-ui/themes/base/all.css';
|
|
|
|
@import "~tinymce/skins/ui/oxide/skin.css";
|
|
@import './editor_content.css';
|
|
|
|
@layer utilities {
|
|
.border-gray-300 {
|
|
--tw-border-opacity: 1;
|
|
border-color: rgba(156, 163, 175, var(--tw-border-opacity));
|
|
}
|
|
.border-gray-100 {
|
|
--tw-border-opacity: 1;
|
|
border-color: rgba(247, 250, 252, var(--tw-border-opacity));
|
|
}
|
|
}
|
|
|
|
@layer components {
|
|
.card {
|
|
@apply rounded bg-white drop-shadow-lg w-full;
|
|
}
|
|
|
|
// Buttons with icons.
|
|
.btn > .svg {
|
|
@apply -ml-1 mr-1 h-4 w-5 fill-current ;
|
|
}
|
|
|
|
// Forms.
|
|
|
|
.help-block {
|
|
@apply mt-2 text-caption;
|
|
}
|
|
|
|
.has-error .ch-form-label {
|
|
@apply h-8;
|
|
}
|
|
|
|
.has-error .help-block {
|
|
@apply italic text-caption;
|
|
}
|
|
|
|
.has-error .ch-form-control {
|
|
}
|
|
|
|
// List
|
|
|
|
.list-group {
|
|
@apply flex flex-col mr-4;
|
|
}
|
|
|
|
.list-group-item {
|
|
@apply flex flex-row justify-start gap-2 border rounded-sm px-3 py-3 items-center;
|
|
}
|
|
|
|
#lp_item_list .list-group-item {
|
|
align-items: normal !important;
|
|
}
|
|
|
|
.data_table, .table-striped {
|
|
@apply border-collapse w-full mt-2;
|
|
|
|
thead th {
|
|
@apply bg-gray-20 text-gray-90 font-semibold text-left px-4 py-3 border-b border-gray-30 border-t border-l border-r border-gray-30 text-center;
|
|
}
|
|
|
|
tbody td {
|
|
@apply px-4 py-3 border-b border-gray-30 border-l border-r border-gray-30;
|
|
}
|
|
|
|
tbody tr:nth-child(odd) {
|
|
@apply bg-gray-5;
|
|
}
|
|
|
|
tbody tr:hover {
|
|
background-color: #eff6ff;
|
|
}
|
|
|
|
.checkbox label {
|
|
@apply pl-4;
|
|
}
|
|
|
|
i.mdi {
|
|
@apply align-middle;
|
|
}
|
|
|
|
.mdi::before {
|
|
@apply inline-block;
|
|
font-size: inherit;
|
|
-webkit-font-smoothing: antialiased;
|
|
text-rendering: optimizeLegibility;
|
|
transform: translate(0, 0);
|
|
}
|
|
}
|
|
|
|
.sortable-container {
|
|
width: 100%;
|
|
overflow: auto;
|
|
}
|
|
|
|
.toolbar-action {
|
|
.p-toolbar-group-start.p-toolbar-group-left {
|
|
display: flex;
|
|
padding: 10px;
|
|
background: #f0f0f0;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.p-toolbar-group-start.p-toolbar-group-left .btn {
|
|
padding: 10px 20px;
|
|
text-decoration: none;
|
|
color: #333;
|
|
background-color: #e7e7e7;
|
|
border: 1px solid #ddd;
|
|
border-radius: 5px;
|
|
transition: background-color 0.3s;
|
|
}
|
|
|
|
.p-toolbar-group-start.p-toolbar-group-left .btn:hover {
|
|
background-color: #ddd;
|
|
}
|
|
|
|
.p-toolbar-group-start.p-toolbar-group-left .btn.active {
|
|
background-color: #007bff;
|
|
color: white;
|
|
border-color: #007bff;
|
|
}
|
|
|
|
.p-toolbar-group-start.p-toolbar-group-left .btn + .btn {
|
|
margin-left: 10px;
|
|
}
|
|
}
|
|
|
|
.sortable-buttons-actions {
|
|
@apply bg-gray-5 border border-gray-20 rounded shadow;
|
|
|
|
.btn {
|
|
@apply px-4 bg-white border border-gray-30 py-2 mr-2 text-gray-90 rounded cursor-pointer transition-all;
|
|
height: 35px;
|
|
}
|
|
|
|
.btn--action {
|
|
@apply bg-white border border-gray-30 py-1 px-3 text-sm rounded cursor-pointer text-gray-90;
|
|
}
|
|
|
|
.btn:hover, .plane:hover {
|
|
@apply bg-gray-25 text-gray-90;
|
|
}
|
|
}
|
|
|
|
.card .flex {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.card .flex .relative {
|
|
position: relative;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.card .flex a {
|
|
margin-left: 10px;
|
|
font-size: 18px;
|
|
color: #333;
|
|
}
|
|
|
|
.card .sectioncomment {
|
|
padding: 15px;
|
|
background-color: #f7f7f7;
|
|
}
|
|
|
|
.card span.float-right {
|
|
float: right;
|
|
margin-right: 15px;
|
|
font-size: 14px;
|
|
color: #666;
|
|
}
|
|
|
|
.card .stat-content {
|
|
padding: 10px;
|
|
}
|
|
|
|
// Alerts
|
|
|
|
.alert {
|
|
@apply p-3.5 mb-5 border border-transparent rounded;
|
|
}
|
|
|
|
.alert-warning {
|
|
background-color: #fff3cd;
|
|
color: #856404;
|
|
border-color: #ffeeba;
|
|
}
|
|
|
|
.alert-danger {
|
|
background-color: #f8d7da;
|
|
color: #721c24;
|
|
border-color: #f5c6cb;
|
|
}
|
|
|
|
.alert-info {
|
|
background-color: #d1ecf1;
|
|
color: #0c5460;
|
|
border-color: #bee5eb;
|
|
}
|
|
|
|
.alert-success {
|
|
background-color: #d4edda;
|
|
color: #155724;
|
|
border-color: #c3e6cb;
|
|
}
|
|
|
|
|
|
// Tabs
|
|
|
|
.tab_wrapper nav {
|
|
@apply card flex flex-row justify-between gap-4;
|
|
}
|
|
|
|
.tab_wrapper nav a {
|
|
@apply p-4;
|
|
}
|
|
|
|
// Calendar
|
|
|
|
#calendar .fc-toolbar-chunk {
|
|
@apply flex flex-row;
|
|
}
|
|
|
|
// Page header
|
|
|
|
.page-header {
|
|
@apply text-h3 flex flex-row gap-2;
|
|
}
|
|
|
|
#no-data-view {
|
|
@apply flex flex-col items-center justify-center p-4 space-y-4 antialiased;
|
|
}
|
|
|
|
.pull-right {
|
|
@apply flex justify-end;
|
|
}
|
|
|
|
.header-border-bottom {
|
|
border-bottom: 1px solid #e4e9ed !important;
|
|
}
|
|
|
|
.ch-tool-icon {
|
|
@apply font-extrabold text-primary;
|
|
}
|
|
.ch-toolbar-icon {
|
|
@apply font-extrabold text-primary leading-none;
|
|
}
|
|
.ch-tool-icon-disabled {
|
|
@apply font-extrabold text-gray-50;
|
|
}
|
|
.ch-tool-icon-gradient {
|
|
@apply font-extrabold text-transparent bg-clip-text bg-gradient-to-br from-primary to-primary-gradient;
|
|
}
|
|
.ch-tool-icon-button {
|
|
@apply font-extrabold bg-clip-text;
|
|
}
|
|
|
|
#course-search-keyword {
|
|
@apply w-auto;
|
|
}
|
|
|
|
// Form
|
|
.has-error input, .has-error select {
|
|
border-color: red !important;
|
|
}
|
|
|
|
// Special
|
|
|
|
// Progress bars
|
|
.progress {
|
|
@apply rounded-sm ring-1 text-center min-h-full ml-12 mr-4;
|
|
}
|
|
|
|
.log-container {
|
|
height: 300px;
|
|
overflow-y: scroll;
|
|
background-color: #000;
|
|
padding: 10px;
|
|
}
|
|
|
|
.terminal {
|
|
color: #00ff00; /* Green */
|
|
font-family: monospace;
|
|
}
|
|
|
|
.terms-container {
|
|
overflow-y: scroll;
|
|
height: 180px;
|
|
border: 1px solid #ccc;
|
|
padding: 10px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
// Pager
|
|
.pager-bar {
|
|
}
|
|
.pager-bar .pager-select {
|
|
}
|
|
.pager-bar .pager-counter {
|
|
@apply mt-4;
|
|
}
|
|
.pager-bar .pager-jumper {
|
|
@apply mt-4;
|
|
}
|
|
.pager-bar .pager-jumper .btn-link {
|
|
@apply -mt-2 mx-2;
|
|
}
|
|
|
|
// free-jqGrid override
|
|
.ui-jqgrid-bootstrap.modal {
|
|
@apply bg-white;
|
|
}
|
|
}
|
|
|
|
.field > small.p-error {
|
|
@apply text-error;
|
|
}
|
|
|
|
// tabs
|
|
.tab-content {
|
|
> .tab-pane {
|
|
display: none;
|
|
}
|
|
> .active {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
.col-md-offset-0 {
|
|
margin-left: 0 !important;
|
|
}
|
|
|
|
.col-md-offset-1 {
|
|
margin-left: 5% !important;
|
|
}
|
|
|
|
.col-md-offset-2 {
|
|
margin-left: 10% !important;
|
|
}
|
|
|
|
.col-md-offset-3 {
|
|
margin-left: 15% !important;
|
|
}
|
|
|
|
.col-md-offset-4 {
|
|
margin-left: 20% !important;
|
|
}
|
|
|
|
.custom-message {
|
|
padding: 15px;
|
|
}
|
|
|
|
.custom-message {
|
|
ol,
|
|
ul,
|
|
menu {
|
|
list-style: initial;
|
|
}
|
|
}
|
|
|
|
.custom-link {
|
|
color: blue;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
#date_fields label,
|
|
.p-float-label .datepicker-label {
|
|
top: 0px;
|
|
left: 0.5rem;
|
|
--tw-bg-opacity: 1;
|
|
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
|
padding-left: 0.25rem;
|
|
padding-right: 0.25rem;
|
|
--tw-text-opacity: 1;
|
|
color: rgb(46 117 163 / var(--tw-text-opacity));
|
|
font-size: 12px;
|
|
}
|
|
|
|
.question_options .droppable {
|
|
padding: 5px;
|
|
text-align: center;
|
|
background-color: #ECF0F1;
|
|
border: dotted #dddddd 2px;
|
|
border-radius: 4px;
|
|
color: #666666;
|
|
display: inline-block;
|
|
width: 85%;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.question_options .droppable-item {
|
|
background-color: #84bd00;
|
|
color: #FFF;
|
|
padding: 3px 0 3px 5px;
|
|
width: 20%;
|
|
}
|
|
|
|
.question_options .droppable-item .number {
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
display: inline-block;
|
|
}
|
|
|
|
.hide-label-title {
|
|
color: #0a0a0a;
|
|
}
|
|
|
|
#global-modal {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.documents-layout {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.template-list-container {
|
|
flex-basis: 20%;
|
|
max-height: 600px;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.documents-form-container {
|
|
flex-basis: 78%;
|
|
}
|
|
|
|
.template-item img {
|
|
border: 1px solid #ccc;
|
|
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
|
|
border-radius: 4px;
|
|
transition: transform 0.2s ease;
|
|
}
|
|
|
|
.template-item img:hover {
|
|
transform: scale(1.05);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.template-list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 10px;
|
|
}
|
|
|
|
.template-item {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
text-align: center;
|
|
padding: 10px;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
background-color: #f9f9f9;
|
|
}
|
|
|
|
.template-item img {
|
|
width: 100%;
|
|
max-width: 200px;
|
|
height: auto;
|
|
object-fit: cover;
|
|
border-radius: 4px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.template-item:hover {
|
|
background-color: #ececec;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.users-list {
|
|
.nav-tabs {
|
|
display: flex;
|
|
list-style-type: none;
|
|
padding: 0;
|
|
border-bottom: 1px solid #ddd;
|
|
margin: 0 0 20px;
|
|
}
|
|
|
|
.nav-tabs .nav-item {
|
|
margin-bottom: -1px;
|
|
}
|
|
|
|
.nav-tabs .nav-link {
|
|
display: block;
|
|
padding: 0.5rem 1rem;
|
|
margin-right: 0.1rem;
|
|
background: #f8f8f8;
|
|
border: 1px solid #ddd;
|
|
border-radius: 0.25rem 0.25rem 0 0;
|
|
text-decoration: none;
|
|
color: #555;
|
|
}
|
|
|
|
.nav-tabs .nav-link:hover {
|
|
background-color: #e9ecef;
|
|
}
|
|
|
|
.nav-tabs .nav-link.active {
|
|
color: #495057;
|
|
background-color: #fff;
|
|
border-color: #ddd #ddd #fff;
|
|
border-bottom-color: transparent;
|
|
font-weight: bolder;
|
|
}
|
|
}
|
|
|
|
form .field {
|
|
.help-text {
|
|
color: #666;
|
|
font-family: 'Arial', sans-serif;
|
|
font-size: 14px;
|
|
line-height: 1.6;
|
|
background-color: #f8f8f8;
|
|
border-left: 4px solid #007bff;
|
|
padding: 10px 15px;
|
|
margin-bottom: 20px;
|
|
border-radius: 5px;
|
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
max-width: 80%;
|
|
display: inline-block;
|
|
}
|
|
|
|
textarea {
|
|
width: 100%;
|
|
}
|
|
|
|
.freeze {
|
|
display: block;
|
|
padding-top: 10px;
|
|
}
|
|
|
|
.freeze + label,
|
|
.advmultiselect + label,
|
|
textarea + label.settings-label
|
|
{
|
|
font-size: 13px;
|
|
@apply absolute top-0 left-0 text-support-3 text-caption px-1 bg-white text-primary;
|
|
}
|
|
}
|
|
|
|
.flatpickr-calendar .flatpickr-validate-btn {
|
|
margin-top: 10px;
|
|
width: 100%;
|
|
padding: 5px;
|
|
background-color: #569ff7;
|
|
border: none;
|
|
cursor: pointer;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.mce-translatehtml, span[lang] {
|
|
display: none;
|
|
}
|
|
|
|
.easy-donut {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
.easy-donut .percent {
|
|
font-size: 1.25rem;
|
|
font-weight: bold;
|
|
}
|
|
.stat-widget-five {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.stat-widget-five .fa, .stat-widget-five .mdi-icon {
|
|
margin-right: 1rem;
|
|
}
|
|
|
|
.toggle-password {
|
|
position: absolute !important;
|
|
top: 65% !important;
|
|
transform: translateY(-50%);
|
|
right: 0.75rem;
|
|
display: flex;
|
|
align-items: center;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.toggle-password i {
|
|
font-size: 24px;
|
|
}
|
|
|
|
#legacy_content {
|
|
.exercise-overview {
|
|
padding: 30px 10px 60px;
|
|
}
|
|
.question-result {
|
|
padding-top: 30px;
|
|
}
|
|
|
|
.exercise-draggable-answer.full-width {
|
|
width: 100%;
|
|
}
|
|
|
|
.exercise-draggable-answer.list-inline {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.exercise-draggable-answer.vertical {
|
|
@apply flex flex-col w-full;
|
|
}
|
|
|
|
.exercise-draggable-answer.horizontal {
|
|
@apply flex flex-wrap;
|
|
}
|
|
|
|
.droppable-item {
|
|
@apply flex items-center justify-between p-4 mb-4 rounded-md;
|
|
}
|
|
|
|
.number {
|
|
@apply text-lg font-bold;
|
|
}
|
|
|
|
.droppable, .ui-droppable {
|
|
@apply border-2 border-dashed p-4 bg-white rounded-md min-h-[50px];
|
|
}
|
|
|
|
.question_options .question-answer__items--vertical .droppable {
|
|
width: 98%;
|
|
}
|
|
|
|
.ui-dragging {
|
|
@apply w-full flex items-center justify-center p-4 border-2 border-dashed;
|
|
}
|
|
|
|
.vertical .ui-draggable-dragging {
|
|
width: 80%;
|
|
}
|
|
|
|
.question-answer__items--vertical {
|
|
@apply flex flex-col w-full;
|
|
}
|
|
|
|
.question-answer__items--horizontal {
|
|
@apply flex flex-row flex-wrap;
|
|
}
|
|
}
|
|
|
|
.btn:hover {
|
|
cursor: pointer;
|
|
color: #fff;
|
|
}
|
|
|
|
.btn.btn--success.btn-large:hover {
|
|
background-color: #28a745;
|
|
}
|
|
|
|
.btn.btn--warning.question-validate-btn:hover {
|
|
background-color: #ffc107;
|
|
}
|
|
|
|
.btn.btn--info:hover {
|
|
background-color: #17a2b8;
|
|
}
|
|
|
|
.btn.btn--success:hover {
|
|
background-color: #28a745;
|
|
}
|
|
|
|
.btn.btn--danger:hover {
|
|
background-color: #dc3545;
|
|
}
|
|
|
|
.permissions-table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
table-layout: auto;
|
|
th, td {
|
|
border: 1px solid #ccc;
|
|
padding: 8px;
|
|
text-align: center;
|
|
}
|
|
th {
|
|
background-color: #f9f9f9;
|
|
}
|
|
tr:nth-child(even) {
|
|
background-color: #f2f2f2;
|
|
}
|
|
tr:hover {
|
|
background-color: #e9e9e9;
|
|
}
|
|
th, td {
|
|
padding: 5px;
|
|
font-size: 0.9em;
|
|
white-space: normal;
|
|
word-wrap: break-word;
|
|
min-width: 100px;
|
|
vertical-align: top;
|
|
}
|
|
th {
|
|
padding-top: 12px;
|
|
padding-bottom: 12px;
|
|
text-align: center;
|
|
background-color: #999;
|
|
color: white;
|
|
}
|
|
td {
|
|
padding: 12px;
|
|
}
|
|
input[type="checkbox"] {
|
|
transform: scale(1.2);
|
|
}
|
|
.save-button {
|
|
background-color: #4CAF50;
|
|
color: white;
|
|
padding: 10px 20px;
|
|
margin: 20px 0;
|
|
border: none;
|
|
cursor: pointer;
|
|
text-align: center;
|
|
}
|
|
.save-button:hover {
|
|
background-color: #45a049;
|
|
}
|
|
input[type="checkbox"] {
|
|
transform: scale(1);
|
|
margin: 0 auto;
|
|
}
|
|
}
|
|
|
|
.files-info-page {
|
|
.form-control {
|
|
@apply w-48 p-1 border border-gray-300 rounded;
|
|
}
|
|
|
|
.btn-primary {
|
|
@apply bg-primary text-primary-button-text p-1 rounded;
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
@apply bg-secondary-hover;
|
|
}
|
|
|
|
.modal {
|
|
@apply hidden fixed z-10 left-0 top-0 w-full h-full overflow-auto bg-black bg-opacity-50 pt-16;
|
|
}
|
|
|
|
.modal-content {
|
|
@apply bg-white m-auto p-5 border border-gray-300 w-1/3;
|
|
}
|
|
|
|
.close-button {
|
|
@apply text-fontdisabled float-right text-2xl font-bold;
|
|
}
|
|
|
|
.close-button:hover,
|
|
.close-button:focus {
|
|
@apply text-black no-underline cursor-pointer;
|
|
}
|
|
|
|
.pagination {
|
|
@apply flex justify-center my-5;
|
|
}
|
|
|
|
.pagination a,
|
|
.pagination span {
|
|
@apply mx-1 px-4 py-2 text-primary border border-gray-25;
|
|
}
|
|
|
|
.pagination a:hover {
|
|
@apply bg-gray-15;
|
|
}
|
|
|
|
.pagination span {
|
|
@apply bg-primary text-white border-primary;
|
|
}
|
|
}
|
|
|
|
.filemanager-container {
|
|
.mdi-icon {
|
|
font-size: 48px;
|
|
}
|
|
|
|
.thumbnails {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 10px;
|
|
}
|
|
|
|
.thumbnail-item {
|
|
width: 150px;
|
|
padding: 5px;
|
|
border: 1px solid #ccc;
|
|
border-radius: 5px;
|
|
text-align: center;
|
|
}
|
|
|
|
.thumbnail-icon {
|
|
font-size: 2rem;
|
|
}
|
|
|
|
.thumbnail-title {
|
|
margin-top: 10px;
|
|
font-size: 1rem;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.thumbnail-actions {
|
|
margin-top: 10px;
|
|
display: flex;
|
|
justify-content: center;
|
|
gap: 5px;
|
|
}
|
|
|
|
.thumbnail-image {
|
|
width: 100px;
|
|
height: 100px;
|
|
object-fit: cover;
|
|
}
|
|
}
|
|
|
|
.row {
|
|
@apply flex flex-wrap -mx-4;
|
|
}
|
|
.col-md-4 {
|
|
@apply w-full md:w-1/3 px-4;
|
|
}
|
|
.col-md-6 {
|
|
@apply w-full md:w-1/2 px-4;
|
|
}
|
|
|
|
.section-header__title {
|
|
@apply mt-4;
|
|
}
|
|
|
|
.stats_table {
|
|
thead th {
|
|
@apply bg-gray-20 text-gray-90 font-semibold text-left px-4 py-3 border-b border-gray-30;
|
|
}
|
|
}
|
|
|
|
@layer components {
|
|
.tiny-content table {
|
|
@apply w-auto table-auto;
|
|
}
|
|
}
|
|
|
|
//@import "~jquery-ui-timepicker-addon/dist/jquery-ui-timepicker-addon.css";
|
|
@import "~@fancyapps/fancybox/dist/jquery.fancybox.css";
|
|
@import "~timepicker/jquery.timepicker.min.css";
|
|
@import "~qtip2/dist/jquery.qtip.min.css";
|
|
|