From 2505b336156a37ed6c31b98558097861b6725907 Mon Sep 17 00:00:00 2001
From: Hypolite Petovan <hypolite@mrpetovan.com>
Date: Sat, 15 Aug 2020 19:01:24 -0400
Subject: [PATCH] [frio] Move specific event styles to main theme stylesheet

- Fix hovercard.css formatting
---
 view/theme/frio/css/hovercard.css        | 647 ++++++++++++-----------
 view/theme/frio/css/mod_events.css       | 118 -----
 view/theme/frio/css/style.css            | 125 ++++-
 view/theme/frio/templates/event_head.tpl |   1 -
 4 files changed, 456 insertions(+), 435 deletions(-)
 delete mode 100644 view/theme/frio/css/mod_events.css

diff --git a/view/theme/frio/css/hovercard.css b/view/theme/frio/css/hovercard.css
index 5f972cd1f..5e283f8a8 100644
--- a/view/theme/frio/css/hovercard.css
+++ b/view/theme/frio/css/hovercard.css
@@ -1,302 +1,345 @@
-
-.hovercard {
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: 1040;
-  display: none;
-  /*max-width: 276px;*/
-  max-width: 400px;
-  padding: 1px;
-  text-align: left;
-  background-color: #ffffff;
-  background-clip: padding-box;
-  border: 1px solid #cccccc;
-  border: 1px solid rgba(0, 0, 0, 0.2);
-  border-radius: 200px;
-  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-  white-space: normal;
-}
-.hovercard.top {
-  margin-top: -10px;
-}
-.hovercard.right {
-  margin-left: 10px;
-}
-.hovercard.bottom {
-  margin-top: 10px;
-}
-.hovercard.left {
-  margin-left: -10px;
-}
-.hovercard-title {
-  margin: 0;
-  padding: 8px 14px;
-  font-size: 14px;
-  font-weight: normal;
-  line-height: 18px;
-  background-color: #f7f7f7;
-  border-bottom: 1px solid #ebebeb;
-  border-radius: 199px 199px 0 0;
-  display: none;
-}
-.hovercard-content {
-  color: #777;
-  padding: 0;
-}
-.hovercard > .arrow,
-.hovercard > .arrow:after {
-  position: absolute;
-  display: block;
-  width: 0;
-  height: 0;
-  border-color: transparent;
-  border-style: solid;
-}
-.hovercard > .arrow {
-  border-width: 11px;
-}
-.hovercard > .arrow:after {
-  border-width: 10px;
-  content: "";
-}
-.hovercard.top > .arrow {
-  left: 50%;
-  margin-left: -11px;
-  border-bottom-width: 0;
-  border-top-color: #999999;
-  border-top-color: rgba(0, 0, 0, 0.25);
-  bottom: -11px;
-}
-.hovercard.top > .arrow:after {
-  content: " ";
-  bottom: 1px;
-  margin-left: -10px;
-  border-bottom-width: 0;
-  border-top-color: #ffffff;
-}
-.hovercard.right > .arrow {
-  top: 50%;
-  left: -11px;
-  margin-top: -11px;
-  border-left-width: 0;
-  border-right-color: #999999;
-  border-right-color: rgba(0, 0, 0, 0.25);
-}
-.hovercard.right > .arrow:after {
-  content: " ";
-  left: 1px;
-  bottom: -10px;
-  border-left-width: 0;
-  border-right-color: #ffffff;
-}
-.hovercard.bottom > .arrow {
-  left: 50%;
-  margin-left: -11px;
-  border-top-width: 0;
-  border-bottom-color: #999999;
-  border-bottom-color: rgba(0, 0, 0, 0.25);
-  top: -11px;
-}
-.hovercard.bottom > .arrow:after {
-  content: " ";
-  top: 1px;
-  margin-left: -10px;
-  border-top-width: 0;
-  border-bottom-color: #ffffff;
-}
-.hovercard.left > .arrow {
-  top: 50%;
-  right: -11px;
-  margin-top: -11px;
-  border-right-width: 0;
-  border-left-color: #999999;
-  border-left-color: rgba(0, 0, 0, 0.25);
-}
-.hovercard.left > .arrow:after {
-  content: " ";
-  right: 1px;
-  border-right-width: 0;
-  border-left-color: #ffffff;
-  bottom: -10px;
-}
-
-.right-aligned {
-  float: right !important;
-}
-.left-align {
-  float: left !important;
-}
-.hidden {
-  display: none !important;
-  visibility: hidden !important;
-}
-.hovercard h1,
-.hovercard .h1,
-.hovercard h2,
-.hovercard .h2,
-.hovercard h3,
-.hovercard .h3 {
-  margin: 0;
-  padding: 0;
-}
-.hovercard h3 {
-  font-size: 24px;
-}
-.hovercard h4,
-.hovercard .h4,
-.hovercard h5,
-.hovercard .h5,
-.hovercard h6,
-.hovercard .h6 {
-  margin: 0;
-  padding: 0;
-}
-.hovercard h4.text-center {
-  margin-top: 10px;
-  margin-bottom: 5px;
-}
-.hovercard sup {
-  top: 0;
-}
-.hovercard small,
-.hovercard .small {
-  font-size: 85%;
-}
-.hovercard ul,
-.hovercard ol {
-  margin: 0;
-  padding: 0;
-  margin-bottom: 0;
-}
-.hovercard a:hover,
-.hovercard a:active,
-.hovercard a:focus,
-.hovercard a:visited {
-  text-decoration: none !important;
-}
-
-
-/* Basic hovercard */
-.basic-content {
-  padding: 9px;
-}
-.image-wrapper {
-  background: #fff;
-  border: 2px #fff solid;
-  display: block;
-  overflow: hidden;
-}
-.image-wrapper > a,
-.image-wrapper > span {
-  background-size: 100% !important;
-}
-.image-wrapper.medium > a,
-.image-wrapper.medium > span {
-  content: " ";
-  display: block;
-}
-.image-wrapper.medium > a img {
-  height: 80px;
-  width: 80px;
-  margin-bottom: 0;
-}
-.hovercard {
-  -webkit-border-radius: 4px;
-  -moz-border-radius: 4px;
-  border-radius: 4px;
-  /*max-width: 250px;*/
-  max-width: 400px;
-  width: 350px;
-  -webkit-box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);
-  -moz-box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);
-  box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);
-  border: 1px solid rgba(0, 0, 0, 0);
-}
-.hovercard a:hover {
-  text-decoration: none;
-}
-.hovercard.right > .arrow {
-  border-right-color: rgba(0, 0, 0, 0.05);
-}
-.hovercard.left > .arrow {
-  border-left-color: rgba(0, 0, 0, 0.05);
-}
-.hovercard.bottom > .arrow {
-  border-bottom-color: rgba(0, 0, 0, 0.05);
-}
-.hovercard.top > .arrow {
-  border-top-color: rgba(0, 0, 0, 0.05);
-}
-.advance-hovercard + .hovercard {
-  max-width: 445px;
-}
-.advance-hovercard + .hovercard .hovercard-content {
-  padding: 5px;
-}
-
-.basic-hovercard + .hovercard {
-  max-width: 445px;
-}
-.basic-hovercard + .hovercard .hovercard-content {
-  padding: 5px;
-}
-
-.hover-card-header {
-  width: 100%;
-}
-.hover-card-header h4 {
-  display: block;
-
-}
-.hover-card-header h4 a {
-  font-size: 18px;
-  font-weight: bold;
-  letter-spacing: 0.03rem;
-}
-.hover-card-details {
-  width: 100%;
-}
-.hover-card-pic {
-  margin-top: 0px;
-  display: block;
-}
-.hover-card-pic .image-wrapper {
-  margin-right: 0.75em;
-  float: left;
-  position: relative;
-}
-.hover-card-content {
-  list-style-type: none;
-  width: 100%;
-  display: block;
-  background: #fff;
-  padding: 0.3em 0 1em;
-}
-.hover-card-content .profile-details {
-    font-size: 13px;
-}
-.hover-card-content .profile-addr {
-  overflow: hidden;
-  display: block;
-  text-overflow: ellipsis;
-}
-.hovercard-content .hover-card-details .hover-card-content   .profile-details > .profile-network a {
-    color: #777;
-}
-.hover-card-actions {
-  display: flex;
-}
-.hover-card-actions-connection {
-  margin-left: 10px;
-}
-.hovercard .hovercard-content .hover-card-actions a.btn {
-  display: inline-block;
-}
-.hover-card-footer {
-  background-color: #f7f7f7;
-  border-top: 1px solid #ebebeb;
-  padding: 0 10px;
-}
-
+
+.hovercard {
+	position: absolute;
+	top: 0;
+	left: 0;
+	z-index: 1040;
+	display: none;
+	max-width: 400px;
+	padding: 1px;
+	text-align: left;
+	background-color: #ffffff;
+	background-clip: padding-box;
+	border: 1px solid #cccccc;
+	border: 1px solid rgba(0, 0, 0, 0.2);
+	border-radius: 200px;
+	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+	white-space: normal;
+}
+
+.hovercard.top {
+	margin-top: -10px;
+}
+
+.hovercard.right {
+	margin-left: 10px;
+}
+
+.hovercard.bottom {
+	margin-top: 10px;
+}
+
+.hovercard.left {
+	margin-left: -10px;
+}
+
+.hovercard-title {
+	margin: 0;
+	padding: 8px 14px;
+	font-size: 14px;
+	font-weight: normal;
+	line-height: 18px;
+	background-color: #f7f7f7;
+	border-bottom: 1px solid #ebebeb;
+	border-radius: 199px 199px 0 0;
+	display: none;
+}
+
+.hovercard-content {
+	padding: 0;
+}
+
+.hovercard > .arrow,
+.hovercard > .arrow:after {
+	position: absolute;
+	display: block;
+	width: 0;
+	height: 0;
+	border-color: transparent;
+	border-style: solid;
+}
+
+.hovercard > .arrow {
+	border-width: 11px;
+}
+
+.hovercard > .arrow:after {
+	border-width: 10px;
+	content: "";
+}
+
+.hovercard.top > .arrow {
+	left: 50%;
+	margin-left: -11px;
+	border-bottom-width: 0;
+	border-top-color: #999999;
+	border-top-color: rgba(0, 0, 0, 0.25);
+	bottom: -11px;
+}
+
+.hovercard.top > .arrow:after {
+	content: " ";
+	bottom: 1px;
+	margin-left: -10px;
+	border-bottom-width: 0;
+	border-top-color: #ffffff;
+}
+
+.hovercard.right > .arrow {
+	top: 50%;
+	left: -11px;
+	margin-top: -11px;
+	border-left-width: 0;
+	border-right-color: #999999;
+	border-right-color: rgba(0, 0, 0, 0.25);
+}
+
+.hovercard.right > .arrow:after {
+	content: " ";
+	left: 1px;
+	bottom: -10px;
+	border-left-width: 0;
+	border-right-color: #ffffff;
+}
+
+.hovercard.bottom > .arrow {
+	left: 50%;
+	margin-left: -11px;
+	border-top-width: 0;
+	border-bottom-color: #999999;
+	border-bottom-color: rgba(0, 0, 0, 0.25);
+	top: -11px;
+}
+
+.hovercard.bottom > .arrow:after {
+	content: " ";
+	top: 1px;
+	margin-left: -10px;
+	border-top-width: 0;
+	border-bottom-color: #ffffff;
+}
+
+.hovercard.left > .arrow {
+	top: 50%;
+	right: -11px;
+	margin-top: -11px;
+	border-right-width: 0;
+	border-left-color: #999999;
+	border-left-color: rgba(0, 0, 0, 0.25);
+}
+
+.hovercard.left > .arrow:after {
+	content: " ";
+	right: 1px;
+	border-right-width: 0;
+	border-left-color: #ffffff;
+	bottom: -10px;
+}
+
+.right-aligned {
+	float: right !important;
+}
+
+.left-align {
+	float: left !important;
+}
+
+.hidden {
+	display: none !important;
+	visibility: hidden !important;
+}
+
+.hovercard h1,
+.hovercard .h1,
+.hovercard h2,
+.hovercard .h2,
+.hovercard h3,
+.hovercard .h3 {
+	margin: 0;
+	padding: 0;
+}
+
+.hovercard h3 {
+	font-size: 24px;
+}
+
+.hovercard h4,
+.hovercard .h4,
+.hovercard h5,
+.hovercard .h5,
+.hovercard h6,
+.hovercard .h6 {
+	margin: 0;
+	padding: 0;
+}
+
+.hovercard h4.text-center {
+	margin-top: 10px;
+	margin-bottom: 5px;
+}
+
+.hovercard sup {
+	top: 0;
+}
+
+.hovercard small,
+.hovercard .small {
+	font-size: 85%;
+}
+
+.hovercard ul,
+.hovercard ol {
+	margin: 0;
+	padding: 0;
+	margin-bottom: 0;
+}
+
+.hovercard a:hover,
+.hovercard a:active,
+.hovercard a:focus,
+.hovercard a:visited {
+	text-decoration: none !important;
+}
+
+
+/* Basic hovercard */
+.basic-content {
+	padding: 9px;
+}
+
+.image-wrapper {
+	display: block;
+	overflow: hidden;
+}
+
+.image-wrapper > a,
+.image-wrapper > span {
+	background-size: 100% !important;
+}
+
+.image-wrapper.medium > a,
+.image-wrapper.medium > span {
+	content: " ";
+	display: block;
+}
+
+.image-wrapper.medium > a img {
+	height: 80px;
+	width: 80px;
+	margin-bottom: 0;
+}
+
+.hovercard {
+	-webkit-border-radius: 4px;
+	-moz-border-radius: 4px;
+	border-radius: 4px;
+	/*max-width: 250px;*/
+	max-width: 400px;
+	width: 350px;
+	-webkit-box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);
+	-moz-box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);
+	box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);
+	border: 1px solid rgba(0, 0, 0, 0);
+}
+
+.hovercard a:hover {
+	text-decoration: none;
+}
+
+.hovercard.right > .arrow {
+	border-right-color: rgba(0, 0, 0, 0.05);
+}
+
+.hovercard.left > .arrow {
+	border-left-color: rgba(0, 0, 0, 0.05);
+}
+
+.hovercard.bottom > .arrow {
+	border-bottom-color: rgba(0, 0, 0, 0.05);
+}
+
+.hovercard.top > .arrow {
+	border-top-color: rgba(0, 0, 0, 0.05);
+}
+
+.advance-hovercard + .hovercard {
+	max-width: 445px;
+}
+
+.advance-hovercard + .hovercard .hovercard-content {
+	padding: 5px;
+}
+
+.basic-hovercard + .hovercard {
+	max-width: 445px;
+}
+
+.basic-hovercard + .hovercard .hovercard-content {
+	padding: 5px;
+}
+
+.hover-card-header {
+	width: 100%;
+}
+
+.hover-card-header h4 {
+	display: block;
+
+}
+
+.hover-card-header h4 a {
+	font-size: 18px;
+	font-weight: bold;
+	letter-spacing: 0.03rem;
+}
+
+.hover-card-details {
+	width: 100%;
+}
+
+.hover-card-pic {
+	margin-top: 0px;
+	display: block;
+}
+
+.hover-card-pic .image-wrapper {
+	margin-right: 0.75em;
+	float: left;
+	position: relative;
+}
+
+.hover-card-content {
+	list-style-type: none;
+	width: 100%;
+	display: block;
+	padding: 0.3em 0 1em;
+}
+
+.hover-card-content .profile-details {
+	font-size: 13px;
+}
+
+.hover-card-content .profile-addr {
+	overflow: hidden;
+	display: block;
+	text-overflow: ellipsis;
+}
+
+.hover-card-actions {
+	display: flex;
+}
+
+.hover-card-actions-connection {
+	margin-left: 10px;
+}
+
+.hovercard .hovercard-content .hover-card-actions a.btn {
+	display: inline-block;
+}
+
+.hover-card-footer {
+	background-color: #f7f7f7;
+	border-top: 1px solid #ebebeb;
+	padding: 0 10px;
+}
diff --git a/view/theme/frio/css/mod_events.css b/view/theme/frio/css/mod_events.css
deleted file mode 100644
index 65344ede9..000000000
--- a/view/theme/frio/css/mod_events.css
+++ /dev/null
@@ -1,118 +0,0 @@
-/**
- * @file view/theme/frio/css/mod_event.css
- */
-
-/**
- * The different views of js fullcalendar
- */
-#fc-header {
-    margin-top: 20px;
-    margin-bottom: 10px;
-}
-#fc-header-left,
-#fc-header-right,
-#event-calendar-title {
-    display: inline-block;
-}
-#fc-title {
-    margin: 0;
-    padding-left: 20px;
-
-}
-#fc-header-right {
-    margin-top: -4px;
-}
-#fc-header-right .dropdown > button {
-    color: inherit;
-}
-#event-calendar-title {
-    vertical-align: middle;
-}
-#event-calendar-views {
-    padding: 6px 9px;
-    font-size: 14px
-}
-.fc .fc-toolbar {
-    display: none;
-}
-.fc .fc-month-view td.fc-widget-content,
-.fc .fc-list-view,
-.fc .fc-list-view .fc-list-table td,
-.fc .fc-body td {
-    border-style: none;
-}
-.fc td.fc-widget-header,
-.fc th.fc-widget-header {
-    border-left: none;
-    border-right: none;
-    border-top: none;
-}
-.fc .fc-month-view td.fc-day {
-    border-left: none;
-    border-right: none;
-    border-bottom: 1px solid;
-    padding: 0 6px;
-}
-.fc .fc-day-grid-container .fc-row {
-    border-bottom: 1px solid;
-    border-color: #ddd;
-}
-.fc .fc-day-grid-event .fc-content {
-    /*white-space: normal;*/
-}
-.fc tr td.fc-today {
-    border-style: none;
-}
-.fc .fc-month-view .fc-content .fc-title .item-desc {
-    font-size: 11px;
-}
-.fc .fc-view-container {
-    margin-top: 25px;
-}
-.fc .fc-list-view td {
-    padding: 0;
-}
-#events-calendar.fc-ltr .fc-basic-view .fc-day-top .fc-day-number {
-    float: left;
-    font-size: 12px;
-}
-.fc .fc-event {
-    background-color: transparent;
-    background-color: #E3F2FD;
-    border: 1px solid #BBDEFB;
-    color: #555;
-}
-.fc .fc-month-view .fc-time,
-.fc .fc-listMonth-view .fc-list-item-time,
-.fc .fc-listMonth-view .fc-list-item-marker,
-.fc .fc-listMonth-view .fc-widget-header {
-    display: none;
-}
-.fc .fc-listMonth-view .fc-list-item:hover td {
-    background: transparent;
-    cursor: pointer;
-}
-.fc .fc-listMonth-view .seperator {
-    margin-left: 30px;
-    width: 60px;
-}
-
-/**
- * The event-card
- */
-.event-card {
-    width: auto;
-}
-.event-card .event-label,
-.event-card .location-label {
-    font-weight: bold;
-}
-.popover.event-card .event-card-basic-content {
-    margin-top: 0;
-    padding: 9px;
-    padding-left: 0px;
-}
-.event-card .event-hover-location .location {
-    color: #777;
-    font-size: 13px;
-}
diff --git a/view/theme/frio/css/style.css b/view/theme/frio/css/style.css
index 84779c36a..8781ee16e 100644
--- a/view/theme/frio/css/style.css
+++ b/view/theme/frio/css/style.css
@@ -8,20 +8,6 @@ and open the template in the editor.
     Author     : rabuzarus
 */
 
