Sorry for my late reply. I copied the Captive Portal stuff inside the shared Dropbox IPFire-Share folder. Here is the link again: https://www.dropbox.com/sh/1j3p4f3igjxk2u8/AAAmebh2c1ay1t-z4UKrsWBAa?dl=0

Please use the Pattern Lib of the Website (at Zeplin) for the Captive Portal. Yes, the old StyleGuide for Captive Portal is available as well. But please use the Pattern Lib (which is located at Zeplin) as the primary guidelines.

Let me know if there are any questions.

Best,
Maurice

On Wed, Apr 12, 2017 at 5:58 PM, Michael Tremer <michael.tremer@ipfire.org> wrote:
Hi,

On Wed, 2017-04-12 at 16:10 +0200, Maurice Gesswein wrote:
> Hi,
>
> I'll check out bugzilla and add the open issues there. I used bugzilla ages
> ago :)

It's nice, but it doesn't look too great. Maybe the next big UI/UX project :)

> Other topic:
> I signed up for a small payed freelance job. Deadline is 24.4. Until that date
> I'm not sure if I can continue working on IPFire. After that date I'll of
> course continue :)

No worries. Work comes first of course.

Are the Captive Portal styleguides somewhere? So I can keep pushing on that.

And I am sure that there is enough stuff available for Sven to start working on
the Features page.

-Michael

