Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix/various visual bugs #2

Merged
merged 9 commits into from
Jul 8, 2024
Merged

Fix/various visual bugs #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
a272f94
fix: kinds label
AnthonyMarin Jul 8, 2024
49bdfba
fix: opacity/zindex issues
AnthonyMarin Jul 8, 2024
03f874d
revert: accidental commit
AnthonyMarin Jul 8, 2024
806e2e5
change name to strict
AnthonyMarin Jul 8, 2024
460cf23
update description
AnthonyMarin Jul 8, 2024
40b92e6
style: remove gap
AnthonyMarin Jul 8, 2024
a992139
style: relay-settings fonts and grids
AnthonyMarin Jul 8, 2024
b9ba1cb
style: removed word
AnthonyMarin Jul 8, 2024
07518ad
style:font-size labels
AnthonyMarin Jul 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 2 additions & 5 deletions public/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,14 +7,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta
name="description"
content="H.O.R.N.E.T Storage Nostr Relay💾 Powered by Scionic Merkle Trees and Blossom🎄🌸"
content="H.O.R.N.E.T Storage Nostr Relay💾 Powered by Blossom Blobs and Scionic Merkle Trees🎄🌸"
/>
<meta name="keywords" content="nostr, multimedia, storage, relay, secure, responsive" />
<meta itemprop="title" content="H.O.R.N.E.T Storage" />
<meta
itemprop="description"
content="H.O.R.N.E.T Storage Nostr Relay💾 Powered by Scionic Merkle Trees and Blossom🎄🌸"
/>

