uqbar-dao/nectar
1
1
Fork 0
mirror of https://github.com/uqbar-dao/nectar.git synced 2024-11-30 21:26:27 +03:00
Code Issues Packages Projects Releases Wiki Activity

add screensize meta tags for kinoupdates and appstore widgets; remove quickhide widget button; resize mobile modals

Browse Source
This commit is contained in:
Tobias Merkle 2024-06-20 14:09:15 -04:00
parent 605bc565eb
commit b05a0e1640
11 changed files with 49 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
kinode/packages/app_store/app_store/src/http_api.rs
View File

@ -60,6 +60,7 @@ pub fn init_frontend(our: &Address) {
fn make_widget() -> String {
return r#"<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
box-sizing: border-box;
@ -84,7 +85,7 @@ fn make_widget() -> String {
gap: 0.5rem;
align-items: center;
backdrop-filter: saturate(1.25);
border-radius: 0.75rem;
border-radius: 1rem;
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
height: 100vh;
width: 100vw;
@ -98,7 +99,7 @@ fn make_widget() -> String {
display: flex;
flex-grow: 1;
align-items: stretch;
border-radius: 0.75rem;
border-radius: 0.5rem;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
background-color: rgba(255, 255, 255, 0.1);
cursor: pointer;

16
kinode/packages/app_store/pkg/ui/assets/index--ISnU8mD.js → kinode/packages/app_store/pkg/ui/assets/index-B8jjW9yS.js
View File

File diff suppressed because one or more lines are too long

1
kinode/packages/app_store/pkg/ui/assets/index-x8quY1Q7.css
View File

File diff suppressed because one or more lines are too long

1
kinode/packages/app_store/pkg/ui/assets/index-zU7UyELC.css Normal file
View File

File diff suppressed because one or more lines are too long

4
kinode/packages/app_store/pkg/ui/index.html
View File

@ -14,8 +14,8 @@
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport"
content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover" />
<script type="module" crossorigin src="/main:app_store:sys/assets/index--ISnU8mD.js"></script>
<link rel="stylesheet" crossorigin href="/main:app_store:sys/assets/index-x8quY1Q7.css">
<script type="module" crossorigin src="/main:app_store:sys/assets/index-B8jjW9yS.js"></script>
<link rel="stylesheet" crossorigin href="/main:app_store:sys/assets/index-zU7UyELC.css">
</head>
<body>

12
kinode/packages/app_store/ui/src/components/Modal.tsx
View File

@ -1,6 +1,7 @@
import classNames from 'classnames'
import React, { MouseEvent } from 'react'
import { FaX } from 'react-icons/fa6'
import { isMobileCheck } from '../utils/dimensions'
export interface ModalProps extends React.HTMLAttributes<HTMLDivElement> {
show: boolean
@ -25,10 +26,17 @@ const Modal: React.FC<ModalProps> = ({
return null
}
const isMobile = isMobileCheck()
return (
<div
className={classNames(`bg-black/25 backdrop-blur-lg fixed top-0 bottom-0 left-0 right-0 flex flex-col c z-30 min-h-[10em] min-w-[30em]`,
{ show }
className={classNames(`bg-black/25 backdrop-blur-lg fixed top-0 bottom-0 left-0 right-0 flex flex-col c z-30 min-h-[10em] isMobile-${isMobile}`,
{
isMobile,
show,
'min-w-[30em]': !isMobile,
'min-w-[75vw]': isMobile,
}
)}
onClick={hide}
>

42
kinode/packages/homepage/pkg/ui/assets/index-BLQ3kP3C.js → kinode/packages/homepage/pkg/ui/assets/index-DRR7woJo.js
View File

File diff suppressed because one or more lines are too long

2
kinode/packages/homepage/pkg/ui/index.html
View File

@ -9,7 +9,7 @@
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport"
content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover" />
<script type="module" crossorigin src="/assets/index-BLQ3kP3C.js"></script>
<script type="module" crossorigin src="/assets/index-DRR7woJo.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-BS5LP50I.css">
</head>

2
kinode/packages/homepage/ui/dist/index.html vendored
View File

@ -9,7 +9,7 @@
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport"
content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover" />
<script type="module" crossorigin src="/assets/index-BLQ3kP3C.js"></script>
<script type="module" crossorigin src="/assets/index-DRR7woJo.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-BS5LP50I.css">
</head>

12
kinode/packages/homepage/ui/src/components/Widget.tsx
View File

@ -1,5 +1,4 @@
import classNames from "classnames"
import { FaEye, FaEyeSlash } from "react-icons/fa6"
import { useEffect, useState } from "react"
import usePersistentStore from "../store/persistentStore"
import useHomepageStore from "../store/homepageStore"
@ -13,8 +12,7 @@ interface WidgetProps {
const Widget: React.FC<WidgetProps> = ({ package_name, widget, forceLarge }) => {
const { apps } = useHomepageStore()
const { widgetSettings, toggleWidgetVisibility } = usePersistentStore()
const [isHovered, setIsHovered] = useState(false)
const { widgetSettings } = usePersistentStore()
const isMobile = isMobileCheck()
const isLarge = forceLarge || widgetSettings[package_name]?.size === "large"
const isSmall = !widgetSettings[package_name]?.size || widgetSettings[package_name]?.size === "small"
@ -31,8 +29,6 @@ const Widget: React.FC<WidgetProps> = ({ package_name, widget, forceLarge }) =>
"max-w-1/4": isSmall && !tallScreen,
'w-full': isMobile
})}
onMouseEnter={() => setIsHovered(true)}
onMouseLeave={() => setIsHovered(false)}
>
<h6 className="flex-center my-2">
{apps.find(app => app.package_name === package_name)?.label || package_name}
@ -42,12 +38,6 @@ const Widget: React.FC<WidgetProps> = ({ package_name, widget, forceLarge }) =>
className="grow self-stretch"
data-widget-code={widget}
/>
{isHovered && <button
className="absolute top-0 left-0 icon"
onClick={() => toggleWidgetVisibility(package_name)}
>
{widgetSettings[package_name]?.hide ? <FaEye /> : <FaEyeSlash />}
</button>}
</div>
}

1
kinode/packages/kino_updates/widget/src/lib.rs
View File

@ -49,6 +49,7 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
return format!(
r#"<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {{
box-sizing: border-box;