newtab
Forum rules
Only original work ;)
Only original work ;)
newtab
https://github.com/manuel-uberti/newtab
Programming is too heavy a word for this little thingy, but I am so used to Opera's Speed Dial I wanted something similar for Chrome.
I wanted something HTML+CSS only, without JavaScript but with some fanciness like button pressed effect, etc.
Really silly, really simple, but it spares me another browser extension.
Programming is too heavy a word for this little thingy, but I am so used to Opera's Speed Dial I wanted something similar for Chrome.
I wanted something HTML+CSS only, without JavaScript but with some fanciness like button pressed effect, etc.
Really silly, really simple, but it spares me another browser extension.
- wuxmedia
- Grasshopper
- Posts: 6454
- Joined: Wed Oct 17, 2012 11:32 am
- Location: Back in Blighty
- Contact:
Re: newtab
pretty, and very useful.
I used to be happy with the chrome auto managed homepage, but it's a recently been a bit crap and I visit soo many random sites on the job it gets full of random sites I don't want to ever visit again
also html+css - My Man! forked and new tabbed.
I used to be happy with the chrome auto managed homepage, but it's a recently been a bit crap and I visit soo many random sites on the job it gets full of random sites I don't want to ever visit again
also html+css - My Man! forked and new tabbed.
Re: newtab
Give us a star, man, just do it! ;-)
- wuxmedia
- Grasshopper
- Posts: 6454
- Joined: Wed Oct 17, 2012 11:32 am
- Location: Back in Blighty
- Contact:
Re: newtab
oh sure -done, needed to make sure I could work out how to fork it (took long enough, then forked it to the wrong repo under my work user *sighs*)
is that, a Dr Who haynes manual on your github avatar? for the tardis maybe? nice.
eurgh there is always something - I like my new tab to have the bookmarks bar on - but have it hidden on normal browsing. Which the custom new tab ext doesn't cater for, So i just migrated the most used bookmarks onto this page as that is what it is for.
probably best if my repo isn't public with all the shady urls I have on it now :D
is that, a Dr Who haynes manual on your github avatar? for the tardis maybe? nice.
eurgh there is always something - I like my new tab to have the bookmarks bar on - but have it hidden on normal browsing. Which the custom new tab ext doesn't cater for, So i just migrated the most used bookmarks onto this page as that is what it is for.
probably best if my repo isn't public with all the shady urls I have on it now :D
Re: newtab
^ :) thanks
The shirt comes straight from https://www.thewhoshop.com/
Dalek picture, by the way.
Been there a while ago with the missus, Dr Who geeks as we are, and bought a souvenir.
The shirt comes straight from https://www.thewhoshop.com/
Dalek picture, by the way.
Been there a while ago with the missus, Dr Who geeks as we are, and bought a souvenir.
- wuxmedia
- Grasshopper
- Posts: 6454
- Joined: Wed Oct 17, 2012 11:32 am
- Location: Back in Blighty
- Contact:
Re: newtab
ahh cool,
I splashed out on a herbie hancock 'head hunters' t-shirt (of the ablum cover and back on the back)
- hey I made this page responsive by the way, not sure if you give a shit, seemed slightly easier to maintain I can just add buttons and the page decides how many can fit on etc, one 'button-area' div :D
I splashed out on a herbie hancock 'head hunters' t-shirt (of the ablum cover and back on the back)
- hey I made this page responsive by the way, not sure if you give a shit, seemed slightly easier to maintain I can just add buttons and the page decides how many can fit on etc, one 'button-area' div :D
Re: newtab
^ Nice touch, I'll check it out.
- wuxmedia
- Grasshopper
- Posts: 6454
- Joined: Wed Oct 17, 2012 11:32 am
- Location: Back in Blighty
- Contact:
Re: newtab
ahem once I figure out how to push the code back :D
Re: newtab
^ Just seen it. Thanks, I did the same, much easier to add stuff now.
- wuxmedia
- Grasshopper
- Posts: 6454
- Joined: Wed Oct 17, 2012 11:32 am
- Location: Back in Blighty
- Contact:
Re: newtab
yeah cool, great minds and all that - I added a yellow box too as that is the company colour. I know - sign me up as a web dev :D
- wuxmedia
- Grasshopper
- Posts: 6454
- Joined: Wed Oct 17, 2012 11:32 am
- Location: Back in Blighty
- Contact:
Re: newtab
im not sure that it is the best flexible grid arrangement in the world. gets kinda gappy, mostly only ever full screen width anyway.
Re: newtab
To be honest, I've never played with flex before. I just wanted a grid of buttons, every line the same size, taking care of the gaps itself.
I'm open to a better CSS, of course. :)
I'm open to a better CSS, of course. :)
- wuxmedia
- Grasshopper
- Posts: 6454
- Joined: Wed Oct 17, 2012 11:32 am
- Location: Back in Blighty
- Contact:
Re: newtab
neither had i - i know the principles of responsive though and it pretty much is.
hmmm, try this:
and equal margins for the boxes:
then the amount of boxes is decided by the width of the box I think..
yeah that looks quite nice- thanks for pointing to the flex attribute - i had not seen it before, should make things a bit easier should i wish to redesign my site.
hmmm, try this:
Code: Select all
.button-area {
justify-content: center;
and equal margins for the boxes:
Code: Select all
.button-* {
margin: 4px 4px;
yeah that looks quite nice- thanks for pointing to the flex attribute - i had not seen it before, should make things a bit easier should i wish to redesign my site.
Re: newtab
Fantastic, thanks for the tips. I pushed a new version on GitHub, and this is really pleasing.
- ivanovnegro
- Minister of Truth
- Posts: 5450
- Joined: Wed Oct 17, 2012 11:12 pm
Re: newtab
Now that looks nice guys. Though I usually only use the keyboard to get to another page or bookmark. But at least it looks fancier than Chrome's default tab page.
Re: newtab
^ Mostly, I do the same. I am particularly fond of DuckDuckGo bangs to move around.
But for the regular websites, and the lazy dude, I like the one-click option.
But for the regular websites, and the lazy dude, I like the one-click option.
- wuxmedia
- Grasshopper
- Posts: 6454
- Joined: Wed Oct 17, 2012 11:32 am
- Location: Back in Blighty
- Contact:
Re: newtab
Glad I could help, seems I'm more of a find something and alter it (read try all the thing and see what it does) rather than a read the docs understand the thing and make it 'from scratch' person :)
OMFG Does this actually fucking work? - It was more pseudo bash than an actual CSS thing :D Well, great "I know CSS"
Code: Select all
.button-* {
margin: 4px 4px;
- franksinistra
- Ivana Fukalot
- Posts: 1093
- Joined: Mon Jan 27, 2014 2:03 am
- Location: 印尼国
Re: newtab
Could use some media queries on its font size
like:
and you can delete all those font-size you set up manually on each of your button class.
I think you'll benefit more using sass / scss rather than plain css, or you could set your color class to be different from your button class i.e.
That newtab page would also benefitted more from using justify-content: center stuff, since flex-start would leave some right part of your browser width unoccupied. If you instead want to use flex-start, you could use flex-grow to make sure each element inside your container will occupy all space.
Just my 2p. :)
like:
Code: Select all
/* assuming you set your default minimum font-size to 12px, works nicely on mobile browser as well */
@media screen and (min-width: 540px) {
* {
font-size: calc(12px + 8 * ((100vw - 540px) / 1080)) !important;
}
}
I think you'll benefit more using sass / scss rather than plain css, or you could set your color class to be different from your button class i.e.
Code: Select all
:root {
--green: #some_hex;
--blue: #some_hex;
}
.green {
background: var(--green);
}
Just my 2p. :)
rice no more.
- franksinistra
- Ivana Fukalot
- Posts: 1093
- Joined: Mon Jan 27, 2014 2:03 am
- Location: 印尼国
Re: newtab
^ Just wow, implemented every suggestion. Thank you.