[TASK] WIP: Userprofile template files structure

extensions/t3omy/Resources/Private/Partials/UserProfile/ListUser.html

 {namespace userprofile=In2code\Userprofile\ViewHelpers}
 {namespace t3omy=T3o\T3omy\ViewHelpers}
-<f:comment>
-<f:debug>{frontendUser.uid}</f:debug>
-<f:debug title="FE USer:{frontendUser.uid}">{t3omy:isSlackOnline(frontendUserUID:'{frontendUser.uid}')}</f:debug>
-</f:comment>
-
-
 
 <f:link.action class="user-box" controller="UserProfile" action="show" arguments="{user:frontendUser}">
     <div class="user-box-image ">

extensions/t3omy/Resources/Private/Partials/UserProfile/ShowEdit.html

+<hr/>
+<f:link.action action="edit" arguments="{user:user}" class="btn btn-primary" >Edit your profile</f:link.action>
+<f:if condition="{settings.features.enablePublicProfile}">
+	<f:if condition="{user.publicProfile}">
+		<f:then>
+			<f:link.action class="btn alert-danger" action="changeProfileVisibility" arguments="{user:user}">Hide profile</f:link.action>
+			</br>
+			<span>
+				Your profile page is currently active. Your Url is:</br>
+				<f:uri.page addQueryString="true" absolute="true" />
+			</span>
+		</f:then>
+		<f:else>
+			<f:link.action class="btn alert-success" action="changeProfileVisibility" arguments="{user:user}">Make profile public</f:link.action>
+			<span>Your profile page is hidden</span>
+		</f:else>
+	</f:if>
+</f:if>
+</br>
+
+<hr />
+
+<h3>Your privacy settings</h3>
+<table>
+	<thead>
+		<td>show your data to </td>
+		<td>Everyone</td>
+		<td>Community</td>
+		<td>Teams</td>
+	</thead>
+	<f:for each="{privacySettings}" as="privacySetting" key="privacySettingValue">
+		<tr>
+			<td>{privacySettingValue}</td>
+			<td>{f:if(condition:privacySetting.public, then: 'Yes', else: 'No')}</td>
+			<td>{f:if(condition:privacySetting.authenticated, then: 'Yes', else: 'No')}</td>
+			<td>{f:if(condition:privacySetting.groups, then: 'Yes', else: 'No')}</td>
+		</tr>
+	</f:for>
+</table>
+<f:link.action class="btn btn-secondary" action="privacyEdit" arguments="{user:user}">Edit privacy settings</f:link.action>

extensions/t3omy/Resources/Private/Partials/UserProfile/ShowSidebar.html

+<f:if condition="{isOwnProfile}">
+    <f:render partial="ShowEdit" arguments="{_all}" />
+</f:if>
\ No newline at end of file

extensions/t3omy/Resources/Private/Partials/UserProfile/ShowUserData.html

+{namespace userprofile=In2code\Userprofile\ViewHelpers}
+{namespace t3omy=T3o\T3omy\ViewHelpers}
+
+<div class="user-profile-data">
+    <f:if condition="{userprofile:isPropertyVisible(propertyName:'image', user:user)}">
+        <f:for each="{user.image}" as="image">
+            <f:image class="img-fluid rounded-circle" image="{image}" width="300" height="300" />
+        </f:for>
+    </f:if>
+    <f:comment>
+        Here should be the Carma Display
+    </f:comment>
+    <br />
+    <br />
+
+    <f:if condition="{userprofile:isPropertyVisible(propertyName:'address', user:user)} AND {user.address}">
+        <span>{user.address}</span><br />
+    </f:if>
+
+    <f:if condition="{userprofile:isPropertyVisible(propertyName:'zip', user:user)} AND {user.zip}">
+        <span>{user.zip}</span><br />
+    </f:if>
+
+    <f:if condition="{userprofile:isPropertyVisible(propertyName:'city', user:user)} AND {user.city}">
+        <span>{user.city}</span><br />
+    </f:if>
+
+    <f:if condition="{userprofile:isPropertyVisible(propertyName:'telephone', user:user)} AND {user.telephone}">
+        <span>{user.telephone}</span><br />
+    </f:if>
+
+    <f:if condition="{userprofile:isPropertyVisible(propertyName:'email', user:user)} AND {user.email}">
+        <span>{user.email}</span><br />
+    </f:if>
+
+    <f:if condition="{userprofile:isPropertyVisible(propertyName:'country', user:user)} AND {user.country}">
+        <span>{user.country}</span><br />
+    </f:if>
+
+    <f:if condition="{userprofile:isPropertyVisible(propertyName:'www', user:user)} AND {user.www}">
+        <span> {user.www}</span><br />
+    </f:if>
+
+    <f:if condition="{userprofile:isPropertyVisible(propertyName:'slack_id', user:user)} AND {user.slack_id}">
+        <span><f:format.raw><slack:showSlackLink frontendUserUID="{user.uid}" /></f:format.raw></span><br />
+    </f:if>
+</div>
\ No newline at end of file

