tweak: sharing style

This commit is contained in:
jelveh 2024-11-13 17:30:03 -08:00
parent b5bb95e2d7
commit 94b10c78b7
2 changed files with 35 additions and 7 deletions

View File

@ -27,7 +27,6 @@ async function UIWindowShare(items, recipient){
//------------------------------------------------ //------------------------------------------------
// Icons // Icons
//------------------------------------------------ //------------------------------------------------
h += `<div style="display:flex; justify-content: center; margin-bottom: 10px; disable-user-select">`; h += `<div style="display:flex; justify-content: center; margin-bottom: 10px; disable-user-select">`;
// 1 item shared // 1 item shared
if(items.length === 1) if(items.length === 1)
@ -61,7 +60,7 @@ async function UIWindowShare(items, recipient){
h += `</div>`; h += `</div>`;
// ------------------------------------------------ // ------------------------------------------------
// Name // Item Name
// ------------------------------------------------ // ------------------------------------------------
h += `<h2 style="font-size: 17px; margin-top:0; text-align:center; margin-bottom: 40px; font-weight: 400; color: #303d49;">`; h += `<h2 style="font-size: 17px; margin-top:0; text-align:center; margin-bottom: 40px; font-weight: 400; color: #303d49;">`;
h += `Share <strong>${html_encode(items[0].name)}</strong>`; h += `Share <strong>${html_encode(items[0].name)}</strong>`;
@ -69,7 +68,9 @@ async function UIWindowShare(items, recipient){
h += ` and ${items.length - 1} other item${items.length > 2 ? 's' : ''}`; h += ` and ${items.length - 1} other item${items.length > 2 ? 's' : ''}`;
h += `</h2>`; h += `</h2>`;
// form // ------------------------------------------------
// Recipient
// ------------------------------------------------
h += `<form class="window-give-item-access-form">`; h += `<form class="window-give-item-access-form">`;
// Error msg // Error msg
h += `<div class="error"></div>`; h += `<div class="error"></div>`;
@ -85,7 +86,9 @@ async function UIWindowShare(items, recipient){
h += `</div>`; h += `</div>`;
h += `</form>`; h += `</form>`;
//recipients // ------------------------------------------------
// Already Shared With
// ------------------------------------------------
h += `<p style="font-size: 14px; margin-bottom: 0px; color: #303d49; text-shadow: 1px 1px white;">People with access</p>`; h += `<p style="font-size: 14px; margin-bottom: 0px; color: #303d49; text-shadow: 1px 1px white;">People with access</p>`;
h += `<div class="share-recipients">`; h += `<div class="share-recipients">`;
h += `</div>`; h += `</div>`;
@ -124,6 +127,7 @@ async function UIWindowShare(items, recipient){
let contacts = []; let contacts = [];
// get contacts
puter.kv.get('contacts').then((kv_contacts) => { puter.kv.get('contacts').then((kv_contacts) => {
if(kv_contacts){ if(kv_contacts){
try{ try{
@ -139,7 +143,8 @@ async function UIWindowShare(items, recipient){
// /stat // /stat
let perms = []; let perms = [];
let printed_users = []; let printed_users = [];
for(let i=0; i<items.length; i++){ for(let i=0; i<items.length; i++){
puter.fs.stat({ puter.fs.stat({
path: items[i].path, path: items[i].path,
@ -198,7 +203,7 @@ async function UIWindowShare(items, recipient){
let recipient_id = $(el_window).find('.access-recipient').val(); let recipient_id = $(el_window).find('.access-recipient').val();
// todo do some basic validation client-side // todo do some basic validation client-side
if(recipient_id === '' || recipient_id === null || recipient_id === undefined) if(!recipient_id)
return; return;
if(is_email(recipient_id)) if(is_email(recipient_id))
@ -216,7 +221,7 @@ async function UIWindowShare(items, recipient){
}) })
if(recipient_already_in_list){ if(recipient_already_in_list){
$(el_window).find('.error').html('This user already has access'); $(el_window).find('.error').html('This user already has access to this item');
$(el_window).find('.error').fadeIn(); $(el_window).find('.error').fadeIn();
return; return;
} }

View File

@ -2149,6 +2149,29 @@ label {
max-height: 200px; max-height: 200px;
overflow: hidden; overflow: hidden;
} }
.ui-menu{
margin-top: 5px;
border-radius: 5px;
}
.ui-menu .ui-menu-item{
padding: 5px 10px;
border-radius: 5px;
}
.ui-menu .ui-menu-item .ui-menu-item-wrapper {
background: none;
border: none;
padding: 5px 10px;
font-size: 14px;
}
.ui-menu .ui-menu-item:hover .ui-menu-item-wrapper,
.ui-menu .ui-menu-item:focus .ui-menu-item-wrapper,
.ui-menu .ui-menu-item:active .ui-menu-item-wrapper,
.ui-menu .ui-menu-item .ui-menu-item-wrapper.ui-state-active {
background-color: #4092da;
color: #fff;
border-radius: 5px;
border: 1px solid #4092da;
}
.feedback-sent-success { .feedback-sent-success {
display: none; display: none;