@finqu/cool 1.0.0

package/less/utilities/background.less

@@ -0,0 +1,70 @@
+// Background
+.bg-black {
+    background-color: @color-black !important;
+}
+.bg-white {
+    background-color: @color-white !important;
+}
+.bg-blue-darker {
+    background-color: @color-blue-darker !important;
+}
+.bg-blue {
+    background-color: @color-blue !important;
+}
+.bg-blue-light {
+    background-color: @color-blue-light !important;
+}
+.bg-green {
+    background-color: @color-green !important;
+}
+.bg-pink {
+    background-color: @color-pink !important;
+}
+.bg-yellow {
+    background-color: @color-yellow !important;
+}
+.bg-red {
+    background-color: @color-red !important;
+}
+.bg-grey-darkest {
+    background-color: @color-grey-darkest !important;
+}
+.bg-grey-darker {
+    background-color: @color-grey-darker !important;
+}
+.bg-grey-dark {
+    background-color: @color-grey-dark !important;
+}
+.bg-grey {
+    background-color: @color-grey !important;
+}
+.bg-grey-light {
+    background-color: @color-grey-light !important;
+}
+.bg-grey-lighter {
+    background-color: @color-grey-lighter !important;
+}
+.bg-grey-lightest {
+    background-color: @color-grey-lightest !important;
+}
+.bg-placeholder {
+    background-color: @color-placeholder !important;
+}
+.bg-bg {
+    background-color: @color-bg !important;
+}
+.bg-icon {
+    background-color: @color-icon !important;
+}
+.bg-primary {
+    background-color: @color-primary !important;
+}
+.bg-secondary {
+    background-color: @color-secondary !important;
+}
+.bg-dark-grey-blue {
+    background-color: @color-dark-grey-blue !important;
+}
+.bg-grey-blue {
+    background-color: @color-grey-blue !important;
+}

package/less/utilities/borders.less

@@ -0,0 +1,16 @@
+// Borders
+.border {
+	border: 1px solid @color-border;
+}
+.border-top {
+	border-top: 1px solid @color-border;
+}
+.border-right {
+	border-right: 1px solid @color-border;
+}
+.border-left {
+	border-left: 1px solid @color-border;
+}
+.border-bottom {
+	border-bottom: 1px solid @color-border;
+}

package/less/utilities/color.less

@@ -0,0 +1,70 @@
+// Color
+.color-black {
+    color: @color-black !important;
+}
+.color-white {
+    color: @color-white !important;
+}
+.color-blue-darker {
+    color: @color-blue-darker !important;
+}
+.color-blue {
+    color: @color-blue !important;
+}
+.color-blue-light {
+    color: @color-blue-light !important;
+}
+.color-green {
+    color: @color-green !important;
+}
+.color-pink {
+    color: @color-pink !important;
+}
+.color-yellow {
+    color: @color-yellow !important;
+}
+.color-red {
+    color: @color-red !important;
+}
+.color-grey-darkest {
+    color: @color-grey-darkest !important;
+}
+.color-grey-darker {
+    color: @color-grey-darker !important;
+}
+.color-grey-dark {
+    color: @color-grey-dark !important;
+}
+.color-grey {
+    color: @color-grey !important;
+}
+.color-grey-light {
+    color: @color-grey-light !important;
+}
+.color-grey-lighter {
+    color: @color-grey-lighter !important;
+}
+.color-grey-lightest {
+    color: @color-grey-lightest !important;
+}
+.color-placeholder {
+    color: @color-placeholder !important;
+}
+.color-bg {
+    color: @color-bg !important;
+}
+.color-icon {
+    color: @color-icon !important;
+}
+.color-primary {
+    color: @color-primary !important;
+}
+.color-secondary {
+    color: @color-secondary !important;
+}
+.color-dark-grey-blue {
+    color: @color-dark-grey-blue !important;
+}
+.color-grey-blue {
+    color: @color-grey-blue !important;
+}

package/less/utilities/cursor.less

@@ -0,0 +1,8 @@
+// Cursor
+.c-default {
+	cursor: default;
+}
+
+.c-pointer {
+	cursor: pointer;
+}

package/less/utilities/display.less

@@ -0,0 +1,38 @@
+// Display
+.d-inline {
+	display: inline;
+}
+
+.d-inline-block {
+	display: inline-block;
+}
+
+.block,
+.d-block {
+	display: block;
+}
+
+.d-table {
+    display: table;
+}
+
+.d-table-row {
+	display: table-row;
+}
+
+.d-table-cell {
+	display: table-cell;
+}
+
+.d-flex {
+	display: flex;
+}
+
+.d-inline-flex {
+	display: inline-flex;
+}
+
+.d-none,
+.hidden {
+	display: none;
+}

