Avatars & profiles tweaks

src/main/resources/langs/ru/mail.json

@@ -32,7 +32,7 @@
   "mail_in_reply_to_comment": "комментарий {name, inflect, genitive}",
   "mail_in_reply_to_own_post": "вашу запись",
   "mail_in_reply_to_own_comment": "ваш комментарий",
-  "profile_write_message": "Написать сообщение",
+  "profile_write_message": "Отправить сообщение",
   "messages_title": "Сообщения",
   "mail_conversation_history": "История сообщений"
 }

src/main/resources/langs/ru/settings.json

@@ -43,7 +43,7 @@
   "gender_male": "мужской",
   "gender_female": "женский",
   "gender_none": "(не указан)",
-  "upload_avatar": "Загрузить аватарку",
+  "upload_avatar": "Загрузить фотографию",
   "profile_info_updated": "Информация в профиле обновлена",
   "profile_pic_select_square_version": "Выбранная квадратная область будет показываться у ваших записей и комментариев.",
   "drag_or_choose_file": "Выберите файл или перетащите его в это окно",

src/main/resources/templates/desktop/group.twig

@@ -51,17 +51,14 @@
 			{% else %}
 			{% if canEditGroup %}
 			<a href="/groups/{{ group.id }}/edit" onclick="new ProfilePictureBox({{ group.id }}).show(); return false;">
-				<span class="ava avaPlaceholder inProfile group">
-					<span class="ownProfileAvaPlaceholderLabel">{{L('upload_avatar')}}</span>
-				</span>
+				<span class="ava avaPlaceholder inProfile group own"></span><div class="ownProfileAvaPlaceholderLabel">{{L('upload_avatar')}}</div>
 			</a>
 			{%else%}
 			<span class="ava avaPlaceholder inProfile group"></span>
 			{%endif%}
 			{%endif%}
 			{% if currentUser is not null and (membershipStateText is not empty or membershipState=="NONE" or membershipState=="INVITED") %}
 			<div class="profileBelowAva">
-				{{ membershipStateText }}
 				{% if group.event %}
 				{% if membershipState=="NONE" or membershipState=="INVITED" %}
 					<a href="/groups/{{ group.id }}/join?csrf={{ csrf }}" class="button{{ membershipStateText is empty ? '' : ' withText' }}">{{ L('join_event_certain') }}</a>
@@ -74,6 +71,9 @@
 					<a href="/groups/{{ group.id }}/join?csrf={{ csrf }}" class="button{{ membershipStateText is empty ? '' : ' withText' }}">{{ L(group.accessType=='CLOSED' ? 'apply_to_join_group' : 'join_group') }}</a>
 				{% endif %}
 				{% endif %}
+				{% if membershipStateText is not empty %}
+				<div class="friendshipStateText">{{ membershipStateText }}</div>
+				{% endif %}
 			</div>
 			{% endif %}
 			<ul class="actionList marginAfter marginBefore">

src/main/resources/templates/desktop/mail_message_list.twig

@@ -3,7 +3,7 @@
 {% if recentlySentMessage is not null %}
 <div class="settingsMessage">
 	{%- if (recentlySentMessage.to | length)>1 %}
-	{{- L('mail_message_sent_muitl', {'name': users[recentlySentMessage.firstRecipientID].firstLastAndGender, 'moreCount': (recentlySentMessage.to | length)-1}, {'message': {'href': "/my/mail/messages/#{recentlySentMessage.encodedID}"} }) }}
+	{{- L('mail_message_sent_multi', {'name': users[recentlySentMessage.firstRecipientID].firstLastAndGender, 'moreCount': (recentlySentMessage.to | length)-1}, {'message': {'href': "/my/mail/messages/#{recentlySentMessage.encodedID}"} }) }}
 	{%- else %}
 	{{- L('mail_message_sent', {'name': users[recentlySentMessage.firstRecipientID].firstLastAndGender}, {'message': {'href': "/my/mail/messages/#{recentlySentMessage.encodedID}"} }) }}
 	{%- endif %}

src/main/resources/templates/desktop/profile.twig

@@ -27,30 +27,30 @@
 			{%else%}
 			{%if currentUser is not null and currentUser.id==user.id%}
 			<a href="/settings/profile/general" onclick="new ProfilePictureBox().show(); return false;">
-				<span class="ava avaPlaceholder inProfile{%if user.gender=='FEMALE'%} female{%endif%}">
-					<span class="ownProfileAvaPlaceholderLabel">{{L('upload_avatar')}}</span>
-				</span>
+				<span class="ava avaPlaceholder inProfile own"></span><div class="ownProfileAvaPlaceholderLabel">{{L('upload_avatar')}}</div>
 			</a>
 			{%else%}
-			<span class="ava avaPlaceholder inProfile{%if user.gender=='FEMALE'%} female{%endif%}"></span>
+			<span class="ava avaPlaceholder inProfile"></span>
 			{%endif%}
 			{%endif%}
 			{% if currentUser is not null and currentUser.id!=user.id and not isSelfBlocked %}
 			<div class="profileBelowAva">
-				{{ friendshipStatusText | raw }}
+				{% if canMessage %}
+				<a href="/my/mail/compose?to={{ user.id }}" class="button withText" onclick="showMailFormBox(this); return false;">{{ L('profile_write_message') }}</a>
+				{% endif %}
 				{%if not(isFriend) and not(following) and not(friendRequestSent) and not(followRequested)%}
 				{%if user.supportsFriendRequests%}
 				{% if friendRequestRecvd %}
