Ok, I have to Build a Website. -with a timeline

Well I dont have to use A timeline, but that is how I am seeing it in my head.

This is Saturday.
To have the majority of it up and running by Monday would be good.

… !

I have to present 24 years of Legal Paperwork to a Legal Bod, asap
And contant a local authority to let them know that Stuff is now being done by legal people.

I have got someone to finance the legal stuff, so I had better get started on the paperwork side of things.

I HATE this BS… its corrupt.

but anyway

I visualise it as a scrolling Vertical timeline, where I can make additions, drop in docs that can be downloaded etc, visuals of the docs in a preview,
Quick rundown of the docs, so you can see what. your downloading first

and hey! in the future (end of the week? :S )

A search function and maybe the ability to group items by …some grouping system.
ie, tags, Council contract , evidence of. fraud etc etc.

so , with that in mind I have been looking at several things for inspiration

and currently am looking at this as my starting off point

which has been sexily pimped here

and whilst sniffing around I see that one of the commenters on the main, instructional videos above
as re worked this as a React plugin for NPM

…so since this is such a sexy little thing, and PineGrow uses Node (waves hands in the air, as If I know what I am talking about…) would this react plugin make a Fine Contribution to the Pinegrow Blocks Library?

its here

caveat… I have NO idea of the relevance of React to NPM/ELECTRON, Pinegrow etc.

and in hindsight, Im about to check out our PG blocks now too as I have not seen them for a long time.
Or Benhannas tbh.
I have changed PG versions so much that tis one has nothing installed.

And I need to get my Productivity rolling and find my love for web stuff again as tbh, its taken a pasting lately.

Building the timeline with the sliding panels is easy. Even the animations can be done with that plug in that was recently updates. Making it all responsive is more of a challenge, because this kind of two-column layout isn’t going to fit into a cell phone display.

The search, tags, etc is another story. Now you’re talking a database.

All in two days. I don’t envy you.

thanks… it might run to 3…maybe 4… but heading for 2
and someone seems to have a fix there to make it responsive.
Oh well.
SO hello to you across the pond :wink:

maybe you missed it… or had scroll fatigue ie, couldn’t. be arsed to look down and process the info :stuck_out_tongue:
hee hee

Going Responsive

We’re almost ready! The last thing we have to do is to make our timeline responsive. 

First, on what we’ll refer to as “medium screens” (>600px and ≤900px), we only make one small modification. Specifically, we decrease the width of the divs. 

Here are the rules that we have to change:

@media screen and (max-width: 900px) {
  .timeline ul li div {
    width: 250px;
  .timeline ul li:nth-child(even) div {
    left: -289px; /*250+45-6*/

ta da!!
one column.

Actually, it’s just general fatigue. I’ve been working 16-18 hour days the last week.

Yeah that’s a bit rough.
I’ve been doing the same sort of hours, not working, getting to bed around 8am etc
just trying to get stuff done here.
I’ve had a bit of a sense of humour failure/frustration overload, lots going on, not much of it nice.
so, here we all go again>
and maybe it was the full moooooooon tooooooo.

Hi Ian,
I was wondering the following (also because it looks like this are your own personal documents and not something you have to do for a client or friend).

How important or necessary is it to put it all in a “fancy and shiny” overview…??
It all sounds VERY important, then the contents of the documents and that it all is organized is way more important than the presentation.You don’t have to proof or show them you can do a bit of webdesign! Don’t make it too difficult for yourself and focus on the right things.

I would start to put all these documents in a clear directory and file structure (by year, or category and date). So that everything is named correctly and well organized. Don’t know if you got this “organized structure” already, and maybe this is also enough to present and hand over to those people (on a USB stick or a zip file by mail).

If you want to put those documents also in a “html overview”, you can use that well organized directory and file structure as a solid base to make and build that “html overview”. And again, if you decide to do this, it don’t have to be “fancy and shiny”. A normal table structure is maybe the best and easier way to go for and is for the purpose maybe more than enough.

And about “responsive”, they probably going to view it on a wide enough screen on their office desktop or laptop. So I would not spend time on that and bother about smaller screen sizes.

And keep in mind if you present it only in such an online “html overview”, they have to click, download and save every file seperatly themselves. Which can take a long time for them, which is probably not very handy for them, because their time is valuable and also their hourly rate is high and expensive.

Then it is more “user friendly” and less time consuming for them (and also for you) to have a normal directory and file structure with all documents on a USB stick or in a zip file by mail.

Sorry for maybe being critical, but it is to help you and to see if you have your priorities right, to prevent that you spent too much time on a “shiny overview” that is not needed. To discover at the end of the week that you have to rush things and are having stress and maybe need to fall back and use a “normal” solution because you don’t have enough time left to get it all done before the deadline.

I would first take care of a normal and simple solution (which is probably more than enough) and that you have done that task and that you are able to have all the documents sorted out and that you can hand them over to them. And when that is done and ready and you still have time left. You can see if you are able to make a “fancy and shiny” overview as a nice exercise for yourself without a ticking clock because you have a deadline and to get it all done in time.

Just my thoughts!

All good and I have already had exactly the same thoughts and that is what I will be doing.


there, that was quick from me for a change.
BUT (as always)

Every solicitor/Barrister I have dealt with has also been incompetent / corrupt

-including sitting on my papers for 4 years, ignoring all requests for them , until the Statute of Limitations time period had expired - and the guilty people could NOT be taken to court.

So… I wil also be making this a PUBLIC repository, on the off chance that I can FIND SOMEONE, with some morality who HASNT sold their soul to prostitute themselves out to the highest bidder and finds my situation as REDICULOUS as everyone else but can DO SOMETHING about it.

Website wont be shiny.
and there are other things.
including the police doing nothing when I got Shot at whilst in my motorhome last July
the Health service doing nothing, screwing up and then just abandoning me, for permanently paralysed when I broke my neck in 2003 (I’m fine now! - The world works in weird ways when your determined enough)

etc etc.

So, I shall be collecting all of this into one site


but this solicitor wants to see the papers
after 24 years and 4 solicitors, 4 local authorities (changed ownership that many times over the period) and barristers.

Thats a lot of paper.
So the purpose of the timeline is to give a general overview of timespan and the ability to cherry pic documents

this Solicitor is 28, she was 2 when I started this…

She is just over half my age and charges £150 and hour.

At her Age I was a RoughNeck on the oil Rigs in the North Atlantic, nearly being killed everyday
for £13 an hour… the most I have ever earned…

It makes one think

Right, just updating this topic, with a link to a fine

Timeline Tutorial

For when I get back to this topic, or if others follow along with the thread in the future.

And this is along the same lines, but wrt Wordpress implimentation, and has more of a sorting function within it too, for sorting the order of articles into chronological order in WP.