@finqu/cool 1.0.0

package/scss/_navbar.scss

@@ -0,0 +1,214 @@
+// Navbar
+// ---------------------------------------------------------------------------------------------------------------
+
+html.dom-ready {
+    .navbar {
+    	.navbar-brand {
+			.sidebar-left-toggler,
+			.sidebar-right-toggler {
+				.border,
+				.img-bordered {
+					transition: border-color .15s ease-in-out;
+				}
+			}
+    	}
+
+    	.navbar-nav {
+			.nav-item {
+				transition: color .15s ease-in-out;
+
+				.border,
+				.img-bordered {
+					transition: border-color .15s ease-in-out;
+				}
+			}
+    	}
+    }
+}
+
+.navbar {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	justify-content: space-between;
+	background-color: $navbar-bg;
+	height: $navbar-height;
+	position: relative;
+	border-bottom: $navbar-border-width solid $navbar-border-color;
+	padding: 0 $navbar-padding-x;
+	@include media-breakpoint-down(sm) {
+		height: $navbar-height-sm;
+		padding: 0;
+	}
+
+	.navbar-brand {
+		display: flex;
+		align-items: center;
+		height: 100%;
+		box-sizing: border-box;
+		@include media-breakpoint-down(sm) {
+			width: 100%;
+		}
+
+		& + .navbar-nav {
+			margin-left: 20px;
+		}
+
+		// Brand
+		.brand-container {
+			display: flex;
+			height: 100%;
+			align-items: center;
+			justify-content: flex-start;
+			width: 100%;
+			height: 100%;
+			@include media-breakpoint-down(sm) {
+				justify-content: center;
+			}
+
+			.brand {
+				svg {
+					margin-top: 5px;
+				}
+			}
+		}
+
+		// Sidebar toggles
+		.sidebar-left-toggler,
+		.sidebar-right-toggler {
+		    display: flex;
+		    min-width: $navbar-height-sm;
+		    height: 100%;
+		    justify-content: center;
+		    align-items: center;
+		    @include media-breakpoint-up(md) {
+		    	display: none
+		    }
+
+		    &.open {
+				.icon {
+					margin-right: -5px;
+
+					&.animated span {
+						&:nth-child(1) {
+							transform: rotate(45deg);
+							top: 0px;
+							left: 0px;
+						}
+
+						&:nth-child(2) {
+							width: 0%;
+					  		opacity: 0;
+						}
+
+						&:nth-child(3) {
+							transform: rotate(-45deg);
+							top: 15px;
+							left: 0px;
+						}
+					}
+				}
+			}
+
+			.icon {
+				&.animated {
+					width: 22px;
+					height: 15px;
+					position: relative;
+					transform: rotate(0deg);
+					transition: all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1);
+					cursor: pointer;
+
+					span {
+						display: block;
+						position: absolute;
+						height: 2px;
+						width: 100%;
+						background: $navbar-color;
+						border-radius: 1px;
+						opacity: 1;
+						left: 0;
+						transform: rotate(0deg);
+						transition: 0.25s ease-in-out;
+
+						&:nth-child(1) {
+							top: 0px;
+							transform-origin: left center;
+						}
+
+						&:nth-child(2) {
+							top: 6px;
+							transform-origin: left center;
+						}
+
+						&:nth-child(3) {
+							top: 12px;
+							transform-origin: left center;
+						}
+					}
+				}
+			}
+
+			.border,
+			.img-bordered {
+				border-color: $navbar-color;
+			}
+		}
+	}
+
+	// Nav
+	.navbar-nav {
+		display: flex;
+		width: 100%;
+		height: 100%;
+		justify-content: flex-end;
+		align-items: center;
+		margin-right: -#{$navbar-item-padding-x};
+		@include media-breakpoint-down(sm) {
+			display: none;
+		}
+
+		.nav-item {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			padding: 0 $navbar-item-padding-x;
+			font-size: $navbar-item-font-size;
+			line-height: 0;
+			background-color: transparent;
+			border: 0;
+			cursor: pointer;
+			outline: 0;
+			color: $navbar-color;
+			margin: 0 0 auto 0;
+			box-sizing: border-box;
+			min-width: 45px;
+			text-align: center;
+			height: 100%;
+
+			.icon {
+				width: auto;
+				height: $navbar-item-icon-size;
+			}
+
+			&:hover,
+			&.active {
+				color: $navbar-hover-color;
+
+				.border,
+				.img-bordered {
+					border-color: $navbar-hover-color;
+				}
+			}
+
+			.border,
+			.img-bordered {
+				border-color: $navbar-color;
+			}
+		}
+
+		.nav-dropdown {
+			height: 100%;
+		}
+	}
+}

