lee/puter
1
0
Fork 0
mirror of https://github.com/HeyPuter/puter.git synced 2026-05-04 00:20:45 +00:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

Revert "feat(gui): Add animation effects to the taskbar (#1365)" (#1366)
Docker Image CI / build-and-push-image (push) Has been cancelled
Details
Maintain Release Merge PR / update-release-pr (push) Has been cancelled
Details
release-please / release-please (push) Has been cancelled
Details
test / test (18.x) (push) Has been cancelled
Details
test / test (20.x) (push) Has been cancelled
Details
test / test (22.x) (push) Has been cancelled
Details

Browse Source 
This reverts commit 212bc88c8f.
This commit is contained in:
Nariman Jelveh
2025-07-19 11:12:28 -07:00
committed by GitHub
parent 212bc88c8f
commit e14e1acd95
4 changed files with 150 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/gui/src/UI/UITaskBarCreateCurve.js
-24
View File
@@ -1,24 +0,0 @@
function baseCurve(x) {
if (x < 0) return 0;
if (x > 1) return 0;
return Math.sin(x * Math.PI);
}
export function UITaskBarCreateCurve(totalXDis, topX, minY, maxY) {
return function curve(x) {
const beginX = topX - totalXDis / 2;
const endX = topX + totalXDis / 2;
if (x < beginX) return minY;
if (x > endX) return minY;
const yDis = maxY - minY;
return baseCurve((x - beginX) / totalXDis) * yDis + minY;
};
}
export function UITaskBarLayout(items, curve) {
for (const item of items) {
const rect = item.getBoundingClientRect();
const x = rect.x + rect.width / 2;
const scale = curve(x);
item.style.setProperty('--i', scale);
}
}
src/gui/src/UI/UITaskbar.js
+57 -80
View File
@@ -7,12 +7,12 @@
* it under the terms of the GNU Affero General Public License as published
* by the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
@@ -20,9 +20,8 @@
import UITaskbarItem from './UITaskbarItem.js'
import UIPopover from './UIPopover.js'
import launch_app from "../helpers/launch_app.js"
import {UITaskBarCreateCurve, UITaskBarLayout} from './UITaskBarCreateCurve.js'
async function UITaskbar(options) {
async function UITaskbar(options){
window.global_element_id++;
options = options ?? {};
@@ -35,18 +34,16 @@ async function UITaskbar(options) {
async: true,
contentType: "application/json",
headers: {
"Authorization": "Bearer " + window.auth_token
"Authorization": "Bearer "+window.auth_token
},
success: function (apps) {
success: function (apps){
window.launch_apps = apps;
}
});
let h = '';
h += `<div id="ui-taskbar_${window.global_element_id}" class="taskbar" style="height:${window.taskbar_height}px;">`;
h += `<div class="taskbar-menu">`;
h += `<div class="taskbar-sortable" style="display: flex; justify-content: center;align-items: flex-end; z-index: 99999;"></div>`;
h += `</div>`;
h += `<div class="taskbar-sortable" style="display: flex; justify-content: center; z-index: 99999;"></div>`;
h += `</div>`;
@@ -62,9 +59,9 @@ async function UITaskbar(options) {
sortable: false,
keep_in_taskbar: true,
disable_context_menu: true,
onClick: async function (item) {
onClick: async function(item){
// skip if popover already open
if ($(item).hasClass('has-open-popover'))
if($(item).hasClass('has-open-popover'))
return;
// show popover
@@ -80,7 +77,7 @@ async function UITaskbar(options) {
// In the rare case that launch_apps is not populated yet, get it from the server
// then populate the popover
if (!window.launch_apps || !window.launch_apps.recent || window.launch_apps.recent.length === 0) {
if(!window.launch_apps || !window.launch_apps.recent || window.launch_apps.recent.length === 0){
// get launch apps
window.launch_apps = await $.ajax({
url: window.api_origin + "/get-launch-apps?icon_size=64",
@@ -88,22 +85,22 @@ async function UITaskbar(options) {
async: true,
contentType: "application/json",
headers: {
"Authorization": "Bearer " + window.auth_token
"Authorization": "Bearer "+window.auth_token
},
});
}
let apps_str = '';
apps_str += `<div class="launch-search-wrapper">`
apps_str += `<input style="background-image:url('${window.icons['magnifier-outline.svg']}');" class="launch-search">`;
apps_str += `<img class="launch-search-clear" src="${window.icons['close.svg']}">`;
apps_str += `<input style="background-image:url('${window.icons['magnifier-outline.svg']}');" class="launch-search">`;
apps_str += `<img class="launch-search-clear" src="${window.icons['close.svg']}">`;
apps_str += `</div>`;
// -------------------------------------------
// Recent apps
// -------------------------------------------
if (window.launch_apps.recent.length > 0) {
if(window.launch_apps.recent.length > 0){
// heading
apps_str += `<h1 class="start-section-heading start-section-heading-recent">${i18n('recent')}</h1>`;
@@ -112,10 +109,10 @@ async function UITaskbar(options) {
for (let index = 0; index < window.launch_recent_apps_count && index < window.launch_apps.recent.length; index++) {
const app_info = window.launch_apps.recent[index];
apps_str += `<div title="${html_encode(app_info.title)}" data-name="${html_encode(app_info.name)}" class="start-app-card">`;
apps_str += `<div class="start-app" data-app-name="${html_encode(app_info.name)}" data-app-uuid="${html_encode(app_info.uuid)}" data-app-icon="${html_encode(app_info.icon)}" data-app-title="${html_encode(app_info.title)}">`;
apps_str += `<img class="start-app-icon" src="${html_encode(app_info.icon ? app_info.icon : window.icons['app.svg'])}">`;
apps_str += `<span class="start-app-title">${html_encode(app_info.title)}</span>`;
apps_str += `</div>`;
apps_str += `<div class="start-app" data-app-name="${html_encode(app_info.name)}" data-app-uuid="${html_encode(app_info.uuid)}" data-app-icon="${html_encode(app_info.icon)}" data-app-title="${html_encode(app_info.title)}">`;
apps_str += `<img class="start-app-icon" src="${html_encode(app_info.icon ? app_info.icon : window.icons['app.svg'])}">`;
apps_str += `<span class="start-app-title">${html_encode(app_info.title)}</span>`;
apps_str += `</div>`;
apps_str += `</div>`;
}
apps_str += `</div>`;
@@ -123,7 +120,7 @@ async function UITaskbar(options) {
// -------------------------------------------
// Reccomended apps
// -------------------------------------------
if (window.launch_apps.recommended.length > 0) {
if(window.launch_apps.recommended.length > 0){
// heading
apps_str += `<h1 class="start-section-heading start-section-heading-recommended" style="${window.launch_apps.recent.length > 0 ? 'padding-top: 30px;' : ''}">${i18n('recommended')}</h1>`;
// apps
@@ -131,10 +128,10 @@ async function UITaskbar(options) {
for (let index = 0; index < window.launch_apps.recommended.length; index++) {
const app_info = window.launch_apps.recommended[index];
apps_str += `<div title="${html_encode(app_info.title)}" data-name="${html_encode(app_info.name)}" class="start-app-card">`;
apps_str += `<div class="start-app" data-app-name="${html_encode(app_info.name)}" data-app-uuid="${html_encode(app_info.uuid)}" data-app-icon="${html_encode(app_info.icon)}" data-app-title="${html_encode(app_info.title)}">`;
apps_str += `<img class="start-app-icon" src="${html_encode(app_info.icon ? app_info.icon : window.icons['app.svg'])}">`;
apps_str += `<span class="start-app-title">${html_encode(app_info.title)}</span>`;
apps_str += `</div>`;
apps_str += `<div class="start-app" data-app-name="${html_encode(app_info.name)}" data-app-uuid="${html_encode(app_info.uuid)}" data-app-icon="${html_encode(app_info.icon)}" data-app-title="${html_encode(app_info.title)}">`;
apps_str += `<img class="start-app-icon" src="${html_encode(app_info.icon ? app_info.icon : window.icons['app.svg'])}">`;
apps_str += `<span class="start-app-title">${html_encode(app_info.title)}</span>`;
apps_str += `</div>`;
apps_str += `</div>`;
}
apps_str += `</div>`;
@@ -144,7 +141,7 @@ async function UITaskbar(options) {
$(popover).find('.launch-popover').append(apps_str);
// focus on search input only if not on mobile
if (!isMobile.phone)
if(!isMobile.phone)
$(popover).find('.launch-search').focus();
// make apps draggable
@@ -157,12 +154,12 @@ async function UITaskbar(options) {
distance: 5,
revertDuration: 100,
helper: 'clone',
cursorAt: {left: 18, top: 20},
start: function (event, ui) {
cursorAt: { left: 18, top: 20 },
start: function(event, ui){
},
drag: function (event, ui) {
drag: function(event, ui){
},
stop: function () {
stop: function(){
}
});
}
@@ -178,11 +175,11 @@ async function UITaskbar(options) {
sortable: false,
keep_in_taskbar: true,
lock_keep_in_taskbar: true,
onClick: function () {
onClick: function(){
let open_window_count = parseInt($(`.taskbar-item[data-app="explorer"]`).attr('data-open-windows'));
if (open_window_count === 0) {
launch_app({name: 'explorer', path: window.home_path});
} else {
if(open_window_count === 0){
launch_app({ name: 'explorer', path: window.home_path});
}else{
return false;
}
}
@@ -191,7 +188,7 @@ async function UITaskbar(options) {
//---------------------------------------------
// Add other useful apps to the taskbar
//---------------------------------------------
if (window.user.taskbar_items && window.user.taskbar_items.length > 0) {
if(window.user.taskbar_items && window.user.taskbar_items.length > 0){
for (let index = 0; index < window.user.taskbar_items.length; index++) {
const app_info = window.user.taskbar_items[index];
// add taskbar item for each app
@@ -200,13 +197,13 @@ async function UITaskbar(options) {
app: app_info.name,
name: app_info.title,
keep_in_taskbar: true,
onClick: function () {
onClick: function(){
let open_window_count = parseInt($(`.taskbar-item[data-app="${app_info.name}"]`).attr('data-open-windows'));
if (open_window_count === 0) {
if(open_window_count === 0){
launch_app({
name: app_info.name,
})
} else {
})
}else{
return false;
}
}
@@ -218,7 +215,7 @@ async function UITaskbar(options) {
// add `Trash` to the taskbar
//---------------------------------------------
const trash = await puter.fs.stat(window.trash_path);
if (window.socket) {
if(window.socket){
window.socket.emit('trash.is_empty', {is_empty: trash.is_empty});
}
@@ -229,28 +226,23 @@ async function UITaskbar(options) {
sortable: false,
keep_in_taskbar: true,
lock_keep_in_taskbar: true,
onClick: function () {
onClick: function(){
let open_windows = $(`.window[data-path="${html_encode(window.trash_path)}"]`);
if (open_windows.length === 0) {
launch_app({name: 'explorer', path: window.trash_path});
} else {
if(open_windows.length === 0){
launch_app({ name: 'explorer', path: window.trash_path});
}else{
open_windows.focusWindow();
}
},
onItemsDrop: function (items) {
onItemsDrop: function(items){
window.move_items(items, window.trash_path);
}
})
window.make_taskbar_sortable();
//---------------------------------------------
// Taskbar is Animation
//---------------------------------------------
window.taskbar_is_animation()
}
window.make_taskbar_sortable = function () {
window.make_taskbar_sortable = function(){
//-------------------------------------------
// Taskbar is sortable
//-------------------------------------------
@@ -259,41 +251,41 @@ window.make_taskbar_sortable = function () {
items: '.taskbar-item-sortable:not(.has-open-contextmenu)',
cancel: '.has-open-contextmenu',
placeholder: "taskbar-item-sortable-placeholder",
helper: 'clone',
helper : 'clone',
distance: 5,
revert: 10,
receive: function (event, ui) {
if (!$(ui.item).hasClass('taskbar-item')) {
receive: function(event, ui){
if(!$(ui.item).hasClass('taskbar-item')){
// if app is already in taskbar, cancel
if ($(`.taskbar-item[data-app="${$(ui.item).attr('data-app-name')}"]`).length !== 0) {
if($(`.taskbar-item[data-app="${$(ui.item).attr('data-app-name')}"]`).length !== 0){
$(this).sortable('cancel');
$('.taskbar .start-app').remove();
return;
}
}
},
update: function (event, ui) {
if (!$(ui.item).hasClass('taskbar-item')) {
update: function(event, ui){
if(!$(ui.item).hasClass('taskbar-item')){
// if app is already in taskbar, cancel
if ($(`.taskbar-item[data-app="${$(ui.item).attr('data-app-name')}"]`).length !== 0) {
if($(`.taskbar-item[data-app="${$(ui.item).attr('data-app-name')}"]`).length !== 0){
$(this).sortable('cancel');
$('.taskbar .start-app').remove();
return;
}
let item = UITaskbarItem({
icon: $(ui.item).attr('data-app-icon'),
app: $(ui.item).attr('data-app-name'),
name: $(ui.item).attr('data-app-title'),
append_to_taskbar: false,
keep_in_taskbar: true,
onClick: function () {
onClick: function(){
let open_window_count = parseInt($(`.taskbar-item[data-app="${$(ui.item).attr('data-app-name')}"]`).attr('data-open-windows'));
if (open_window_count === 0) {
if(open_window_count === 0){
launch_app({
name: $(ui.item).attr('data-app-name'),
})
} else {
})
}else{
return false;
}
}
@@ -305,26 +297,11 @@ window.make_taskbar_sortable = function () {
window.update_taskbar();
}
// only proceed to update DB if the item sorted was a pinned item otherwise no point in updating the taskbar in DB
else if ($(ui.item).attr('data-keep-in-taskbar') === 'true') {
else if($(ui.item).attr('data-keep-in-taskbar') === 'true'){
window.update_taskbar();
}
},
});
}
window.taskbar_is_animation = function () {
const range = 300;
const maxScale = 1.8;
const items = $('.taskbar-item');
const taskbar = $('.taskbar')
taskbar.on('mousemove', function (e) {
const curve = UITaskBarCreateCurve(range, e.clientX, 1, maxScale);
console.log(curve, 'UITaskBarCreateCurve');
UITaskBarLayout(items, curve)
})
taskbar.on("mouseleave", function () {
UITaskBarLayout(items, () => 1);
})
}
export default UITaskbar;
src/gui/src/UI/UITaskbarItem.js
+43 -44
View File
@@ -7,12 +7,12 @@
* it under the terms of the GNU Affero General Public License as published
* by the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
@@ -45,20 +45,19 @@ function UITaskbarItem(options){
title = "${html_encode(options.name)}"
style= "${options.style ? html_encode(options.style) : ''}"
>`;
let icon = options.icon ? options.icon : window.icons['app.svg'];
if(options.app === 'explorer')
icon = window.icons['folders.svg'];
let icon = options.icon ? options.icon : window.icons['app.svg'];
if(options.app === 'explorer')
icon = window.icons['folders.svg'];
// taskbar icon
h += `<div class="taskbar-icon">`;
h += `<img src="${html_encode(icon)}" style="${options.group === 'apps' ? 'filter:none;' : ''}">`;
h += `</div>`;
// taskbar icon
h += `<div class="taskbar-icon">`;
h += `<img src="${html_encode(icon)}" style="${options.group === 'apps' ? 'filter:none;' : ''}">`;
h += `</div>`;
// active indicator
if(options.app !== 'apps')
h += `<span class="active-taskbar-indicator"></span>`;
// active indicator
if(options.app !== 'apps')
h += `<span class="active-taskbar-indicator"></span>`;
h += `</div>`;
// h += `<div class="taskbar-gap"></div>`
if(options.append_to_taskbar) {
if (options.before_trash){
@@ -86,10 +85,10 @@ function UITaskbarItem(options){
$(el_taskbar_item).on("click", function(e){
e.preventDefault();
e.stopPropagation();
// if this is for the launcher popover, and it's mobile, and has-open-popover, close the popover
if( $(el_taskbar_item).attr('data-name') === 'Start'
&& (isMobile.phone || isMobile.tablet) && $(el_taskbar_item).hasClass('has-open-popover')){
&& (isMobile.phone || isMobile.tablet) && $(el_taskbar_item).hasClass('has-open-popover')){
$('.popover').remove();
return;
}
@@ -100,15 +99,15 @@ function UITaskbarItem(options){
el_taskbar_item.querySelector("img").animate(
[
{ transform: 'translateY(0) scale(1)' },
{ transform: 'translateY(-5px) scale(1.2)' },
{ transform: 'translateY(0) scale(1)' }
{ transform: 'translateY(0) scale(1)' },
{ transform: 'translateY(-5px) scale(1.2)' },
{ transform: 'translateY(0) scale(1)' }
],
{
duration: 300,
easing: 'ease-out',
duration: 300,
easing: 'ease-out',
}
);
);
if(options.onClick === undefined || options.onClick(el_taskbar_item) === false){
// re-show each window in this app group
@@ -134,7 +133,7 @@ function UITaskbarItem(options){
return;
const menu_items =[];
const open_windows = parseInt($(el_taskbar_item).attr('data-open-windows'));
const open_windows = parseInt($(el_taskbar_item).attr('data-open-windows'));
// -------------------------------------------
// List of open windows belonging to this app
// -------------------------------------------
@@ -168,8 +167,8 @@ function UITaskbarItem(options){
}
})
}
//------------------------------------------
// Open Trash
//------------------------------------------
// Open Trash
//------------------------------------------
else if(options.app && options.app === 'trash'){
menu_items.push({
@@ -217,8 +216,8 @@ function UITaskbarItem(options){
}
})
}
//------------------------------------------
// Keep in Taskbar
//------------------------------------------
// Keep in Taskbar
//------------------------------------------
else if(!options.keep_in_taskbar){
menu_items.push({
@@ -229,7 +228,7 @@ function UITaskbarItem(options){
window.update_taskbar();
options.keep_in_taskbar = true;
}
})
})
}
if(open_windows > 0){
@@ -282,14 +281,14 @@ function UITaskbarItem(options){
my: "center bottom-20",
at: "center top",
using: function( position, feedback ) {
$( this ).css( position );
$( "<div>" )
.addClass( "arrow" )
.addClass( feedback.vertical )
.addClass( feedback.horizontal )
.appendTo( this );
$( this ).css( position );
$( "<div>" )
.addClass( "arrow" )
.addClass( feedback.vertical )
.addClass( feedback.horizontal )
.appendTo( this );
}
}
}
});
// --------------------------------------------------------
@@ -309,10 +308,10 @@ function UITaskbarItem(options){
return;
const items_to_move = []
// First item
items_to_move.push(ui.draggable);
items_to_move.push(ui.draggable);
// All subsequent items
const cloned_items = document.getElementsByClassName('item-selected-clone');
for(let i =0; i<cloned_items.length; i++){
@@ -328,8 +327,8 @@ function UITaskbarItem(options){
options.onItemsDrop(items_to_move);
return;
}
// --------------------------------------------------------
// If dropped on an app, open the app with the dropped item as an argument
// --------------------------------------------------------
// If dropped on an app, open the app with the dropped item as an argument
//--------------------------------------------------------
else if(options.app){
// an array that hold the items to sign
@@ -338,9 +337,9 @@ function UITaskbarItem(options){
// prepare items to sign
for(let i=0; i < items_to_move.length; i++){
items_to_sign.push({
name: $(items_to_move[i]).attr('data-name'),
uid: $(items_to_move[i]).attr('data-uid'),
action: 'write',
name: $(items_to_move[i]).attr('data-name'),
uid: $(items_to_move[i]).attr('data-uid'),
action: 'write',
path: $(items_to_move[i]).attr('data-path')
});
}
@@ -349,7 +348,7 @@ function UITaskbarItem(options){
for (let i = 0; i < items_to_sign.length; i++) {
const item = items_to_sign[i];
launch_app({
name: options.app,
name: options.app,
file_path: item.path,
// app_obj: open_item_meta.suggested_apps[0],
window_title: item.name,
@@ -409,7 +408,7 @@ function UITaskbarItem(options){
$('.ui-draggable-dragging .item-name, .item-selected-clone .item-name').css('opacity', 'initial')
$('.item-container').removeClass('item-container-transparent-border')
}
$('.item-container').droppable( 'enable' )
$('.item-container').droppable( 'enable' )
}
});
src/gui/src/css/style.css
+50 -72
View File
@@ -71,18 +71,12 @@
font-weight: 900;
}
@property --i {
syntax: '<number>';
initial-value: 1;
inherits: false;
}
* {
font-family: "Inter", "Helvetica Neue", HelveticaNeue, Helvetica, Arial, sans-serif;
user-select: none;
font-optical-sizing: auto;
font-style: normal;
font-variation-settings: "slnt" 0;
font-variation-settings: "slnt"0;
}
pre {
@@ -800,7 +794,7 @@ span.header-sort-icon img {
font-size: 13px;
}
.device-desktop .item-selected > .item-name, .device-desktop .window-body .item-selected > .item-name {
.device-desktop .item-selected>.item-name, .device-desktop .window-body .item-selected>.item-name {
background-color: #3b56ee;
color: white;
}
@@ -865,11 +859,11 @@ span.header-sort-icon img {
border-radius: calc(1.5 * var(--scale));
}
.window-menubar-item.active > span {
.window-menubar-item.active>span {
background-color: #e2e2e2;
}
.window-menubar-global .window-menubar-item.active > span {
.window-menubar-global .window-menubar-item.active>span {
background-color: #e4e4e43a;
}
@@ -980,9 +974,9 @@ span.header-sort-icon img {
overflow: hidden !important;
padding: 0;
background-color: hsla(var(--window-head-hue),
var(--window-head-saturation),
var(--window-head-lightness),
calc(0.5 + 0.5 * var(--window-head-alpha)));
var(--window-head-saturation),
var(--window-head-lightness),
calc(0.5 + 0.5 * var(--window-head-alpha)));
filter: grayscale(80%);
box-shadow: inset 0px -4px 5px -7px rgb(0 0 0 / 64%);
display: flex;
@@ -1183,9 +1177,9 @@ span.header-sort-icon img {
padding: 15px 10px;
box-sizing: border-box;
background-color: hsla(var(--window-sidebar-hue),
var(--window-sidebar-saturation),
var(--window-sidebar-lightness),
calc(0.5 + 0.5 * var(--window-sidebar-alpha)));
var(--window-sidebar-saturation),
var(--window-sidebar-lightness),
calc(0.5 + 0.5*var(--window-sidebar-alpha)));
overflow-y: scroll;
margin-top: 1px;
box-shadow: inset -4px 0 8px -8px rgba(0, 0, 0, 0.3);
@@ -1348,17 +1342,15 @@ span.header-sort-icon img {
.window-body-app {
height: calc(100% - 30px);
}
.window-with-menubar .window-body-app {
height: calc(100% - 65px);
}
.fullpage-mode.device-phone .window-body-app {
height: calc(100%);
}
.fullpage-mode.device-desktop .window-body-app {
height: calc(100%);
height: calc(100% );
}
.window-filedialog-prompt {
@@ -1411,7 +1403,7 @@ span.header-sort-icon img {
opacity: 1;
}
.window-action-btn > img {
.window-action-btn>img {
width: 18px;
margin-top: 5px;
margin-right: 4px;
@@ -1425,11 +1417,11 @@ span.header-sort-icon img {
filter: var(--primary-color-icon);
}
.window-action-btn:hover > img {
.window-action-btn:hover>img {
opacity: 1;
}
.window-scale-btn > img {
.window-scale-btn>img {
width: 15px;
height: 15px;
margin-top: 7px
@@ -1470,7 +1462,7 @@ span.header-sort-icon img {
cursor: nwse-resize;
}
.window > .ui-resizable-nw, .window > .ui-resizable-ne, .window > .ui-resizable-se, .window > .ui-resizable-sw {
.window>.ui-resizable-nw, .window>.ui-resizable-ne, .window>.ui-resizable-se, .window>.ui-resizable-sw {
width: 15px;
height: 15px;
z-index: 95 !important;
@@ -1605,7 +1597,7 @@ span.header-sort-icon img {
cursor: default !important;
}
.context-menu .context-menu-divider > hr {
.context-menu .context-menu-divider>hr {
margin-top: 0;
margin-bottom: 0;
border-bottom: none;
@@ -1874,7 +1866,6 @@ label {
background-color: rgb(255 255 255 / 15%);
border-radius: 3px;
}
/***************************************************/
.login-error-msg, .signup-error-msg, .publish-website-error-msg, .form-error-msg {
@@ -2327,6 +2318,7 @@ label {
.login-c2a-session-list:hover, .signup-c2a-session-list:hover {
text-decoration: underline;
;
}
/*****************************************************
@@ -2339,13 +2331,13 @@ label {
left: 0;
width: 100%;
background-color: hsla(var(--taskbar-hue),
var(--taskbar-saturation),
var(--taskbar-lightness),
calc(0.5 + 0.5 * var(--taskbar-alpha)));
var(--taskbar-saturation),
var(--taskbar-lightness),
calc(0.5 + 0.5*var(--taskbar-alpha)));
display: flex;
justify-content: center;
z-index: 99999;
/*overflow: hidden !important;*/
overflow: hidden !important;
height: 50px;
border-radius: 10px;
@@ -2357,21 +2349,12 @@ label {
transform: translateX(-50%);
/* that sweet sweet subtle shadow */
box-shadow: inset 0 0 0 0.5px rgba(255, 255, 255, 0.2),
0 0 0 0.5px rgba(0, 0, 0, 0.2),
0 4px 16px rgba(0, 0, 0, 0.2);
box-shadow:
inset 0 0 0 0.5px rgba(255, 255, 255, 0.2),
0 0 0 0.5px rgba(0, 0, 0, 0.2),
0 4px 16px rgba(0, 0, 0, 0.2);
}
.taskbar .taskbar-menu {
display: flex;
align-items: end;
}
/*.taskbar .taskbar-gap {*/
/* width: calc(var(--i, 1) * 10px);*/
/* height: 40px;*/
/*}*/
.taskbar .taskbar-item {
float: left;
position: relative;
@@ -2380,13 +2363,10 @@ label {
display: none;
}
.taskbar .taskbar-item-sortable-placeholder, .taskbar .taskbar-menu .taskbar-item {
/*width: 40px;*/
.taskbar .taskbar-item-sortable-placeholder, .taskbar .taskbar-item {
width: 40px;
height: 40px;
/*padding: 6px 5px 10px 5px;*/
width: calc(var(--i, 1) * 40px);
/*height: calc(var(--i, 1) * 40px);*/
padding: 6px 5px calc(var(--i, 1) * 20px - 10px);
padding: 6px 5px 10px 5px;
}
.taskbar .taskbar-item .taskbar-icon {
@@ -2498,9 +2478,9 @@ label {
@supports ((backdrop-filter: blur())) {
.taskbar {
background-color: hsla(var(--taskbar-hue),
var(--taskbar-saturation),
var(--taskbar-lightness),
var(--taskbar-alpha));
var(--taskbar-saturation),
var(--taskbar-lightness),
var(--taskbar-alpha));
backdrop-filter: blur(10px);
}
@@ -3061,7 +3041,7 @@ fieldset[name=number-code] {
}
70% {
-webkit-box-shadow: 0 0 0px rgba(204, 169, 44, 0);
-webkit-box-shadow: 0 0 0 px rgba(204, 169, 44, 0);
}
100% {
@@ -3169,17 +3149,17 @@ fieldset[name=number-code] {
@supports ((backdrop-filter: blur())) {
.window-head {
background-color: hsla(var(--window-head-hue),
var(--window-head-saturation),
var(--window-head-lightness),
var(--window-head-alpha));
var(--window-head-saturation),
var(--window-head-lightness),
var(--window-head-alpha));
backdrop-filter: blur(10px);
}
.notification {
background-color: hsla(var(--window-head-hue),
var(--window-head-saturation),
var(--window-head-lightness),
var(--window-head-alpha));
var(--window-head-saturation),
var(--window-head-lightness),
var(--window-head-alpha));
backdrop-filter: blur(10px);
}
@@ -3191,9 +3171,9 @@ fieldset[name=number-code] {
.window-sidebar {
/* background-color: var(--puter-window-background); */
background-color: hsla(var(--window-sidebar-hue),
var(--window-sidebar-saturation),
var(--window-sidebar-lightness),
var(--window-sidebar-alpha));
var(--window-sidebar-saturation),
var(--window-sidebar-lightness),
var(--window-sidebar-alpha));
backdrop-filter: blur(10px);
}
@@ -3312,8 +3292,7 @@ fieldset[name=number-code] {
opacity: 1;
}
.launch-app-selected {
}
.launch-app-selected {}
.website-badge-popover-title {
@@ -3594,7 +3573,7 @@ fieldset[name=number-code] {
color: #000;
}
/**
/**
* ------------------------------------
* Button
* ------------------------------------
@@ -3779,7 +3758,7 @@ fieldset[name=number-code] {
text-decoration: underline;
}
@media (max-width: 480px) {
@media (max-width:480px) {
.puter-auth-dialog-content {
padding: 50px 20px;
}
@@ -4791,7 +4770,7 @@ fieldset[name=number-code] {
}
/* Hide desktop icons when the desktop-icons-hidden class is applied */
.desktop.item-container.desktop-icons-hidden > .item {
.desktop.item-container.desktop-icons-hidden>.item {
visibility: hidden;
}
@@ -4804,11 +4783,10 @@ fieldset[name=number-code] {
-webkit-font-smoothing: antialiased;
color: #5f626d;
}
.progress-report {
font-size: 15px;
overflow: hidden;
flex-grow: 1;
text-overflow: ellipsis;
.progress-report{
font-size:15px;
overflow: hidden;
flex-grow: 1;
text-overflow: ellipsis;
white-space: nowrap;
}