[a / b / c / d / e / f / g / gif / h / hr / k / m / o / p / r / s / t / u / v / vg / vr / w / wg] [i / ic] [r9k / s4s / vip / qa] [cm / hm / lgbt / y] [3 / aco / adv / an / asp / bant / biz / cgl / ck / co / diy / fa / fit / gd / hc / his / int / jp / lit / mlp / mu / n / news / out / po / pol / qst / sci / soc / sp / tg / toy / trv / tv / vp / wsg / wsr / x] [Settings] [Search] [Home]
Board
Settings Home
/wg/ - Wallpapers/General

Name
Options
Comment
Verification
4chan Pass users can bypass this verification. [Learn More] [Login]
File
  • Please read the Rules and FAQ before posting.
  • Maximum file size allowed is 6144 KB.
  • Images smaller than 480x600 pixels are not allowed.
  • There are 49 posters in this thread.

05/04/17New trial board added: /bant/ - International/Random
10/04/16New board for 4chan Pass users: /vip/ - Very Important Posts
06/20/16New 4chan Banner Contest with a chance to win a 4chan Pass! See the contest page for details.
[Hide] [Show All]


Please consider donating to help the victims of the KyoAni studio fire: https://www.gofundme.com/f/help-kyoani-heal


File: 1550821522844.webm (2.37 MB, 1359x901)
2.37 MB
2.37 MB WEBM
Just in time edition.

>What are startpages?
Startpages (in the context of this thread) are locally hosted webpages (as in, the files are on your computer - not a server somewhere) that serve as the homepage or new tab page for a browser. They generally contain some number of links to frequently visited sites as the main element; search bars, clocks, calendars and other embedded items are usually added as secondary elements.

>What browser are you using?
If you can't tell what browser it is, it's probably Firefox, you can theme Firefox using Stylish and finding themes on the Firefox tag of Userstyles.
Otherwise if you won't upgrade there's always Chrome, you can ~slightly~ customize it using Chrome Theme Maker. Lately, we noticed Vivaldi can can have custom css too.

---FAQ---
>http://pastebin.com/PdPrW5aP

---Discord link---
>https://discord.gg/ExAGgVR

---Relevant Sites---
Collection of startpages for modification and use.
>http://startpages.github.io/
>https://www.ricing.chloechantelle.com/
>http://nanami-tan.info/#HTMLPage
>http://pastebin.com/ZJvDn0eN

--HTML, CSS & JS--
>http://www.w3schools.com/html/default.asp
>http://www.w3schools.com/css/default.asp
>http://www.w3schools.com/js/default.asp
>https://www.codecademy.com/learn/make-a-website
>https://www.codecademy.com/learn/javascript

---Colours Related Links---
>http://palettegenerator.com/
>https://webgradients.com/
>https://www.gradient-animator.com/

---Colours Converter---
RGB to HEX
>http://www.javascripter.net/faq/rgbtohex.htm

HEX to RGB
>http://www.javascripter.net/faq/hextorgb.htm

---Typography Related Links---
>http://practicaltypography.com/
>https://www.typewolf.com/

---Old Thread---
>>7348064
>>
File: vrj.png (412 KB, 1114x602)
412 KB
412 KB PNG
startpage: https://rice.capuno.cat/Archive/NotRice/websites/startpages/gate/index.html
what do u guys think about the dvd effect when u click the viagra link? anyone has a better idea on how to do that?
>>
New thread, even more spam.
This are the thing i've done:
https://github.com/just12/web-styles
https://github.com/just12/startpages
>>
Rate my newtab
>>
>>7420409
if you are going for the box that everyone hopes hits perfectly in the corner, i really want to see the progression of this idea
>>
>>7420422
>lainchan
my nigga
>>
>>7420123
hey i recognise that webm
>>
File: browser-2019-06-02.webm (1.29 MB, 1790x1111)
1.29 MB
1.29 MB WEBM
slight bump with an update on something i've been working on

also included the stylus code, look how clean it all looks
>>
>>7421585
Looks dope, keep it up!
>>
>>7420422
Are you on a small screen? Otherwise I'd pop a max width on that bad boy and generally provide a bit more space.

