Common Custom Elements use in SabzCity Platforms
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
a-base-tags
a-fonts
a-style/material-design
m-connectivity-state
m-notification
m-outdated-browser
public-library
.gitignore
LICENSE
README.md
a-app-distinctions.js
a-app-engine.js
a-behaviors-a11y-keys.js
a-behaviors-checked-element.js
a-behaviors-effects-inky-focus.js
a-behaviors-effects-ripple.js
a-behaviors-form-element.js
a-behaviors-ripple.js
a-behaviors-state-button.js
a-behaviors-state-checked-element.js
a-behaviors-state-select.js
a-behaviors-validator.js
a-browser-compatibility.js
a-button-dropdown.js
a-button-radio.js
a-button-toggle.js
a-button.js
a-card.js
a-checkbox.js
a-divider.js
a-i18n-languages-list.js
a-i18n-suggest-language.js
a-i18n.js
a-icon-set.js
a-icon.js
a-icons-material.js
a-list-grid.js
a-list-simple.js
a-modal.js
a-progress.js
a-pushstate.js
a-router-appendSlashToUrl.js
a-router.js
a-style.js
a-text-container.js
a-text-input.js
a-tooltip.js
app-http-403.js
app-http-404.js
app-http-500.js
m-browser-notification.js
m-chip.js
m-dialog.js
m-expansion-panel.js
m-helper.js
m-launch-screen.js
m-menu.js
m-navigation-drawer.js
m-picker-color.js
m-picker-date.js
m-picker-lang.js
m-picker-time.js
m-slider.js
m-social-buttons.js
m-stepper.js
m-style-changer.js
m-tab.js
m-table.js
m-toast.js
m-toolbar.js
package.json
s-comments.js
s-oauth2.js
s-product.js
s-products.js
t-intro.js
t-product-simple.js

README.md

SabzCityElements

Design Methodology

We use AtomicDesign!

Naming of Elements

Atom elements           —->     a-{name_of_elements}
Molecule elements       —->     m-{name_of_elements}
Template elements       —->     t-{name_of_elements}
SabzCity SaaS elements  —->     s-{name_of_elements}
App elements            —->     app-{name_of_domain||subdomain}

Responsive Layout

Use CSS Grid & Flex

Use Animatation in Elements

Use Animatation in elements is very good but must not use so much, because it is bad user experience in long use
Can use many standard animation in Internet e.g. https://telegram.me/UI_land

PWA Architecture

For Offline apps we must use Service Worker and other browsers featured

ISO Naming

Free Sources

Some Examples