[IPFire Artwork] Questions for the CSS based on the mockup and technical question related to Server and GIT

Sven sven.hoehn at posteo.de
Wed Mar 29 14:18:19 CEST 2017

> On 29. Mar 2017, at 13:54, Michael Tremer <michael.tremer at ipfire.org> wrote:
> Hi,
> On Tue, 2017-03-28 at 23:54 +0200, Maurice Gesswein wrote:
>> Hey Sven,
>> see my inline comments...
>> On Tue, Mar 28, 2017 at 10:32 PM, Sven <sven.hoehn at posteo.de> wrote:
>>> Hello,
>>> I have some questions:
>>> What is the base-font size? 16px (SM) or 20px (M)?
>> I use 16px for body text in all viewports. Only in some cases the
>> text sizes are different in some viewports for the same case. For the
>> WUI (IPFire Admin Interface) I'm going to use 14px as the default
>> size.
>>> It is okay if I use rem for the font-size? (It’s the default in
>>> bootstrap).
>> If I convert rem into px later on based your finished pages and I get
>> the px size back I defined than I'm happy :) I leave the decision to
>> you. I can't use rem in Sketch. So I'll provide always px.
>>> How we handle the headings do we use h1-h6 with given sizes or are
>>> the sizes defined via classes 4xl-xs?
>>> (Keine Ahnung ob das so zu verstehen ist. Also meine Frage ist ob
>>> wir für die Überschriften die Schriftgrößen bei H1-H6 definieren
>>> oder wir die Größen über Klassen festlegen also 4xl-xs?)
>> Use the way which do you think works better :)
> I think it is best to change the bootstrap template to what we need and
> then we are fine.
> Bootstrap 4 has also extra classed for "display" headings. Maybe it is
> those that we should change. Probably just the default ones.

At the moment I think to just edit the _variable.scss from bootstrap and then add the missing pieces.
There are all the definitions for fonts, sizes, colours etc.

>>> What are the fallback fonts? Ubuntu, “Helvetica Neue”, Arial, sans-
>>> serif?
>> I suggest the common fallback. I can't remember a case where the
>> webfont was not able to load.
> How do you guys feel about the Ubuntu font anyways?

I like the Ubuntu font.

>>> The grid is the default Bootstrap Grid (12 columns) with a padding
>>> of 24px instead of the default 30px?
>> Correct.
>> e.g. https://www.dropbox.com/home/IPFire/IPFire-Share/Website?preview
>> =Website+-+Start+-+XL+-+GRID.png
>>> Do we use the color naming from the Zeplin Project or a semantic
>>> color naming like brand-primary, brand-info etc.?
>> I prefer names as provided in Zeplin. They are named how they look
>> and not for what they are planed to use. It avoids confusion in cases
>> like: A blue is named "info-blue" and later on it should be used for
>> a donut-chart fragment as well. "info-blue" doesn't fit anymore.
> I think we should go with the bootstrap names again. We exactly have
> colours for the success, info, danger, etc. states and I used that in
> all the existing markup already. So going with that way we don't have
> to change too much in the HTML and just get the right colour
> everywhere.
> The fewer stuff we have to customise the better.
>>> If I create a note file for myself, do I also put this file on git?
> Could do. Depends on what it is really. Generally I would like to keep
> everything open and accessible for everyone. So we can see what the
> status is, review what we need to review and so on.

I copied some examples from the Bootstrap documentation in there for the naming of the media-queries and the scss mixin, so that I don’t have to go back every time.

>>> How often do you want me to submit the work, is once a day enough?
> I would prefer small and logical steps. That doesn't have to be once a
> day. Usually that is more often :)
> You can use branches for stuff as well. I usually make sure that by the
> end of my working day everything is in Git - just to have a backup.

It’s the first time that I work with Git, so I have no experience with it.

>>> I’m not familiar with the Python webserver it is better to serve
>>> less files (like in HTTP) or more small files (like in HTTP/2)?
> This will just be used to serve the HTML. The assets like JS and CSS
> will be served by nginx later. I try to keep the number of files as low
> as possible because that means fewer requests.
> However, I do not see that there will be more files required. You
> should not need to create more JS and CSS will just be modifying the
> Bootstrap template which is one (rather large) file.

At the moment there are 3 css files and 3 js files if I remember, for less files I would go down to just one minified-CSS and one local minified-JS file on the webpage.
On my end I will combine the needed Bootstrap files plus the customisation via @import in the scss file and compile only the one css file.

>>> Can I remove all the HTTP prefixes in the template file and put
>>> only //. At the moment both methods are used.
> Some of the websites are served over http, some over https.

So at the moment there is no plan to bring everything over to HTTPS?

> We deliver assets from static.ipfire.org <http://static.ipfire.org/> in production, so that nobody
> needs to download these files multiple times when they browser across
> domain names on the same webapp.

I leave it as it is.

> Hope this answers all these questions so far. Please do send more if
> there are any.


> What is the progress so far? How are you doing? I cannot tell by the
> questions you are asking :)

Now that I think to have all the pieces I put them together and we will see what happens.

> -Michael

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.ipfire.org/pipermail/ipfire-artwork/attachments/20170329/9dbcc6ec/attachment-0001.html>

More information about the IPFire-Artwork mailing list