-					<a href="/users/{{ user.id }}/respondToFriendRequest?csrf={{csrf}}&accept" class="button{%if friendshipStatusText%} withText{%endif%}" data-ajax="1">{{L("accept")}}</a>
+					<a href="/users/{{ user.id }}/respondToFriendRequest?csrf={{csrf}}&accept" class="button" data-ajax="1">{{L("add_friend")}}</a>
 				{% else %}
-					<a href="/users/{{ user.id }}/confirmSendFriendRequest?csrf={{csrf}}" class="button{%if friendshipStatusText%} withText{%endif%}" data-ajax-box="1">{{L("add_friend")}}</a>
+					<a href="/users/{{ user.id }}/confirmSendFriendRequest?csrf={{csrf}}" class="button" data-ajax-box="1">{{L("add_friend")}}</a>
 				{% endif %}
 				{%else%}
-				<a href="/users/{{ user.id }}/confirmSendFriendRequest?csrf={{csrf}}" class="button{%if friendshipStatusText%} withText{%endif%}" data-ajax="1">{{L("follow")}}</a>
+				<a href="/users/{{ user.id }}/confirmSendFriendRequest?csrf={{csrf}}" class="button" data-ajax="1">{{L("follow")}}</a>
 				{%endif%}
 				{%endif%}
-				{% if canMessage %}
-				<a href="/my/mail/compose?to={{ user.id }}" class="button withText" onclick="showMailFormBox(this); return false;">{{ L('profile_write_message') }}</a>
+				{% if friendshipStatusText is not empty %}
+				<div class="friendshipStatus">{{ friendshipStatusText | raw }}</div>
 				{% endif %}
 			</div>
 			{%endif%}

src/main/resources/templates/mobile/mail_message_list.twig

@@ -3,7 +3,7 @@
 {% if recentlySentMessage is not null %}
 <div class="settingsMessage">
 	{%- if (recentlySentMessage.to | length)>1 %}
-	{{- L('mail_message_sent_muitl', {'name': users[recentlySentMessage.firstRecipientID].firstLastAndGender, 'moreCount': (recentlySentMessage.to | length)-1}, {'message': {'href': "/my/mail/messages/#{recentlySentMessage.encodedID}"} }) }}
+	{{- L('mail_message_sent_multi', {'name': users[recentlySentMessage.firstRecipientID].firstLastAndGender, 'moreCount': (recentlySentMessage.to | length)-1}, {'message': {'href': "/my/mail/messages/#{recentlySentMessage.encodedID}"} }) }}
 	{%- else %}
 	{{- L('mail_message_sent', {'name': users[recentlySentMessage.firstRecipientID].firstLastAndGender}, {'message': {'href': "/my/mail/messages/#{recentlySentMessage.encodedID}"} }) }}
 	{%- endif %}

src/main/web/common.scss

@@ -270,34 +270,21 @@ a, a:link, a:visited, .link{
 	background: $gray;
 	vertical-align: top;
 	margin: 0;
-	background-image: svg-load("img/ava_placeholder_male_s.svg", fill: $darkerGray);
+	background-color: #fff;
+	background-image: svg-load("img/ava_question.svg", fill: #809528);
 	background-repeat: no-repeat;
 	background-position: center;
-	border: solid 1px $darkerGray;
+	background-size: contain;
+	border: solid 1px #ece5d1;
 	box-sizing: border-box;
-	&.sizeM{
-		background-size: auto 32px;
-	}
-	&.sizeL{
-		background-size: auto 48px;
-	}
-	&.female{
-		background-image: svg-load("img/ava_placeholder_female_s.svg", fill: $darkerGray);
-	}
-	&.group{
-		background-image: svg-load("img/ava_placeholder_group_s.svg", fill: $darkerGray);
-	}
 	&.inProfile{
 		width: 200px;
-		height: 200px;
-		border: none;
+		height: 115px;
 		position: relative;
-		background-image: svg-load("img/ava_placeholder_male_l.svg", fill: $darkerGray);
-		&.female{
-			background-image: svg-load("img/ava_placeholder_female_l.svg", fill: $darkerGray);
-		}
-		&.group{
-			background-image: svg-load("img/ava_placeholder_group_l.svg", fill: $darkerGray);
+		&.own{
+			background-image: svg-load("img/ava_question.svg", fill: #e8e3bb);
+			background-color: #fff8cc;
+			border: none;
 		}
 	}
 }

src/main/web/desktop.scss

@@ -659,14 +659,11 @@ small{
 }
 
 .ownProfileAvaPlaceholderLabel{
-	color: $grayText;
-	display: inline-block;
-	width: 100%;
-	height: 68px;
-	line-height: 68px;
+	color: $normalLink;
 	text-align: center;
-	position: absolute;
-	bottom: 0;
+	padding: 1px 5px 7px;
+	border-bottom: solid 1px #ffe222;
+	background: #fff8cc;
 }
 
 .membersRow td{
@@ -1117,17 +1114,23 @@ select{
 }
 
 .profileBelowAva{
-	background: $gray;
-	border-bottom: solid 1px $darkerGray;
+	background: $blockUnderboxBackground;
 	text-align: center;
-	padding: 22px 16px 16px 16px;
-	margin-top: -6px;
+	padding: 0 8px;
+	margin-top: 8px;
 	color: $textOnGray;
+	overflow: hidden; /* suppress margin collapse with child elements */
 	.button{
 		width: 100%;
-		&.withText{
-			margin-top: 8px;
-		}
+		height: 28px;
+		line-height: 26px;
+		display: block;
+	}
+	>*{
+		margin: 8px 0;
+	}
+	.friendshipStateText{
+		padding: 7.5px 0;
 	}
 }