urbit/shrub
1
1
Fork 0
mirror of https://github.com/urbit/shrub.git synced 2025-01-06 04:07:23 +03:00
Code Issues Packages Projects Releases Wiki Activity

linux-distro-ify

Browse Source
This commit is contained in:
Will Hanlen 2024-05-24 01:57:57 -05:00
parent ac61976231
commit 41ca7829d2
13 changed files with 596 additions and 319 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

124
pkg/arvo/app/neo.hoon
View File

@ -649,51 +649,58 @@
--
++ dove
|_ [here=pith:neo slot=@ud id=@da]
++ idt `tape`(zing (scan +:(scow %da id) (most dot (star ;~(less dot prn)))))
++ ha-wk
;div.hawk.fc.wf.hf
=id "hawk-slot-{<id>}"
=id "hawk-{idt}"
=hx-params "id,slot"
=hx-vals "\{\"id\": \"{<id>}\", \"slot\": \"{<slot>}\"}"
=morph-no-swap ""
;+ header
;+ raw
;+ rendered
==
++ has-app !=(~ (get:of-top here))
++ header
;header.b2.p1.frw.g1.ac
=id "hawk-header-{idt}"
=style "border: 2px solid var(--b2);"
;button.p1.hover.b2.br1
;button
=class "p1 hover b2 br1 bd0 {(trip ?:(has-app '' 'toggled'))}"
=onclick
"""
$(this).toggleClass('b3');
$(this).toggleClass('toggled');
$(this).closest('.hawk').find('.raw').toggleClass('hidden');
$(this).closest('.hawk').find('.rendered').toggleClass('hidden');
$(this).closest('header').children('.hawk-tog').toggleClass('hidden');
"""
;+ outline:feather-icons
==
;a.p-1.hover.b2.br1.s0.hawk-tog.fc.ac.jc
=style "height: 2rem;"
=href "/neo/hawk"
; /
==
;*
=< p
%^ spin here
1
|= [=iota a=@]
:_ +(a)
;div.hawk-tog.fr.ac.g1
;div
=class "hawk-tog frw g1 ac grow {(trip ?:(has-app '' 'hidden'))}"
;a.p-1.hover.b2.br1.s0.fc.ac.jc
=style "height: 2rem;"
;div.f4.s-1: >
;a.hover.b2.br1.p1.s0
=hx-vals "\{\"id\": \"{<id>}\", \"slot\": \"{<slot>}\"}"
=href "/neo/hawk{(en-tape:pith:neo (scag a here))}"
; {(trip ?@(iota iota (scot iota)))}
==
=href "/neo/hawk"
; /
==
;div.hawk-tog.grow;
;form.hawk-tog.hidden.grow.fr.ac.m0.relative
;*
=< p
%^ spin here
1
|= [=iota a=@]
:_ +(a)
;div.fr.ac.g1
=style "height: 2rem;"
;div.f4.s-1: >
;a.hover.b2.br1.p1.s0
=hx-vals "\{\"id\": \"{<id>}\", \"slot\": \"{<slot>}\"}"
=href "/neo/hawk{(en-tape:pith:neo (scag a here))}"
; {(trip ?@(iota iota (scot iota)))}
==
==
;div.grow;
==
;form
=class "hawk-tog grow fr m0 relative {(trip ?:(has-app 'hidden' ''))}"
=style "height: 2rem;"
=hx-get "/neo/hawk"
=hx-target "closest .hawk"
@ -706,8 +713,8 @@
==
==
==
;input.p-1.br1.b1.wf.s0.loaded.grow
=style "border: none;"
;input.p-1.br1.b1.wf.s0.loaded.grow.bd0
=style "margin-left: 5px;"
=type "text"
=value (en-tape:pith:neo here)
=oninput
@ -720,12 +727,14 @@
==
==
;div.fr.ac.jc.g1.hawk-actions
=id "hawk-actions-{idt}"
;button.p1.hover.b2.br1.loader.s-1
=id "hawk-slide-up-{idt}"
=hx-post "/neo/hawk/sky?stud=sky-diff"
=hx-target "find .loading"
=hx-swap "outerHTML"
=head "slide-up"
=slot "{<slot>}"
=hawk-slot "{<slot>}"
;span.loaded
;+ chevron-left:feather-icons
==
@ -734,11 +743,12 @@
==
==
;button.p1.hover.b2.br1.loader.s-1
=id "hawk-slide-down-{idt}"
=hx-post "/neo/hawk/sky?stud=sky-diff"
=hx-target "find .loading"
=hx-swap "outerHTML"
=head "slide-down"
=slot "{<slot>}"
=hawk-slot "{<slot>}"
;span.loaded
;+ chevron-right:feather-icons
==
@ -747,11 +757,12 @@
==
==
;button.p1.hover.b2.br1.loader.s-1
=id "hawk-close-{idt}"
=hx-post "/neo/hawk/sky?stud=sky-diff"
=hx-target "find .loading"
=hx-swap "outerHTML"
=head "minimize"
=slot "{<slot>}"
=hawk-slot "{<slot>}"
;span.loaded
;+ minimize:feather-icons
==
@ -776,8 +787,10 @@
=/ rom (get:of-top here)
=- -(a.g [[%here (en-tape:pith:neo here)] a.g.-])
^- manx
;div.rendered.wf.hf.b0.scroll-y.scroll-x
=id "hawk-rendered-{<id>}"
;div
=class "rendered wf hf b0 scroll-y scroll-x {(trip ?:(has-app '' 'hidden'))}"
=id "hawk-rendered-{idt}"
=morph-retain "class"
;+
?~ rom
;div.wf.hf.fc.ac.jc: nothing here
@ -796,22 +809,48 @@
%+ turn ~(tap by (kid:of-top here))
|= [=pith:neo *]
-.pith
;div.raw.hidden.b3.p2.fc.g1.js.ac.scroll-y.wf.hf
;div
=class "raw b0 p-page fc g1 js af scroll-y wf hf {(trip ?:(has-app 'hidden' ''))}"
=morph-retain "class"
;+
=/ rom (get:of-top here)
?~ rom ;div.f3.p1: no state
=/ =pail:neo (to-pail:room:neo u.rom)
;details.bd1.br1
;summary.p1.hover: state
;div.fc.g2.p2
;a.p2.br1.border.b1.hover.block.wfc
=href "/neo/hawk/src/std/pro/{(trip ?@(p.pail p.pail mark.p.pail))}"
; {<p.pail>}
==
;div.pre.mono.scroll-x.p2
;+
;/
=/ size (met 3 (jam q.pail))
?: (gth size 1.500.000) "vase too large to print: {<size>}"
(of-wall:format (~(win re (sell q.pail)) 0 80))
==
==
==
;h2.s1.bold.p1: children
;*
?~ (lent dirs)
;=
;div.wf.hf.fc.ac.jc: no children
;div.p2.f3: None
==
%+ turn
:: alphabetical sort
^- (list iota)
(sort dirs aor)
|= =iota
;button.p2.br1.b1.hover.wf.fr.js
;button.p2.br1.b1.hover.wf.fr.js.loader
=hx-get (en-tape:pith:neo :(weld /neo/hawk here /[iota]))
=hx-target "closest .hawk"
=hx-swap "outerHTML"
; {(trip ?@(iota iota (scot iota)))}
;span.loaded: {(trip ?@(iota iota (scot iota)))}
;span.loading
;+ loading.feather-icons
==
==
==
::
@ -918,6 +957,12 @@
if (oldNode.hasAttribute('morph-no-swap') && oldNode.id === newNode.id) {
return false;
}
else if (
newNode.hasAttribute('morph-if-class') &&
!oldNode.classList.contains(newNode.getAttribute('morph-if-class'))
) {
return false;
}
}
}
'''
@ -989,6 +1034,13 @@
=hx-history "false"
=hx-replace-url "/neo/sky"
=hx-target "closest .hawk"
=style
"""
background-color: var(--b1);
background-image: var(--sky-bg-url);
background-size: var(--sky-bg-size);
background-repeat: var(--sky-bg-repeat);
"""
;+ in
==
==
@ -1203,7 +1255,7 @@
=/ slot (slav %ud (need s))
%- poke-move
:- #/[p/our.bowl]/$/eyre/req/[eyre-id]
[~[p/[our.bowl] %sky] %poke %sky-diff !>([%move-tab (dec slot) pith])]
[~[p/[our.bowl] %sky] %poke %sky-diff !>([%move-tab slot pith])]
%- send
%- manx-response:gen:serv
=? pith =(pith /sky) (welp pith /settings)

2
pkg/arvo/neo/src/std/con/iframe-htmx.hoon
View File

@ -27,7 +27,7 @@
; Save
==
==
;iframe.wf.hf
;iframe.wf.hf.bd0
=style "background-color: #eee;"
=id "iframe-{url}"
=src url

10
pkg/arvo/neo/src/std/con/node-sky-diff.hoon
View File

@ -10,14 +10,14 @@
%new-tab
[%new-tab ~]
%minimize
[%minimize (dec (slav %ud (got:mu %slot)))]
[%minimize (slav %ud (got:mu %hawk-slot))]
%slide-up
[%slide-up (dec (slav %ud (got:mu %slot)))]
[%slide-up (slav %ud (got:mu %hawk-slot))]
%slide-down
[%slide-down (dec (slav %ud (got:mu %slot)))]
[%slide-down (slav %ud (got:mu %hawk-slot))]
%maximize
[%maximize (dec (slav %ud (got:mu %hawk-slot)))]
[%maximize (slav %ud (got:mu %hawk-slot))]
%close
[%close (dec (slav %ud (got:mu %hawk-slot)))]
[%close (slav %ud (got:mu %hawk-slot))]
::
==

87
pkg/arvo/neo/src/std/con/sail-htmx.hoon
View File

@ -1,4 +1,5 @@
/@ sail
/- _/feather-icons
:- [%sail %htmx]
|= =sail
|= =bowl:neo
@ -20,37 +21,44 @@
%+ weld "--"
(trip smeg)
++ controls
;div.b1.p2.frw.g3.sticky.wf
;div.p2.frw.jc.ac.g3.sticky.wf
=style "top:0; left: 0;"
;label.fr.g1
;input
=name "view"
=type "radio"
=oninput "$('#tabs-{id}').children().addClass('hidden');$('#editor-{id}').removeClass('hidden');"
;
==
;span: edit
;button.p-1.br1.b1.hover
=type "button"
=onclick
"""
$('#tabs-{id}').children().addClass('hidden');
$('#editor-{id}').removeClass('hidden');
$(this).siblings().removeClass('toggled');
$(this).addClass('toggled');
"""
; edit
==
;label.fr.g1
;input
=name "view"
=type "radio"
=oninput "$('#tabs-{id}').children().addClass('hidden');$('#viewer-{id}').removeClass('hidden');$('#editor-{id}').removeClass('hidden');"
;
==
;span: both
;button.p-1.br1.b1.hover
=type "button"
=onclick
"""
$('#tabs-{id}').children().addClass('hidden');
$('#viewer-{id}').removeClass('hidden');
$('#editor-{id}').removeClass('hidden');
$(this).siblings().removeClass('toggled');
$(this).addClass('toggled');
"""
; both
==
;label.fr.g1
;input
=name "view"
=type "radio"
=checked ""
=oninput "$('#tabs-{id}').children().addClass('hidden');$('#viewer-{id}').removeClass('hidden');"
;button.p-1.br1.b1.hover.toggled
=type "button"
=onclick
"""
$('#tabs-{id}').children().addClass('hidden');
$('#viewer-{id}').removeClass('hidden');
$(this).siblings().removeClass('toggled');
$(this).addClass('toggled');
"""
;
==
;span: view
; view
==
;label.fr.je.g1.grow
;label.fr.je.g1.grow.hidden
;input
=name "view"
=type "radio"
@ -59,14 +67,9 @@
==
;span: docs
==
;div.loader
=id "ind-{id}"
;span.loaded.f3: saved
;span.loading: ---
==
==
++ editor
;form.fc.hidden.grow.basis-half.border.scroll-y
;form.fc.p1.g1.hidden.grow.basis-half.scroll-y.relative
=id "editor-{id}"
=style "min-width: 300px; height: 100%;"
=hx-post "/neo/hawk{(en-tape:pith:neo here.bowl)}?stud=sail"
@ -74,9 +77,7 @@
=hx-select "main > div"
=hx-target "#viewer-{id}"
=hx-trigger "input changed delay:0.4s from:find textarea, input changed delay:0.4s from:find input"
=hx-indicator "#ind-{id}"
;input.p2.mono
=style "border-bottom: 1px solid var(--f3);"
;input.p2.mono.bd1.br1
=name "classes"
=placeholder "prose p3"
=type "text"
@ -85,17 +86,27 @@
=oninput "$(this).attr('value', this.value);"
;
==
;textarea.p2.pre.mono.scroll-x.grow
;textarea.p2.pre.mono.scroll-x.grow.bd1.m0.br1
=name "code"
=oninput "this.setAttribute('value', this.value);"
=spellcheck "false"
=value ""
=placeholder "# new document"
; {(trip code.sail)}
==
;div.absolute
=style "top: 14px; right: 14px;"
;div.loader
;span.loaded(style "opacity: 0;"): ---
;span.loading
;+ loading.feather-icons
==
==
==
==
++ error
|= =tang
;div.fc.g3.p3
;div.fc.g3.p3.s0
;div.pre.mono
;*
%+ turn (scag 25 tang)
@ -112,7 +123,7 @@
==
==
++ viewer
;main.grow.border.basis-half.scroll-x.scroll-y
;main.grow.basis-half.scroll-x.scroll-y.br1
=id "viewer-{id}"
=style "min-width: 300px; height: 100%;"
;+

4
pkg/arvo/neo/src/std/con/sky-diff-htmx.hoon
View File

@ -10,7 +10,7 @@
=hx-indicator "closest .loader"
=hx-target "#air"
=hx-select "#air"
=hx-swap "morph:outerHTML"
=hx-trigger "load"
=hx-swap "outerHTML"
=hx-trigger "load once"
;+ loading.feather-icons
==

342
pkg/arvo/neo/src/std/con/sky-htmx.hoon
View File

@ -6,7 +6,20 @@
|= =bowl:neo
^- manx
|^
shell
;div.wf.hf.relative
;a-i-r.wf.hf.relative
=style "opacity: var(--sky-opacity); padding: var(--sky-outer-gap);"
=id "air"
=hawks "{<open.sky>}"
=morph-retain "closed"
;+ menu-btn
;+ menu-btn-style
;+ theme-style
;+ nav
;* p:(spin (scag open.sky hawks.sky) 0 ha-wk)
==
;+ eye
==
::
++ map-to-css-tape
|= m=(map @t @t)
@ -17,7 +30,7 @@
"""
--{(trip key)}: {(trip val)};
"""
++ shell
++ theme-style
=/ settings
^- (unit sky-settings)
=/ s (~(get by kids.bowl) /settings)
@ -25,163 +38,222 @@
:- ~
!< sky-settings
q.u.s
;a-i-r.wf.hf.b1.relative
=id "air"
=hawks "{<slots.sky>}"
;button.hover.f2.b1.fc.ac.jc.air-btn
=slot "button"
=onclick "$(this).closest('a-i-r').attr('closed', !$(this).parent().attr('closed'))"
;div.fc.ac.jc.bold.s2: ~
==
;style
;+ ;/ %- trip
'''
;style
;+ ;/
?~ settings
""
"""
html \{
{(map-to-css-tape u.settings)}
}
"""
==
++ menu-btn
;button.hover.f2.b2.fc.ac.jc.air-btn.wf
=slot "button"
=onclick "$(this).closest('a-i-r').attr('closed', !$(this).parent().attr('closed'))"
;div.fc.ac.jc.bold.s3.f3(style "height: 2rem;"): ~
==
++ menu-btn-style
;style
;+ ;/ %- trip
'''
.air-btn {
position: relative;
padding: 4px;
border-radius: 3px;
border: 2px solid var(--b2);
}
@media(max-width: 900px) {
.air-btn {
position: relative;
padding: 8px;
margin: 8px;
border-radius: 4px;
position: absolute;
bottom: 25px;
right: 25px;
padding: 30px;
width: 70px;
height: 70px;
z-index: 10;
border-radius: 50px;
border: 1px solid var(--b3);
}
@media(max-width: 900px) {
.air-btn {
position: absolute;
bottom: 25px;
right: 25px;
padding: 30px;
width: 70px;
height: 70px;
z-index: 10;
border-radius: 50px;
border: 1px solid var(--f3);
}
a-i-r {
padding: 0 !important;
}
'''
}
'''
==
++ ha-wk
|= [[id=@da =pith] a=@]
:_ +(a)
=/ ext
?: =(pith /) ""
(en-tape:pith:neo pith)
=/ idt `tape`(zing (scan +:(scow %da id) (most dot (star ;~(less dot prn)))))
;div.wf.hf.br1
=slot "s{<a>}"
=id "hawk-windshield-{idt}"
;div.wf.hf.fc.jc.ac.f2.s3.spinner
=id "hawk-{idt}"
=morph-if-class "spinner"
;+ loading.feather-icons
==
;nav.wf.hf.p2.fc.g2
=slot "nav"
;hr.m0.wf.bd0.b3.o4(style "height: 1.5px;");
;+ new-tab
;*
=< p
%^ spin hawks.sky
1
|= [[id=@da =pith] a=@]
:_ +(a)
=/ color (trip ?:((lte a slots.sky) 'b2' 'b1'))
;div
=class "fr ac br1 {color}"
;button
=class "loader p2 tl br1 hover grow {color}"
=hx-post "/neo/hawk/sky?stud=sky-diff"
=hx-target "find .loading"
=hx-swap "outerHTML"
=head "maximize"
=hawk-slot "{<a>}"
;span.loaded: {(en-tape:pith:neo pith)}
;span.loading
;+ loading.feather-icons
==
==
;button
=class "loader p2 tl br1 hover {color}"
=hx-post "/neo/hawk/sky?stud=sky-diff"
=hx-target "find .loading"
=hx-swap "outerHTML"
=head "close"
=hawk-slot "{<a>}"
;span.loaded.f3
;+ close.feather-icons
==
;span.loading
;+ loading.feather-icons
==
==
==
;div.hidden
=hx-get "/neo/hawk{ext}?slot={<a>}&id={<id>}&no-save"
=hx-trigger "load"
=hx-target "#hawk-{idt}"
=hx-swap "morph"
;
==
==
++ nav
;nav.wf.hf.p2.fc.g2
=slot "nav"
;div.mt2.o0;
;+ new-tab
;*
=< p
%^ spin (scag slots.sky hawks.sky)
1
|= [[id=@da =pith] a=@]
:_ +(a)
=/ ext
?: =(pith /) ""
(en-tape:pith:neo pith)
;div.wf.hf.br1
=slot "s{<a>}"
=id "hawk-part-{<id>}"
;div.wf.hf.fc.jc.ac.f2.s3
=id "hawk-slot-{<id>}"
=morph-no-swap ""
=hx-get "/neo/hawk{ext}?slot={<a>}&id={<id>}&no-save"
=hx-trigger "load once"
=hx-target "this"
=hx-swap "outerHTML"
=< p
%^ spin
hawks.sky
0
|= [[id=@da =pith] a=@]
:_ +(a)
=/ idt `tape`(zing (scan +:(scow %da id) (most dot (star ;~(less dot prn)))))
=/ color (trip ?:((lth a open.sky) 'b2' 'b1'))
;div
=id "hawk-tab-{idt}"
=class "fr ac br1 {color}"
;button
=class "loader p2 tl br1 hover grow {color}"
=hx-post "/neo/hawk/sky?stud=sky-diff"
=hx-target "find .loading"
=hx-swap "outerHTML"
=head "maximize"
=hawk-slot "{<a>}"
;span.loaded: {(en-tape:pith:neo pith)}
;span.loading
;+ loading.feather-icons
==
==
;button
=class "loader p2 tl br1 hover {color}"
=hx-post "/neo/hawk/sky?stud=sky-diff"
=hx-target "find .loading"
=hx-swap "outerHTML"
=head "close"
=hawk-slot "{<a>}"
;span.loaded.f3
;+ close.feather-icons
==
;span.loading
;+ loading.feather-icons
==
==
;style
;+ ;/
?~ settings
""
"""
html \{
{(map-to-css-tape u.settings)}
}
"""
==
==
++ new-tab
;button.loader.b2.p2.tc.br1.hover.o6.wfc.s-1
;button.loader.b2.p2.tc.br1.hover.wfc.s-1
=hx-post "/neo/hawk/sky?stud=sky-diff"
=hx-target "find .loading"
=hx-swap "outerHTML"
=type "button"
=head "new-tab"
;span.loaded.fr.ac.js.g2
;+ add.feather-icons
;span: New tab
;span.f3: new tab
==
;span.loading
;+ loading:feather-icons
==
==
++ shell2
=/ settings
^- (unit sky-settings)
=/ s (~(get by kids.bowl) /settings)
?~ s ~
:- ~
!< sky-settings
q.u.s
;s-k-y.wf.hf(open "", hawks "{<slots.sky>}")
;*
=< p
%^ spin hawks.sky
1
|= [[id=@da =pith] a=@]
:_ +(a)
;ha-wk
=slot "s{<a>}"
=here (en-tape:pith:neo pith)
;div
=hx-get "/neo/hawk{(en-tape:pith:neo pith)}"
=hx-trigger "load"
=hx-target "this"
=hx-swap "outerHTML"
;div.wf.hf.fc.jc.ac.f2.s3
;+ loading.feather-icons
==
==
==
;style
;+ ;/
?~ settings
""
"""
html \{
{(map-to-css-tape u.settings)}
++ eye
;div#eye.fixed.hidden
=style "bottom: 30px; left: 30px;"
=morph-no-swap ""
;script
;+ ;/ %- trip
'''
function handleKey(e) {
let focused = document.activeElement;
let textarea = ['TEXTAREA'].includes(focused.nodeName)
let textinput = ['text', 'number', 'email', 'password'].includes(focused.getAttribute('type'));
if (textarea || textinput) {
if (e.key === 'Escape') {
closeEye();
document.activeElement.blur();
}
return;
}
if (e.key === ' ') {
e.preventDefault();
if (window.eye.open) {
closeEye();
} else {
openEye();
}
} else if (e.key === 'Escape') {
e.preventDefault();
document.activeElement.blur();
} else if (!e.ctrlKey && !e.metaKey && !e.altKey) {
if (window.eye?.open) {
e.preventDefault();
let area = window.eye?.spots?.filter(s => s[0][0] === e.key);
if (area.length === 1) {
let btn = area[0][1];
btn.click();
btn.focus();
closeEye();
}
else if (!!area.length) {
let news = area.map(c => (c[0].length < 2) ? c : [c[0].slice(1), c[1]]);
window.eye.spots = news;
closeEye(true);
openEye();
} else {
closeEye();
}
}
}
}
"""
function openEye() {
window.eye.open = true;
document.getElementById('eye').classList.remove('hidden');
buildGazeSpots();
}
function closeEye(keep) {
window.eye.open = false;
if (!keep) {
window.eye.spots = null;
}
document.getElementById('eye').classList.add('hidden');
document.querySelectorAll('.gaze').forEach(g => g.remove());
}
function buildGazeSpots() {
let buttons = window.eye?.spots?.map(s => s[1]) ||
document.querySelectorAll(
'a, button, summary, [role="button"], input, textarea, .clickable'
);
let chars = ['a', 's', 'd', 'f', 'k', 'm', 'n', 'r', 't', 'y', 'u', 'i', 'c', 'v', 'b'];
buttons.forEach((b, i) => {
let d = b.getBoundingClientRect();
if (d.right > 0 && d.right > 0) {
let t = document.createElement('div');
var lent = Math.floor((i / chars.length) + 1);
var word = ''
while (lent > 0) {
let ch = chars[i % chars.length];
word = `${word}${ch}`;
lent = lent - 1;
}
t.textContent = word.slice(-1);
t.className = 'b-1 br2 p1 s0 bold fixed gaze z2'
t.style = `top: ${Math.max(0, d.top - 10)}px; left: ${Math.max(0, d.left - 10)}px;`
document.getElementById('eye')?.parentNode.appendChild(t);
window.eye.spots = [[word, b], ...(window.eye?.spots || [])]
}
})
}
window.addEventListener('keydown', handleKey);
'''
==
==
--

91
pkg/arvo/neo/src/std/con/sky-settings-htmx.hoon
View File

@ -10,6 +10,8 @@
=hx-post "/neo/hawk{(en-tape:pith:neo here.bowl)}?stud=sky-settings"
=hx-swap "none"
;+ script
;+ background-image
;+ spacing
;+ typography
;+ (colors "light")
;+ (colors "dark")
@ -29,13 +31,96 @@
==
==
==
++ curr
|= var=cord
(trip (~(gut by settings) var ''))
++ selected
|= [f=? =manx]
%= manx
a.g
?. f a.g.manx
[[%selected ""] a.g.manx]
==
++ background-image
;div.fc.js.g2.ja.p2
;label.fc.g1
;span.s-1: Background Image
;input.bd1.border.p2.br1
=oninput "setCss('sky-bg-url', `url('$\{this.value}')`); $(this).attr('value', `url('$\{this.value}')`);"
=value (curr 'sky-bg-url')
=var "sky-bg-url"
=type "text"
;
==
==
;label
;span.s-1: Position
;select.br1.bd1.p2
=oninput "setCss('sky-bg-size', this.value); $(this).attr('value', this.value);"
=value (curr 'sky-bg-size')
=var "sky-bg-size"
;*
%+ turn
:~
"initial"
"contain"
"cover"
==
|= =tape
%+ selected =(tape (curr 'sky-bg-size'))
;option(value tape): {tape}
==
==
;label.fc.g1
;span.s-1: Opacity
;input.bd1.border.p2.br1
=oninput "setCss('sky-opacity', this.value); $(this).attr('value', this.value);"
=value (trip (~(gut by settings) 'sky-opacity' '1'))
=var "sky-opacity"
=type "range"
=min "0.6"
=max "1.0"
=step "0.01"
;
==
==
==
++ spacing
;div.fc.g2
;label.fc.g1
;span.s-1: Outer Gap
;input.bd1.border.p2.br1
=oninput "setCss('sky-outer-gap', `$\{this.value}px`); $(this).attr('value', this.value);"
=value (curr 'sky-outer-gap')
=var "sky-outer-gap"
=type "range"
=min "0"
=max "30"
=step "1"
;
==
==
;label.fc.g1
;span.s-1: Inner Gap
;input.bd1.border.p2.br1
=oninput "setCss('sky-inner-gap', `$\{this.value}px`); $(this).attr('value', this.value);"
=value (curr 'sky-inner-gap')
=var "sky-inner-gap"
=type "range"
=min "0"
=max "30"
=step "1"
;
==
==
==
++ typography
;div.fc.js.g2.ja.p2
;label.fc.g1.mt1
;span.s-1: Main font
;select.br1.bd1.p2
=oninput "setCss('font', this.value); $(this).attr('value', this.value);"
=value (trip (~(gut by settings) 'font' ''))
=value (curr 'font')
=var "font"
;*
%+ turn
@ -52,6 +137,7 @@
"PT Sans"
==
|= =tape
%+ selected =(tape (curr 'font'))
;option(value tape): {tape}
==
==
@ -72,7 +158,7 @@
;span.s-1: Monospace font
;select.br1.bd1.p2
=oninput "setCss('font-mono', `'$\{this.value}'`); $(this).attr('value', this.value);"
=value (trip (~(gut by settings) 'font-mono' ''))
=value (curr 'font-mono')
=var "font-mono"
;*
%+ turn
@ -84,6 +170,7 @@
"Spot Mono"
==
|= =tape
%+ selected =(tape (curr 'font-mono'))
;option(value tape): {tape}
==
==

8
pkg/arvo/neo/src/std/imp/sky-settings.hoon
View File

@ -22,12 +22,18 @@
^- (list [@t @t])
:~
:- 'font' 'Urbit Sans'
:- 'font-mono' 'Monaco'
:- 'font-mono' 'monospace'
:- 'mono-scale' '0.8'
:- 'letter-spacing' '0.024em'
:- 'line-height' '1.4'
:- '1in' '4px'
::
:- 'sky-opacity' '0.88'
:- 'sky-bg-size' 'contain'
:- 'sky-bg-url' ''
:- 'sky-outer-gap' '8px'
:- 'sky-inner-gap' '8px'
::
:- 'light-b-3' '#dd5522'
:- 'light-b-2' '#ddaa33'
:- 'light-b-1' '#55dd33'

18
pkg/arvo/neo/src/std/imp/sky.hoon
View File

@ -25,7 +25,7 @@
%new-tab
:- ~
=. hawks.this [[now.bowl /home] hawks.this]
=. slots.this (min 4 +(slots.this))
=. open.this (min 4 +(open.this))
!>(this)
%move-tab
:- ~
@ -39,7 +39,7 @@
(slag +(slot.poke) hawks.this)
[(snag slot.poke hawks.this) ~]
==
=. slots.this (dec slots.this)
=. open.this (dec open.this)
!>(this)
%maximize
:- ~
@ -49,30 +49,32 @@
(scag slot.poke hawks.this)
(slag +(slot.poke) hawks.this)
==
=? slots.this (gth slot.poke slots.this) (min 4 +(slots.this))
=? open.this
(gte slot.poke open.this)
(min 4 +(open.this))
!>(this)
%close
:- ~
=. hawks.this (oust [slot.poke 1] hawks.this)
=? open.this
(lth slot.poke open.this)
(dec open.this)
!>(this)
%slide-up
:- ~
=? hawks.this
(gth slot.poke 0)
=/ ok
;: welp
(scag (dec slot.poke) hawks.this)
[(snag slot.poke hawks.this) ~]
[(snag (dec slot.poke) hawks.this) ~]
(slag +(slot.poke) hawks.this)
==
~& ok
ok
!>(this)
%slide-down
:- ~
=? hawks.this
(lth slot.poke 4)
(lth slot.poke 3)
;: welp
(scag slot.poke hawks.this)
[(snag +(slot.poke) hawks.this) ~]
@ -80,7 +82,9 @@
(slag (add 2 slot.poke) hawks.this)
==
!>(this)
::
==
::
==
++ init
|= vas=(unit vase)

2
pkg/arvo/neo/src/std/pro/sky.hoon
View File

@ -1,4 +1,4 @@
$:
hawks=(list (pair @da pith))
slots=@ud
open=@ud
==

209
pkg/arvo/web/a-i-r.js
View File

@ -48,102 +48,135 @@ class extends HTMLElement {
gap: 12px;
overflow: auto;
}
main.s0 {
grid-template-columns: 1fr;
grid-template-rows: 1fr;
grid-template-areas:
".";
/*
* grid display
*
*/
main {
display: grid;
grid-area: main;
overflow: hidden;
padding-left: var(--sky-inner-gap);
}
main.s0 #s1,
main.s0 #s2,
main.s0 #s3,
main.s0 #s4 {
display: none;
}
main.s1 {
grid-template-columns: 1fr;
grid-template-rows: 1fr;
grid-template-areas:
"s1";
}
main.s1 #s1 {
display: block;
}
main.s1 #s2,
main.s1 #s3,
main.s1 #s4 {
display: none;
}
main.s2 {
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr;
grid-template-areas:
"s1 s2";
}
main.s2 #s1,
main.s2 #s2 {
display: block;
}
main.s2 #s3,
main.s2 #s4 {
display: none;
}
main.s3 {
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
grid-template-areas:
"s1 s2"
"s1 s3";
}
main.s3 #s1,
main.s3 #s2,
main.s3 #s3 {
display: block;
}
main.s3 #s4 {
display: none;
}
main.s4 {
grid-template-columns: 2fr 1fr 1fr;
grid-template-rows: 1fr 1fr;
grid-template-areas:
"s1 s2 s2"
"s1 s3 s4";
}
main.s4 #s1,
main.s4 #s2,
main.s4 #s3,
main.s4 #s4 {
display: block;
#s0, #s1, #s2, #s3 {
overflow: auto;
}
#button {
grid-area: btn;
height: fit-content;
}
main {
display: grid;
grid-area: main;
overflow: hidden;
}
#s1, #s2, #s3, #s4 {
overflow: auto;
#s0 {
grid-area: s0;
}
#s1 {
grid-area: s1;
padding: 3px;
}
#s2 {
grid-area: s2;
padding: 3px;
}
#s3 {
grid-area: s3;
padding: 3px;
}
#s4 {
grid-area: s4;
padding: 3px;
main.open-0 {
grid-template-columns: 1fr;
grid-template-rows: 1fr;
grid-template-areas:
".";
}
main.open-0 #s0,
main.open-0 #s1,
main.open-0 #s2,
main.open-0 #s3 {
display: none;
}
main.open-1 {
grid-template-columns: 1fr;
grid-template-rows: 1fr;
grid-template-areas:
"s0";
}
main.open-1 #s0 {
display: block;
}
main.open-1 #s1,
main.open-1 #s2,
main.open-1 #s3 {
display: none;
}
main.open-2 {
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr;
grid-template-areas:
"s0 s1";
}
main.open-2 #s0,
main.open-2 #s1 {
display: block;
}
main.open-2 #s2,
main.open-2 #s3 {
display: none;
}
main.open-3 {
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
grid-template-areas:
"s0 s1"
"s0 s2";
}
main.open-3 #s0,
main.open-3 #s1,
main.open-3 #s2 {
display: block;
}
main.open-3 #s3 {
display: none;
}
main.open-4 {
grid-template-columns: 2fr 1fr 1fr;
grid-template-rows: 1fr 1fr;
grid-template-areas:
"s0 s1 s1"
"s0 s2 s3";
}
main.open-4 #s0,
main.open-4 #s1,
main.open-4 #s2,
main.open-4 #s3 {
display: block;
}
/*
* gaps
*
*/
main.open-1 #s0 {
padding-right: 0;
}
main.open-2 #s0,
main.open-3 #s0,
main.open-4 #s0 {
padding-right: var(--sky-inner-gap);
}
main.open-1 #s1,
main.open-2 #s1 {
padding-bottom: 0;
}
main.open-3 #s1,
main.open-4 #s1 {
padding-bottom: var(--sky-inner-gap);
}
main.open-1 #s2,
main.open-2 #s2,
main.open-3 #s2 {
padding-right: 0;
}
main.open-4 #s2 {
padding-right: var(--sky-inner-gap);
}
/*
* mobile
*
*/
@media (max-width: 900px) {
:host {
grid-template-columns: auto;
@ -170,14 +203,21 @@ class extends HTMLElement {
grid-template-columns: auto;
grid-template-rows: auto;
grid-template-areas:
"s1";
"s0";
}
#nav {
--rem: 24px;
}
#s1 {
main {
padding: 0;
}
main #s0 {
display: block;
padding: 0;
padding-right: 0 !important;
}
main #s1 {
display: none !important;
}
main #s2 {
display: none !important;
@ -185,9 +225,6 @@ class extends HTMLElement {
main #s3 {
display: none !important;
}
main #s4 {
display: none !important;
}
:host(.closed) #nav {
display: flex;
}
@ -206,10 +243,10 @@ class extends HTMLElement {
</slot>
<slot id="nav" name="nav"></slot>
<main>
<slot name="s0" id="s0"></slot>
<slot name="s1" id="s1"></slot>
<slot name="s2" id="s2"></slot>
<slot name="s3" id="s3"></slot>
<slot name="s4" id="s4"></slot>
</main>
<slot id="default" style="display: none;"></slot>
`
@ -233,7 +270,7 @@ class extends HTMLElement {
if (name === "closed") {
this.classList.toggle("closed");
} else if (name === "hawks") {
this.qs("main").className = `s${this.hawks}`;
this.qs("main").className = `open-${this.hawks}`;
}
}
});

10
pkg/arvo/web/feather.css
View File

@ -151,9 +151,9 @@ body {
color: var(--f1);
}
button {
border: unset;
background: unset;
color: unset;
border: inherit;
background: inherit;
color: inherit;
}
.break {
@ -580,10 +580,10 @@ button {
border: none;
}
.bd1 {
border: 0.8px solid var(--f3);
border: 0.8px solid var(--b3);
}
.bd2 {
border: 1px solid var(--f2);
border: 0.8px solid var(--f3);
}
.bd3 {
border: 2px solid var(--f1);

8
pkg/arvo/web/reset.css
View File

@ -5,6 +5,7 @@
*::before,
*::after {
box-sizing: border-box;
margin: 0;
}
/* Prevent font size inflation */
@ -32,6 +33,10 @@ button, input, label {
line-height: 1.1;
}
button, summary {
cursor: pointer;
}
/* Balance text wrapping on headings */
h1, h2,
h3, h4 {
@ -59,6 +64,9 @@ textarea, select {
background: inherit;
color: inherit;
}
textarea {
resize: none;
}
/* Make sure textareas without a rows attribute are not tiny */
textarea:not([rows]) {