Improves mimicing of WP. (site)

1 files changed, 183 insertions, 0 deletions

diff --git a/site/public/css/fk-custom.css b/site/public/css/fk-custom.css
new file mode 100644
index 0000000..9a58e37
--- /dev/null
+++ b/site/public/css/fk-custom.css
@@ -0,0 +1,183 @@
+html {
+  position: relative;
+  min-height: 100%;
+}
+body > .container {
+  padding: 30px 15px 0;
+}
+
+.card-img-right {
+  height: 100%;
+  border-radius: 0 3px 3px 0;
+}
+.custom-flex-child {
+	min-width: 0;
+}
+.h3-truncate {
+	min-width: 0;
+}
+.custom-flex-child > .h3-truncate > .hide-overflow{
+	overflow: hidden;
+	text-overflow: ellipsis !important;
+}
+.custom-flex-child > .hide-overflow{
+	overflow: hidden;
+	text-overflow: ellipsis !important;
+}
+.hide-overflow{
+	overflow: hidden;
+	text-overflow: ellipsis !important;
+}
+.footer-col {
+	padding-right: 20px;
+	padding-left: 20px;
+}
+.w-55 {
+	width: 55% !important;
+}
+.h-40 {
+	height: 40% !important;
+}
+.h-45 {
+	height: 45% !important;
+}
+.text-small {
+	font-size: 80%;
+}
+.mt-10 {
+	margin-top: 10px;
+}
+.mt-20 {
+	margin-top: 20px;
+}
+.text-dotted {
+	text-decoration: underline dotted;
+}
+.off-badge {
+	color: white; 
+	font-size: 150%; 
+	padding-right: 10px; 
+	padding-left:10px; 
+	opacity: 0.9;
+}
+.off-badge-small {
+	font-size: 120%; 
+}
+.text-large {
+	font-size: 120%; 
+}
+.img-grey {
+	opacity: 0.7; 
+	filter: grayscale(100%);
+}
+.u {
+	text-decoration: underline;
+}
+.card {
+	/*
+	background-color: #d1d8e0;
+	box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
+	box-shadow: 0 .25rem .75rem #d1d8e0;
+	border: 0.5px solid #d1d8e0 !important;
+	box-shadow: 1rem 1rem 1rem #d1d8e0 !important;
+
+	box-shadow: 1rem 1rem 1rem #aaa !important;
+	box-shadow: .5rem .5rem 1rem #aaa, 1rem 1rem 1rem #aaa !important;
+
+	border-top: 2px solid white; 
+	*/
+	box-shadow: 0rem 0rem .1rem .01rem #d1d8e0, 1rem 1rem 1rem #d1d8e0 !important;
+	border-left: 3px solid white; 
+}
+.card:hover {
+	box-shadow: 0.5rem 0.5rem 0.5rem #aaa !important;
+	transition: box-shadow .1s cubic-bezier(.4,0,1,1);
+
+	will-change: box-shadow,transform;
+	/*
+	border-left: 4px solid #d1d8e0; 
+	border-left: 4px solid #12CBC4; 
+	border-left: 3px solid #142639 ; 
+	border-left: 4px solid white; 
+	*/
+	border-left: 3px solid #1289A7; 
+	/*
+	border-top: 4px solid #1289A7; 
+	border-top: 2px solid #1289A7; 
+	*/
+}
+.card-link {
+	position: relative;
+}
+
+footer {
+	/*
+	background-color: #d1d8e0 !important;
+	box-shadow: -0.5rem 0 .1rem .15rem #d1d8e0;
+	box-shadow: 0 -0.5rem .1rem .05rem #d1d8e0;
+	*/
+	box-shadow: 0 -0.2rem .1rem .05rem #d1d8e0;
+}
+.jumbotron.box-shadow {
+	box-shadow: 0rem 0rem .5rem .15rem #d1d8e0, 1rem 1rem 1rem #d1d8e0 !important;
+}
+.text-fade-out {
+	position: absolute; 
+	bottom: 45%;
+	left: 0;
+	width: 100%; 
+	text-align: center; 
+	margin: 0; padding: 8px 0; 
+	background-image: linear-gradient(to bottom, transparent, white);
+}
+/*
+ * Not used.
+ */
+.created_at {
+	bottom: 5px;
+	/*
+	margin-top: 200%;
+	*/
+	position: absolute;
+	background-color: #d1d8e0 !important;
+	color: #142639 !important;
+	padding-left:5px; 
+	padding-right: 5px; 
+	opacity: 0.9;
+}
+.footer-link {
+	padding-left: 0px !important;
+}
+.navbar-small {
+	font-size: 70% !important;
+}
+.search-btn-bg-white {
+	/*
+	*/
+	background-color: rgba(255,255,255,0.05)!important;
+}
+.search-btn-bg-white:hover {
+	background-color: rgba(255,255,255,.15)!important;
+}
+.s-link:hover {
+	color: inherit;
+}
+
+.flex-auto {
+  -ms-flex: 0 0 auto;
+  -webkit-box-flex: 0;
+  flex: 0 0 auto;
+}
+
+.h-250 { height: 250px; }
+@media (min-width: 768px) {
+  .h-md-250 { height: 250px; }
+}
+
+.border-top { border-top: 1px solid #e5e5e5; }
+.border-bottom { border-bottom: 1px solid #e5e5e5; }
+.border-white { border: 1px solid white; }
+
+.ml-10 {
+	margin-left: 10px !important;
+}