Introduction
Kimera CSS is approaching its peak. We will build the last parts and prepare the work for major changes and new projects steps. These steps towards the future will necessarily drastic changes of this repo. We invite everyone to download and update the packs used to avoid finding themselves with no references on their sites and apps, ex: don't rely on cdn! They will probably be lost. Thank you all.
If you like this project, you would like to click on the ★ above the github page and follow us on the official fanpage: kimera framework
Kimera 2.8.X is a simple and alternative frontend framework based on css, html5 and native javascript.
The aim of this work, shared free under the GNU license, is to generate a ready-to-use development kit for interfaces and designs that are thinked for cross-platform and easy to modding. We invite you to read the API for every detail on the classes and systems of the framework. We invite you to read the API for every detail on the classes and systems of the framework.
Because it is a fast and solid base on which it is possible to build websites, apps in cordova and capacitor, programs in web coding and probably (it is in test) with electron.
Compared to many other projects, all of them are designed from scratch to reach 100, without any real intermediary.
The framework offers several advantages and particularities.
The potential, as a demo, of this project can also be seen in a preview tester at the link: https://shapegroup.github.io/kimera-tester - Remember "it's just a tester, not everything".
and if you want a list of the most common answers:
- Based on clean and pure web languages (html5,css,js);
- Internal debugging system with suggestions about your mistakes (experimental);
- Compatible with all major browsers, cross system, and php \ node ecosystems;
- Compatible with cordova app (electron and capacitor is now under testing);
- Viewport pre-typed (web and app, mobile and not);
- Customizable modals (we call it outbox);
- Customizable alert, prompt and confirm;
- Full elastic layout and fit-elements design concept;
- Different types of assets preset, grids, snaps sliders, drag & drops, and other..
- Cross themifized in css4-draft & flanked to less and other compilers;
- Integrated dynamic Ui system;
- Integrated preloader and loader system (page to page);
- built-in effects (parallax, other);
- Integrated custom effector system (click, scroll, elements, other);
- and more...
and...
-
the core is in css and js native and is detached from the theme which is always editable (so you don't happen to make a change and send everything to fuuuuuuk)
-
The elements are directly predisposed to the composition of ordered layouts, such as those of indesign, Sketch or Figma or, to understand us, in metro style windows.
The logic is: "trace an elastic container> occupy the container proportionally".
Every native element has been formatted with a completely custom reset which allows you to do everything in the list. -
The system is suitable for app layouts, desktop apps, vertical and horizontal web, for front and admin panels
-
It manages texts in their typology, in alignments, multiple and selectable ellipsis line, list types, etc.
-
The system adapts everything elastically, including images, videos etc.
-
Manages positions through simple classes like: absolute-top-left (left corner of parent box)
-
Manages spacing of elements dynamically. there is a space-pxnumber class that manages the inner padding of the traced boxes, also via mediaquery
-
It has three cleaned no rowed grids: a grid in %, the other has a masonry, and verticals grids.
-
the grids have a gap attribute and an autostrech attributes that manages spaces and centerings automatically
-
The system already manages scroll and snap scrollable elements, both for apps and for the web, as well as overflow elements between tables that are too large and other such. And ... About scroll manages, with the css, a solution to hide the scroll bars.
-
Manages the smooth on click of the links
-
It has a system to superimpose one box on the other with a simple structure and advanced modal systems (here they are called outboxes), their contents, menus etc.
-
automatically manages youtube, vimeo, instagram videos etc. (note: now in experimental for upgrading...)
-
it has a pre-integrated ui kit stylizable via theme whit datepikers, file and other.
-
the theme of ui is in css4-draft and perfectly integrated with compilers, better in Less in all its versions. However, all compiler is not mandatory, on the contrary, it is compatible with many compilers.
-
If you use less, the framework helps you not to commit nonsense about the js versions and its slowdowns.
-
it has clickable cards (div on click) based on the link inside them and expandable cards that zoom in full screen
-
has an integrated loader page that also acts as a transition between one page and another if you click on any
target = "_ self"ortarget = "_ top"with editable spinner -
has an experimental upload system integrated
-
has a small action and effects manager (small, does not generate particles but manages small things)
-
Speaking of effects:
Some are pre-integrated ... 2 are under construction while the parallax effect which, unlike the crap seen around, is related to the membership box and therefore does not smear the entire document, is already present in thefx-xParallax-[parameters]andfx-yParallax-[parameters]. -
It has an ultra-fast nomenclature syntax:
space-[100-50-20]ie padding-[100px desktop, 50 in tablet, 20 on mobile] and so are the grids (which are in% or quantity of columns) and the rest -
and more of this... Honestly, try it first :D
We are currently carrying out extensive prototyping work. This makes the framework "a gateway" between the old and the new development model.
The current version (2.8.X) aims to fix some bugs and define new UI system blocks and will be developed until its complete stability.
The latest version of these development models will come with the next version (2.9), where new classes and a plugin system will be defined. This ... will also be the latest version available on this space.
In fact we will face a new 3.0 construction concept, with custom tag, new class system and with a new name and new design ideas ... but that's another story.
We therefore advise you to keep track of the news on the official page and on this repository until everything is moved and there will be an official version.
Gapkit was a a free and open project which seeks to combine all the various aspects of IT development under a single technology (web coding). Currently the project is changing its name and evolving with our own business. The same thing is coming to this framework over time.
Nothing will be left to chance, stay tuned.
Follow the roadmap of 3.0 project
From the 3.0 version to use npm and cli, however, for now... The whole system are only 2 folders to copy and paste in your root (for example the www (or public)) to be linked as any script and css in the head of the document.
To have a more precise guide it is better to follow the steps:
If you come from an old version you will find here the news
We are thinking about how to raise funds and how we can integrate other developers on these projects ... everything in its time, for now let us feel your support with a like or a star (it means a lot the same)
Above all, if you can, notify us of any bugs and anomalies in issue system!