[frio] Restyle photo upload (#5427)

* Better wording in photo upload.

* [frio] Restyle photo uploader to conform to frio style.
This commit is contained in:
Andreas Neustifter 2018-07-20 21:23:12 +02:00 committed by Hypolite Petovan
parent 7382be2766
commit 24fc070c5c
3 changed files with 99 additions and 3 deletions

View file

@ -1041,7 +1041,7 @@ function photos_content(App $a)
$albumselect = '';
$albumselect .= '<option value="" ' . (!$selname ? ' selected="selected" ' : '') . '>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</option>';
$albumselect .= '<option value="" ' . (!$selname ? ' selected="selected" ' : '') . '>&lt;current year&gt;</option>';
if (count($a->data['albums'])) {
foreach ($a->data['albums'] as $album) {
if (($album['album'] === '') || ($album['album'] === 'Contact Photos') || ($album['album'] === L10n::t('Contact Photos'))) {
@ -1077,7 +1077,7 @@ function photos_content(App $a)
'$usage' => $usage_message,
'$nickname' => $a->data['user']['nickname'],
'$newalbum' => L10n::t('New album name: '),
'$existalbumtext' => L10n::t('or existing album name: '),
'$existalbumtext' => L10n::t('or select existing album:'),
'$nosharetext' => L10n::t('Do not show a status post for this upload'),
'$albumselect' => $albumselect,
'$permissions' => L10n::t('Permissions'),

View file

@ -217,7 +217,7 @@ a.btn:hover {
font-size: 12px;
}
.btn-primary {
background: $nav_bg;
background: $nav_bg !important;
color: $btn_primary_color !important;
}
.btn-primary:hover, .btn-primary:focus {
@ -3258,6 +3258,50 @@ section .profile-match-wrapper {
background-color: rgba(255,255,255,.85);
}
.qq-upload-button {
background: $nav_bg !important;
color: $btn_primary_color !important;
float: none;
border: none;
-webkit-box-shadow: none;
box-shadow: none;
-moz-box-shadow: none;
background-image: none;
text-shadow: none;
border-radius: 3px;
outline: 0!important;
margin-bottom: 0;
font-size: 14px;
font-weight: 600;
padding: 8px 16px;
color: inherit;
width: 100% !important;
}
.qq-upload-drop-area {
background: white !important;
float: none;
border: none;
-webkit-box-shadow: none;
box-shadow: none;
-moz-box-shadow: none;
background-image: none;
text-shadow: none;
border-radius: 3px;
outline: 0!important;
margin-bottom: 0;
font-size: 14px;
font-weight: 600;
padding: 8px 16px;
color: inherit;
width: 100% !important;
display: block !important;
position: relative !important;
border: black 1px dashed !important;
margin-bottom: 5px !important;
margin-top: 15px !important;
}
/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
.mod-home.is-not-singleuser #content,

View file

@ -0,0 +1,52 @@
<h3>{{$pagename}}</h3>
<div id="photos-usage-message">{{$usage}}</div>
<form action="photos/{{$nickname}}" enctype="multipart/form-data" method="post" name="photos-upload-form" id="photos-upload-form" >
<div id="photos-upload-new-wrapper" >
<div id="photos-upload-newalbum-div">
<label id="photos-upload-newalbum-text" for="photos-upload-newalbum" >{{$newalbum}}</label>
</div>
<input class="form-control" id="photos-upload-newalbum" type="text" name="newalbum" />
</div>
<div id="photos-upload-new-end"></div>
<div id="photos-upload-exist-wrapper">
<div id="photos-upload-existing-album-div">
<label id="photos-upload-existing-album-text" for="photos-upload-album-select">{{$existalbumtext}}</label>
</div>
<select class="form-control" id="photos-upload-album-select" name="album" size="4">
{{$albumselect}}
</select>
</div>
<div id="photos-upload-exist-end"></div>
<div id="photos-upload-noshare-div" class="photos-upload-noshare-div pull-left" >
<input id="photos-upload-noshare" type="checkbox" name="not_visible" value="1" checked/>
<label id="photos-upload-noshare-text" for="photos-upload-noshare" >{{$nosharetext}}</label>
</div>
<div id="photos-upload-perms" class="photos-upload-perms pull-right" >
<a href="#photos-upload-permissions-wrapper" id="photos-upload-perms-menu" class="button popupbox" />
<span id="jot-perms-icon" class="icon {{$lockstate}}" ></span>{{$permissions}}
</a>
</div>
<div id="photos-upload-perms-end" class="clear"></div>
<div style="display: none;">
<div id="photos-upload-permissions-wrapper">
{{$aclselect}}
</div>
</div>
<div id="photos-upload-spacer"></div>
{{$alt_uploader}}
{{$default_upload_box}}
{{$default_upload_submit}}
<div class="photos-upload-end" ></div>
</form>