Depending on the background your thin font for the links might be a tad bit hard to read.

Personal nitpick: The lack of a consistent pairing of font types is a little off-putting. The time to me is paired with the month (mayo) even though it ought not to be. The temperature is paired with the date (30). This can also be solved with colors/font-weight.

I like the page, especially the wallpaper :)
>>
>>7420409
In general: Page looking really good. The concept is there and you are doing well.

dvd effect: Personally its gimmicky and I doubt I'd use it (or anyone that uses this page). The issue is that you have to click that link, a new tab page ideally lasts as long as a single click, since it should be a minimal middleman between you and your new tab destination.

_Maybe_ have it do the effect after a variable amount of time without any action?
>>
is there any way to hide the black line thats at the bottom of the tab bar?
>>
>>7422853

how do you modify firefox ?

using css ?
>>
>>7422934
Search the userChrome.css file, on gnu/linux: ~/.mozilla/firefox/profile.default/chrome/userChrome.css
There are also other tools inside firefox to view the classes and ids and shit from the browser itself and not the website, https://developer.mozilla.org/en-US/docs/Tools/Browser_Toolbox
U can try this userChrome.css https://rice.capuno.cat/Dotfiles/.mozilla/firefox/user/chrome/userChrome.css and edit it as u want if u dont want to fiddle with the browser toolbox.
>>
Page 10. Wew.
>>
File: hackybar.png (20 KB, 1833x1051)
20 KB
20 KB PNG
>>7422853
been a while but it's probably
#navigator-toolbox::after {
content: "";
display: -moz-box;
border-bottom: 1px solid var(--toolbox-border-bottom-color);
}
this shit (yet again).

or just make a hacky toggle solution that persists after deletion for some reason and made troubleshooting this complete aids
>>
>>7425218
forgot i posted that

:root {
--chrome-content-separator-color: none !important;
}

and

#TabsToolbar{
border-bottom: 0px transparent !important;
}