package/less/utilities/embed.less

@@ -0,0 +1,61 @@
+// Embed
+.embed-responsive {
+	position: relative;
+	display: block;
+	width: 100%;
+	padding: 0;
+	overflow: hidden;
+	&::before {
+		display: block;
+		content: '';
+	}
+	&.embed-responsive-21by9 {
+		&::before {
+		padding-top: percentage(9/21);
+		}
+	}
+	&.embed-responsive-16by9 {
+		&::before {
+		padding-top: percentage(9/16);
+		}
+	}
+	&.embed-responsive-4by3 {
+		&::before {
+		padding-top: percentage(3/4);
+		}
+	}
+	&.embed-responsive-1by1 {
+		&::before {
+			padding-top: percentage(1/1);
+		}
+	}
+	.embed-responsive-item,
+	iframe,
+	embed,
+	object,
+	video {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+		border: 0;
+	}
+}
+
+.embed-tiles {
+	display: flex;
+	flex-wrap: wrap;
+	margin: -5px;
+	.embed-responsive {
+		margin: 5px;
+		flex: 0 1  ~"calc(50% - 10px)";
+		@media screen and (max-width: 680px) {
+			flex: 0 1 100%;
+		}
+		@media screen and (min-width: 767px) and (max-width: 1024px) {
+			flex: 0 1 100%
+		}
+	}
+}

package/less/utilities/flex.less

@@ -0,0 +1,76 @@
+// Flex
+.justify-content-start {
+    justify-content: flex-start ;
+}
+
+.justify-content-center {
+    justify-content: center;
+}
+
+.justify-content-end {
+    justify-content: flex-end ;
+}
+
+.justify-content-between {
+    justify-content: space-between;
+}
+
+.justify-content-around {
+    justify-content: space-around;
+}
+
+.flex-direction-column {
+    flex-direction: column;
+}
+
+.flex-direction-column-reverse {
+    flex-direction: column-reverse;
+}
+
+.flex-direction-row {
+    flex-direction: row;
+}
+
+.flex-direction-row-reverse {
+    flex-direction: row-reverse;
+}
+
+.align-items-baseline {
+	align-items: baseline;
+}
+
+.align-items-center {
+	align-items: center;
+}
+
+.align-items-end {
+	align-items: end;
+}
+
+.align-items-flex-end {
+	align-items: flex-end;
+}
+
+.align-items-flex-start {
+	align-items: flex-start;
+}
+
+.align-items-left {
+	align-items: left;
+}
+
+.align-items-normal {
+	align-items: normal;
+}
+
+.align-items-right {
+	align-items: right;
+}
+
+.align-items-start {
+	align-items: start;
+}
+
+.align-items-stretch {
+	align-items: stretch;
+}

package/less/utilities/jquery-ui.less

@@ -0,0 +1,116 @@
+// jQuery UI
+.ui-helper-hidden-accessible {
+	display: none;
+}
+.ui-autocomplete {
+	display: block;
+	position: absolute;
+	background: #fff;
+	float: left;
+	margin: 0;
+	padding: 5px 0;
+	text-align: left;
+	list-style: none;
+	font-size: 12px;
+	box-sizing: border-box;
+	max-height: 250px;
+    overflow-y: scroll;
+    z-index: 1000000;
+    border-radius: 3px;
+    box-shadow: 0 0 0 1px rgba(39,44,48,0.05), 0 2px 7px 1px rgba(39,44,48,0.16);
+	li {
+		width: 100%;
+		position: relative;
+		display: inline-block;
+		float: left;
+		box-sizing: border-box;
+		text-align: left;
+		border: 0;
+		background-color: transparent;
+		padding: 10px;
+		clear: both;
+		font-weight: 400;
+		line-height: 1.42857143;
+		color: #23363D;
+		&:hover {
+			background: #F3F6F8;
+			color: #23363D;
+			cursor: pointer;
+        }
+        a {
+        	display: flex;
+        	align-items: center;
+        	color: #23363D;
+        	&:hover {
+        		color: #23363D;
+        	}
+        }
+		img {
+			display: inline-block;
+			float: left;
+			max-height: 32px;
+			max-width: 32px;
+			margin-right: 15px;
+			border-radius: @border-radius;
+		}
+		span {
+			font-size: 12px;
+			font-weight: 400;
+			margin-left: 5px;
+		}
+	}
+}
+
+.ui-datepicker-trigger {
+	font-family: 'FontAwesome';
+	color: #FFF;
+	text-align: center;
+	margin: 0px;
+	height: 35px;
+	margin-top: 0px;
+	border: none;
+	text-decoration: none;
+	padding: 0px 13px;
+	-webkit-appearance: none;
+	border-bottom-right-radius: 0px;
+	border-bottom-left-radius: 0px;
+	border-top-right-radius: 0px;
+	border-top-left-radius: 0px;
+	background: @color-blue;
+	cursor: pointer;
+	font-size: 14px;
+	white-space: nowrap;
+	display: inline-block;
+	vertical-align: middle;
+}
+
+.ui-datepicker {
+    background: white;
+    border: 1px solid #ccc;
+    padding: 15px;
+    font-size: 12px;
+    display: none;
+    table td,th {
+        text-align: center;
+    }
+}
+
+.ui-datepicker-next {
+    float: right;
+}
+
+.ui-datepicker-next:hover,
+.ui-datepicker-prev:hover {
+    cursor: pointer;
+}
+
+.ui-datepicker-title {
+    font-size: 14px;
+    color: #555;
+    margin: 10px 0 5px 0;
+}
+
+.ui-datepicker-today {
+    border: 1px solid #ccc;
+    background: #efefef;
+}

