tobias/friendica
1
0
Fork 0
Code Pull requests Activity

Refactor profile edit page

Browse source 
- Fix header hierarchy
- [frio] Fix panel display
This commit is contained in:
Hypolite Petovan 2020-04-01 19:14:37 -04:00
parent b480e4eaa9
commit 91fb396ec1
3 changed files with 34 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
view/templates/settings/profile/index.tpl
View file

@ -97,7 +97,7 @@
</div> </div>
<div class="profile-edit-submit-end"></div> <div class="profile-edit-submit-end"></div>
<h3>{{$lbl_custom_fields_section}}</h3> <h2>{{$lbl_custom_fields_section}}</h2>
{{$custom_fields_description nofilter}} {{$custom_fields_description nofilter}}
<div id="profile-custom-fields"> <div id="profile-custom-fields">
{{foreach $custom_fields as $custom_field}} {{foreach $custom_fields as $custom_field}}

59
view/theme/frio/templates/settings/profile/index.tpl
View file

@ -1,5 +1,5 @@
<div class="generic-page-wrapper"> <div class="generic-page-wrapper">
{{include file="section_title.tpl" title=$banner}} <h1>{{$banner}}</h1>
{{* The actions dropdown which can performed to the current profile *}} {{* The actions dropdown which can performed to the current profile *}}
<div id="profile-edit-links"> <div id="profile-edit-links">
@ -50,16 +50,16 @@
<div class="panel-group panel-group-settings" id="profile-edit-wrapper" role="tablist" aria-multiselectable="true"> <div class="panel-group panel-group-settings" id="profile-edit-wrapper" role="tablist" aria-multiselectable="true">
{{* The personal settings *}} {{* The personal settings *}}
<div class="panel"> <div class="panel">
<div class="section-subtitle-wrapper" role="tab" id="personal"> <div class="section-subtitle-wrapper panel-heading" role="tab" id="personal">
<h4> <h2>
<a class="accordion-toggle" data-toggle="collapse" data-parent="#profile-edit-wrapper" href="#personal-collapse" aria-expanded="true" aria-controls="personal-collapse"> <a class="accordion-toggle" data-toggle="collapse" data-parent="#profile-edit-wrapper" href="#personal-collapse" aria-expanded="true" aria-controls="personal-collapse">
{{$lbl_personal_section}} {{$lbl_personal_section}}
</a> </a>
</h4> </h2>
</div> </div>
{{* for the $detailed_profile we use bootstraps collapsable panel-groups to have expandable groups *}} {{* for the $detailed_profile we use bootstraps collapsable panel-groups to have expandable groups *}}
<div id="personal-collapse" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="personal"> <div id="personal-collapse" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="personal">
<div class="section-content-tools-wrapper"> <div class="panel-body">
{{include file="field_input.tpl" field=$name}} {{include file="field_input.tpl" field=$name}}
{{include file="field_textarea.tpl" field=$about}} {{include file="field_textarea.tpl" field=$about}}
@ -67,26 +67,24 @@
{{$dob nofilter}} {{$dob nofilter}}
{{$hide_friends nofilter}} {{$hide_friends nofilter}}
<div class="form-group pull-right">
<button type="submit" name="submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
</div> </div>
<div class="clear"></div> <div class="panel-footer">
<button type="submit" name="submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
</div> </div>
</div> </div>
</div> </div>
{{* The location settings *}} {{* The location settings *}}
<div class="panel"> <div class="panel">
<div class="section-subtitle-wrapper" role="tab" id="location"> <div class="section-subtitle-wrapper panel-heading" role="tab" id="location">
<h4> <h2>
<a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#profile-edit-wrapper" href="#location-collapse" aria-expanded="false" aria-controls="location-collapse"> <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#profile-edit-wrapper" href="#location-collapse" aria-expanded="false" aria-controls="location-collapse">
{{$lbl_location_section}} {{$lbl_location_section}}
</a> </a>
</h4> </h2>
</div> </div>
<div id="location-collapse" class="panel-collapse collapse" role="tabpanel" aria-labelledby="location"> <div id="location-collapse" class="panel-collapse collapse" role="tabpanel" aria-labelledby="location">
<div class="section-content-tools-wrapper"> <div class="panel-body">
{{include file="field_input.tpl" field=$address}} {{include file="field_input.tpl" field=$address}}
{{include file="field_input.tpl" field=$locality}} {{include file="field_input.tpl" field=$locality}}
@ -109,27 +107,24 @@
<option>temp</option> <option>temp</option>
</select> </select>
</div> </div>
<div class="clear"></div>
<div class="form-group pull-right">
<button type="submit" name="submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
</div> </div>
<div class="clear"></div> <div class="panel-footer">
<button type="submit" name="submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
</div> </div>
</div> </div>
</div> </div>
{{* The miscellanous other settings *}} {{* The miscellanous other settings *}}
<div class="panel"> <div class="panel">
<div class="section-subtitle-wrapper" role="tab" id="miscellaneous"> <div class="section-subtitle-wrapper panel-heading" role="tab" id="miscellaneous">
<h4> <h2>
<a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#profile-edit-wrapper" href="#miscellaneous-collapse" aria-expanded="false" aria-controls="miscellaneous-collapse"> <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#profile-edit-wrapper" href="#miscellaneous-collapse" aria-expanded="false" aria-controls="miscellaneous-collapse">
{{$lbl_miscellaneous_section}} {{$lbl_miscellaneous_section}}
</a> </a>
</h4> </h2>
</div> </div>
<div id="miscellaneous-collapse" class="panel-collapse collapse" role="tabpanel" aria-labelledby="miscellaneous"> <div id="miscellaneous-collapse" class="panel-collapse collapse" role="tabpanel" aria-labelledby="miscellaneous">
<div class="section-content-tools-wrapper"> <div class="panel-body">
{{include file="field_input.tpl" field=$homepage}} {{include file="field_input.tpl" field=$homepage}}
{{include file="field_input.tpl" field=$xmpp}} {{include file="field_input.tpl" field=$xmpp}}
@ -137,37 +132,33 @@
{{include file="field_input.tpl" field=$pub_keywords}} {{include file="field_input.tpl" field=$pub_keywords}}
{{include file="field_input.tpl" field=$prv_keywords}} {{include file="field_input.tpl" field=$prv_keywords}}
<div class="form-group pull-right">
<button type="submit" name="submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
</div> </div>
<div class="clear"></div> <div class="panel-footer">
<button type="submit" name="submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
</div> </div>
</div> </div>
</div> </div>
{{* The miscellanous other settings *}} {{* The miscellanous other settings *}}
<div class="panel"> <div class="panel">
<div class="section-subtitle-wrapper" role="tab" id="custom-fields"> <div class="section-subtitle-wrapper panel-heading" role="tab" id="custom-fields">
<h4> <h2>
<a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#profile-edit-wrapper" href="#custom-fields-collapse" aria-expanded="false" aria-controls="custom-fields-collapse"> <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#profile-edit-wrapper" href="#custom-fields-collapse" aria-expanded="false" aria-controls="custom-fields-collapse">
{{$lbl_custom_fields_section}} {{$lbl_custom_fields_section}}
</a> </a>
</h4> </h2>
</div> </div>
<div id="custom-fields-collapse" class="panel-collapse collapse" role="tabpanel" aria-labelledby="custom-fields"> <div id="custom-fields-collapse" class="panel-collapse collapse" role="tabpanel" aria-labelledby="custom-fields">
<div class="section-content-tools-wrapper"> <div class="panel-body">
{{$custom_fields_description nofilter}} {{$custom_fields_description nofilter}}
<div id="profile-custom-fields"> <div id="profile-custom-fields">
{{foreach $custom_fields as $custom_field}} {{foreach $custom_fields as $custom_field}}
{{include file="settings/profile/field/edit.tpl" profile_field=$custom_field}} {{include file="settings/profile/field/edit.tpl" profile_field=$custom_field}}
{{/foreach}} {{/foreach}}
</div> </div>
<div class="form-group pull-right">
<button type="submit" name="submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
</div> </div>
<div class="clear"></div> <div class="panel-footer">
<button type="submit" name="submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
</div> </div>
</div> </div>
</div> </div>