<link
rel="stylesheet"
href="https://unpkg.com/[email protected]/dist/leaflet.css"
Expand Down
1 change: 1 addition & 0 deletions src/components/common/Overlay/Overlay.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ export const Overlay = styled.div<OverlayProps>`
${(props) =>
props.show &&
css`
z-index: 2;
backdrop-filter: blur(6px);
width: 100vw;
height: 100vh;
Expand Down
1 change: 1 addition & 0 deletions src/components/layouts/main/sider/SiderMenu/SiderMenu.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ const SiderMenu: React.FC<SiderContentProps> = ({ setCollapsed }) => {

return (
<S.Menu
style={{ zIndex: 3 }}
mode="inline"
defaultSelectedKeys={defaultSelectedKeys}
defaultOpenKeys={defaultOpenKeys}
Expand Down
1 change: 1 addition & 0 deletions src/components/tables/editableTable/EditableTable.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,7 @@ const EditableTable: React.FC = () => {
width: '25%',
editable: false,
sorter: true,
zIndex: 0,
sortOrder: sortField === 'kindName' ? sortOrder : undefined,
},
{
Expand Down
1 change: 1 addition & 0 deletions src/pages/DashboardPages/DashboardPage.styles.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ export const RightSideCol = styled(BaseCol)`
height: calc(100vh - ${LAYOUT.desktop.headerHeight});
background-color: var(--sider-background-color);
overflow-y: auto;
z-index: 5;
&::-webkit-scrollbar {
width: 6px;
display: none; // Hide scrollbar by default
Expand Down
73 changes: 45 additions & 28 deletions src/pages/RelaySettingsPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -412,7 +412,7 @@ const RelaySettingsPage: React.FC = () => {
<S.LabelSpan>{t('common.serverSetting')}</S.LabelSpan>
<S.LargeSwitch
className="modeSwitch"
checkedChildren="Smart"
checkedChildren="Strict"
unCheckedChildren="Unlimited"
checked={settings.mode === 'smart'}
onChange={(e) => handleModeChange(e)}
Expand All @@ -423,13 +423,16 @@ const RelaySettingsPage: React.FC = () => {
<S.LabelSpan style={{ width: '7rem' }}>{t('common.protocolSetting')}</S.LabelSpan>
<Checkbox.Group
options={[
{ label: 'WebSocket', value: 'WebSocket' },
{ label: 'Libp2p QUIC', value: 'QUIC' },
{ label: 'WebSocket', value: 'WebSocket', style: { fontSize: '.85rem' } },
{ label: 'Libp2p QUIC', value: 'QUIC', style: { fontSize: '.85rem' } },
]}
value={settings.protocol}
className="custom-checkbox-group"
onChange={(checkedValues) => handleProtocolChange(checkedValues as string[])}
style={{ display: 'flex', flexDirection: 'row', gap: '1rem', justifyContent: 'start' }}
style={{
display: 'grid',
gridTemplateColumns: '10rem auto', // Adjust the width as needed
}}
/>
</div>
<div style={{ borderTop: '1px solid #ccc', margin: '1rem 0' }}></div>
Expand All @@ -438,18 +441,21 @@ const RelaySettingsPage: React.FC = () => {
<Checkbox.Group
className="custom-checkbox-group"
options={[
{ label: 'Unchunked', value: 'unchunked' },
{ label: 'Chunked', value: 'chunked' },
{ label: `Unchunked \u{1F338}`, value: 'unchunked', style: { fontSize: '.85rem' } },
{ label: `Chunked \u{1F333}`, value: 'chunked', style: { fontSize: '.85rem' } },
]}
value={settings.chunked}
onChange={(checkedValues) => handleChunkedChange(checkedValues as string[])}
style={{ display: 'flex', flexDirection: 'row', gap: '1rem', justifyContent: 'start' }}
style={{
display: 'grid',
gridTemplateColumns: '10rem auto', // Adjust the width as needed
}}
/>
</div>
{settings.chunked.includes('unchunked') && (
<>
<div style={{ marginTop: '1rem' }}>
<strong>Specify Max Unchunked File Size:</strong>
<strong>Max Unchunked File Size:</strong>
<S.Space />
</div>
<div style={{ display: 'flex', alignItems: 'center', gap: '1rem', marginTop: '0.5rem' }}>
Expand Down Expand Up @@ -477,7 +483,7 @@ const RelaySettingsPage: React.FC = () => {
{settings.chunked.includes('chunked') && (
<>
<div style={{ marginTop: '1rem' }}>
<strong>Specify Max Chunked File Size:</strong>
<strong>Max Chunked File Size:</strong>
<S.Space />
</div>
<div style={{ display: 'flex', alignItems: 'center', gap: '1rem', marginTop: '0.5rem' }}>
Expand Down Expand Up @@ -512,7 +518,7 @@ const RelaySettingsPage: React.FC = () => {
<BaseCol xs={24}>
<Collapse style={{ padding: '1rem 0 1rem 0', margin: '0 0 1rem 0' }} bordered={false}>
<StyledPanel
header={settings.mode === 'unlimited' ? `Blacklisted Kind Numbers` : 'Kinds'}
header={settings.mode === 'unlimited' ? `Blacklisted Kind Numbers` : 'Kind Numbers'}
key="notes"
className="centered-header"
>
Expand Down Expand Up @@ -729,7 +735,7 @@ const RelaySettingsPage: React.FC = () => {
/>
</div>
<BaseCheckbox.Group
className={`custom-checkbox-group grid-checkbox-group large-label ${
className={`custom-checkbox-group grid-checkbox-group ${
settings.mode === 'unlimited' ? 'blacklist-mode-active' : ''
}`}
options={audioFormatOptions}
Expand Down Expand Up @@ -782,7 +788,7 @@ const RelaySettingsPage: React.FC = () => {
<S.LabelSpan>{t('common.serverSetting')}</S.LabelSpan>
<S.LargeSwitch
className="modeSwitch"
checkedChildren="Smart"
checkedChildren="Strict"
unCheckedChildren="Unlimited"
checked={settings.mode === 'smart'}
onChange={(e) => handleModeChange(e)}
Expand All @@ -794,36 +800,49 @@ const RelaySettingsPage: React.FC = () => {
<Checkbox.Group
className="custom-checkbox-group"
options={[
{ label: 'WebSocket', value: 'WebSocket' },
{ label: 'Libp2p QUIC', value: 'QUIC' },
{ label: 'WebSocket', value: 'WebSocket', style: { fontSize: '.8rem' } },
{ label: 'Libp2p QUIC', value: 'QUIC', style: { fontSize: '.8rem' } },
]}
value={settings.protocol}
onChange={(checkedValues) => handleProtocolChange(checkedValues as string[])}
style={{
display: 'flex',
flexDirection: 'row',
gap: '1rem',
display: 'grid',
gridTemplateColumns: '9rem auto',
paddingRight: '0',
justifyContent: 'start',
fontSize: 'small',
}}
/>
</div>
<div style={{ borderTop: '1px solid #ccc', margin: '1rem 0' }}></div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<S.LabelSpan style={{ marginBottom: '0.5rem' }}>{t('common.chunkedSetting')}</S.LabelSpan>
<S.LabelSpan style={{ marginBottom: '0.5rem', fontSize: '1.5rem' }}>
{t('common.chunkedSetting')}
</S.LabelSpan>
<Checkbox.Group
className="custom-checkbox-group"
options={[
{ label: 'Unchunked', value: 'unchunked' },
{ label: 'Chunked', value: 'chunked' },
{
label: `Unchunked \u{1F338}`,
value: 'unchunked',
style: { fontSize: '.8rem' },
},
{ label: `Chunked \u{1F333}`, value: 'chunked', style: { fontSize: '.8rem' } },
]}
value={settings.chunked}
onChange={(checkedValues) => handleChunkedChange(checkedValues as string[])}
style={{ display: 'flex', flexDirection: 'row', gap: '1rem', justifyContent: 'start' }}
style={{
display: 'grid',
gridTemplateColumns: '9rem auto',
paddingRight: '0',
justifyContent: 'start',
fontSize: 'small',
}}
/>
{settings.chunked.includes('unchunked') && (
<>
<div style={{ marginTop: '1rem' }}>
<strong>Specify Max Unchunked File Size:</strong>
<strong>Max Unchunked File Size:</strong>
<S.Space />
</div>
<div style={{ display: 'flex', alignItems: 'center', gap: '1rem', marginTop: '0.5rem' }}>
Expand Down Expand Up @@ -851,7 +870,7 @@ const RelaySettingsPage: React.FC = () => {
{settings.chunked.includes('chunked') && (
<>
<div style={{ marginTop: '1rem' }}>
<strong>Specify Max Chunked File Size:</strong>
<strong>Max Chunked File Size:</strong>
<S.Space />
</div>
<div style={{ display: 'flex', alignItems: 'center', gap: '1rem', marginTop: '0.5rem' }}>
Expand Down Expand Up @@ -881,9 +900,7 @@ const RelaySettingsPage: React.FC = () => {
</S.Card>
</StyledPanel>
</Collapse>
</BaseCol>

<BaseCol span={24}>
<Collapse style={{ padding: '1rem 0 1rem 0', margin: '0 0 1rem 0' }} bordered={false}>
<StyledPanel
header={settings.mode === 'unlimited' ? `Blacklisted Kind Numbers` : 'Kind Numbers'}
Expand Down Expand Up @@ -1011,7 +1028,7 @@ const RelaySettingsPage: React.FC = () => {

<BaseCheckbox.Group
style={{ paddingLeft: '1rem' }}
className={`custom-checkbox-group grid-checkbox-group ${
className={`custom-checkbox-group grid-mobile-checkbox-group ${
settings.mode === 'unlimited' ? 'blacklist-mode-active' : ''
}`}
options={photoFormatOptions}
Expand Down Expand Up @@ -1039,7 +1056,7 @@ const RelaySettingsPage: React.FC = () => {

<BaseCheckbox.Group
style={{ paddingLeft: '1rem' }}
className={`custom-checkbox-group grid-checkbox-group ${
className={`custom-checkbox-group grid-mobile-checkbox-group ${
settings.mode === 'unlimited' ? 'blacklist-mode-active' : ''
}`}
options={videoFormatOptions}
Expand Down Expand Up @@ -1095,7 +1112,7 @@ const RelaySettingsPage: React.FC = () => {
</div>
<BaseCheckbox.Group
style={{ paddingLeft: '1rem' }}
className={`custom-checkbox-group grid-checkbox-group large-label ${
className={`custom-checkbox-group grid-mobile-checkbox-group ${
settings.mode === 'unlimited' ? 'blacklist-mode-active' : ''
}`}
options={audioFormatOptions}
Expand Down
11 changes: 10 additions & 1 deletion src/styles/GlobalStyle.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -255,9 +255,15 @@ export default createGlobalStyle`
.grid-checkbox-group {
width: 100%;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
gap: 1.8rem;
}
.grid-mobile-checkbox-group{
display: grid;
grid-template-columns: 9rem auto;
gap: 1.2rem;

}

.grid-checkbox-group.large-label {
grid-template-columns: repeat(auto-fill, minmax(195px, 1fr));
Expand All @@ -279,4 +285,7 @@ export default createGlobalStyle`
.custom-dropdown .ant-select-arrow{
color: var(--text-nft-light-color)
}
.custom-tooltip-class .ant-tooltip-content .ant-tooltip-inner {
background-color: rgba(0, 0, 0, 1);
}
`;
Loading