package/less/utilities/lazyload.less

@@ -0,0 +1,29 @@
+// Lazyload
+img:not([src]):not([srcset]) {
+	visibility: hidden;
+}
+
+@-moz-document url-prefix() {
+    img:-moz-loading {
+        visibility: hidden;
+    }
+}
+
+img[data-src],
+img[data-srcset], {
+	display: block;
+	min-height: 1px;
+	border: 0;
+	opacity: 0;
+	margin: 0 auto;
+}
+
+img:not(.initial):not(.no-transition) {
+	transition: opacity 0.4s;
+}
+
+img.initial,
+img.loaded,
+img.error {
+	opacity: 1;
+}

package/less/utilities/overflow.less

@@ -0,0 +1,11 @@
+// Overflow
+.no-overflow {
+    overflow: hidden !important;
+}
+
+.overflow-visible,
+.section .overflow-visible,
+.section .section-content.overflow-visible {
+    overflow-x: visible;
+    overflow-y: visible;
+}

package/less/utilities/pace.less

@@ -0,0 +1,25 @@
+// Pace
+.pace {
+    position: absolute;
+    left: 0;
+    right: 0;
+    height: 2px;
+    pointer-events: none;
+    user-select: none;
+    overflow: hidden;
+    @media screen and (max-width: 767px) {
+        left: 0;
+    }
+    &.pace-inactive {
+        display: none;
+    }
+    > .pace-progress {
+        position: absolute;
+        top: 0;
+        right: 100%;
+        width: 100%;
+        height: 2px;
+        background: @color-blue;
+        z-index: 2000;
+    }
+}

package/less/utilities/placeholder.less

@@ -0,0 +1,60 @@
+// Placeholder
+.placeholder {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	color: @color-text;
+    box-sizing: border-box;
+    padding: 16px;
+	.placeholder-icon {
+		.icon {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			border-radius: 50%;
+			width: 100px;
+			height: 100px;
+			color: @color-grey-darker;
+			background-color: @color-grey-lighter;
+			padding: 10px;
+			i {
+				font-size: 5rem;
+			}
+		}
+		& + .placeholder-title,
+		& + .placeholder-description,
+		& + .placeholder-action,
+		& + .placeholder-action-secondary {
+			margin-top: 20px;
+		}
+	}
+	.placeholder-title {
+		text-align: center;
+		color: @color-grey-blue;
+		& + .placeholder-description {
+			margin-top: 10px;
+		}
+		& + .placeholder-action,
+		& + .placeholder-action-secondary {
+			margin-top: 20px;
+		}
+	}
+	.placeholder-description {
+		text-align: center;
+		font-weight: @font-weight-light;
+		color: @color-grey-darker;
+		.description {
+			margin-bottom: 0;
+		}
+		& + .placeholder-action,
+		& + .placeholder-secondary {
+			margin-top: 20px;
+		}
+	}
+	.placeholder-action {
+		& + .placeholder-secondary {
+			margin-top: 20px;
+		}
+	}
+}

package/less/utilities/position.less

@@ -0,0 +1,42 @@
+// Position
+.position-static {
+	position: static;
+}
+
+.position-relative {
+	position: relative;
+}
+
+.position-absolute {
+	position: absolute;
+}
+
+.position-fixed {
+	position: fixed;
+}
+
+.position-sticky {
+	position: sticky;
+}
+
+.fixed-top {
+	position: fixed;
+	top: 0;
+	right: 0;
+	left: 0;
+	z-index: @zindex-fixed;
+}
+
+.fixed-bottom {
+	position: fixed;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	z-index: @zindex-fixed;
+}
+
+.sticky-top {
+	position: sticky;
+	top: 0;
+	z-index: @zindex-sticky;
+}