8
view/theme/vier/templates/settings/profile/index.tpl
View file

@ -23,7 +23,7 @@
<!-- Profile picture --> <!-- Profile picture -->
<div class="toggle-section js-toggle-section"> <div class="toggle-section js-toggle-section">
<a class="section-caption js-section-toggler" href="javascript:;">{{$lbl_picture_section}} &raquo;</a> <h2><a class="section-caption js-section-toggler" href="javascript:;">{{$lbl_picture_section}} &raquo;</a></h2>
<div class="js-section toggle-section-content hidden"> <div class="js-section toggle-section-content hidden">
<div id="profile-photo-upload-wrapper"> <div id="profile-photo-upload-wrapper">
@ -45,7 +45,7 @@
<!-- Basic information --> <!-- Basic information -->
<div class="toggle-section js-toggle-section"> <div class="toggle-section js-toggle-section">
<a class="section-caption js-section-toggler" href="javascript:;">{{$lbl_personal_section}} &raquo;</a> <h2><a class="section-caption js-section-toggler" href="javascript:;">{{$lbl_personal_section}} &raquo;</a></h2>
<div class="js-section toggle-section-content hidden"> <div class="js-section toggle-section-content hidden">
<div id="profile-edit-name-wrapper"> <div id="profile-edit-name-wrapper">
@ -103,7 +103,7 @@
</div> </div>
<!-- About you --> <!-- About you -->
<div class="toggle-section js-toggle-section"> <div class="toggle-section js-toggle-section">
<a class="section-caption js-section-toggler" href="javascript:;">{{$lbl_location_section}} &raquo;</a> <h2><a class="section-caption js-section-toggler" href="javascript:;">{{$lbl_location_section}} &raquo;</a></h2>
<div class="js-section toggle-section-content hidden"> <div class="js-section toggle-section-content hidden">
<div id="profile-edit-address-wrapper"> <div id="profile-edit-address-wrapper">
@ -148,7 +148,7 @@
</div> </div>
<!-- Interests --> <!-- Interests -->
<div class="toggle-section js-toggle-section"> <div class="toggle-section js-toggle-section">
<a class="section-caption js-section-toggler" href="javascript:;">{{$lbl_custom_fields_section}} &raquo;</a> <h2><a class="section-caption js-section-toggler" href="javascript:;">{{$lbl_custom_fields_section}} &raquo;</a></h2>
<div class="js-section toggle-section-content hidden"> <div class="js-section toggle-section-content hidden">
{{$custom_fields_description nofilter}} {{$custom_fields_description nofilter}}
<div id="profile-custom-fields"> <div id="profile-custom-fields">