extensions/t3omy/Resources/Private/Partials/UserProfile/ShowUserText.html

+{namespace userprofile=In2code\Userprofile\ViewHelpers}
+{namespace t3omy=T3o\T3omy\ViewHelpers}
+
+<div class="user-profile-text">
+
+    <h1>{user.name}</h1>
+
+    <f:if condition="{t3omy:isSlackOnline(frontendUserUID: '{user.uid}')}">
+        <div class="user-profile {t3omy:isSlackOnline(frontendUserUID: '{user.uid}')}">
+            <i class="fa fa-2x fa-slack"></i>
+            <span></span>
+        </div>
+    </f:if>
+
+    <f:if condition="{userprofile:isPropertyVisible(propertyName:'about_me', user:user)}">
+        <p>{user.aboutMe}</p>
+    </f:if>
+
+</div>

extensions/t3omy/Resources/Private/Templates/UserProfile/UserProfile/Show.html

 {namespace userprofile=In2code\Userprofile\ViewHelpers}
 {namespace slack=T3o\T3oSlack\ViewHelpers}
 <section class="container">
-	<h1>{user.name}</h1>
-	<ul>
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'name', user:user)}">
-			<li>Name: {user.name}</li>
-		</f:if>
-
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'firstname', user:user)}">
-			<li>Firstname: {user.firstname}</li>
-		</f:if>
-
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'lastname', user:user)}">
-			<li>Lastname: {user.lastname}</li>
-		</f:if>
-
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'address', user:user)}">
-			<li>Street: {user.address}</li>
-		</f:if>
-
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'zip', user:user)}">
-			<li>Zip: {user.zip}</li>
-		</f:if>
-
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'city', user:user)}">
-			<li>City: {user.city}</li>
-		</f:if>
-
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'telephone', user:user)}">
-			<li>Phone: {user.telephone}</li>
-		</f:if>
-
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'email', user:user)}">
-			<li>Email: {user.email}</li>
-		</f:if>
-
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'country', user:user)}">
-			<li>Country: {user.country}</li>
-		</f:if>
-
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'www', user:user)}">
-			<li>www:  {user.www}</li>
-		</f:if>
-
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'image', user:user)}">
-			<f:for each="{user.image}" as="image">
-				<f:image image="{image}" maxWidth="800" />
-			</f:for>
-		</f:if>
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'about_me', user:user)}">
-			<li>About me:  {user.aboutMe}</li>
-		</f:if>
-		<f:if condition="{userprofile:isPropertyVisible(propertyName:'slack_id', user:user)}">
-			<li><slack:showSlackLink frontendUserUID="{user.uid}" /></li>
-
-		</f:if>
-
-
+	<div class="row">
+		<div class="col-sm-3">
+			<f:render partial="ShowUserData" arguments="{_all}"/>
+		</div>
+		<div class="{f:if(condition:isOwnProfile , then:'col-sm-6' , else:'col-sm-9')}">
+			<f:render partial="ShowUserText" arguments="{_all}"/>
+		</div>
 		<f:if condition="{isOwnProfile}">
-			<f:render partial="ShowEdit" arguments="{_all}" />
+			<div class="col-sm-3">
+				<f:render partial="ShowSidebar" arguments="{_all}"/>
+			</div>
 		</f:if>
-	</ul>
+	</div>
 </section>