desk-kit 2.0.9 → 2.1.2

package/dist/styles/global.css

@@ -0,0 +1,783 @@
+:root {
+	--main-color: #090c0f;
+	--primary-color: #0568fd;
+	--primary-color-light_20: #3c89fd;
+	--primary-color-light_80: #e3eefe;
+	--primary-color-dark_20: #0350c4;
+	--primary-color-dark_80: #000b1c;
+	--secondary-color: #17152b;
+	--secondary-color-light_20: #454455;
+	--aditional-color: #e76a4f;
+	--border-color: #707070;
+	--low-contrarst: #e0e0e2;
+	--low-contrarst-50: hsla(240, 3%, 88%, 0.5);
+	--low-contrarst-20: hsla(240, 3%, 88%, 0.2);
+	--mid-contrarst: #747380;
+	--border-radius: 5px;
+	--min-border-radius: 3px;
+	--font-regular: "Inter";
+	--font-medium: "Inter";
+	--font-bold: "Inter";
+	--error-color: #c72f37;
+	--warning-color: #eaad1c;
+	--success-color: #64bf4b;
+	--purple-color: #523395;
+	--font-size: 16px;
+}
+
+* {
+	box-sizing: border-box;
+	padding: 0;
+	margin: 0;
+}
+
+body {
+	margin: 0px;
+	padding: 0px;
+	font-family: Inter;
+	text-rendering: optimizeLegibility;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+	background-color: #f8fafd;
+	font-size: var(--font-size);
+}
+
+.box {
+	padding: 15px;
+	padding-top: 30px;
+	padding-bottom: 30px;
+	min-height: 200px;
+	border-radius: 10px;
+}
+
+.link {
+	color: #0568fd;
+	cursor: pointer;
+	text-decoration: underline;
+	font-size: 14px;
+}
+
+.wrapper {
+	width: 100%;
+}
+
+.wrapper .content {
+	width: 100%;
+	display: flex;
+	align-items: stretch;
+	flex-direction: row;
+}
+
+.body {
+	background-color: white;
+	width: 100%;
+	border-radius: 20px 0px 0px 0px;
+	min-height: calc(100vh - 80px);
+}
+@media all and (max-width: 768px) {
+	.body {
+		border-radius: 20px 20px 0px 0px;
+		margin-bottom: 80px;
+	}
+}
+.pincode-input-text {
+	font-family: Inter;
+	font-weight: bold;
+	font-size: 22px;
+}
+@media (prefers-color-scheme: dark) {
+	html {
+		color-scheme: dark;
+	}
+}
+
+@media (prefers-color-scheme: dark) {
+	.body {
+		background-color: #121212;
+	}
+	body {
+		background-color: #1b1b1b;
+	}
+	.pincode-input-text {
+		border-color: white !important;
+	}
+}
+
+.home_select {
+	list-style-type: none;
+	margin: 0px;
+	padding: 0px;
+}
+.home_select li a {
+	text-decoration: none;
+	color: inherit;
+}
+.home_select li {
+	padding: 15px;
+	border: 1px solid rgba(0, 0, 0, 0.13);
+	border-bottom: 0px;
+}
+.home_select li:first-child {
+	border-radius: 10px 10px 0px 0px;
+}
+
+.home_select li:last-child {
+	border-radius: 0px 0px 10px 10px;
+	border-bottom: 1px solid rgba(0, 0, 0, 0.13);
+}
+
+@media (prefers-color-scheme: dark) {
+	.home_select li {
+		border-color: rgba(255, 255, 255, 0.13);
+	}
+	.home_select li:last-child {
+		border-bottom: 1px solid rgba(255, 255, 255, 0.13);
+	}
+}
+
+.mapa-container {
+	position: relative;
+}
+.mapa-container:before {
+	position: absolute;
+	content: "";
+	background-color: black;
+	width: 1px;
+	left: 50%;
+	top: 0px;
+	bottom: 0px;
+	z-index: 1;
+}
+.mapa-container:after {
+	position: absolute;
+	content: "";
+	background-color: black;
+	height: 1px;
+	left: 0px;
+	right: 0px;
+	top: 50%;
+	z-index: 1;
+}
+
+/* .cropper-view-box,
+.cropper-face {
+	border-radius: 50%;
+}
+
+.cropped-image {
+	border-radius: 50%; 
+} */
+
+.drop-zone {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	min-height: 150px;
+	border-radius: 10px;
+	padding: 15px;
+	border: 1px dashed var(--primary-color-light_20);
+}
+
+.drop-zone.isDragActive {
+	border-color: #000b1c;
+}
+.text-align-right {
+	text-align: right;
+}
+.text-align-center {
+	text-align: center;
+}
+
+.text-center {
+	text-align: center;
+}
+.folder-card {
+	width: 100%;
+	background-color: #e3eefe;
+	border-radius: 8px;
+	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+	position: relative;
+	padding: 20px;
+	padding-left: 20px;
+	color: #333;
+	font-family: Arial, sans-serif;
+	min-height: 220px;
+}
+
+.folder-tab {
+	position: absolute;
+	left: 0px;
+	top: -16px;
+	width: 45%;
+	height: 30px;
+	background-color: #e3eefe;
+	border-radius: 5px 5px 0px 0px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	font-weight: bold;
+}
+
+.folder-content {
+	margin-top: 0px;
+}
+
+.folder-style {
+	overflow: visible;
+	position: relative;
+	background-color: #e3eefe;
+	border: 1px solid #abccfe;
+	border-radius: 0px 10px 10px 10px;
+}
+
+.folder-style:before {
+	content: "";
+	position: absolute;
+	height: 30px;
+	top: -30px;
+	width: 200px;
+	background: #e3eefe;
+	border-radius: 10px 10px 0px 0px;
+	border-left: 1px solid #abccfe;
+	border-top: 1px solid #abccfe;
+	border-right: 1px solid #abccfe;
+	left: -1px;
+}
+
+.folder-min-height {
+	min-height: 120px;
+}
+
+.folder-style.selected {
+	border-color: #0568fd;
+}
+
+.folder-style.selected::before {
+	border-color: #0568fd;
+}
+.contentsearch fieldset {
+	border-radius: 30px;
+}
+.contentsearch select {
+	min-width: 138px;
+}
+.gray {
+	color: #454455;
+}
+.card-skyblue {
+	background-color: #f8fafd;
+	padding: 4px;
+	margin-top: 0px;
+	justify-content: space-between;
+	border-radius: 5px;
+}
+.bold {
+	font-weight: bold;
+}
+.date {
+	font-size: 12px;
+	padding: 0px;
+	line-height: 1.43;
+	margin: 0px;
+	display: flex;
+	align-items: center;
+}
+@media (prefers-color-scheme: dark) {
+	.folder-style {
+		background-color: initial !important;
+		border-color: initial !important;
+		border: 0px !important;
+	}
+	.folder-style::before {
+		border: 0px !important;
+		background: linear-gradient(
+			rgba(255, 255, 255, 0.05),
+			rgba(255, 255, 255, 0.05)
+		);
+	}
+	.folder-style.selected {
+		border-color: initial !important;
+		border: 1px solid white !important;
+	}
+	.folder-style.selected::before {
+		border-color: initial !important;
+		border: 1px solid white !important;
+	}
+	.gray {
+		color: initial !important;
+	}
+	.card-skyblue {
+		background-color: initial !important;
+	}
+}
+
+.table-row-draggable .icon-draggable {
+	display: none;
+}
+
+.table-row-draggable:hover .icon-draggable,
+.table-row-draggable.isDragging .icon-draggable {
+	display: block;
+}
+
+.table-row-draggable:hover td {
+	border-bottom: 1px solid #0568fd !important;
+}
+.table-row-draggable:hover td:first-child {
+	border-bottom: 0px !important;
+}
+.table-row-draggable td:first-child {
+	position: relative;
+}
+.table-row-draggable td:first-child::after {
+	content: "";
+	position: absolute;
+	width: 4px;
+	height: 4px;
+	border-radius: 4px;
+	background-color: #e0e0e2;
+	bottom: 0px;
+	right: 50%;
+}
+
+.table-row-draggable.isDragging td:first-child::after {
+	display: none !important;
+}
+.add-item-table {
+	display: none;
+	position: absolute;
+	bottom: -10px;
+	width: 20px;
+	height: 20px;
+	left: 50%;
+	background-color: #0568fd;
+	border-radius: 50%;
+	border: 0px;
+	cursor: pointer;
+}
+.mar-3 {
+	margin-right: 8px;
+}
+
+.add-item-table::after {
+	content: "";
+	position: absolute;
+	width: 30px;
+	height: 1px;
+	background-color: #0568fd;
+	right: -30px;
+	top: calc(50%);
+	cursor: pointer;
+}
+.table-row-draggable:not():hover td,
+.table-row-draggable.isDragging td {
+	background-color: #f8fafd;
+}
+.table-row-draggable.isDragging td {
+	border-bottom: 0px;
+}
+
+.table-row-draggable td:first-child {
+	border-radius: 10px 0px 0px 10px;
+}
+.table-row-draggable td:last-child {
+	border-radius: 0px 10px 10px 0px;
+}
+@media (prefers-color-scheme: dark) {
+	.table-row-draggable:hover td,
+	.table-row-draggable.isDragging td {
+		background-color: #111b22;
+	}
+}
+.table-row-draggable:hover td:first-child::after {
+	display: none;
+}
+.table-row-draggable:hover .add-item-table {
+	display: block;
+}
+
+.table-header td {
+	background-color: #012254;
+	border-bottom: 0px !important;
+}
+
+.section-table {
+	margin-bottom: 15px;
+}
+
+table.section-table .section-footer td {
+	background-color: #012254;
+	border-radius: 0px 0px 10px 10px;
+}
+
+.section-borders-left:not(.isDragging) {
+	border-left: 1px solid #012254;
+}
+
+.section-borders-right:not(.isDragging) {
+	border-right: 1px solid #012254;
+}
+
+.table-header-sub-content .section-borders-left:not(.isDragging) {
+	border-left: none;
+}
+.table-header-sub-content .section-borders-right:not(.isDragging) {
+	border-right: none;
+}
+
+.table-header-sub-content tr:last-child td {
+	border-bottom: 0px !important;
+}
+
+.table-header td > * {
+	color: white !important;
+}
+.table-header td:first-child {
+	border-radius: 10px 0px 0px 0px;
+}
+.table-header td:last-child {
+	border-radius: 0px 10px 0px 0px;
+}
+
+.table-header-sub td {
+	background-color: #abccfe;
+	border-bottom: 0px !important;
+}
+.table-header-sub td:first-child {
+	border-radius: 10px 0px 0px 0px;
+}
+.table-header-sub td:last-child {
+	border-radius: 0px 10px 0px 0px;
+}
+
+.table-header-sub.bottom td:first-child {
+	border-radius: 0px 0px 10px 10px;
+}
+.table-header-sub-content {
+	border-left: 1px solid #abccfe;
+	border-bottom: 1px solid #abccfe;
+	border-right: 1px solid #abccfe;
+}
+
+.table-header-sub-content table tbody:last-child tr:last-child td {
+	border-bottom: 0px !important;
+}
+.table-concept {
+	margin-top: 15px;
+	margin-bottom: 15px;
+}
+.table-concept tbody {
+	border: 0px !important;
+}
+
+.area-dropable {
+	min-height: 30px; /* Ajusta la altura mínima según tus necesidades */
+}
+
+.no-border {
+	background-color: transparent !important;
+	border: 0px !important;
+}
+
+.min-height {
+	min-height: 30px;
+}
+.no-wrap {
+	white-space: nowrap;
+}
+.avatarcontent {
+	display: flex;
+	margin-bottom: auto;
+	min-height: 100px;
+}
+
+/* Dropdown menu */
+.dropdown-menu {
+	background: white;
+	border: 1px solid var(--secondary-color-light_20);
+	border-radius: 0.7rem;
+	box-shadow: var(--shadow);
+	display: flex;
+	flex-direction: column;
+	gap: 0.1rem;
+	overflow: auto;
+	padding: 0.4rem;
+	position: relative;
+}
+.dropdown-menu button {
+	align-items: center;
+	background-color: transparent;
+	display: flex;
+	padding: 5px;
+	border: 0px;
+	text-align: left;
+	width: 100%;
+}
+.dropdown-menu button:hover,
+.dropdown-menu button:hover.is-selected {
+	background-color: var(--low-contrarst);
+}
+.dropdown-menu button.is-selected {
+	background-color: var(--primary-color);
+	color: white;
+}
+
+.tiptap :first-child {
+	margin-top: 0;
+}
+.mention {
+	background-color: var(--primary-color-light_80);
+	border-radius: 0.4rem;
+	box-decoration-break: clone;
+	color: var(--primary-color);
+	padding: 0.1rem 0.3rem;
+}
+
+.tiptap {
+	width: 100%;
+	min-height: 60px;
+	border: 1px solid #707070;
+	min-width: 200px;
+	padding: 5px;
+	border-radius: 5px;
+}
+
+.editor-comments {
+	width: 100%;
+}
+
+.comment-item {
+	margin-bottom: 15px;
+}
+.comment-wrapper {
+	width: 100%;
+}
+.comment-description {
+	position: relative;
+	width: 100%;
+	background-color: #f8fafd;
+	padding: 5px;
+	border-radius: 5px;
+	min-height: 48px;
+}
+.comment-description p {
+	color: #17152b;
+}
+
+.comment-user-name {
+	color: #454455;
+	font-weight: bold;
+}
+
+.notification-item {
+	position: relative;
+	background-color: white;
+	padding: 3px;
+	border-radius: 3px;
+	margin: 3px;
+	margin-left: 5px;
+	margin-right: 5px;
+}
+.notification-item:hover {
+	background-color: #f4f4f5;
+	cursor: pointer;
+}
+.notification-description {
+	max-width: 300px;
+}
+
+.notification-read {
+	width: 12px;
+	height: 12px;
+	border-radius: 12px;
+	background-color: var(--primary-color);
+	position: absolute;
+	top: 8px;
+	right: 8px;
+}
+.comment-description p {
+	font-size: 14px;
+}
+.groupavatars .MuiAvatar-circular {
+	width: 36px;
+	height: 36px;
+}
+
+@media (prefers-color-scheme: dark) {
+	.notification-item {
+		background-color: transparent;
+	}
+
+	.notification-item:hover {
+		background-color: #1b1b1b;
+	}
+	.comment-description {
+		background-color: #1b1b1b;
+	}
+
+	.comment-description p {
+		color: white;
+	}
+	.comment-description span:not(.mention) {
+		color: white;
+	}
+}
+.notifications_wrapper {
+	width: 100%;
+	max-height: 400px;
+	overflow-y: scroll;
+}
+
+/*header*/
+header.main {
+	width: 100%;
+	height: 80px;
+	background-color: #f8fafd;
+	position: sticky;
+	top: 0px;
+	z-index: 2;
+	padding-left: 15px;
+	padding-right: 15px;
+	justify-content: space-between;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+}
+
+header.main .button_account {
+	border-radius: 5px;
+	padding: 5px;
+	padding-left: 8px;
+	padding-right: 8px;
+	cursor: pointer;
+	margin-left: 15px;
+}
+header.main .button_account:hover {
+	border-color: var(--primary-color);
+	background-color: var(--primary-color);
+}
+header.main .button_account h6 {
+	margin: 0px;
+	padding: 0px;
+	line-height: initial !important;
+}
+header.main .button_account:hover h6 {
+	color: white;
+}
+
+header.main .nav {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+}
+
+header.main .nav .logo {
+	width: 210px;
+	height: 70px;
+	margin-right: 15px;
+}
+
+header .search {
+	position: relative;
+	display: flex;
+	flex-direction: row;
+	background-color: #f3f3f3;
+	width: 100%;
+	height: 48px;
+	border-radius: 5px;
+	max-width: 375px;
+}
+header .search .icon {
+	width: 48px;
+	height: 48px;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	justify-content: center;
+}
+header .search input {
+	width: 100%;
+	height: 100%;
+	position: absolute;
+	border: 0px;
+	background-color: transparent;
+	padding-left: 48px;
+}
+
+.app_item {
+	text-decoration: none;
+	border-radius: 5px;
+	width: 100px;
+	height: 111px;
+	background-color: white;
+	display: flex;
+	color: inherit;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+}
+
+.app_item:hover {
+	cursor: pointer;
+	background-color: #f4f4f5;
+}
+
+.app_item .app_icon {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	justify-content: center;
+	background-color: #e76a4f;
+	border-radius: 5px;
+	width: 40px;
+	height: 40px;
+}
+
+@media all and (max-width: 768px) {
+	header .logo {
+		display: none;
+	}
+	header .sections {
+		display: none;
+	}
+	header .button_account_name {
+		display: none;
+	}
+}
+
+@media (prefers-color-scheme: dark) {
+	header.main {
+		background-color: #1b1b1b;
+	}
+
+	header .search {
+		background-color: #282a2c;
+	}
+	header .search svg {
+		fill: rgba(255, 255, 255, 0.7) !important ;
+	}
+	.app_item {
+		background-color: transparent;
+	}
+
+	.app_item .app_icon {
+		background-color: #a42f16;
+	}
+
+	.app_item:hover {
+		background-color: #1b1b1b;
+	}
+}
+
+
+.table-footer-content{
+	background-color: #012254;
+}
+
+.table-footer-content.end td:first-child{
+	border:0px 0px 10px 0px;
+}
+.table-footer-content.end td:last-child{
+	border:0px 0px 0px 10px;
+}