did the trick
>>
File: screencap.png (1016 KB, 1366x768)
1016 KB
1016 KB PNG
Does anybody know how to force Firefox to use Helvetica instead of reverting to Arial on custom start pages? some forums have suggested using
@font-face { font-family: 'font you want to replace'; src: local('font of your choice');
as a solution, but it doesn't seem to work. It must be a Firefox issue, as MS Edge can display the font with no problems.


I would also like to try to improve the readability of the links by making the backround blurred, but filter: blur also blurs the links themselves - is there any way to do this apart from editing the background picture manually? Thanks in advance
>>
>>7426072
>With the @font-face rule, web designers do not have to use one of the "web-safe" fonts anymore.
no one sane should have suggested that for anything.
>blur also blurs the links themselves
blur the image and not the entire page?
>>
Does a dark CSS for the updated E-Hentai layout exist?
>>
>>7426114
well I want to blur the background of the links and keep the rest clear if that makes sense.
>>
>>7426228
the way I'd salvage it is just boxing the entire thing in and making it a solid colour with alpha channel. least painful.

the way I thought of to get exactly what you described involves sprites and I'll leave it at that because it's completely retarded.
>>
File: screencap1.png (590 KB, 1366x768)
590 KB
590 KB PNG
>>7426262
this is the css before, and the box elements are still there, i just removed the opacity in order to make it look transparent.
i had some problems doing it, when i removed the opacity of the box the text went with it, and i learned that this is because the child elements (eg the text) take the opacity values from the parent elements (box).
However I solved this by using rgba background values. The question is whether the blur effects can be ascribed to the box itself while not affecting the text.
>>
File: DybUDbZWwAA_SWI.jpg (94 KB, 723x930)
94 KB
94 KB JPG
I'm not sure if this is the appropriate thread, but I've been trying Vivaldi for a bit and holy shit the font rendering is horrible - is there any fix? Picture unrelated.
>>
>>7426590
way cleaner than my original thoughts. hope you like grid. (can probably just be ported to however yours is with z-index stuff. might even be better depending how you want to handle the image)

https://codepen.io/anon/pen/ZdGbWr
>>
For Firefox when you start a new tab it doesn't let you start it with your homepage, is there an extension or a workaround for that?
>>
>>7427092
>extension
New Tab Override - not the plus version though
>>
>>7426730
many thanks for the advice, but for now it looks like too much work tweaking it up - I might go back to the project once I find more time but for now i'll just keep the semi-opaque box. I'll keep your code though hoping to make it happen one day.
>>
>>7427373
updated for just regular divs and absolute positions and what not.
https://codepen.io/anon/pen/ZdGbWr

tldr blurred image needs to be seperate. like. if you got one box and one box only then you just make two boxes. image and blur in one and text in the other. z-index if needed.

no real work. it's like one very tiny line of markup.
>>
File: Capturar.png (25 KB, 2560x1050)
25 KB
25 KB PNG
>>
File: Start.png (207 KB, 1676x926)
207 KB
207 KB PNG
I've got this raw startpage I want to improve.
Please feel free to change, add, and remove any part.
https://github.com/1NV3RN0MUT0/Ono-Sendai-Startpage/tree/master/Ono%20Sendai%20Homepage
>>
>>7420123
Is there a download link to this css? Looks kinda neat.
>>
>>7428068
I'll be radically honest with you, it's awful, start again with another style in mind.
Using a wallpaper for a website background might not be the cleanest idea.
>>
File: preview.png (198 KB, 1676x920)
198 KB
198 KB PNG
>>7428068
I'm making little steps
>>
>>7428068
Definitely swipe a search script from someone so you don't have five input fields.
>>
File: 3.png (628 KB, 1366x653)
628 KB
628 KB PNG
>>7427460
hey thank you so much, would have never figured this out! appreciate it
>>
File: 044623.png (3.67 MB, 1916x1045)
3.67 MB
3.67 MB PNG
Any idea on how to add a task list to a startpage?
>>
>>7428626
Fixed.
But somehow I fucked things up with the layout..
>>
>>7429193
Maybe some CSS is being applied inside the script?
>>
File: 6356931473845.png (386 KB, 1366x768)
386 KB
386 KB PNG
i wrote up this rss reader for a jquery terminal that also searches unrecognized commands on bing, source included in contact, happy hacking
acktic(dot)github(dot)com
>>
File: Preview.png (126 KB, 1364x672)
126 KB
126 KB PNG
>>7428541
I finished it. I only have a question and I hope someone can help me because I don't know how to figure it out.
I have 2 different size monitors and I need all elements to fit the with same proportions.
I settled out with crazy settings in the way to have the desired layout at 100% and 125% of my Chrome frame.
There should be a cleaner way to automate that playing with absolute/relative position, I give up!
Check it if you want.>>7428068
>>
File: startup01.png (2.71 MB, 1920x1011)
2.71 MB
2.71 MB PNG
First I ever made
>>
>>7430072
That's pretty nice, I think it would be cool if you made the links window a tabbed one, so you could have different subjects in different tabs.
It looks beautiful though, nice work.
>>
>>7427787
hex of the background color please?
>>
>>7430996
you could just copy/paste the picture in gimp and select it yourself
#282a36
>>
>>7430072
>>7428701
Pape?
>>
>>7430072
anyone got that pape?
>>
File: 1539901795882.jpg (2.81 MB, 2560x1440)
2.81 MB
2.81 MB JPG
>>7432966
>>7433033
>>
>>7433261
thanks!
>>
>>7420409
good ideam looks awesome im ur biggest fan now but obviously ur gonna need left-right movement too
>>
>>7428748
i'll give you a hint... append localstorage['todo-items']
>>
File: 1557842648933.jpg (1.08 MB, 5184x3456)
1.08 MB
1.08 MB JPG
>>7432966
>>
>>7420123
What css is that
>>
>>7433321
click the button more times, the direction is random
>>
>>7434245
https://github.com/saxamaphone69/ss16/tree/20XX

i am working on a "ss21/ss16 2.1.0" release but it's a slow process due to work
>>
>>7433323
holy shit, i'll get back to you on that, once i figure it out
>>
File: file.png (1.88 MB, 1920x1080)
1.88 MB
1.88 MB PNG
haven't really posted in a long time. i needa update the list as well :/
>>
this is how it ended up looking like
>>
>>7435509
mind posting the background image?
>>
>>7428541
>Huffington Post
>>
File: 1.png (294 KB, 1279x709)
294 KB
294 KB PNG
summer is here edition!
>>
>>7435623
wanna play some chess, anon?
>>
>>7437886
Im down, but mind you im not great. i mosly play long matches, if thats ok then lets do it
>>
>>7437912
>but mind you im not great
don't worry, mate
i'm still in the phase of learning, invite me: temp199
>>
>>7438724
sorry, username is of lichess
>>
File: First Startpage.png (3.86 MB, 1920x957)
3.86 MB
3.86 MB PNG
First startpage I've made. Pretty simplistic but I like it. Any suggestions as to what I should add?
>>
>>7420123
is codeacademy actually good?
>>
>>7440254
taste
>>
Saw the wallpaper over in the cyberpunk thread and that window just screamed startpage.
Heavy work in process, but I like it so far. 3D perspective in CSS is a royal pain though.
>>
File: wip.png (3.3 MB, 1914x937)
3.3 MB
3.3 MB PNG
>>7441792
Oops.
>>
I thought you guys might like this:

https://hostyoself.com/
>>
>>7440409
Same question here
>>
>>7420123
I need a little bit of help.
I'm trying to make a collage of CSS stylesheets for Firefox but I'm having an issue with my tabs bar, and I don't know what is causing it. Help?
https://streamable .com/irf1f
https://paste .ee/p/PCg0G
>>
>>7443407
>what is causing it
1. blindly pasting stuff
2. spastic hovers for no reason
3. transition: opacity 0.15s ease-in, max-height 0.15s linear;
4. transition: opacity 0.15s ease-in !important;
5. not clarifying which part you deem an issue
>>
>>7443407
>>7443416
It's also a painfully bloated. 97 lines for something that takes 15 in reality (or less. mine is probably bloat as well because I'm a dummy)
>>
File: screenshot.png (98 KB, 1360x738)
98 KB
98 KB PNG
>>7443416
>transition: opacity 0.15s
Removed them both and that seemingly solved most of the issue.

