Merge branch 'dev'

9 files changed, 150 insertions, 114 deletions

diff --git a/view/css/mod_profile_photo.css b/view/css/mod_profile_photo.css
index 1b7e15194..3b5f7f321 100644
--- a/view/css/mod_profile_photo.css
+++ b/view/css/mod_profile_photo.css
@@ -12,9 +12,5 @@
 }
 
 #profile-photo-wrapper {
-	height: 300px;
-	width: 300px;
-	max-width: 300px;
-	max-height: 300px;
 	overflow: hidden;
 }
diff --git a/view/css/widgets.css b/view/css/widgets.css
index b78725919..df77940dd 100644
--- a/view/css/widgets.css
+++ b/view/css/widgets.css
@@ -243,9 +243,9 @@ a.wikilist {
 
 /* contact block */
 .contact-block-div .oneway-overlay {
-	font-size: 20px;
-	margin-left: -25px;
-	margin-top: 25px;
+	font-size: .9rem;
+	margin-left: -1.2rem;
+	margin-top: 2rem;
 	opacity: 0.8;
 }
 
diff --git a/view/js/main.js b/view/js/main.js
index d3f4eff9a..0e16809e4 100644
--- a/view/js/main.js
+++ b/view/js/main.js
@@ -1158,8 +1158,18 @@ function dolike(ident, verb) {
 	if(typeof page_mode == typeof undefined)
 		page_mode = '';
 
-	$.get('like/' + ident.toString() + '?verb=' + verb + '&conv_mode=' + conv_mode + '&page_mode=' + page_mode, function (data) {
+	var reload = '';
+	if(module == 'photos')
+		reload = 1;
+
+	$.get('like/' + ident.toString() + '?verb=' + verb + '&conv_mode=' + conv_mode + '&page_mode=' + page_mode + '&reload=' + reload, function (data) {
 		if(data.success) {
+
+			// mod photos
+			if (data.reload) {
+				window.location.href = window.location.href;
+			}
+
 			// this is a bit tricky since the top level thread wrapper wraps the whole thread
 			if($('#thread-wrapper-' + data.orig_id).hasClass('toplevel_item')) {
 				var wrapper = $('<div></div>').html( data.html ).find('#wall-item-outside-wrapper-' + data.id);
@@ -1381,7 +1391,14 @@ function post_comment(id) {
 		"item",
 		form_data  + '&conv_mode=' + conv_mode,
 		function(data) {
-			if(data.success) {
+			if (data.success) {
+
+				//mod photos
+				if (data.reload) {
+					window.location.href = data.reload;
+				}
+
+
 				localStorage.removeItem("comment_body-" + id);
 				$("#comment-edit-preview-" + id).hide();
 				$("#comment-edit-text-" + id).val('').blur().attr('placeholder', aStr.comment);
@@ -1392,7 +1409,7 @@ function post_comment(id) {
 				commentBusy = false;
 
 				var tarea = document.getElementById("comment-edit-text-" + id);
-				if(tarea) {
+				if (tarea) {
 					commentClose(tarea, id);
 					$(document).off( "click.commentOpen");
 				}
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index 346e46c6b..16a7624f8 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -24,15 +24,15 @@ body {
 
 aside#region_1 {
 	border-right: 1px solid transparent;
-	width: $left_aside_widthpx;
-	min-width: $left_aside_widthpx;
-	max-width: $left_aside_widthpx;
+	width: $left_aside_widthrem;
+	min-width: $left_aside_widthrem;
+	max-width: $left_aside_widthrem;
 }
 
 aside#region_3 {
-	width: $right_aside_widthpx;
-	min-width: $left_aside_widthpx;
-	max-width: $right_aside_widthpx;
+	width: $right_aside_widthrem;
+	min-width: $left_aside_widthrem;
+	max-width: $right_aside_widthrem;
 }
 
 aside#left_aside_wrapper,
@@ -49,7 +49,7 @@ main {
 #overlay {
 	position: fixed;
 	top: 0;
-	left: $left_aside_widthpx;
+	left: $left_aside_widthrem;
 	width: 100vw;
 	height: 100vh;
 	background: rgba(0, 0, 0, .3);
@@ -400,34 +400,20 @@ footer {
 	color: #444444;
 }
 
-.vcard {
-	margin-bottom: 10px;
-	padding: 0px 10px 10px 10px;
+.vcard-card {
 	background-color: rgba(254,254,254,0.5);
-	border: 1px solid rgba(254,254,254,0.5);
-	border-radius: $radius;
-	word-wrap: break-word;
-}
-
-.vcard dl,
-.vcard .title {
-	margin-top: 10px;
-	margin-bottom: 0px;
 }
 
-.connect-btn-wrapper {
-	margin-bottom: 10px;
-
+.vcard {
+	word-wrap: break-word;
 }
 
 .profile-edit-side-link {
-	padding: 3px 0px;
 	opacity: 0;
-	filter:alpha(opacity=30);
-	float: right;
+	filter:alpha(opacity=0);
 }
 
-.vcard:hover .profile-edit-side-link {
+.card:hover .profile-edit-side-link {
 	opacity: 1;
 	filter:alpha(opacity=100);
 }
@@ -435,15 +421,6 @@ footer {
 #profile-photo-wrapper img {
 	width: 100%;
 	height: 100%;
-	max-width: 300px;
-	max-height: 300px;
-}
-
-#profile-photo-wrapper {
-	width: 251px;
-	height: 251px;
-	margin-bottom: 10px;
-	border-radius: $radius;
 }
 
 #hide-friends-yes-label,
@@ -571,8 +548,8 @@ footer {
 }
 
 .contact-block-img {
-	width:47px;
-	height:47px;
+	width: 2.95rem;
+	height: 2.95rem;
 	margin-bottom: 3px;
 }
 
@@ -1191,7 +1168,6 @@ img.mail-conv-sender-photo {
 
 .widget {
 	background-color: rgba(254,254,254,.5);
-	border: 1px solid rgba(254,254,254,.5);
 	border-radius: $radius;
 }
 
@@ -1530,8 +1506,8 @@ blockquote {
 	}
 
 	main {
-		left: -$left_aside_widthpx;
-		width: calc( 100% + $left_aside_widthpx );
+		left: -$left_aside_widthrem;
+		width: calc( 100% + $left_aside_widthrem );
 	}
 
 	main.region_1-on {
diff --git a/view/theme/redbasic/php/config.php b/view/theme/redbasic/php/config.php
index 0a779529d..0de475fe5 100644
--- a/view/theme/redbasic/php/config.php
+++ b/view/theme/redbasic/php/config.php
@@ -32,7 +32,7 @@ class RedbasicConfig {
 	}
 
 	function get() {
-		if(! local_channel()) { 
+		if(! local_channel()) {
 			return;
 		}
 
@@ -59,7 +59,7 @@ class RedbasicConfig {
 	}
 
 	function post() {
-		if(!local_channel()) { 
+		if(!local_channel()) {
 			return;
 		}
 
@@ -89,7 +89,7 @@ class RedbasicConfig {
 
 		if(get_pconfig(local_channel(), 'redbasic', 'advanced_theming'))
 			$expert = 1;
-					
+
 	  	$o .= replace_macros(get_markup_template('theme_settings.tpl'), array(
 			'$submit' => t('Submit'),
 			'$baseurl' => z_root(),
@@ -98,19 +98,19 @@ class RedbasicConfig {
 			'$title' => t("Theme settings"),
 			'$narrow_navbar' => array('redbasic_narrow_navbar',t('Narrow navbar'),$arr['narrow_navbar'], '', array(t('No'),t('Yes'))),
 			'$nav_bg' => array('redbasic_nav_bg', t('Navigation bar background color'), $arr['nav_bg']),
-			'$nav_icon_colour' => array('redbasic_nav_icon_colour', t('Navigation bar icon color '), $arr['nav_icon_colour']),	
+			'$nav_icon_colour' => array('redbasic_nav_icon_colour', t('Navigation bar icon color '), $arr['nav_icon_colour']),
 			'$nav_active_icon_colour' => array('redbasic_nav_active_icon_colour', t('Navigation bar active icon color '), $arr['nav_active_icon_colour']),
 			'$link_colour' => array('redbasic_link_colour', t('Link color'), $arr['link_colour'], '', $link_colours),
 			'$banner_colour' => array('redbasic_banner_colour', t('Set font-color for banner'), $arr['banner_colour']),
 			'$bgcolour' => array('redbasic_background_colour', t('Set the background color'), $arr['bgcolour']),
-			'$background_image' => array('redbasic_background_image', t('Set the background image'), $arr['background_image']),	
+			'$background_image' => array('redbasic_background_image', t('Set the background image'), $arr['background_image']),
 			'$item_colour' => array('redbasic_item_colour', t('Set the background color of items'), $arr['item_colour']),
 			'$comment_item_colour' => array('redbasic_comment_item_colour', t('Set the background color of comments'), $arr['comment_item_colour']),
 			'$font_size' => array('redbasic_font_size', t('Set font-size for the entire application'), $arr['font_size'], t('Examples: 1rem, 100%, 16px')),
 			'$font_colour' => array('redbasic_font_colour', t('Set font-color for posts and comments'), $arr['font_colour']),
 			'$radius' => array('redbasic_radius', t('Set radius of corners'), $arr['radius'], t('Example: 4px')),
 			'$shadow' => array('redbasic_shadow', t('Set shadow depth of photos'), $arr['shadow']),
-			'$converse_width' => array('redbasic_converse_width',t('Set maximum width of content region in pixel'),$arr['converse_width'], t('Leave empty for default width')),
+			'$converse_width' => array('redbasic_converse_width',t('Set maximum width of content region in rem'),$arr['converse_width'], t('Leave empty for default width')),
 			'$top_photo' => array('redbasic_top_photo', t('Set size of conversation author photo'), $arr['top_photo']),
 			'$reply_photo' => array('redbasic_reply_photo', t('Set size of followup author photos'), $arr['reply_photo']),
 			'$advanced_theming' => ['redbasic_advanced_theming', t('Show advanced settings'), $arr['advanced_theming'], '', [t('No'), t('Yes')]]
diff --git a/view/theme/redbasic/php/style.php b/view/theme/redbasic/php/style.php
index 3ea94f9aa..6ba0d569e 100644
--- a/view/theme/redbasic/php/style.php
+++ b/view/theme/redbasic/php/style.php
@@ -101,7 +101,7 @@ if (! $radius)
 if (! $shadow)
 	$shadow = '0';
 if (! $converse_width)
-	$converse_width = '790';
+	$converse_width = '1250'; //unit: rem
 if(! $top_photo)
 	$top_photo = '2.3rem';
 if(! $reply_photo)
@@ -120,8 +120,8 @@ if(file_exists('view/theme/redbasic/css/style.css')) {
 		$x .= $schemecss;
 	}
 
-	$left_aside_width = 288;
-	$right_aside_width = 288;
+	$left_aside_width = 21; //unit: rem
+	$right_aside_width = 21; //unit: rem
 
 	$main_width = $left_aside_width + $right_aside_width + intval($converse_width);
 
diff --git a/view/tpl/connstatus.tpl b/view/tpl/connstatus.tpl
index 667775f3a..869345682 100644
--- a/view/tpl/connstatus.tpl
+++ b/view/tpl/connstatus.tpl
@@ -1 +1 @@
-<i class="fa fa-fw fa-comments oneway-overlay text-{{if $perminfo.connpermcount == 3}}success{{elseif $perminfo.connpermcount > 0}}warning{{else}}danger{{/if}}" title="{{$perminfo.connperms}}"></i>
+<i class="fa fa-comments oneway-overlay text-{{if $perminfo.connpermcount == 3}}success{{elseif $perminfo.connpermcount > 0}}warning{{else}}danger{{/if}}" title="{{$perminfo.connperms}}"></i>
diff --git a/view/tpl/profile_vcard.tpl b/view/tpl/profile_vcard.tpl
index 13caf5603..8ebc9a311 100644
--- a/view/tpl/profile_vcard.tpl
+++ b/view/tpl/profile_vcard.tpl
@@ -1,60 +1,107 @@
-<div class="vcard h-card">
-	{{if ! $zcard}}
-	<div id="profile-photo-wrapper">{{if $editmenu}}<a href="profile_photo" title="{{$change_photo}}">{{/if}}<img class="photo u-photo" src="{{$profile.photo}}?rev={{$profile.picdate}}" alt="{{$profile.fullname}}">{{if $editmenu}}</a>{{/if}}</div>
-	{{/if}}
-	{{if $connect}}
-	<div class="connect-btn-wrapper"><a href="{{$connect_url}}" class="btn btn-block btn-success btn-sm"><i class="fa fa-plus"></i> {{$connect}}</a></div>
-	{{/if}}
-	{{if ! $zcard}}
-	{{if $editmenu.multi}}
-	<div class="dropdown float-end">
-		<a class="dropdown-toggle" data-bs-toggle="dropdown" href="#" ><i class="fa fa-pencil" title="{{$editmenu.edit.1}}"></i></a>
-		<div class="dropdown-menu dropdown-menu-end" role="menu">
-			{{foreach $editmenu.menu.entries as $e}}
-			<a href="profiles/{{$e.id}}" class="dropdown-item"><img class="menu-img-1" src='{{$e.photo}}'> {{$e.profile_name}}</a>
-			{{/foreach}}
-			<a href="profile_photo" class="dropdown-item">{{$editmenu.menu.chg_photo}}</a>
-			{{if $editmenu.menu.cr_new}}<a href="profiles/new" id="profile-listing-new-link" class="dropdown-item">{{$editmenu.menu.cr_new}}</a>{{/if}}
+<div  class="rounded mb-3 vcard-card h-card">
+	<div  class="card">
+		<div class="row">
+			<div class="col-4" style="width: 7rem;">
+				{{if $editmenu}}
+				<a href="profile_photo" title="{{$change_photo}}">
+				{{/if}}
+					<div id="profile-photo-wrapper">
+						<img class="rounded-start u-photo" src="{{$profile.photo}}?rev={{$profile.picdate}}" alt="{{$profile.fullname}}" style="width: 6rem; height:6rem;">
+					</div>
+				{{if $editmenu}}
+				</a>
+				{{/if}}
+			</div>
+			<div class="col-7 m-1 p-0">
+				{{if $editmenu.multi}}
+				<div class="dropdown float-end">
+					<a class="profile-edit-side-link float-end" data-bs-toggle="dropdown" href="#" ><i class="fa fa-pencil" title="{{$editmenu.edit.1}}"></i></a>
+					<div class="dropdown-menu dropdown-menu-end" role="menu">
+						{{foreach $editmenu.menu.entries as $e}}
+						<a href="profiles/{{$e.id}}" class="dropdown-item"><img class="menu-img-1" src='{{$e.photo}}'> {{$e.profile_name}}</a>
+						{{/foreach}}
+						<a href="profile_photo" class="dropdown-item">{{$editmenu.menu.chg_photo}}</a>
+						{{if $editmenu.menu.cr_new}}
+						<a href="profiles/new" id="profile-listing-new-link" class="dropdown-item">{{$editmenu.menu.cr_new}}</a>
+						{{/if}}
+					</div>
+				</div>
+				{{elseif $editmenu}}
+				<a class="profile-edit-side-link float-end" href="{{$editmenu.edit.0}}" ><i class="fa fa-pencil" title="{{$editmenu.edit.1}}"></i></a>
+				{{/if}}
+
+				<div class="text-truncate">
+					<strong class="fn p-name">{{$profile.fullname}}{{if $profile.online}}<i class="fa fa-fw fa-asterisk text-danger ps-2" title="{{$profile.online}}"></i>{{/if}}</strong>
+				</div>
+				<div class="text-truncate">
+					<small class="text-muted p-adr">{{$profile.reddress}}</small>
+				</div>
+				{{if $connect}}
+				<div class="mt-1">
+					<a href="{{$connect_url}}" class="btn btn-success btn-sm" rel="nofollow">
+						<i class="fa fa-plus"></i> {{$connect}}
+					</a>
+				</div>
+				{{/if}}
+			</div>
 		</div>
 	</div>
-	{{elseif $editmenu}}
-	<a class="profile-edit-side-link" href="{{$editmenu.edit.0}}" ><i class="fa fa-pencil" title="{{$editmenu.edit.1}}"></i></a>
-	{{/if}}
-	{{/if}}
-
-	{{if ! $zcard}}
-	<div class="fn p-name">{{$profile.fullname}}{{if $profile.online}} <i class="fa fa-asterisk online-now" title="{{$profile.online}}"></i>{{/if}}</div>
-	{{if $reddress}}<div class="reddress">{{$profile.reddress}}</div>{{/if}}		
-	{{/if}}
-	{{if $pdesc}}<div class="title">{{$profile.pdesc}}</div>{{/if}}
-	{{if $location}}
-		<dl class="location"><dt class="location-label">{{$location}}</dt> 
-		<dd class="adr h-adr">
-			{{if $profile.address}}<div class="street-address p-street-address">{{$profile.address}}</div>{{/if}}
-			<span class="city-state-zip">
-				<span class="locality p-locality">{{$profile.locality}}</span>{{if $profile.locality}}, {{/if}}
-				<span class="region p-region">{{$profile.region}}</span>
-				<span class="postal-code p-postal-code">{{$profile.postal_code}}</span>
-			</span>
-			{{if $profile.country_name}}<span class="country-name p-country-name">{{$profile.country_name}}</span>{{/if}}
-		</dd>
+	{{if $details}}
+	<div class="vcard ps-2 pe-2">
+		{{if $profile.pdesc}}
+		<div class="pb-3 pt-2">{{$profile.pdesc}}</div>
+		{{/if}}
+		{{if $location}}
+		<dl class="">
+			<dt class="location-label">{{$location}}</dt>
+			<dd class="adr h-adr">
+				{{if $profile.address}}
+				<div class="street-address p-street-address">{{$profile.address}}</div>
+				{{/if}}
+				<div class="city-state-zip">
+					<span class="postal-code p-postal-code">{{$profile.postal_code}}</span>
+					<span class="locality p-locality">{{$profile.locality}}</span>
+				</div>
+				{{if $profile.region}}
+				<div class="region p-region">{{$profile.region}}</div>
+				{{/if}}
+				{{if $profile.country_name}}
+				<div class="country-name p-country-name">{{$profile.country_name}}</div>
+				{{/if}}
+			</dd>
+		</dl>
+		{{/if}}
+		{{if $hometown}}
+		<dl class="">
+			<dt class="hometown-label">{{$hometown}}</dt>
+			<dd class="p-hometown">{{$profile.hometown}}</dd>
+		</dl>
+		{{/if}}
+		{{if $gender}}
+		<dl class="">
+			<dt class="gender-label">{{$gender}}</dt>
+			<dd class="p-gender">{{if $profile.gender_icon}}<i class="fa fa-{{$profile.gender_icon}}"></i>&nbsp;{{/if}}{{$profile.gender}}</dd>
+		</dl>
+		{{/if}}
+		{{if $marital}}
+		<dl class="">
+			<dt class="marital-label"><span class="heart"><i class="fa fa-heart"></i>&nbsp;</span>{{$marital}}</dt>
+			<dd class="marital-text">{{$profile.marital}}</dd>
 		</dl>
+		{{/if}}
+		{{if $homepage}}
+		<dl class="pb-2">
+			<dt class="homepage-label">{{$homepage}}</dt>
+			<dd class="homepage-url u-url">{{$profile.homepage}}</dd>
+		</dl>
+		{{/if}}
+		<div class="hcard-addon"></div>
+	</div>
 	{{/if}}
-
-	{{if $gender}}<dl class="mf"><dt class="gender-label">{{$gender}}</dt> <dd class="p-gender">{{if $profile.gender_icon}}<i class="fa fa-{{$profile.gender_icon}}"></i>&nbsp;{{/if}}{{$profile.gender}}</dd></dl>{{/if}}
-
-	{{if $marital}}<dl class="marital"><dt class="marital-label"><span class="heart"><i class="fa fa-heart"></i>&nbsp;</span>{{$marital}}</dt><dd class="marital-text">{{$profile.marital}}</dd></dl>{{/if}}
-
-	{{if $homepage}}<dl class="homepage"><dt class="homepage-label">{{$homepage}}</dt><dd class="homepage-url u-url">{{$profile.homepage}}</dd></dl>{{/if}}
-
-<div class="hcard-addon"></div>
 </div>
-<div class="clear"></div>
-
-{{$rating}}
-
+{{if $details}}
 {{$chanmenu}}
-
 {{$contact_block}}
+{{/if}}
 
 
diff --git a/view/tpl/xchan_vcard.tpl b/view/tpl/xchan_vcard.tpl
index 2fd9bec1d..a5568f283 100644
--- a/view/tpl/xchan_vcard.tpl
+++ b/view/tpl/xchan_vcard.tpl
@@ -1,11 +1,11 @@
 <div class="card mb-3 h-card">
 	<div class="row">
-		<div class="col-4">
+		<div class="col-4" style="width: 7rem;">
 			<a href="{{$link}}" >
-				<img class="u-photo" src="{{$photo}}" alt="{{$name}}" width="80px" height="80px">
+				<img class="u-photo rounded-start" src="{{$photo}}" alt="{{$name}}" style="width: 6rem; height:6rem;">
 			</a>
 		</div>
-		<div class="col-7 m-1">
+		<div class="col-7 m-1 p-0">
 			<div class="text-truncate">
 				<strong class="fn p-name">{{$name}}</strong>
 			</div>