ro-a-fi / conflatao Goto Github PK
View Code? Open in Web Editor NEWDas neue Contao 3 Backend Themes
Das neue Contao 3 Backend Themes
Currently there are way to many different colors in use. You pretty much can not tell any difference between them, so my suggestion is to limit these. This will help us to maintain the project better and saves some bytes if gzip is activated.
@ro-a-fi Are you okay with that?
I suggest removing platform specific styles like webkit
, firefox
, safari
, opera
, ie
and js
.
Use some browser normalisation instead.
I suggest to build everything upon one coding style. Do you prefer tabs or spaces and how much do you like to indent them?
I always use two spaces for css because this is the recommendation from Google and SassGuidelines. Yeah, this topic is a debate on it's own but because you are the creator, what do you like more?
Hope this is ok, that I am pushing forward but maybe this theme might end up being in Contao 4.0 :D
Hallo Raphael, wie weit ist denn Dein Theme inzwischen? Ist es noch in Bearbeitung oder schon fertig?
Man kann in Contao 3.5.x die Bildgrößen-Einstellungen nicht öffnen, da in der Theme Übersicht das Icon dafür nicht vorhanden ist.
Are we allowed to include Source Sans Pro
in the project? I am a bit confused.
WARNING: NOTE THAT ONLY GOOGLE INC MAY DISTRIBUTE MODIFIED VERSIONS WITH THE TRADEMARK NAME "SOURCE" and only then with approval
It is the first open source font family from Adobe, distributed under the SIL Open Font License.
The OFL allows the licensed fonts to be used, studied, modified and redistributed freely as long as they are not sold by themselves.
So I think it is ok to include it into the project but I am not 100% sure.
If we have the permission I suggest to generate and only serve woff
and woff2
because they are supported by mostly any browser (~90%). Older browsers which do not support woff
also lack on supporting other features so in my opinion it is ok to fall back to a system font. Old browsers will not have to download heavy fonts with this way of serving the font.
If we want to get a bit further we can load the font async and store it in localstorage
. I've done some tests and this works really well
When hovering rows at articles or site structure, there is some strange behaviour, please see video: http://screencast.com/t/1qp0pptsn
Browser: Chrome latest
Contao: 3.5.0
ConFlatao: Master Branch (05.06.2015)
Under which license is your work, public domain?
Can we remove src/dripicons
? They are not used in the theme.
Iconfonts are not the best solution for an icon system. Best way would be to use an SVG iconsprite but unfortunately this is not supported by Contao. I think using pngs for now is the best solution.
Add styling for core elements:
https://github.com/ro-a-fi/ConFlatao/blob/master/main.css#L1785
I recommend using @media (min-width: XXX)
:
Mobile-first approach is better for smartphones because it lowers file size and reduces css parsing
Hey, how do you like relative units? Currently everything is coded in px
.
I personally use rems
since a few months. Before I used ems
but rems
work a bit nicer. The benefit of this technique would be that everything builds upon a base size. I suggest using e.g. 14px ~ 0.875rems
and use multiples / divisions for spacing. E.g. .25rem
, .5rem
, .75rem
, 1rem
, 1.5rem
. This will be a more consistent approach and also be very simple to code.
The only downside of rems
is that it is only supported in IE9+
. My go would be using rems
with a fallback of px
so it is easy to drop IE8
support in the near future.
Of course this will cause that the theme looks slightly different but I think this is a more consistent way. Also the big benefit of this is that it will scale according to the browser settings. If the user changes the default text size to e.g. 24px
everything will scale up.
Hey Raphael,
I really like this theme and would help you with it, if you want to.
My suggestion is to code it in Scss instead of regular CSS, so we can take advantage of variables for spacing and colors, functions and loops. This way, everything is more dynamic and consistent.
If you agree, I can take care of this and send you a PR :)
I think this would be a nice approach on mobile devices.
http://tympanus.net/Development/SidebarTransitions/
Google and SassGuidelines suggest to sort css declarations alphabetically. This ways there is a clear coding style.
Also this article shows that sorting reduces the file size when gzip is enabled
According to CanIUse opacity, box-sizing and box-shadow can be omitted.
If we need some prefixes, I suggest to include a build process using autoprefixer but I would shift this to tackle later on
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.