>
> Best,
> Maurice
>
> Am 11.04.2017 4:27 nachm. schrieb "Michael Tremer" <michael.tremer@ipfire.org>
> :
> > Regarding the updated content: I am going to sit down with Daniel as soon as
> > we
> > can. It's Easter now, so maybe we get something done this weekend or the
> > week
> > after.
> >
> > I mainly want to focus on the texts and working. Maybe make them a little
> > bit
> > shorter and more to the point, but I generally do not plan to change
> > anything
> > that is big enough to change the layout, too. If we do need some changes I
> > won't
> > hesitate to ask, but it is all rather minor stuff that I do have in mind so
> > far.
> >
> > Regarding the bug tracker:
> >
> > The category exists already under "Infrastructure".
> >
> > I created a new umbrella bug which should be used to make other bugs depend
> > on
> > it. That allows us to always have a list of things that need to be dealt
> > with at
> > a glance:
> >
> >   https://bugzilla.ipfire.org/show_bug.cgi?id=11314
> >
> > Just create new reports in the same category and type in 11314 into the
> > "Depends
> > on" field.
> >
> > Bugzilla seems a big ugly and scary in the beginning but it is really
> > powerful
> > :) So give it a chance.
> >
> > Best,
> > -Michael
> >
> > On Tue, 2017-04-11 at 14:58 +0200, Maurice Gesswein wrote:
> > > Regarding the icons: I would like to use the material design icon rules.
> > With
> > > rules I mean the guidelines to create those icons. E.g. 2px stroke
> > strength.
> > > Reason: it's easy to create custom icons with these rules and the keep a
> > > consistent look. We will need a lot of icons for the WUI.
> > >
> > > Am 11.04.2017 2:47 nachm. schrieb "Sven" <sven.hoehn@posteo.de>:
> > > > > On 11. Apr 2017, at 14:43, Maurice Gesswein <zerpixelung@gmail.com>
> > wrote:
> > > > >
> > > > > Hi all,
> > > > >
> > > > > I agree. Good job so far Sven. Thanks.
> > > > >
> > > > > I see couple of more minor bugs I would like to fix. Can we please
> > create
> > > > > a to-do list which can be edit and tracked by all involved people?
> > > > > Michael, can you set up something?
> > > >
> > > > If Michael can add a new category for the website in the ipfire
> > bugtracker,
> > > > than we can add the issues there.
> > > >
> > > > > At the moment I design some key viewports for the features page and
> > the
> > > > > captive portal in parallel.
> > > > >
> > > > > Michael, if you want to implement new copies, images etc. let me know
> > and
> > > > > I can design an additional or replacement for a section of the
> > homepage.
> > > > >
> > > > > Best,
> > > > > Maurice
> > > > >
> > > > > Am 11.04.2017 12:26 nachm. schrieb "Michael Tremer" <michael.tremer@ip
> > fire
> > > > > .org>:
> > > > > > Hi,
> > > > > >
> > > > > > so finally I took the time and had a close look at the current
> > version
> > > > > > of the
> > > > > > website and I really really really like it so far.
> > > > > >
> > > > > > For me it mainly has some sort of soul. The old website was just
> > blank
> > > > > > and
> > > > > > didn't really present things very well. It just delivered the plain
> > > > > > content.
> > > > > >
> > > > > > Very well done guys.
> > > > > >
> > > > > > But this is only the start :) There is more ahead and I am really
> > > > > > looking
> > > > > > forward to present everything to our community soon!
> > > > > >
> > > > > > ----
> > > > > >
> > > > > > What I at the moment don't get from the website when I open it is
> > that
> > > > > > this is
> > > > > > saying "firewall" in any sense. I don't mean just the word but
> > visually
> > > > > > stating
> > > > > > this anywhere.
> > > > > >
> > > > > > It is not a big issue for me but at least in the block below we have
> > to
> > > > > > make
> > > > > > this clearer what IPFire actually is. This doesn't have much to do
> > with
> > > > > > the
> > > > > > design. This is just content.
> > > > > >
> > > > > > After a general introduction the reader gets to the latest news!
> > > > > >
> > > > > > And then how to support the project and contribute (at least
> > financially
> > > > > > here).
> > > > > >
> > > > > > Good flow.
> > > > > >
> > > > > > ----
> > > > > >
> > > > > > Overall I could not find any issues with the implementation so far.
> > > > > >
> > > > > > The mobile views look good. Most of the stuff that I do not like is
> > > > > > content. We
> > > > > > have to update this a bit.
> > > > > >
> > > > > > One thing is that the arrow at the bottom of the page that scrolls
> > it
> > > > > > down
> > > > > > becomes invisible when hovering over it. Maybe it should become
> > white
> > > > > > when the
> > > > > > background changes to red?
> > > > > >
> > > > > > And in the Wishlist section there is a line that says "86% funded"
> > over
> > > > > > the
> > > > > > headline of the crowd funding name. This is a slightly lighter grey
> > than
> > > > > > the
> > > > > > background and practically invisible.
> > > > > >
> > > > > > The link to the "Features" page is wrong on the top view. It points
> > to:
> > > > > > http://d
> > > > > > ev.ipfire.org/featues (an r is missing).
> > > > > >
> > > > > > ----
> > > > > >
> > > > > > Regarding code:
> > > > > >
> > > > > > The CSS seems to be quite small (I like that a lot). However, how
> > would
> > > > > > that get
> > > > > > translated from SCSS to CSS? Could you modify the Makefile so that
> > this
> > > > > > is done
> > > > > > automatically when ever something has changed or so? I am not even
> > sure
> > > > > > what
> > > > > > tools are required to build the CSS. Can we document that somehwere,
> > > > > > too?
> > > >
> > > > Small CSS? It has 5385 lines at the moment, is not that small :-) But in
> > the
> > > > live version I will compress the code.
> > > > For the CSS compilation I use a program called Codekit that complies the
> > CSS
> > > > every time I save the document.
> > > > But I will look for something that can do that step on the server.
> > > >
> > > > > > We need to do a spring clean then. Will we continue to use Font
> > Awesome
> > > > > > icons or
> > > > > > the glyphicons? If not, bin them.
> > > >
> > > > Only the icons made by Maurice as svg. No Font Awesome or glyphicons.
> > > >
> > > > > > ----
> > > > > >
> > > > > > So I think we are very close to consider the frontpage done. What
> > are
> > > > > > the next
> > > > > > steps?
> > > > > >
> > > > > > -Michael
> > > > > >
> > > > > > On Tue, 2017-04-11 at 07:09 +0200, Sven wrote:
> > > > > > > Hello,
> > > > > > > I updated the icons on the site.
> > > > > > > What else is wrong or to change?
> > > > > > >
> > > > > > >
> > > > > > > > On 9. Apr 2017, at 14:40, Maurice Gesswein <zerpixelung@gmail.co
> > m>
> > > > > > wrote:
> > > > > > > >
> > > > > > > > Sorry for the delay. I fixed the slice area for the icons. Sven,
> > > > > > please
> > > > > > > > export all of those again. All of them have now a square size.
> > > > > > Source pixel-
> > > > > > > > size is 24x24px.
> > > > > > > >
> > > > > > > > On Fri, Apr 7, 2017 at 4:40 PM, Sven <sven.hoehn@posteo.de>
> > wrote:
> > > > > > > > > there are some strange bugs with flex and webkit. I’m not sure
> > if
> > > > > > they
> > > > > > > > > come from Bootstrap or are real bugs in Webkit, but I think
> > that I
> > > > > > can
> > > > > > > > > workaround them.
> > > > > > > > >
> > > > > > > > >
> > > > > > > > > > On 7. Apr 2017, at 12:01, Michael Tremer <michael.tremer@ipf
> > ire.
> > > > > > org>
> > > > > > > > > wrote:
> > > > > > > > > >
> > > > > > > > > > Hi,
> > > > > > > > > >
> > > > > > > > > > I just updated the dev site.
> > > > > > > > > >
> > > > > > > > > > I will run a job that does this automatically once an hour
> > from
> > > > > > now on.
> > > > > > > > > >
> > > > > > > > > > Icons won't load at the moment... :(
> > > > > > > > > >
> > > > > > > > > > -Michael
> > > > > > > > > >
> > > > > > > > > > On Fri, 2017-04-07 at 08:11 +0200, Maurice Gesswein wrote:
> > > > > > > > > >>
> > > > > > > > > >>
> > > > > > > > > >> Am 06.04.2017 10:52 nachm. schrieb "Sven" <sven.hoehn@poste
> > o.de
> > > > > > >:
> > > > > > > > > >> @Michael can you please update the files for the dev
> > website
> > > > > > with the
> > > > > > > > > new
> > > > > > > > > >> commit?
> > > > > > > > > >>
> > > > > > > > > >> I correct a part of the errors written down by Maurice.
> > > > > > > > > >> Also edit the icons but now I have complete control with
> > CSS
> > > > > > but the
> > > > > > > > > sizes are
> > > > > > > > > >> not right, have to check the SVG code for that. (https://fv
> > sch.
> > > > > > com/code
> > > > > > > > > /svg-ic
> > > > > > > > > >> ons/how-to/)
> > > > > > > > > >>
> > > > > > > > > >> Seems to be that I was not clear enough, sorry. I provided
> > the
> > > > > > icons in
> > > > > > > > > a
> > > > > > > > > >> wrong way. I'll send corrected icons at 24x24 this evening.
> > > > > > Just scale
> > > > > > > > > the
> > > > > > > > > >> existing icons to a square will not work as expected. The
> > > > > > optical
> > > > > > > > > proportions
> > > > > > > > > >> will be lost. Feel free to compare them with the existing
> > ones
> > > > > > and you
> > > > > > > > > will
> > > > > > > > > >> see the difference.
> > > > > > > > > >>
> > > > > > > > > >>
> > > > > > > > > >>
> > > > > > > > > >>
> > > > > > > > > >>> On 6. Apr 2017, at 15:19, Sven <sven.hoehn@posteo.de>
> > wrote:
> > > > > > > > > >>>
> > > > > > > > > >>>
> > > > > > > > > >>>> On 6. Apr 2017, at 14:19, Michael Tremer <michael.tremer@
> > ipfi
> > > > > > re.org>
> > > > > > > > > >>>> wrote:
> > > > > > > > > >>>>
> > > > > > > > > >>>> First of all loads of thanks to you two for working on
> > this.
> > > > > > This is
> > > > > > > > > >>>> really
> > > > > > > > > >>>> coming along looking awesome.
> > > > > > > > > >>>>
> > > > > > > > > >>>> How do we fix the "visual bugs" now?
> > > > > > > > > >>>
> > > > > > > > > >>> Good question,
> > > > > > > > > >>>
> > > > > > > > > >>>> I am not really on the same page with what should be
> > finished
> > > > > > now and
> > > > > > > > > what
> > > > > > > > > >>>> not.
> > > > > > > > > >>>> Many pages look broken and I assume you just have not
> > been
> > > > > > working on
> > > > > > > > > >>>> these, yet
> > > > > > > > > >>>> :)
> > > > > > > > > >>>
> > > > > > > > > >>> I didn’t look at any other page except the homepage and to
> > me
> > > > > > it’s not
> > > > > > > > > clear
> > > > > > > > > >>> which page get a complete new layout and which page get
> > only
> > > > > > the
> > > > > > > > > “style-
> > > > > > > > > >>> update”.
> > > > > > > > > >>>
> > > > > > > > > >>>> And I have some smaller things that don't seem to look
> > right
> > > > > > in
> > > > > > > > > Firefox.
> > > > > > > > > >>>> Is this
> > > > > > > > > >>>> the right time to collect these, yet?
> > > > > > > > > >>>
> > > > > > > > > >>> Yes. But let us open a ticket on the bug tracker for the
> > > > > > webpage.
> > > > > > > > > >>> I think that some of the things that don’t look right to
> > you
> > > > > > are the
> > > > > > > > > same
> > > > > > > > > >>> for Maurice.
> > > > > > > > > >>>
> > > > > > > > > >>> @Michael can you create the ticket? I’m not sure in which
> > > > > > category it
> > > > > > > > > goes.
> > > > > > > > > >>> Thanks.
> > > > > > > > > >>>
> > > > > > > > > >>>> -Michael
> > > > > > > > > >>>>
> > > > > > > > > >>>> On Wed, 2017-04-05 at 23:02 +0200, Maurice Gesswein
> > wrote:
> > > > > > > > > >>>>> First output looks very promising for me. Thanks Sven!
> > > > > > > > > >>>>>
> > > > > > > > > >>>>> It seems to be that something went weird with the colors
> > at
> > > > > > Zeplin.
> > > > > > > > > At
> > > > > > > > > >>>>> the
> > > > > > > > > >>>>> thumbnails they look good, when you open a screen they
> > > > > > doesn't. Good
> > > > > > > > > >>>>> news: Hex
> > > > > > > > > >>>>> codes are correct! :) I'll figure out what went wrong
> > and
> > > > > > perhaps I
> > > > > > > > > >>>>> found
> > > > > > > > > >>>>> another tool like Zeplin which can be archived by
> > Michael ;p
> > > > > > Stay
> > > > > > > > > tuned,
> > > > > > > > > >>>>> still
> > > > > > > > > >>>>> checking the feature set.
> > > > > > > > > >>>>>
> > > > > > > > > >>>>> Next thing is that Zeplin interprets the properties of
> > e.g.
> > > > > > a font
> > > > > > > > > >>>>> correct but
> > > > > > > > > >>>>> might be unclear for others. Please use the properties
> > ABOVE
> > > > > > the CSS
> > > > > > > > > box
> > > > > > > > > >>>>> as
> > > > > > > > > >>>>> the primary information about the selected element. Than
> > > > > > your
> > > > > > > > > mentioned
> > > > > > > > > >>>>> opacity issue should be clear. The colors should look
> > like
> > > > > > this:
> > > > > > > > > rgba(0,
> > > > > > > > > >>>>> 0, 0,
> > > > > > > > > >>>>> 0.6).
> > > > > > > > > >>>>>
> > > > > > > > > >>>>>
> > > > > > > > > >>>>> I found several things I would like to fix:
> > > > > > > > > >>>>> I noticed that I have to build up the Sketch file in a
> > > > > > different way
> > > > > > > > > >>>>> that
> > > > > > > > > >>>>> icons will be exported correct as 24x24px size. At the
> > > > > > moment they
> > > > > > > > > are
> > > > > > > > > >>>>> cropped. At their proper size of 24x24px it will be a
> > lot
> > > > > > easier to
> > > > > > > > > >>>>> align
> > > > > > > > > >>>>> those vertically correct. I'll update the Icon screen
> > asap.
> > > > > > > > > >>>>> Please recheck all opacity values. A lot of them are not
> > > > > > correct. I
> > > > > > > > > >>>>> guess
> > > > > > > > > >>>>> that's due to the CSS output of Zeplin and how I set up
> > the
> > > > > > Sketch
> > > > > > > > > file.
> > > > > > > > > >>>>> Use
> > > > > > > > > >>>>> the values which are shown above the CSS box.
> > > > > > > > > >>>>> Please also recheck the line-heights of each font-style.
> > > > > > Some of
> > > > > > > > > them
> > > > > > > > > >>>>> has
> > > > > > > > > >>>>> strange values.
> > > > > > > > > >>>>> Font weight on buttons should be medium/600.
> > > > > > > > > >>>>> Ghost buttons doesn't have dropshadows
> > > > > > > > > >>>>> Lots of elements become smaller at <992px width. That
> > should
> > > > > > not
> > > > > > > > > >>>>> happens.
> > > > > > > > > >>>>> It seems to be that the gaps of the grid were not set to
> > > > > > 24px
> > > > > > > > > instead of
> > > > > > > > > >>>>> 30px.
> > > > > > > > > >>>>> Aren't they? If this would cause too much trouble, we
> > can
> > > > > > leave it
> > > > > > > > > as it
> > > > > > > > > >>>>> is.
> > > > > > > > > >>>>> It doesn't have a bad impact.
> > > > > > > > > >>>>> "Fire" of IPFire in the top navigation is not
> > bold/medium
> > > > > > > > > >>>>> The buttons has lots of different heights. Please set a
> > > > > > fixed height
> > > > > > > > > of
> > > > > > > > > >>>>> 36 for
> > > > > > > > > >>>>> default buttons and 48px for big buttons
> > > > > > > > > >>>>> The touch target area is missing at the default buttons
> > > > > > (48px
> > > > > > > > > height).
> > > > > > > > > >>>>> That's
> > > > > > > > > >>>>> important to provide a good user experience at touch
> > > > > > devices. The
> > > > > > > > > >>>>> clickable
> > > > > > > > > >>>>> area must be big enough that fat finger hits it the
> > first
> > > > > > time ;)
> > > > > > > > > >>>>> At viewport <992px the burger icon is not left aligned
> > > > > > anymore. But
> > > > > > > > > you
> > > > > > > > > >>>>> already said that you doesn't spend much time at the
> > > > > > navigation so
> > > > > > > > > far.
> > > > > > > > > >>>>> Some more minor issues... But for now it should be
> > enough to
> > > > > > fix :)
> > > > > > > > > >>>>>
> > > > > > > > > >>>>> Do we want to set up a Trello board for all these and
> > > > > > upcoming
> > > > > > > > > todos?
> > > > > > > > > >>>>> I'm also
> > > > > > > > > >>>>> fine by using Git issues for that.
> > > > > > > > > >>>>>
> > > > > > > > > >>>>> Best,
> > > > > > > > > >>>>> Maurice
> > > > > > > > > >>>>>
> > > > > > > > > >>>>> On Wed, Apr 5, 2017 at 8:02 PM, Sven <sven.hoehn@posteo.
> > de>
> > > > > > wrote:
> > > > > > > > > >>>>>> and now how we proceed?
> > > > > > > > > >>>>>>
> > > > > > > > > >>>>>> Are you writing down a list with all the things to
> > change?
> > > > > > > > > >>>>>>
> > > > > > > > > >>>>>> Do we talk so that everybody express what he thinks and
> > > > > > what to
> > > > > > > > > >>>>>> change?
> > > > > > > > > >>>>>>
> > > > > > > > > >>>>>>
> > > > > > > > > >>>>>>> On 5. Apr 2017, at 19:55, Michael Tremer <michael.trem
> > er@i
> > > > > > pfire.or
> > > > > > > > > g>
> > > > > > > > > >>>>>> wrote:
> > > > > > > > > >>>>>>> Hi,
> > > > > > > > > >>>>>>>
> > > > > > > > > >>>>>>> it is all up on http://dev.ipfire.org
> > > > > > > > > >>>>>>>
> > > > > > > > > >>>>>>> If you want to view fireinfo, just add the "dev" to
> > the
> > > > > > domain.
> > > > > > > > > For
> > > > > > > > > >>>>>> example:
> > > > > > > > > >>>>>>>   http://fireinfo.dev.ipfire.org
> > > > > > > > > >>>>>>>
> > > > > > > > > >>>>>>> Do the same for planet, wishlist, etc...
> > > > > > > > > >>>>>>>
> > > > > > > > > >>>>>>> -Michael
> > > > > > > > > >>>>>>>
> > > > > > > > > >>>>>>> On Wed, 2017-04-05 at 18:11 +0100, Michael Tremer
> > wrote:
> > > > > > > > > >>>>>>>> Hi,
> > > > > > > > > >>>>>>>>
> > > > > > > > > >>>>>>>> On Tue, 2017-04-04 at 22:18 +0200, Sven wrote:
> > > > > > > > > >>>>>>>>> Hello everybody,
> > > > > > > > > >>>>>>>>> I’m thinkin’ that the coding of the home page has
> > > > > > reached a
> > > > > > > > > >>>>>>>>> point where
> > > > > > > > > >>>>>> we
> > > > > > > > > >>>>>>>>> need the site live to discuss.
> > > > > > > > > >>>>>>>>
> > > > > > > > > >>>>>>>> Great!
> > > > > > > > > >>>>>>>>
> > > > > > > > > >>>>>>>>> It’s not pixel perfect, the mobile menu is only the
> > > > > > bootstrap
> > > > > > > > > >>>>>>>>> version
> > > > > > > > > >>>>>> from
> > > > > > > > > >>>>>>>>> top
> > > > > > > > > >>>>>>>>> down and not from the left like in the mookups, the
> > SCSS
> > > > > > code is
> > > > > > > > > >>>>>>>>> still
> > > > > > > > > >>>>>> very
> > > > > > > > > >>>>>>>>> chaotic, the image-scaling dosen’t work like
> > expected
> > > > > > and the
> > > > > > > > > >>>>>>>>> svg
> > > > > > > > > >>>>>> scaling
> > > > > > > > > >>>>>>>>> dosen’t work at all in Safari, but it’s good enough
> > to
> > > > > > have a
> > > > > > > > > >>>>>> conversation.
> > > > > > > > > >>>>>>>>> @Michael it is possible to include html markup
> > between
> > > > > > these
> > > > > > > > > >>>>>>>>> brackets {{
> > > > > > > > > >>>>>>>>> _("IPFire") }} for example {{
> > > > > > _(“IP<strong>Fire</strong>") }}
> > > > > > > > > >>>>>>>>
> > > > > > > > > >>>>>>>> No. The translation function escapes all HTML.
> > > > > > > > > >>>>>>>>
> > > > > > > > > >>>>>>>>> @Maurice I have troubles with the colours, in zeplin
> > for
> > > > > > example
> > > > > > > > > >>>>>>>>> the
> > > > > > > > > >>>>>>>>> background is $blue_grey_900 but with a opacity of
> > 0.6
> > > > > > when I
> > > > > > > > > >>>>>>>>> put the
> > > > > > > > > >>>>>> same
> > > > > > > > > >>>>>>>>> values in my css the colour seems darker.
> > > > > > > > > >>>>>>>>> But its easier to go all of these details when you
> > see
> > > > > > it in
> > > > > > > > > >>>>>>>>> your
> > > > > > > > > >>>>>> browser.
> > > > > > > > > >>>>>>>>> Greetings,
> > > > > > > > > >>>>>>>>> Sven
> > > > > > > > > >>>>>>>>
> > > > > > > > > >>>>>>>> -Michael
> > > > > > > > > >>
> > > > > > > > >
> > > > > > > > >
> > > > > > >
> > > > > > > 
> > > >
> > > >