-/* Imports */
-/*@import url("frameworks/bootstrap/css/bootstrap.min.css");
-@import url("frameworks/bootstrap/css/bootstrap-theme.min.css");
-@import url("frameworks/font-awesome/css/font-awesome.min.css");
-@import url("frameworks/jasny/css/jasny-bootstrap.min.css");
-@import url("frameworks/bootstrap-select/css/bootstrap-select.min.css");
-@import url("frameworks/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css");
-@import url("frameworks/ekko-lightbox/ekko-lightbox.min.css");
-@import url("frameworks/justifiedGallery/justifiedGallery.min.css");
-@import url("frameworks/bootstrap-colorpicker/css/bootstrap-colorpicker.min.css");
-@import url("font/open_sans/open-sans.css");
-@import url("css/hovercard.css");*/
-
-
 body {
     padding-top: 110px;
     background-color: $background_color;
@@ -3388,6 +3374,117 @@ section .profile-match-wrapper {
     margin-top: 15px !important;
 }
 
+/**
+ * The different views of js fullcalendar
+ */
+#fc-header {
+	margin-top: 20px;
+	margin-bottom: 10px;
+}
+#fc-header-left,
+#fc-header-right,
+#event-calendar-title {
+	display: inline-block;
+}
+#fc-title {
+	margin: 0;
+	padding-left: 20px;
+
+}
+#fc-header-right {
+	margin-top: -4px;
+}
+#fc-header-right .dropdown > button {
+	color: inherit;
+}
+#event-calendar-title {
+	vertical-align: middle;
+}
+#event-calendar-views {
+	padding: 6px 9px;
+	font-size: 14px
+}
+.fc .fc-toolbar {
+	display: none;
+}
+.fc .fc-month-view td.fc-widget-content,
+.fc .fc-list-view,
+.fc .fc-list-view .fc-list-table td,
+.fc .fc-body td {
+	border-style: none;
+}
+.fc td.fc-widget-header,
+.fc th.fc-widget-header {
+	border-left: none;
+	border-right: none;
+	border-top: none;
+}
+.fc .fc-month-view td.fc-day {
+	border-left: none;
+	border-right: none;
+	border-bottom: 1px solid;
+	padding: 0 6px;
+}
+.fc .fc-day-grid-container .fc-row {
+	border-bottom: 1px solid;
+	border-color: #ddd;
+}
+.fc tr td.fc-today {
+	border-style: none;
+}
+.fc .fc-month-view .fc-content .fc-title .item-desc {
+	font-size: 11px;
+}
+.fc .fc-view-container {
+	margin-top: 25px;
+}
+.fc .fc-list-view td {
+	padding: 0;
+}
+#events-calendar.fc-ltr .fc-basic-view .fc-day-top .fc-day-number {
+	float: left;
+	font-size: 12px;
+}
+.fc .fc-event {
+	background-color: #E3F2FD;
+	border: 1px solid #BBDEFB;
+	color: #555;
+}
+.fc .fc-month-view .fc-time,
+.fc .fc-listMonth-view .fc-list-item-time,
+.fc .fc-listMonth-view .fc-list-item-marker,
+.fc .fc-listMonth-view .fc-widget-header {
+	display: none;
+}
+.fc .fc-listMonth-view .fc-list-item:hover td {
+	background: transparent;
+	cursor: pointer;
+}
+.fc .fc-listMonth-view .seperator {
+	margin-left: 30px;
+	width: 60px;
+}
+
+/**
+ * The event-card
+ */
+.event-card {
+	width: auto;
+}
+.event-card .event-label,
+.event-card .location-label {
+	font-weight: bold;
+}
+.popover.event-card .event-card-basic-content {
+	margin-top: 0;
+	padding: 9px;
+	padding-left: 0px;
+}
+.event-card .event-hover-location .location {
+	color: $font_color;
+	font-size: 13px;
+}
+
 /* Medium devices (desktops, 992px and up) */
 @media (min-width: 992px) {
     .mod-home.is-not-singleuser #content,
diff --git a/view/theme/frio/templates/event_head.tpl b/view/theme/frio/templates/event_head.tpl
index 1150f3b1b..e27fabf23 100644
--- a/view/theme/frio/templates/event_head.tpl
+++ b/view/theme/frio/templates/event_head.tpl
@@ -1,5 +1,4 @@
 
-<link rel="stylesheet" type="text/css" href="view/theme/frio/css/mod_events.css?v={{$smarty.const.FRIENDICA_VERSION}}" />
 <script type="text/javascript" src="view/theme/frio/js/mod_events.js?v={{$smarty.const.FRIENDICA_VERSION}}"></script>
 
 <script type="text/javascript">