package/scss/_pagination.scss

@@ -0,0 +1,79 @@
+// Pagination
+// ---------------------------------------------------------------------------------------------------------------
+
+.pagination {
+    display: inline-flex;
+    flex-wrap: wrap;
+    margin: 0 0 20px 0;
+    padding-left: 0;
+    list-style: none;
+    border-radius: $border-radius;
+    background-color: $pagination-bg;
+    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(63, 63, 68, 0.1);
+    overflow: hidden;
+
+    .page-item {
+        outline: 0;
+
+        &:first-child {
+            .page-link {
+                margin-left: 0;
+                border-top-left-radius: $border-radius;
+                border-bottom-left-radius: $border-radius;
+                border-left: 0;
+            }
+        }
+
+        &:last-child {
+            .page-link {
+                border-top-right-radius: $border-radius;
+                border-bottom-right-radius: $border-radius;
+                border-right: 0;
+            }
+        }
+
+        &.active {
+            .page-link {
+                z-index: 2;
+                color: $pagination-active-color;
+                background-color: $pagination-active-bg;
+                border-color: $pagination-active-border-color;
+            }
+        }
+
+        &.disabled {
+            cursor: not-allowed;
+
+            .page-link {
+                color: $pagination-disabled-color;
+                pointer-events: none;
+                background-color: $pagination-disabled-bg;
+                border-color: $pagination-disabled-border-color;
+            }
+        }
+
+        &:not(.active):not(.disabled) {
+            .page-link {
+                &:focus,
+                &:hover {
+                    color: $pagination-hover-color;
+                    text-decoration: none;
+                    background-color: $pagination-hover-bg;
+                    border-color: $pagination-hover-border-color;
+                }
+            }
+        }
+
+        .page-link {
+            position: relative;
+            display: block;
+            padding: $pagination-padding-y $pagination-padding-x;
+            margin-left: -1px;
+            line-height: $pagination-line-height;
+            color: $pagination-color;
+            background-color: $pagination-bg;
+            border-left: $pagination-border;
+            border-right: $pagination-border;
+        }
+    }
+}

package/scss/_popover.scss

