Initial commit

resources/sass/app.scss

@@ -0,0 +1,11 @@
+// Fonts
+// @import url('https://fonts.googleapis.com/css?family=Nunito');
+
+// Bootstrap
+@import '~bootstrap/scss/bootstrap';
+
+// Font-Awesome
+@import "~@fortawesome/fontawesome-free/scss/fontawesome";
+@import "~@fortawesome/fontawesome-free/scss/regular";
+@import "~@fortawesome/fontawesome-free/scss/solid";
+@import "~@fortawesome/fontawesome-free/scss/brands";

resources/sass/custom_messenger.css

@@ -0,0 +1,668 @@
+/* Timebank customizations for messenger package */
+
+
+/* Friends dropdown navigation bar */
+
+#messenger-style-overrides #click_friends_tab {
+    padding: 0;
+}
+
+#messenger-style-overrides #click_friends_tab {
+    color: initial;
+}
+
+#messenger-style-overrides #click_friends_tab:hover {
+    color: initial;
+}
+
+#messenger-style-overrides #click_friends_tab:hover {
+    text-decoration: initial;
+}
+
+#messenger-style-overrides #nav-friend-tabs {
+    margin: 4px 20px 0px 20px;
+}
+
+#messenger-style-overrides .nav-pills .nav-link.active,
+.nav-pills .show>.nav-link {
+    background-color: #1f2937;
+    color: #fff;
+}
+
+#messenger-style-overrides .nav-pills .nav-link.active,
+.nav-pills .show>.nav-link:hover {
+    background-color: #1f2937;
+    color: #fff;
+}
+
+#messenger-style-overrides .pill-tab-nav>.nav-pills>a.active:hover {
+    background-color: #1f2937;
+    color: #fff !important;
+}
+
+#messenger-style-overrides .pill-tab-nav>.nav-pills>a:hover {
+    background-color: #e2e6ea;
+    color: #1f2937 !important;
+}
+
+#messenger-style-overrides .pill-tab-nav>.nav-pills>a {
+    background-color: #f8f9fa;
+    color: #000;
+    border: 1px #dee2e6 solid;
+}
+
+
+/* Set messenger container to match space viewport */
+
+#messenger-style-overrides .py-12 {
+    padding-top: 3rem;
+    padding-bottom: 0rem;
+}
+
+
+#messenger-style-overrides #thread_header_area {
+    position: initial;
+}
+
+#messenger-style-overrides .card-header {
+
+    padding: 1rem 0.4rem;
+}
+
+#messenger-style-overrides .chat-body {
+    max-height: calc(75vh - 195px);
+    margin: 0px 0px 10px 0px;
+    padding: 10px 10px 10px;
+    scrollbar-width: revert;
+}
+
+#messenger-style-overrides #messenger_container {
+    height: 75vh;
+    overflow: scroll;
+}
+
+#messenger-style-overrides #chat-footer {
+    position: initial;
+}
+
+#messenger-style-overrides #chat-footer .chat-footer {
+    position: relative;
+    width: 100%;
+    bottom: 10px;
+}
+
+#messenger-style-overrides .form-inline {
+    align-items: center;
+    display: flex;
+    flex-flow: column-reverse;
+}
+
+/* Side-bar avatars and threads */
+#messenger-style-overrides .avatar-is-offline {
+    box-shadow: 0px 0px 0px 2px #dee2e6;
+    padding: 1px
+}
+
+#messenger-style-overrides .avatar-is-away {
+    box-shadow: 0px 0px 0px 2px #38bdf8;
+    padding: 1px
+}
+
+#messenger-style-overrides .avatar-is-online {
+    box-shadow: 0px 0px 0px 2px #38c172;
+    padding: 1px
+}
+
+#messenger-style-overrides .input-group {
+    position: initial;
+}
+
+#messenger-style-overrides .messages-panel.card {
+    border: none;
+}
+
+#messenger-style-overrides .alert-warning {
+    background: #1f2937;
+    border-color: #000;
+    color: #fff;
+}
+
+#messenger-style-overrides .thread_list_item.alert-warning:hover {
+    background: #494d50 !important;
+    border-color: #000;
+    color: #fff;
+}
+
+#messenger-style-overrides .thread_list_item.alert-warning.shadow-sm.rounded a {
+    color: #fff;
+}
+
+#messenger-style-overrides .alert-info {
+    background: #fff;
+    border: 0px solid #dfdfdf;
+    padding: 5px 10px;
+}
+
+#messenger-style-overrides #messages_ul .thread_list_item.alert-warning.shadow-sm.rounded.alert-info {
+    background: #1f2937;
+}
+
+#messenger-style-overrides .inbox ul.messages-list li {
+    background: #e9ecef;
+    border: 0px solid #dfdfdf;
+    padding: 5px 10px;
+}
+
+#messenger-style-overrides .inbox ul.messages-list li[class*="alert-"] {
+    background: dimgrey;
+    border: 1px solid #black;
+}
+
+#messenger-style-overrides .inbox ul.messages-list li:hover {
+    color: #fff !important;
+    background: #444;
+    border: 0px solid #dfdfdf;
+}
+
+#messenger-style-overrides .inbox ul.messages-list li[class*="alert-"] a {
+    color: #fff;
+}
+
+#messenger-style-overrides .inbox ul.messages-list li a {
+    background-color: #fff !important;
+}
+
+#messenger-style-overrides .inbox ul.messages-list li:hover a {
+    color: #fff !important;
+}
+
+#messenger-style-overrides .shadow-sm.badge.badge-pill.badge-primary {
+    background: #e3342f;
+    color: #fff;
+}
+
+/* Message container header and buttons */
+#messenger-style-overrides #messenger_container .bg-light {
+    background-color: #fff !important;
+}
+
+#messenger-style-overrides #message_container .btn.text-danger {
+    color: #212529 !important;
+}
+
+#messenger-style-overrides #messenger_container .btn {
+    border-color: #dee2e6;
+}
+
+#messenger-style-overrides .btn-lg {
+    /* height: 0rem; */
+    min-height: 3.5rem;
+    padding-left: 1.5rem;
+    padding-right: 1.5rem;
+    font-size: 1.125rem;
+    min-width: 3.5rem;
+}
+
+#messenger-style-overrides .btn {
+    /* height: 0rem; */
+    min-height: 3rem;
+    min-width: 3rem;
+}
+
+#messenger-style-overrides .badge-info {
+    background-color: #d7d9da;
+    color: #1f2937;
+}
+
+#messenger-style-overrides .badge-primary {
+    background-color: #d7d9da;
+}
+
+#messenger-style-overrides .spinner-grow {
+    background-color: #d7d9da;
+}
+
+/* Change Font Awesome icons for better user experience */
+#messenger-style-overrides .fa-2x {
+    font-size: 1em;
+    color: #212529 !important;
+}
+
+#messenger-style-overrides .fas.fa-cog::before {
+    content: "\f0c9" !important;
+}
+
+/* Bars (Hamburger menu) */
+#messenger-style-overrides .fas.fa-cogs::before {
+    content: "\f0c9" !important;
+}
+
+/* Comment dots (Conversation menu) */
+#messenger-style-overrides .fas.fa-hourglass::before {
+    content: "\f252" !important;
+}
+
+/* Hourglass halfway */
+#messenger-style-overrides .container .fas.fa-edit::before {
+    content: "\f0c0" !important;
+    color: #1f2937;
+}
+
+/* Three profiles (New group conversation) */
+#messenger-style-overrides .container .fas.fa-user-friends::before {
+    content: "\f4fc" !important;
+    color: #1f2937;
+}
+
+/* Profile with check sign (Friends) */
+#messenger-style-overrides .container .fas.fa-cog::before {
+    content: "\f0ad" !important;
+    color: #1f2937;
+}
+
+/* Wrench (Settings) */
+#messenger-style-overrides #click_friends_tab .fa-ban::before {
+    content: "\f057" !important;
+}
+
+/* Circle with x -sign */
+#messenger-style-overrides #pending_friends_nav .fa-ban::before {
+    content: "\f057" !important;
+}
+
+/* Circle with x -sign */
+
+/* Message bodies */
+#messenger-style-overrides .fa-clock {
+    display: none;
+}
+
+#messenger-style-overrides .message-body .message-text {
+    font-size: 16px;
+}
+
+#messenger-style-overrides .message-body .message-text {
+    font-size: 16px;
+}
+
+#messenger-style-overrides .message .message-body {
+    border-radius: 6px;
+    margin: 5px 5px 5px 5px;
+}
+
+/* Left messages (others) */
+
+#messenger-style-overrides .timeago {
+    color: white;
+}
+
+#messenger-style-overrides .message.info .message-info>h4 {
+    color: white;
+}
+
+#messenger-style-overrides .message .message-body a {
+    color: white;
+}
+
+#messenger-style-overrides .message.info .message-body {
+    color: #fff !important;
+    background: dimgrey;
+    border-color: black;
+}
+
+messenger-style-overrides .message hr {
+    display: none;
+}
+
+/* Right messages (self) */
+#messenger-style-overrides .my-message .message-body {
+    color: white;
+    background: black;
+    border-color: black;
+}
+
+#messenger-style-overrides .my-message .timeago {
+    color: #fff;
+}
+
+#messenger-style-overrides ul.messages-list li .timeago {
+    color: #3d3f42;
+}
+
+#messenger-style-overrides ul.messages-list li:hover .timeago {
+    color: #fff;
+}
+
+#messenger-style-overrides .thread_list_item.alert-warning.shadow-sm.rounded a .timeago {
+    color: white;
+}
+
+#messenger-style-overrides .my-message a {
+    color: #fff;
+    background: black;
+}
+
+#messenger-style-overrides .my-message a:hover {
+    color: #d7d9da;
+    background: #808080;
+}
+
+#messenger-style-overrides .message.my-message::after {
+    display: none;
+}
+
+/* Message reactions */
+#messenger-style-overrides #message_container .message-reactions .reactions-body .reacted-by-me {
+    box-shadow: 0 0 0px 1px #dee2e6
+}
+
+#messenger-style-overrides #message_container .message-reactions .text-primary {
+    color: #d7d9da !important
+}
+
+/* Hide Record Audio Message Button */
+#messenger-style-overrides #record_audio_message_btn {
+    display: none;
+}
+
+/* Message container avatars */
+#messenger-style-overrides #thread_header_area .large-image {
+    position: absolute;
+    z-index: 1000;
+    transform: rotate(-2deg);
+}
+
+#messenger-style-overrides img.bobble-image {
+    height: 30px;
+    width: 30px;
+}
+
+#messenger-style-overrides img.main-bobble-offline {
+    box-shadow: 0px 0px 0px 2px #dee2e6;
+    padding: 1px
+}
+
+#messenger-style-overrides img.main-bobble-away {
+    box-shadow: 0px 0px 0px 2px #38bdf8;
+    padding: 1px
+}
+
+#messenger-style-overrides img.main-bobble-online {
+    box-shadow: 0px 0px 0px 2px #38c172;
+    padding: 1px
+}
+
+#messenger-style-overrides #message_container .message-avatar {
+    display: none
+}
+
+#messenger-style-overrides #message_container .message::before {
+    border: 0px;
+}
+
+/* Message footer and input field */
+#messenger-style-overrides .form-control:focus {
+    border-color: #1f2937;
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 0 .2rem rgba(194, 194, 194, 0.25);
+}
+
+#messenger-style-overrides .messages-panel .chat-footer .card.bg-light.mb-0.border-0 {
+    background-color: #fff !important;
+}
+
+
+/* Modals like editing a message */
+#messenger-style-overrides .bg-gradient-dark {
+    background: #fff !important;
+    color: #1f2937 !important;
+}
+
+#messenger-style-overrides .bg-gradient-primary {
+    background: #fff !important;
+    color: #1f2937 !important;
+}
+
+#messenger-style-overrides .bg-gradient-danger {
+    background: #fff !important;
+    color: #1f2937 !important;
+}
+
+#messenger-style-overrides #body_modal .bg-light {
+    background-color: #fff !important;
+}
+
+#messenger-style-overrides #body_modal .shadow-sm {
+    box-shadow: 0 0 0 rgba(0, 0, 0, 0) !important;
+}
+
+#messenger-style-overrides #message_container .btn-success:focus,
+.btn-outline-success:focus {
+    background: #e2e6ea linear-gradient(180deg, #e5e9ed, #e2e6ea) repeat-x;
+    border-color: #dae0e5;
+    color: #212529;
+}
+
+#messenger-style-overrides #message_container .btn-success:hover,
+.btn-outline-success:hover {
+    background: #e2e6ea linear-gradient(180deg, #e5e9ed, #e2e6ea) repeat-x;
+    border-color: #dae0e5;
+    color: #212529;
+}
+
+#messenger-style-overrides #message_container .btn-success,
+.btn-outline-success {
+    background: #f8f9fa linear-gradient(180deg, #f8f9fa, #f8f9fa) repeat-x;
+    border-color: #f8f9fa;
+    box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .15), 0 1px 1px rgba(0, 0, 0, .075);
+    color: #212529;
+}
+
+#messenger-style-overrides #message_container .btn-primary:focus,
+.btn-outline-primary:focus,
+.btn-info:focus,
+.btn-outline-info:focus,
+.btn-dark:focus,
+.btn-outline-dark:focus {
+    background: #e2e6ea linear-gradient(180deg, #e5e9ed, #e2e6ea) repeat-x !important;
+    border-color: #dae0e5;
+    color: #212529;
+    box-shadow: none !important;
+}
+
+#messenger-style-overrides #message_container .btn-primary:active,
+.btn-outline-primary:active,
+.btn-info:active,
+.btn-outline-info:active,
+.btn-dark:active,
+.btn-outline-dark:active {
+    background: #e2e6ea linear-gradient(180deg, #e5e9ed, #e2e6ea) repeat-x;
+    border-color: #dae0e5;
+    color: #212529;
+}
+
+#messenger-style-overrides #message_container .btn-primary:hover,
+.btn-outline-primary:hover,
+.btn-info:hover,
+.btn-outline-info:hover,
+.btn-dark:hover,
+.btn-outline-dark:hover {
+    background: #e2e6ea linear-gradient(180deg, #e5e9ed, #e2e6ea) repeat-x !important;
+    border-color: #dae0e5;
+    color: #212529;
+}
+
+#messenger-style-overrides #message_container .btn-primary,
+.btn-outline-primary,
+.btn-info,
+.btn-outline-info,
+.btn-dark,
+.btn-outline-dark {
+    background: #f8f9fa linear-gradient(180deg, #f8f9fa, #f8f9fa) repeat-x;
+    border-color: #f8f9fa;
+    box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .15), 0 1px 1px rgba(0, 0, 0, .075);
+    color: #212529;
+}
+
+
+#messenger-style-overrides .btn-light {
+    background: white;
+    border-color: #333;
+    box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .15), 0 1px 1px rgba(0, 0, 0, .075);
+    color: #212529;
+    border-width: 1px;
+    border-radius: 8px;
+}
+
+
+#messenger-style-overrides .btn-light:hover {
+    background: #e5e5e5;
+    border-color: black;
+    color: black;
+}
+
+#messenger-style-overrides .btn-light:focus {
+    border-color: black;
+    border-width: 2px;
+    color: black;
+}
+
+#messenger-style-overrides #message_container .bg-warning,
+.bg-outline-warning {
+    background: #fff !important;
+    color: #1f2937 !important;
+}
+
+
+
+#messenger-style-overrides .bg-warning,
+.bg-outline-warning {
+    background: #fff !important;
+    color: #1f2937 !important;
+    box-shadow: none !important;
+}
+
+/* Settings modal*/
+
+#messenger-style-overrides .modal {
+    opacity: 1;
+}
+
+
+
+#messenger-style-overrides .switch input:checked+label::before {
+    background-color: #333;
+}
+
+#messenger-style-overrides .switch input:focus+label::before {
+    box-shadow: 0 0 0 .15rem #999;
+    outline: none;
+}
+
+#messenger-style-overrides #online_status_switch .glowing_btn {
+    animation: none;
+}
+
+#messenger-style-overrides #online_status_switch .btn-success {
+    background: #38c172;
+    border-color: #808080;
+    color: #fff;
+}
+
+#messenger-style-overrides #online_status_switch .btn-danger {
+    background: #333333;
+    border-color: #808080;
+    color: #fff;
+}
+
+#messenger-style-overrides #online_status_switch.btn-secondary {
+    background: #dee2e6;
+    border-color: #808080;
+    color: #d7d9da;
+}
+
+#messenger-style-overrides #online_status_switch .btn:not(:disabled):not(.disabled).active {
+    box-shadow: inset 0px 6px 0px rgb(255, 255, 255);
+}
+
+#messenger-style-overrides .modal-footer .btn-success:focus,
+.btn-outline-success:focus {
+    border-color: black;
+    border-width: 2px;
+    color: black;
+}
+
+#messenger-style-overrides .modal-footer .btn-success:hover,
+.btn-outline-success:hover {
+    background: #e5e5e5;
+    border-color: black;
+    color: black;
+}
+
+#messenger-style-overrides .modal-footer .btn-success,
+.btn-outline-success {
+    background: white;
+    border-color: black;
+    border-width: 1px;
+    border-radius: 8px;
+    box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .15), 0 1px 1px rgba(0, 0, 0, .075);
+    color: black;
+}
+
+#messenger-style-overrides #body_modal div.col-6:nth-child(2) {
+    display: none;
+}
+
+/* Remove avatar change and remove options */
+#messenger-style-overrides #main_modal span.h5:nth-child(1)>i:nth-child(1) {
+    display: none;
+}
+
+/* Remove modal title bar icon */
+
+/* Overall Messenger styles */
+#messenger-style-overrides .text-info {
+    color: #1f2937 !important
+        /* display: none; */
+}
+
+/* #messenger-style-overrides b,
+#messenger-style-overrides strong {
+    font-weight: lighter;
+} */
+
+#messenger-style-overrides .badge {
+    font-weight: 500;
+}
+
+#messenger-style-overrides .text-success {
+    color: #1f2937 !important;
+}
+
+/* Toast Notifications */
+#messenger-style-overrides .toast-info {
+    background-color: #1f2937;
+}
+
+#messenger-style-overrides .toast-warning {
+    background-color: #808080;
+}
+
+#messenger-style-overrides .toast-error {
+    background-color: #e3342f;
+}
+
+#messenger-style-overrides .toast-error {
+    background-color: #e3342f;
+}
+
+#messenger-style-overrides .toast-success {
+    background-color: #ffff;
+    color: #1f2937 !important;
+}
+
+.list-inline {
+    padding-left: 10px;
+    /* Your custom padding */
+    list-style: disc;
+    /* Your custom list style */
+}

