me . blog . projects . talks . podcasts . compform . mastodon . tweets . discord . instagram . sponsor
antfu / broz Goto Github PK
View Code? Open in Web Editor NEWA simple, frameless browser for screenshots
A simple, frameless browser for screenshots
Hi, loving the project. One thing that helps make the presentation more aesthetic (in addition to the frameless aspect) is rounded corners. Needless to say, OSX already does this automatically, but for Windows users, it would help a lot.
I don't use JS in my workflow very often, but it seems that setting the transparent
flag to true
in the browser initialization and appending some sort of border-radius
styling onto the body of the page should do the trick.
If you want, I can make the PR, though I haven't written JS in a few years so it might take longer than it should (feel free to do it yourself if you know the details).
There's a good chance I could be doing something wrong too, regardless, here's where I got the idea.
since setting frameless for win10 is require, all elements with -webkit-app-region:drag;
, will not receive any mouse events. :hover
styles do not work.
have to find a solution sometime. just add this as tracking and reminder.. Also dragging works, just no hover background only win10
I've zoomed out to take a better screenshot, but I could not zoom in again.
Hey, love this project!
Would be awesome to add the ability to screenshot fullpage websites once the url is loaded
Is it possible to add an input field in a similar fashion as the drag button that can take user input and communicate it with the BrowserWindow
object?
I've been playing around with this idea and tried a preload script,
webPreferences: {
preload: path.join(__dirname, 'renderer.js'),
},
but I'm not sure if this is the correct route, or if this is even possible. I can't seem to get access to the client-side's window
or document
objects in order to execute
const input = document.getElementById('url-input')
input.addEventListener('submit', () => {
ipcRenderer.send('search', input.value)
})
I got an error, is localhost still unsupported?
$ npx broz http://localhost:3030/
Error: ERR_CONNECTION_REFUSED (-102) loading 'http://localhost:3030/'
at rejectAndCleanup (electron/js2c/browser_init.js:217:1457)
at Object.failListener (electron/js2c/browser_init.js:217:1670)
at Object.emit (events.js:315:20) {
errno: -102,
code: 'ERR_CONNECTION_REFUSED',
url: 'http://localhost:3030/'
}
Command failed: /Users/k3ntar0/.npm/_npx/10043/lib/node_modules/broz/node_modules/electron/dist/Electron.app/Contents/MacOS/Electron/Users/k3ntar0/.npm/_npx/10043/lib/node_modules/broz/index.js http://localhost:3030/
Btw, I like all of your work!
see attached video
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.