Skip to content

Commit 8105707

Browse files
velzievelzie
committed
[frontend] bump dreamland
1 parent 8ad0e7a commit 8105707

File tree

9 files changed

+182
-182
lines changed

9 files changed

+182
-182
lines changed

‎dreamlandjs‎

‎frontend/src/browser.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,6 @@ export class Browser extends StatefulClass {
8787
canGoBack={use(this.activetab.canGoBack)}
8888
canGoForwards={use(this.activetab.canGoForward)}
8989
goBack={() => {
90-
console.log("WHAT");
9190
this.activetab.history.go(-1);
9291
}}
9392
goForwards={() => {

‎frontend/src/components/IconButton.tsx‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { IconifyIcon } from "@iconify/types";
2-
import type { Component } from "dreamland/core";
2+
import { css, type Component } from "dreamland/core";
33
import { Icon } from "./Icon";
44

55
export const IconButton: Component<{
@@ -18,18 +18,18 @@ export const IconButton: Component<{
1818
</button>
1919
);
2020
};
21-
IconButton.css = `
22-
:scope {
23-
padding: 0.4em;
24-
display: flex;
25-
outline: none;
26-
border: none;
27-
font-size: 1.25em;
28-
background: none;
29-
color: grey;
30-
}
31-
:scope.active {
32-
cursor: pointer;
33-
color: var(--aboutbrowser-active-tab-fg);
34-
}
21+
IconButton.style = css`
22+
:scope {
23+
padding: 0.4em;
24+
display: flex;
25+
outline: none;
26+
border: none;
27+
font-size: 1.25em;
28+
background: none;
29+
color: grey;
30+
}
31+
:scope.active {
32+
cursor: pointer;
33+
color: var(--aboutbrowser-active-tab-fg);
34+
}
3535
`;

‎frontend/src/components/Menu.tsx‎

Lines changed: 25 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { Component, DLElement } from "dreamland/core";
1+
import { css, type Component, type DLElement } from "dreamland/core";
22
import { browser } from "../main";
33

44
export const Menu: Component<{
@@ -43,30 +43,30 @@ export const Menu: Component<{
4343
</div>
4444
);
4545
};
46-
Menu.css = `
47-
:scope {
48-
position: absolute;
49-
top: var(--y);
50-
left: var(--x);
51-
background: white;
52-
border: 1px solid #ccc;
53-
border-radius: 4px;
54-
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
55-
z-index: 1000;
56-
display: flex;
57-
flex-direction: column;
58-
min-width: 10em;
59-
}
60-
button {
61-
background: none;
62-
border: none;
63-
font-size: 0.8em;
64-
padding: 1em;
65-
text-align: left;
66-
}
67-
button:hover {
68-
background: #f0f0f0;
69-
}
46+
Menu.style = css`
47+
:scope {
48+
position: absolute;
49+
top: var(--y);
50+
left: var(--x);
51+
background: white;
52+
border: 1px solid #ccc;
53+
border-radius: 4px;
54+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
55+
z-index: 1000;
56+
display: flex;
57+
flex-direction: column;
58+
min-width: 10em;
59+
}
60+
button {
61+
background: none;
62+
border: none;
63+
font-size: 0.8em;
64+
padding: 1em;
65+
text-align: left;
66+
}
67+
button:hover {
68+
background: #f0f0f0;
69+
}
7070
`;
7171

7272
let activeMenu: DLElement<typeof Menu> | null = null;

‎frontend/src/components/Omnibox.tsx‎

Lines changed: 74 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { Component } from "dreamland/core";
1+
import { css, type Component } from "dreamland/core";
22
import iconBack from "@ktibow/iconset-ion/arrow-back";
33
import iconForwards from "@ktibow/iconset-ion/arrow-forward";
44
import iconRefresh from "@ktibow/iconset-ion/refresh";
@@ -14,10 +14,10 @@ import { IconButton } from "./IconButton";
1414
export const Spacer: Component = function (cx) {
1515
return <div></div>;
1616
};
17-
Spacer.css = `
18-
:scope {
19-
width: 2em;
20-
}
17+
Spacer.style = css`
18+
:scope {
19+
width: 2em;
20+
}
2121
`;
2222

2323
export const UrlInput: Component<
@@ -164,70 +164,70 @@ export const UrlInput: Component<
164164
</div>
165165
);
166166
};
167-
UrlInput.css = `
168-
:scope {
169-
position: relative;
170-
flex: 1;
171-
display: flex;
172-
height: 100%;
173-
}
174-
.overflow {
175-
position: absolute;
176-
display: none;
177-
background: var(--aboutbrowser-omnibox-bg);
178-
width: 100%;
179-
border-radius: 4px;
180-
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
181-
}
182-
.overflow .spacer {
183-
display: block;
184-
height: 2.5em;
185-
}
186-
.overflowitem {
187-
display: flex;
188-
align-items: center;
189-
height: 2.5em;
190-
cursor: pointer;
191-
}
192-
.overflowitem.focused {
193-
background: blue;
194-
}
195-
196-
.overflow.active {
197-
display: block;
198-
}
199-
.inactivebar {
200-
background: white;
201-
width: 100%;
202-
border: none;
203-
outline: none;
204-
border-radius: 4px;
205-
margin: 0.25em;
206-
}
207-
input, .inactiveurl {
208-
background: none;
209-
border: none;
210-
outline: none;
167+
UrlInput.style = css`
168+
:scope {
169+
position: relative;
170+
flex: 1;
171+
display: flex;
172+
height: 100%;
173+
}
174+
.overflow {
175+
position: absolute;
176+
display: none;
177+
background: var(--aboutbrowser-omnibox-bg);
178+
width: 100%;
179+
border-radius: 4px;
180+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
181+
}
182+
.overflow .spacer {
183+
display: block;
184+
height: 2.5em;
185+
}
186+
.overflowitem {
187+
display: flex;
188+
align-items: center;
189+
height: 2.5em;
190+
cursor: pointer;
191+
}
192+
.overflowitem.focused {
193+
background: blue;
194+
}
211195
212-
font-size: 1.00em;
196+
.overflow.active {
197+
display: block;
198+
}
199+
.inactivebar {
200+
background: white;
201+
width: 100%;
202+
border: none;
203+
outline: none;
204+
border-radius: 4px;
205+
margin: 0.25em;
206+
}
207+
input,
208+
.inactiveurl {
209+
background: none;
210+
border: none;
211+
outline: none;
213212
214-
height: 100%;
215-
width: 100%;
216-
}
217-
.inactiveurl {
218-
display: flex;
219-
align-items: center;
220-
}
213+
font-size: 1em;
221214
215+
height: 100%;
216+
width: 100%;
217+
}
218+
.inactiveurl {
219+
display: flex;
220+
align-items: center;
221+
}
222222
223-
.realbar {
224-
position: absolute;
225-
width: 100%;
226-
height: 100%;
227-
display: flex;
228-
z-index: 1;
229-
align-items: center;
230-
}
223+
.realbar {
224+
position: absolute;
225+
width: 100%;
226+
height: 100%;
227+
display: flex;
228+
z-index: 1;
229+
align-items: center;
230+
}
231231
`;
232232

233233
export const Omnibox: Component<{
@@ -270,13 +270,13 @@ export const Omnibox: Component<{
270270
</div>
271271
);
272272
};
273-
Omnibox.css = `
274-
:scope {
275-
background: var(--aboutbrowser-omnibox-bg);
276-
display: flex;
277-
padding: 0px 7px 0px 7px;
278-
height: 2.5em;
279-
align-items: center;
280-
position: relative;
281-
}
273+
Omnibox.style = css`
274+
:scope {
275+
background: var(--aboutbrowser-omnibox-bg);
276+
display: flex;
277+
padding: 0px 7px 0px 7px;
278+
height: 2.5em;
279+
align-items: center;
280+
position: relative;
281+
}
282282
`;

‎frontend/src/components/Shell.tsx‎

Lines changed: 25 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { Component } from "dreamland/core";
1+
import { css, type Component } from "dreamland/core";
22
import { browser } from "../main";
33
import { popTab, pushTab } from "../browser";
44
import type { Tab } from "../Tab";
@@ -31,28 +31,28 @@ export const Shell: Component<{
3131

3232
return <div class:unfocus={use(browser.unfocusframes)}></div>;
3333
};
34-
Shell.css = `
35-
:scope {
36-
flex: 1;
37-
}
38-
.unfocus {
39-
pointer-events: none;
40-
}
41-
.container {
42-
width: 100%;
43-
height: 100%;
44-
display: none;
45-
}
46-
.container.active {
47-
display: block;
48-
}
49-
iframe {
50-
width: 100%;
51-
height: 100%;
52-
border: none;
53-
display: none;
54-
}
55-
.showframe iframe{
56-
display: block;
57-
}
34+
Shell.style = css`
35+
:scope {
36+
flex: 1;
37+
}
38+
.unfocus {
39+
pointer-events: none;
40+
}
41+
.container {
42+
width: 100%;
43+
height: 100%;
44+
display: none;
45+
}
46+
.container.active {
47+
display: block;
48+
}
49+
iframe {
50+
width: 100%;
51+
height: 100%;
52+
border: none;
53+
display: none;
54+
}
55+
.showframe iframe {
56+
display: block;
57+
}
5858
`;

‎frontend/src/components/TabStrip.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import iconClose from "@ktibow/iconset-ion/close";
22
import iconAdd from "@ktibow/iconset-ion/add";
33
import {
44
createState,
5+
css,
56
type Component,
67
type ComponentInstance,
78
type Stateful,
@@ -66,7 +67,7 @@ export const DragTab: Component<{
6667
</div>
6768
);
6869
};
69-
DragTab.css = `
70+
DragTab.style = css`
7071
:scope {
7172
display: inline-block;
7273
user-select: none;
@@ -377,7 +378,7 @@ export const Tabs: Component<
377378
</div>
378379
);
379380
};
380-
Tabs.css = `
381+
Tabs.style = css`
381382
:scope {
382383
background: var(--aboutbrowser-frame-bg);
383384
padding: 6px 12px;

0 commit comments

Comments
 (0)