resources/sass/custom_tagify.css

@@ -0,0 +1,96 @@
+/* Timebank customizations for tagify package */
+
+@keyframes tags--bump {
+    30% {
+        transform: scale(1.1);
+    }
+}
+
+.tagify__tag__removeBtn {
+    transition: 0.05s ease-out;
+    pointer-events: auto;
+    width: 24px !important;
+    height: 24px !important;
+    font-size: 20px !important;
+}
+
+.tagify__tag__removeBtn:hover+div>span {
+    opacity: 1; 
+}
+
+.tagify__tag:hover:not([readonly]) div::before,
+.tagify__tag:focus div::before {
+    --tag-bg-inset: -0.5px;
+    --tag-bg: var(--tag-hover);
+}
+
+
+.tagify__tag {
+	transition: 0.2s ease-out;
+        pointer-events: auto;
+}
+
+
+.tagify {
+    --tags-disabled-bg: #F1F1F1;
+    --tags-border-color: #dee2e6;
+    --tags-hover-border-color: #dee2e6;
+    --tags-focus-border-color: #2563eb;
+    --tag-border-radius: 0.375rem;
+    --tag-bg: #E5E5E5;
+    --tag-hover: #E5E5E5;
+    --tag-text-color: black;
+    --tag-text-color--edit: black;
+    --tag-pad: 0.5em 1.0em;
+    --tag-inset-shadow-size: 3.0em;
+    --tag-invalid-color: #D39494;
+    --tag-invalid-bg: rgba(211, 148, 148, 0.5);
+    --tag-remove-bg: rgba(211, 148, 148, 0.3);
+    --tag-remove-btn-color: black;
+    --tag-remove-btn-bg: none;
+    --tag-remove-btn-bg--hover: #c77777;
+    --readonly-striped: 1;
+    border: 1px solid var(--tags-border-color);
+    border-radius: 0.375rem;
+    transition: 0.1s;
+    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
+}
+
+
+.tagify__dropdown__item--active {
+    background: rgb(153 155 156);
+    color: white;
+}
+
+.tagify__dropdown__wrapper {
+    border: 1px solid;
+    border-color: lightgray;
+}
+
+.tagify__dropdown__item {
+    margin: 6px;
+    border-radius: 3px;
+}
+
+.tagify__dropdown {
+    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
+}
+
+.tagify__dropdown[placement="top"] .tagify__dropdown__wrapper {
+    border-top-width: 1px;
+    border-radius: 8px;
+}
+
+.tagify__dropdown[placement="bottom"] .tagify__dropdown__wrapper {
+    border-top-width: 1px;
+    border-radius: 8px;
+}
+
+.tagify__input {
+    min-width: 150px;
+}
+
+/* Foreign-locale tags: show diagonal stripes to signal untranslated, but keep remove button visible */
+.tagify__tag.tag-foreign-locale > div::before {
+    animation: readonlyStyles 1s calc(-1s * (var(--readonly-striped) - 1)) paused;
+}

resources/sass/custom_timebank.css

@@ -0,0 +1,37 @@
+/* CUSTOM TIMEBANK STYLES TO OVERRULE OTHER STYLES */
+/* Usage: <div id="custom-timebank-style"> </div> */
+
+/* Custom styles for ordered lists */
+#custom-timebank-style ol {
+    padding-left: 10px;
+    margin-bottom: 1rem;
+}
+
+#custom-timebank-style ol li {
+    margin-bottom: 0.5rem;
+}
+
+/* Custom styles for checklists */
+#custom-timebank-style ul {
+    padding-left: 20px;
+    list-style-type: none;
+    margin-bottom: 1rem;
+}
+
+#custom-timebank-style ul li {
+    position: relative;
+    padding-left: 1.5em;
+    margin-bottom: 0.5rem;
+}
+
+
+/* Custom styles for unordered lists */
+#custom-timebank-style ul {
+    padding-left: 20px;
+    list-style-type: disc;
+    margin-bottom: 1rem;
+}
+
+#custom-timebank-style ul li {
+    margin-bottom: 0.5rem;
+}