@@ -0,0 +1,165 @@
+// Popover
+// ---------------------------------------------------------------------------------------------------------------
+
+.popover {
+	position: absolute;
+	top: 0;
+	left: 0;
+	z-index: $zindex-popover;
+	display: block;
+	max-width: $popover-max-width;
+	font-size: $popover-font-size;
+	word-wrap: break-word;
+	background-color: $popover-bg;
+	background-clip: padding-box;
+	border: $popover-border-width solid $popover-border-color;
+	border-radius: $popover-border-radius;
+	@include reset-text;
+
+	.arrow {
+		position: absolute;
+		display: block;
+		width: $popover-arrow-width;
+		height: $popover-arrow-height;
+		margin: 0 $border-radius;
+
+		&::before,
+		&::after {
+			position: absolute;
+			display: block;
+			content: '';
+			border-color: transparent;
+			border-style: solid;
+		}
+	}
+}
+
+.popover-top {
+	margin-bottom: $popover-arrow-height;
+
+	.arrow {
+		bottom: calc((#{$popover-arrow-height} + #{$popover-border-width}) * -1);
+	}
+
+	.arrow::before,
+	.arrow::after {
+		border-width: $popover-arrow-height ($popover-arrow-width / 2) 0;
+	}
+
+	.arrow::before {
+		bottom: 0;
+		border-top-color: $popover-arrow-outer-color;
+	}
+
+	.arrow::after {
+		bottom: $popover-border-width;
+		border-top-color: $popover-arrow-color;
+	}
+}
+
+.popover-right {
+	margin-left: $popover-arrow-height;
+
+	.arrow {
+		left: calc((#{$popover-arrow-height} + #{$popover-border-width}) * -1);
+		width: $popover-arrow-height;
+		height: $popover-arrow-width;
+		margin: $border-radius 0;
+	}
+
+	.arrow::before,
+	.arrow::after {
+		border-width: ($popover-arrow-width / 2) $popover-arrow-height ($popover-arrow-width / 2) 0;
+	}
+
+	.arrow::before {
+		left: 0;
+		border-right-color: $popover-arrow-outer-color;
+	}
+
+	.arrow::after {
+		left: $popover-border-width;
+		border-right-color: $popover-arrow-color;
+	}
+}
+
+.popover-bottom {
+	margin-top: $popover-arrow-height;
+
+	.arrow {
+		top: calc((#{$popover-arrow-height} + #{$popover-border-width}) * -1);
+	}
+
+	.arrow::before,
+	.arrow::after {
+		border-width: 0 ($popover-arrow-width / 2) $popover-arrow-height ($popover-arrow-width / 2);
+	}
+
+	.arrow::before {
+		top: 0;
+		border-bottom-color: $popover-arrow-outer-color;
+	}
+
+	.arrow::after {
+		top: $popover-border-width;
+		border-bottom-color: $popover-arrow-color;
+	}
+
+	.popover-header::before {
+		position: absolute;
+		top: 0;
+		left: 50%;
+		display: block;
+		width: $popover-arrow-width;
+		margin-left: ($popover-arrow-width / -2);
+		content: '';
+		border-bottom: $popover-border-width solid $popover-header-bg;
+	}
+}
+
+.popover-left {
+	margin-right: $popover-arrow-height;
+
+	.arrow {
+		right: calc((#{$popover-arrow-height} + #{$popover-border-width}) * -1);
+		width: $popover-arrow-height;
+		height: $popover-arrow-width;
+		margin: $border-radius 0;
+	}
+
+	.arrow::before,
+	.arrow::after {
+		border-width: ($popover-arrow-width / 2) 0 ($popover-arrow-width / 2) $popover-arrow-height;
+	}
+
+	.arrow::before {
+		right: 0;
+		border-left-color: $popover-arrow-outer-color;
+	}
+
+	.arrow::after {
+		right: $popover-border-width;
+		border-left-color: $popover-arrow-color;
+	}
+}
+
+.popover-header {
+	padding: $popover-header-padding-y $popover-header-padding-x;
+	margin-top: 0;
+	margin-bottom: 0;
+	font-size: $font-size-base;
+	color: $popover-header-color;
+	background-color: $popover-header-bg;
+	border-bottom: $popover-border-width solid darken($popover-header-bg, 5%);
+	border-top-left-radius: calc(#{$border-radius} - #{$popover-border-width});
+	border-top-right-radius: calc(#{$border-radius} - #{$popover-border-width});
+
+	&:empty {
+		display: none;
+	}
+}
+
+.popover-body {
+	padding: $popover-body-padding-y $popover-body-padding-x;
+	color: $popover-body-color;
+}

package/scss/_reboot.scss

@@ -0,0 +1,279 @@
+// Reboot
+// ---------------------------------------------------------------------------------------------------------------
+
+*,
+*::before,
+*::after {
+    box-sizing: border-box;
+}
+
+html {
+    font-family: sans-serif;
+    line-height: 1.15;
+    -webkit-text-size-adjust: 100%;
+    -ms-text-size-adjust: 100%;
+    -ms-overflow-style: scrollbar;
+    -webkit-tap-highlight-color: rgba(color('black'), 0);
+    -webkit-font-smoothing: antialiased;
+}
+
+body {
+    margin: 0;
+    font-family: $font-family-base;
+    font-size: $font-size-base;
+    font-weight: $font-weight-base;
+    line-height: $line-height-base;
+    color: $body-color;
+    text-align: left;
+    background-color: $body-bg;
+}
+
+article,
+aside,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+nav,
+section {
+    display: block;
+}
+
+button,
+input,
+optgroup,
+select,
+textarea {
+    margin: 0;
+    font-family: inherit;
+    font-size: inherit;
+    line-height: inherit;
+}
+
+hr {
+    box-sizing: content-box;
+    height: 0;
+    overflow: visible;
+}
+
+button {
+    border-radius: 0;
+}
+
+button,
+input {
+    overflow: visible;
+}
+
+button,
+select {
+    text-transform: none;
+}
+
+select {
+    word-wrap: normal;
+}
+
+img {
+    vertical-align: middle;
+    border-style: none;
+}
+
+svg {
+    overflow: hidden;
+    vertical-align: middle;
+}
+
+progress {
+    vertical-align: baseline;
+}
+
+abbr[title],
+abbr[data-original-title] {
+    text-decoration: underline;
+    text-decoration: underline dotted;
+    cursor: help;
+    border-bottom: 0;
+}
+
+address {
+    margin-bottom: 16px;
+    font-style: normal;
+    line-height: inherit;
+}
+
+ol,
+ul,
+dl {
+    margin-top: 0;
+    margin-bottom: 16px;
+}
+
+ol ol,
+ul ul,
+ol ul,
+ul ol {
+    margin-bottom: 0;
+}
+
+dt {
+  font-weight: 400;
+}
+
+dd {
+  margin-bottom: 8px;
+  margin-left: 0;
+}
+
+blockquote {
+  margin: 0 0 16px;
+}
+
+dfn {
+  font-style: italic;
+}
+
+[tabindex="-1"]:focus {
+    outline: 0 !important;
+}
+
+button,
+html [type="button"],
+[type="reset"],
+[type="submit"] {
+    -webkit-appearance: button;
+}
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+    &:not(:disabled):not(.disabled) {
+        cursor: pointer;
+    }
+}
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+    border-style: none;
+    padding: 0;
+}
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+    outline: 1px dotted theme-color('primary');
+}
+
+textarea {
+    overflow: auto;
+    resize: vertical;
+}
+
+[type="checkbox"],
+[type="radio"] {
+    box-sizing: border-box;
+    padding: 0;
+}
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+    height: auto;
+}
+
+[type="search"] {
+    -webkit-appearance: textfield;
+    outline-offset: -2px;
+}
+
+[type="search"]::-webkit-search-cancel-button,
+[type="search"]::-webkit-search-decoration {
+    -webkit-appearance: none;
+}
+
+::-webkit-file-upload-button {
+    -webkit-appearance: button;
+    font: inherit;
+}
+
+[type="checkbox"] {
+    margin-right: 5px;
+    vertical-align: top;
+}
+
+input[type="date"],
+input[type="time"],
+input[type="datetime-local"],
+input[type="month"] {
+    -webkit-appearance: listbox;
+}
+
+fieldset,
+.fieldset {
+	background: $body-bg;
+    border: 1px solid $border-color;
+    border-radius: $border-radius;
+    padding: 10px 15px;
+    box-sizing: border-box;
+    margin: 0;
+
+    legend {
+        font-size: 12px;
+        color: color('grey-darker');
+    }
+}
+
+[hidden] {
+    display: none !important;
+}
+
+a {
+    color: $link-color;
+    text-decoration: none;
+    background-color: transparent;
+    -webkit-text-decoration-skip: objects;
+
+    &:hover {
+        color: $link-hover-color;
+    }
+}
+
+a:not([href]):not([tabindex]) {
+    color: inherit;
+    text-decoration: none;
+
+    &:hover,
+    &:focus {
+        color: inherit;
+        text-decoration: none;
+    }
+
+    &:focus {
+        outline: 0;
+    }
+}
+
+p {
+    margin: 0 0 ($line-height-computed / 2);
+}
+
+code {
+    font-family: Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
+    font-size: 80%;
+}
+
+strong,
+b {
+    font-weight: $font-weight-bold;
+}
+
+label {
+    display: inline-block;
+    font-size: $label-font-size;
+    margin-bottom: $label-margin-bottom;
+}