>not clarifying which part you deem an issue
The website overlapping with the tab bar. I thought that was obvious enough, I showed it thrice.

Right now, the only thing left to figure out is why is there this chunk of transparent space and a gray line right under the tabs bar.
I think it might have something to do with the tabs dimensions...? I don't know how to fix it though.
I'm gonna try things at random until someone who knows about this stuff can give me a bit of help.
>>
>>7443420
I don't know a thing about this, but I think that things like auto-hide.css have different options set for the themes and density settings that Firefox has.
Certain dimensions for the Compact Mode with a Dark Theme and so on?
Not sure though, I know nothing about this. I just wanted a quick stylesheet with hoverable navbar and bookmarks bar desu with you.
>>
>>7443407
>>7443423
>>7443424
Alright, that didn't take long.
Here it is. It might be painfully bloated, but hey, at least it works. If someone wanted to clean it up and share it, that would be cool, but the current result is good enough for me.
https://paste .ee/p/xift9
>>
>>7443434
gray lines goes away with
#navigator-toolbox::after {
border-bottom: 0px;
}
probably. it's usually that.


I stand firm on the fact that writing 80 extra lines of dumb code instead of a single comment that instructs the user to change a single value if they aren't running default sizes is very silly. If nothing else the readability is absolutely awful.

(if it was cleaner you could maybe have spotted it yourself even if you're completely new)
>>
>>7426072
I have the same problem whit my fonts.
You found a solution?




Delete Post: [File Only] Style:
[Disable Mobile View / Use Desktop Site]

[Enable Mobile View / Use Mobile Site]

All trademarks and copyrights on this page are owned by their respective parties. Images uploaded are the responsibility of the Poster. Comments are owned by the Poster.