├── .gitignore ├── CHANGELOG.md ├── Dockerfile ├── LICENSE.md ├── README.md ├── core ├── __init__.py ├── asgi.py ├── settings.py ├── urls.py └── wsgi.py ├── env.example ├── manage.py ├── media ├── air-zoom-pegasus │ ├── card.jpg │ └── cover.jpg ├── nike-go-flyease │ ├── card.jpg │ └── cover.jpg ├── nike-goalkeeper-match │ ├── card.jpg │ └── cover.jpg └── paris-saint-germain-strike │ ├── card.jpg │ └── cover.jpg ├── products ├── __init__.py ├── admin.py ├── apps.py ├── models.py ├── static │ └── assets │ │ ├── css │ │ ├── nucleo-icons.css │ │ ├── nucleo-svg.css │ │ ├── soft-design-system.css │ │ └── soft-design-system.min.css │ │ ├── fonts │ │ ├── nucleo-icons.eot │ │ ├── nucleo-icons.svg │ │ ├── nucleo-icons.ttf │ │ ├── nucleo-icons.woff │ │ ├── nucleo-icons.woff2 │ │ ├── nucleo.eot │ │ ├── nucleo.ttf │ │ ├── nucleo.woff │ │ └── nucleo.woff2 │ │ ├── img │ │ ├── anastasia.jpg │ │ ├── annie-spratt.jpg │ │ ├── apple-icon.png │ │ ├── blog7-1.jpg │ │ ├── blog7-2.jpg │ │ ├── blog7-3.jpg │ │ ├── brooke.jpg │ │ ├── bruce-mars.jpg │ │ ├── card-2.jpg │ │ ├── card-3.jpg │ │ ├── charles.jpg │ │ ├── curved-images │ │ │ ├── curved-10.jpg │ │ │ ├── curved-11.jpg │ │ │ ├── curved-6.jpg │ │ │ ├── curved-8.jpg │ │ │ ├── curved.jpg │ │ │ ├── curved1.jpg │ │ │ ├── curved11-small.jpg │ │ │ ├── curved11.jpg │ │ │ ├── curved13.jpg │ │ │ ├── curved14.jpg │ │ │ ├── curved2.jpg │ │ │ ├── curved5-small.jpg │ │ │ ├── curved5.jpg │ │ │ ├── curved6-small.jpg │ │ │ ├── curved6.jpg │ │ │ └── curved8.jpg │ │ ├── down-arrow-dark.svg │ │ ├── down-arrow-white.svg │ │ ├── down-arrow.svg │ │ ├── favicon.png │ │ ├── illustrations │ │ │ ├── chat.png │ │ │ └── sign-up.png │ │ ├── ivana-square.jpg │ │ ├── ivana.jpg │ │ ├── ivancik.jpg │ │ ├── jordan.jpg │ │ ├── kal-visuals-square.jpg │ │ ├── kal-visuals.jpg │ │ ├── logos │ │ │ ├── gray-logos │ │ │ │ ├── logo-apple.svg │ │ │ │ ├── logo-behance.svg │ │ │ │ ├── logo-coinbase.svg │ │ │ │ ├── logo-digitalocean.svg │ │ │ │ ├── logo-facebook.svg │ │ │ │ ├── logo-nasa.svg │ │ │ │ ├── logo-netflix.svg │ │ │ │ ├── logo-pinterest.svg │ │ │ │ ├── logo-spotify.svg │ │ │ │ └── logo-vodafone.svg │ │ │ ├── medium-logos │ │ │ │ ├── logo-apple.svg │ │ │ │ ├── logo-behance.svg │ │ │ │ ├── logo-coinbase.svg │ │ │ │ ├── logo-facebook.svg │ │ │ │ ├── logo-google.svg │ │ │ │ ├── logo-mailchimp.svg │ │ │ │ ├── logo-nasa.svg │ │ │ │ ├── logo-netflix.svg │ │ │ │ ├── logo-pinterest.svg │ │ │ │ └── logo-spotify.svg │ │ │ ├── small-logos │ │ │ │ ├── logo-apple.svg │ │ │ │ ├── logo-asana.svg │ │ │ │ ├── logo-atlassian.svg │ │ │ │ ├── logo-google-drive.svg │ │ │ │ ├── logo-invision.svg │ │ │ │ ├── logo-jira.svg │ │ │ │ ├── logo-shopify.svg │ │ │ │ ├── logo-slack.svg │ │ │ │ ├── logo-spotify.svg │ │ │ │ ├── logo-weave.svg │ │ │ │ ├── logo-webdev.svg │ │ │ │ └── logo-xd.svg │ │ │ └── white-logos │ │ │ │ ├── logo-google-white.svg │ │ │ │ └── logo-spotify-white.svg │ │ ├── marie.jpg │ │ ├── meeting.jpg │ │ ├── nastuh.jpg │ │ ├── office-dark.jpg │ │ ├── shapes │ │ │ ├── pattern-lines.svg │ │ │ ├── waves-gray.svg │ │ │ └── waves-white.svg │ │ ├── team-1.jpg │ │ ├── team-2.jpg │ │ ├── team-3.jpg │ │ ├── team-4.jpg │ │ ├── toa-heftiba.jpg │ │ └── wave-1.svg │ │ ├── js │ │ ├── core │ │ │ ├── bootstrap.min.js │ │ │ └── popper.min.js │ │ ├── payments.js │ │ ├── plugins │ │ │ ├── choices.min.js │ │ │ ├── countup.min.js │ │ │ ├── flatpickr.min.js │ │ │ ├── moment.min.js │ │ │ ├── parallax.min.js │ │ │ ├── perfect-scrollbar.min.js │ │ │ ├── prism.min.js │ │ │ ├── rellax.min.js │ │ │ ├── tilt.min.js │ │ │ └── typedjs.js │ │ ├── soft-design-system.js │ │ └── soft-design-system.min.js │ │ └── scss │ │ ├── soft-design-system.scss │ │ └── soft-design-system │ │ ├── _alert.scss │ │ ├── _buttons.scss │ │ ├── _cards.scss │ │ ├── _dropdown.scss │ │ ├── _footer.scss │ │ ├── _gradients.scss │ │ ├── _header.scss │ │ ├── _info-areas.scss │ │ ├── _misc.scss │ │ ├── _nav.scss │ │ ├── _navbar.scss │ │ ├── _pagination.scss │ │ ├── _popovers.scss │ │ ├── _progress.scss │ │ ├── _tooltips.scss │ │ ├── _typography.scss │ │ ├── _utilities.scss │ │ ├── _variables.scss │ │ ├── avatars │ │ ├── _avatar-group.scss │ │ └── _avatar.scss │ │ ├── bootstrap │ │ ├── _accordion.scss │ │ ├── _alert.scss │ │ ├── _badge.scss │ │ ├── _breadcrumb.scss │ │ ├── _button-group.scss │ │ ├── _buttons.scss │ │ ├── _card.scss │ │ ├── _carousel.scss │ │ ├── _close.scss │ │ ├── _containers.scss │ │ ├── _dropdown.scss │ │ ├── _forms.scss │ │ ├── _functions.scss │ │ ├── _grid.scss │ │ ├── _helpers.scss │ │ ├── _images.scss │ │ ├── _list-group.scss │ │ ├── _mixins.scss │ │ ├── _modal.scss │ │ ├── _nav.scss │ │ ├── _navbar.scss │ │ ├── _pagination.scss │ │ ├── _popover.scss │ │ ├── _progress.scss │ │ ├── _reboot.scss │ │ ├── _root.scss │ │ ├── _spinners.scss │ │ ├── _tables.scss │ │ ├── _toasts.scss │ │ ├── _tooltip.scss │ │ ├── _transitions.scss │ │ ├── _type.scss │ │ ├── _utilities.scss │ │ ├── _variables.scss │ │ ├── bootstrap-grid.scss │ │ ├── bootstrap-reboot.scss │ │ ├── bootstrap-utilities.scss │ │ ├── bootstrap.scss │ │ ├── forms │ │ │ ├── _floating-labels.scss │ │ │ ├── _form-check.scss │ │ │ ├── _form-control.scss │ │ │ ├── _form-range.scss │ │ │ ├── _form-select.scss │ │ │ ├── _form-text.scss │ │ │ ├── _input-group.scss │ │ │ ├── _labels.scss │ │ │ └── _validation.scss │ │ ├── helpers │ │ │ ├── _clearfix.scss │ │ │ ├── _colored-links.scss │ │ │ ├── _position.scss │ │ │ ├── _ratio.scss │ │ │ ├── _stretched-link.scss │ │ │ ├── _text-truncation.scss │ │ │ └── _visually-hidden.scss │ │ ├── mixins │ │ │ ├── _alert.scss │ │ │ ├── _border-radius.scss │ │ │ ├── _box-shadow.scss │ │ │ ├── _breakpoints.scss │ │ │ ├── _buttons.scss │ │ │ ├── _caret.scss │ │ │ ├── _clearfix.scss │ │ │ ├── _container.scss │ │ │ ├── _deprecate.scss │ │ │ ├── _forms.scss │ │ │ ├── _gradients.scss │ │ │ ├── _grid.scss │ │ │ ├── _image.scss │ │ │ ├── _list-group.scss │ │ │ ├── _lists.scss │ │ │ ├── _pagination.scss │ │ │ ├── _reset-text.scss │ │ │ ├── _resize.scss │ │ │ ├── _table-variants.scss │ │ │ ├── _text-truncate.scss │ │ │ ├── _transition.scss │ │ │ ├── _utilities.scss │ │ │ └── _visually-hidden.scss │ │ ├── utilities │ │ │ └── _api.scss │ │ └── vendor │ │ │ └── _rfs.scss │ │ ├── cards │ │ └── card-background.scss │ │ ├── custom │ │ ├── _styles.scss │ │ └── _variables.scss │ │ ├── forms │ │ ├── _form-check.scss │ │ ├── _form-select.scss │ │ ├── _form-switch.scss │ │ ├── _forms.scss │ │ ├── _input-group.scss │ │ ├── _inputs.scss │ │ └── _labels.scss │ │ ├── mixins │ │ ├── _hover.scss │ │ └── mixins.scss │ │ ├── theme.scss │ │ ├── variables │ │ ├── _animations.scss │ │ ├── _avatars.scss │ │ ├── _cards.scss │ │ ├── _choices.scss │ │ ├── _dropdowns.scss │ │ ├── _form-switch.scss │ │ ├── _header.scss │ │ ├── _info-areas.scss │ │ ├── _misc.scss │ │ ├── _navbar.scss │ │ ├── _pagination.scss │ │ └── _utilities.scss │ │ └── vendor │ │ ├── _choices.scss │ │ ├── _flatpickr.scss │ │ ├── _nouislider.scss │ │ ├── _prism.scss │ │ └── plugins.scss ├── templates │ ├── ecommerce │ │ ├── create-product.html │ │ ├── index.html │ │ ├── modal-warning.html │ │ ├── payment-cancelled.html │ │ ├── payment-success.html │ │ └── template.html │ ├── includes │ │ ├── footer.html │ │ ├── navigation-light.html │ │ ├── navigation-transparent.html │ │ ├── navigation.html │ │ └── scripts.html │ ├── layouts │ │ ├── base-fullscreen.html │ │ ├── base-presentation.html │ │ └── base.html │ ├── pages │ │ ├── attention-catchers-alerts.html │ │ ├── attention-catchers-modals.html │ │ ├── attention-catchers-tooltips-popovers.html │ │ ├── elements-avatars.html │ │ ├── elements-badges.html │ │ ├── elements-breadcrumbs.html │ │ ├── elements-buttons.html │ │ ├── elements-dropdowns.html │ │ ├── elements-progress-bars.html │ │ ├── elements-toggles.html │ │ ├── elements-typography.html │ │ ├── index.html │ │ ├── input-areas-forms.html │ │ ├── input-areas-inputs.html │ │ ├── navigation-nav-tabs.html │ │ ├── navigation-navbars.html │ │ ├── navigation-pagination.html │ │ ├── page-403.html │ │ ├── page-404.html │ │ ├── page-500.html │ │ ├── page-about-us.html │ │ ├── page-author.html │ │ ├── page-contact-us.html │ │ ├── page-sections-features.html │ │ ├── page-sections-hero-sections.html │ │ ├── page-sign-in.html │ │ └── page-sign-up.html │ └── products │ │ └── featured.json ├── templatetags │ ├── __init__.py │ └── string_to_json.py ├── tests.py ├── urls.py ├── utils.py └── views.py ├── requirements.txt └── static └── .gitkeep /.gitignore: -------------------------------------------------------------------------------- 1 | # Byte-compiled / optimized / DLL files 2 | __pycache__/ 3 | *.py[cod] 4 | *$py.class 5 | 6 | # C extensions 7 | *.so 8 | 9 | # Distribution / packaging 10 | .Python 11 | build/ 12 | develop-eggs/ 13 | dist/ 14 | downloads/ 15 | eggs/ 16 | .eggs/ 17 | lib/ 18 | lib64/ 19 | parts/ 20 | sdist/ 21 | var/ 22 | wheels/ 23 | *.egg-info/ 24 | .installed.cfg 25 | *.egg 26 | MANIFEST 27 | 28 | # PyInstaller 29 | # Usually these files are written by a python script from a template 30 | # before PyInstaller builds the exe, so as to inject date/other infos into it. 31 | *.manifest 32 | *.spec 33 | 34 | # Installer logs 35 | pip-log.txt 36 | pip-delete-this-directory.txt 37 | 38 | # Unit test / coverage reports 39 | htmlcov/ 40 | .tox/ 41 | .coverage 42 | .coverage.* 43 | .cache 44 | nosetests.xml 45 | coverage.xml 46 | *.cover 47 | .hypothesis/ 48 | .pytest_cache/ 49 | 50 | # Translations 51 | *.mo 52 | *.pot 53 | 54 | # Django stuff: 55 | *.log 56 | local_settings.py 57 | db.sqlite3 58 | 59 | # Flask stuff: 60 | instance/ 61 | .webassets-cache 62 | 63 | # Scrapy stuff: 64 | .scrapy 65 | 66 | # Sphinx documentation 67 | docs/_build/ 68 | 69 | # PyBuilder 70 | target/ 71 | 72 | # Jupyter Notebook 73 | .ipynb_checkpoints 74 | 75 | # pyenv 76 | .python-version 77 | 78 | # celery beat schedule file 79 | celerybeat-schedule 80 | 81 | # SageMath parsed files 82 | *.sage.py 83 | 84 | # Environments 85 | .env 86 | .env* 87 | .venv 88 | env/ 89 | venv/ 90 | ENV/ 91 | env.bak/ 92 | venv.bak/ 93 | 94 | # Spyder project settings 95 | .spyderproject 96 | .spyproject 97 | 98 | # Rope project settings 99 | .ropeproject 100 | 101 | # mkdocs documentation 102 | /site 103 | 104 | # mypy 105 | .mypy_cache/ 106 | 107 | /node_modules/ 108 | /avatar/ 109 | /qr/ 110 | /result/ 111 | /staticfiles/ 112 | local.py 113 | /mediafiles/ 114 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | ## [1.0.10] 2025-03-05 4 | ### Changes 5 | 6 | - Added PRO Version: [Rocket eCommerce](https://app-generator.dev/product/rocket-ecommerce/django/) 7 | 8 | ## [1.0.9] 2024-04-06 9 | ### Changes 10 | 11 | - Update [Rocket eCommerce](https://app-generator.dev/product/rocket-ecommerce/django/) Section 12 | - Adding FIGMA 13 | 14 | ## [1.0.8] 2024-04-06 15 | ### Changes 16 | 17 | - README Update 18 | - [Rocket eCommerce](https://appseed.us/product/rocket-ecommerce/django/) `PRO Version` link 19 | 20 | ## [1.0.7] 2024-03-25 21 | ### Changes 22 | 23 | - README update 24 | - [PRO Version](https://github.com/app-generator/rocket-ecommerce) `Pricing` 25 | 26 | ## [1.0.6] 2024-03-15 27 | ### Changes 28 | 29 | - README update 30 | - [PRO Version](https://github.com/app-generator/rocket-ecommerce) `Features` 31 | 32 | ## [1.0.4] 2024-01-03 33 | ### Changes 34 | 35 | - DOCS Update (readme) 36 | 37 | ## [1.0.3] 2022-11-02 38 | ### Changes 39 | 40 | - UI/UX Changes 41 | - Image Management 42 | - Improved Error Checking 43 | 44 | ## [1.0.2] 2022-10-25 45 | ### Changes 46 | 47 | - Products pulled from Stripe 48 | - Available for `Superusers` 49 | 50 | ## [1.0.1] 2022-10-18 51 | ### Changes 52 | 53 | - Added `license` & `CHANGELOG` 54 | 55 | ## [1.0.0] 2022-10-18 56 | ### Stable Version 57 | 58 | - Products loaded from `templates` directory 59 | - Stripe v3 60 | - `Stripe Credentials` loaded from `.env` file 61 | **[Soft UI Design](https://www.creative-tim.com/product/soft-ui-design-system?AFFILIATE=128200)** (Free Version) by `Creative-Tim` 62 | -------------------------------------------------------------------------------- /Dockerfile: -------------------------------------------------------------------------------- 1 | FROM ubuntu 2 | 3 | WORKDIR /app 4 | 5 | COPY . /app 6 | 7 | RUN apt-get update && \ 8 | apt-get install -y python3 python3-pip && \ 9 | pip install -r requirements.txt 10 | 11 | ENTRYPOINT ["python3"] 12 | CMD ["manage.py", "runserver", "0.0.0.0:8000"] 13 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | # MIT License 2 | 3 | Copyright (c) 2019 - present [AppSeed](http://appseed.us/) 4 | 5 | 6 | 7 | ## Licensing Information 8 | 9 | 10 | 11 | | Item | - | 12 | | ---------------------------------- | --- | 13 | | License Type | MIT | 14 | | Use for print | **YES** | 15 | | Create single personal website/app | **YES** | 16 | | Create single website/app for client | **YES** | 17 | | Create multiple website/apps for clients | **YES** | 18 | | Create multiple SaaS applications | **YES** | 19 | | End-product paying users | **YES** | 20 | | Product sale | **YES** | 21 | | Remove footer credits | **YES** | 22 | | --- | --- | 23 | | Remove copyright mentions from source code | NO | 24 | | Create HTML/CSS template for sale | NO | 25 | | Create Theme/Template for CMS for sale | NO | 26 | | Separate sale of our UI Elements | NO | 27 | 28 | 29 | 30 | --- 31 | For more information regarding licensing, please contact the AppSeed Service < *support@appseed.us* > 32 | -------------------------------------------------------------------------------- /core/__init__.py: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/core/__init__.py -------------------------------------------------------------------------------- /core/asgi.py: -------------------------------------------------------------------------------- 1 | """ 2 | ASGI config for ecommerce project. 3 | 4 | It exposes the ASGI callable as a module-level variable named ``application``. 5 | 6 | For more information on this file, see 7 | https://docs.djangoproject.com/en/4.1/howto/deployment/asgi/ 8 | """ 9 | 10 | import os 11 | 12 | from django.core.asgi import get_asgi_application 13 | 14 | os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'core.settings') 15 | 16 | application = get_asgi_application() 17 | -------------------------------------------------------------------------------- /core/urls.py: -------------------------------------------------------------------------------- 1 | """ecommerce URL Configuration 2 | 3 | The `urlpatterns` list routes URLs to views. For more information please see: 4 | https://docs.djangoproject.com/en/4.1/topics/http/urls/ 5 | Examples: 6 | Function views 7 | 1. Add an import: from my_app import views 8 | 2. Add a URL to urlpatterns: path('', views.home, name='home') 9 | Class-based views 10 | 1. Add an import: from other_app.views import Home 11 | 2. Add a URL to urlpatterns: path('', Home.as_view(), name='home') 12 | Including another URLconf 13 | 1. Import the include() function: from django.urls import include, path 14 | 2. Add a URL to urlpatterns: path('blog/', include('blog.urls')) 15 | """ 16 | from django.contrib import admin 17 | from django.urls import path, include 18 | 19 | urlpatterns = [ 20 | path('admin/', admin.site.urls), 21 | path('', include('products.urls')) 22 | ] 23 | -------------------------------------------------------------------------------- /core/wsgi.py: -------------------------------------------------------------------------------- 1 | """ 2 | WSGI config for ecommerce project. 3 | 4 | It exposes the WSGI callable as a module-level variable named ``application``. 5 | 6 | For more information on this file, see 7 | https://docs.djangoproject.com/en/4.1/howto/deployment/wsgi/ 8 | """ 9 | 10 | import os 11 | 12 | from django.core.wsgi import get_wsgi_application 13 | 14 | os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'core.settings') 15 | 16 | application = get_wsgi_application() 17 | -------------------------------------------------------------------------------- /env.example: -------------------------------------------------------------------------------- 1 | DEBUG=True 2 | SECRET_KEY= 3 | STRIPE_SECRET_KEY= 4 | STRIPE_PUBLISHABLE_KEY= 5 | DOMAIN_URL= -------------------------------------------------------------------------------- /manage.py: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env python 2 | """Django's command-line utility for administrative tasks.""" 3 | import os 4 | import sys 5 | 6 | 7 | def main(): 8 | """Run administrative tasks.""" 9 | os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'core.settings') 10 | try: 11 | from django.core.management import execute_from_command_line 12 | except ImportError as exc: 13 | raise ImportError( 14 | "Couldn't import Django. Are you sure it's installed and " 15 | "available on your PYTHONPATH environment variable? Did you " 16 | "forget to activate a virtual environment?" 17 | ) from exc 18 | execute_from_command_line(sys.argv) 19 | 20 | 21 | if __name__ == '__main__': 22 | main() 23 | -------------------------------------------------------------------------------- /media/air-zoom-pegasus/card.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/media/air-zoom-pegasus/card.jpg -------------------------------------------------------------------------------- /media/air-zoom-pegasus/cover.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/media/air-zoom-pegasus/cover.jpg -------------------------------------------------------------------------------- /media/nike-go-flyease/card.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/media/nike-go-flyease/card.jpg -------------------------------------------------------------------------------- /media/nike-go-flyease/cover.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/media/nike-go-flyease/cover.jpg -------------------------------------------------------------------------------- /media/nike-goalkeeper-match/card.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/media/nike-goalkeeper-match/card.jpg -------------------------------------------------------------------------------- /media/nike-goalkeeper-match/cover.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/media/nike-goalkeeper-match/cover.jpg -------------------------------------------------------------------------------- /media/paris-saint-germain-strike/card.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/media/paris-saint-germain-strike/card.jpg -------------------------------------------------------------------------------- /media/paris-saint-germain-strike/cover.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/media/paris-saint-germain-strike/cover.jpg -------------------------------------------------------------------------------- /products/__init__.py: -------------------------------------------------------------------------------- 1 | # -*- encoding: utf-8 -*- 2 | """ 3 | Copyright (c) 2019 - present AppSeed.us 4 | """ 5 | 6 | -------------------------------------------------------------------------------- /products/admin.py: -------------------------------------------------------------------------------- 1 | # -*- encoding: utf-8 -*- 2 | """ 3 | Copyright (c) 2019 - present AppSeed.us 4 | """ 5 | 6 | from django.contrib import admin 7 | 8 | # Register your models here. -------------------------------------------------------------------------------- /products/apps.py: -------------------------------------------------------------------------------- 1 | # -*- encoding: utf-8 -*- 2 | """ 3 | Copyright (c) 2019 - present AppSeed.us 4 | """ 5 | 6 | from django.apps import AppConfig 7 | 8 | class ProductsConfig(AppConfig): 9 | default_auto_field = 'django.db.models.BigAutoField' 10 | name = 'products' 11 | -------------------------------------------------------------------------------- /products/models.py: -------------------------------------------------------------------------------- 1 | # -*- encoding: utf-8 -*- 2 | """ 3 | Copyright (c) 2019 - present AppSeed.us 4 | """ 5 | 6 | from django.db import models 7 | 8 | # Create your models here. 9 | -------------------------------------------------------------------------------- /products/static/assets/css/nucleo-svg.css: -------------------------------------------------------------------------------- 1 | /* Generated using nucleoapp.com */ 2 | /* -------------------------------- 3 | 4 | Icon colors 5 | 6 | -------------------------------- */ 7 | 8 | .icon { 9 | display: inline-block; 10 | /* icon primary color */ 11 | color: #111111; 12 | height: 1em; 13 | width: 1em; 14 | } 15 | 16 | .icon use { 17 | /* icon secondary color - fill */ 18 | fill: #7ea6f6; 19 | } 20 | 21 | .icon.icon-outline use { 22 | /* icon secondary color - stroke */ 23 | stroke: #7ea6f6; 24 | } 25 | 26 | /* -------------------------------- 27 | 28 | Change icon size 29 | 30 | -------------------------------- */ 31 | 32 | .icon-xs { 33 | height: 0.5em; 34 | width: 0.5em; 35 | } 36 | 37 | .icon-sm { 38 | height: 0.8em; 39 | width: 0.8em; 40 | } 41 | 42 | .icon-lg { 43 | height: 1.6em; 44 | width: 1.6em; 45 | } 46 | 47 | .icon-xl { 48 | height: 2em; 49 | width: 2em; 50 | } 51 | 52 | /* -------------------------------- 53 | 54 | Align icon and text 55 | 56 | -------------------------------- */ 57 | 58 | .icon-text-aligner { 59 | /* add this class to parent element that contains icon + text */ 60 | display: flex; 61 | align-items: center; 62 | } 63 | 64 | .icon-text-aligner .icon { 65 | color: inherit; 66 | margin-right: 0.4em; 67 | } 68 | 69 | .icon-text-aligner .icon use { 70 | color: inherit; 71 | fill: currentColor; 72 | } 73 | 74 | .icon-text-aligner .icon.icon-outline use { 75 | stroke: currentColor; 76 | } 77 | 78 | /* -------------------------------- 79 | 80 | Icon reset values - used to enable color customizations 81 | 82 | -------------------------------- */ 83 | 84 | .icon { 85 | fill: currentColor; 86 | stroke: none; 87 | } 88 | 89 | .icon.icon-outline { 90 | fill: none; 91 | stroke: currentColor; 92 | } 93 | 94 | .icon use { 95 | stroke: none; 96 | } 97 | 98 | .icon.icon-outline use { 99 | fill: none; 100 | } 101 | 102 | /* -------------------------------- 103 | 104 | Stroke effects - Nucleo outline icons 105 | 106 | - 16px icons -> up to 1px stroke (16px outline icons do not support stroke changes) 107 | - 24px, 32px icons -> up to 2px stroke 108 | - 48px, 64px icons -> up to 4px stroke 109 | 110 | -------------------------------- */ 111 | 112 | .icon-outline.icon-stroke-1 { 113 | stroke-width: 1px; 114 | } 115 | 116 | .icon-outline.icon-stroke-2 { 117 | stroke-width: 2px; 118 | } 119 | 120 | .icon-outline.icon-stroke-3 { 121 | stroke-width: 3px; 122 | } 123 | 124 | .icon-outline.icon-stroke-4 { 125 | stroke-width: 4px; 126 | } 127 | 128 | .icon-outline.icon-stroke-1 use, 129 | .icon-outline.icon-stroke-3 use { 130 | -webkit-transform: translateX(0.5px) translateY(0.5px); 131 | -moz-transform: translateX(0.5px) translateY(0.5px); 132 | -ms-transform: translateX(0.5px) translateY(0.5px); 133 | -o-transform: translateX(0.5px) translateY(0.5px); 134 | transform: translateX(0.5px) translateY(0.5px); 135 | } -------------------------------------------------------------------------------- /products/static/assets/fonts/nucleo-icons.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/fonts/nucleo-icons.eot -------------------------------------------------------------------------------- /products/static/assets/fonts/nucleo-icons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/fonts/nucleo-icons.ttf -------------------------------------------------------------------------------- /products/static/assets/fonts/nucleo-icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/fonts/nucleo-icons.woff -------------------------------------------------------------------------------- /products/static/assets/fonts/nucleo-icons.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/fonts/nucleo-icons.woff2 -------------------------------------------------------------------------------- /products/static/assets/fonts/nucleo.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/fonts/nucleo.eot -------------------------------------------------------------------------------- /products/static/assets/fonts/nucleo.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/fonts/nucleo.ttf -------------------------------------------------------------------------------- /products/static/assets/fonts/nucleo.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/fonts/nucleo.woff -------------------------------------------------------------------------------- /products/static/assets/fonts/nucleo.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/fonts/nucleo.woff2 -------------------------------------------------------------------------------- /products/static/assets/img/anastasia.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/anastasia.jpg -------------------------------------------------------------------------------- /products/static/assets/img/annie-spratt.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/annie-spratt.jpg -------------------------------------------------------------------------------- /products/static/assets/img/apple-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/apple-icon.png -------------------------------------------------------------------------------- /products/static/assets/img/blog7-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/blog7-1.jpg -------------------------------------------------------------------------------- /products/static/assets/img/blog7-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/blog7-2.jpg -------------------------------------------------------------------------------- /products/static/assets/img/blog7-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/blog7-3.jpg -------------------------------------------------------------------------------- /products/static/assets/img/brooke.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/brooke.jpg -------------------------------------------------------------------------------- /products/static/assets/img/bruce-mars.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/bruce-mars.jpg -------------------------------------------------------------------------------- /products/static/assets/img/card-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/card-2.jpg -------------------------------------------------------------------------------- /products/static/assets/img/card-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/card-3.jpg -------------------------------------------------------------------------------- /products/static/assets/img/charles.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/charles.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved-10.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved-10.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved-11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved-11.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved-6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved-6.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved-8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved-8.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved1.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved11-small.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved11-small.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved11.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved13.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved13.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved14.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved14.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved2.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved5-small.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved5-small.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved5.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved6-small.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved6-small.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved6.jpg -------------------------------------------------------------------------------- /products/static/assets/img/curved-images/curved8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/curved-images/curved8.jpg -------------------------------------------------------------------------------- /products/static/assets/img/down-arrow-dark.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | down-arrow 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /products/static/assets/img/down-arrow-white.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /products/static/assets/img/down-arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | down-arrow 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /products/static/assets/img/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/favicon.png -------------------------------------------------------------------------------- /products/static/assets/img/illustrations/chat.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/illustrations/chat.png -------------------------------------------------------------------------------- /products/static/assets/img/illustrations/sign-up.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/illustrations/sign-up.png -------------------------------------------------------------------------------- /products/static/assets/img/ivana-square.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/ivana-square.jpg -------------------------------------------------------------------------------- /products/static/assets/img/ivana.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/ivana.jpg -------------------------------------------------------------------------------- /products/static/assets/img/ivancik.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/ivancik.jpg -------------------------------------------------------------------------------- /products/static/assets/img/jordan.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/jordan.jpg -------------------------------------------------------------------------------- /products/static/assets/img/kal-visuals-square.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/kal-visuals-square.jpg -------------------------------------------------------------------------------- /products/static/assets/img/kal-visuals.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/kal-visuals.jpg -------------------------------------------------------------------------------- /products/static/assets/img/logos/gray-logos/logo-netflix.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/medium-logos/logo-netflix.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-apple.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Artboard 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-asana.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-atlassian.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-google-drive.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-invision.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-jira.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-shopify.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-slack.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-spotify.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-weave.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-webdev.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /products/static/assets/img/logos/small-logos/logo-xd.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Logos 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /products/static/assets/img/marie.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/marie.jpg -------------------------------------------------------------------------------- /products/static/assets/img/meeting.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/meeting.jpg -------------------------------------------------------------------------------- /products/static/assets/img/nastuh.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/nastuh.jpg -------------------------------------------------------------------------------- /products/static/assets/img/office-dark.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/office-dark.jpg -------------------------------------------------------------------------------- /products/static/assets/img/team-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/team-1.jpg -------------------------------------------------------------------------------- /products/static/assets/img/team-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/team-2.jpg -------------------------------------------------------------------------------- /products/static/assets/img/team-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/team-3.jpg -------------------------------------------------------------------------------- /products/static/assets/img/team-4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/team-4.jpg -------------------------------------------------------------------------------- /products/static/assets/img/toa-heftiba.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/img/toa-heftiba.jpg -------------------------------------------------------------------------------- /products/static/assets/img/wave-1.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | wave-1 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /products/static/assets/js/payments.js: -------------------------------------------------------------------------------- 1 | 2 | // Get Stripe publishable key 3 | fetch("/config") 4 | .then((result) => { return result.json(); }) 5 | .then((data) => { 6 | // Initialize Stripe.js 7 | const stripe = Stripe(data.publicKey); 8 | // Event handler 9 | document.querySelector("#submitBtn").addEventListener("click", () => { 10 | 11 | var product = document.getElementById('product_slug').innerText; 12 | 13 | //console.log( ' >>> Product = ' + product ); 14 | //return false; 15 | 16 | // Get Checkout Session ID 17 | fetch("/create-checkout-session/" + product) 18 | .then((result) => { return result.json(); }) 19 | .then((data) => { 20 | console.log(data); 21 | // Redirect to Stripe Checkout 22 | return stripe.redirectToCheckout({sessionId: data.sessionId}) 23 | }) 24 | .then((res) => { 25 | console.log(res); 26 | }); 27 | }); 28 | }); 29 | -------------------------------------------------------------------------------- /products/static/assets/js/plugins/parallax.min.js: -------------------------------------------------------------------------------- 1 | var windowHeight = window.innerHeight; 2 | 3 | document.addEventListener('resize', function() { 4 | windowHeight = window.innerHeight; 5 | }) 6 | 7 | function outerHeight(el) { 8 | var height = el.offsetHeight; 9 | var style = getComputedStyle(el); 10 | 11 | height += parseInt(style.marginTop) + parseInt(style.marginBottom); 12 | return height; 13 | } 14 | 15 | function parallax (el, speedFactor, outerHeight) { 16 | var foo = document.querySelectorAll(el); 17 | 18 | var getHeight; 19 | var firstTop; 20 | var paddingTop = 0; 21 | 22 | //get the starting position of each element to have parallax applied to it 23 | foo.forEach(function(subEl){ 24 | firstTop = subEl.getBoundingClientRect().top; 25 | }); 26 | 27 | if (outerHeight) { 28 | getHeight = function(el) { 29 | return outerHeight(el); 30 | }; 31 | } else { 32 | getHeight = function(el) { 33 | return el.clientHeight; 34 | }; 35 | } 36 | 37 | // function to be called whenever the window is scrolled or resized 38 | function update(){ 39 | var pos = window.scrollY; 40 | 41 | foo.forEach(function(subEl){ 42 | var element = subEl; 43 | var top = element.getBoundingClientRect().top; 44 | var height = getHeight(element); 45 | 46 | element.style.top = -(Math.round((firstTop - pos) * speedFactor)) + "px"; 47 | }); 48 | } 49 | document.addEventListener('scroll', update, true) 50 | document.addEventListener('resize', update) 51 | update() 52 | }; 53 | 54 | parallax(".hero", -0.6); 55 | -------------------------------------------------------------------------------- /products/static/assets/js/soft-design-system.min.js: -------------------------------------------------------------------------------- 1 | var popoverTriggerList=[].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]')),popoverList=popoverTriggerList.map(function(t){return new bootstrap.Popover(t)}),tooltipTriggerList=[].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]')),tooltipList=tooltipTriggerList.map(function(t){return new bootstrap.Tooltip(t)});function setAttributes(e,o){Object.keys(o).forEach(function(t){e.setAttribute(t,o[t])})}popoverList=(popoverTriggerList=[].slice.call(document.querySelectorAll('[data-toggle="popover"]'))).map(function(t){return new bootstrap.Popover(t)}),tooltipList=(tooltipTriggerList=[].slice.call(document.querySelectorAll('[data-toggle="tooltip"]'))).map(function(t){return new bootstrap.Tooltip(t)});function copyCode(t){const e=window.getSelection(),o=document.createRange();var r=t.nextElementSibling;o.selectNodeContents(r),e.removeAllRanges(),e.addRange(o);var n;document.execCommand("copy");window.getSelection().removeAllRanges(),t.parentElement.querySelector(".alert")||((n=document.createElement("div")).classList.add("alert","alert-success","position-absolute","top-0","border-0","text-white","w-25","end-0","start-0","mt-2","mx-auto","py-2"),n.style.transform="translate3d(0px, 0px, 0px)",n.style.opacity="0",n.style.transition=".35s ease",setTimeout(function(){n.style.transform="translate3d(0px, 20px, 0px)",n.style.setProperty("opacity","1","important")},100),n.innerHTML="Code successfully copied!",t.parentElement.appendChild(n),setTimeout(function(){n.style.transform="translate3d(0px, 0px, 0px)",n.style.setProperty("opacity","0","important")},2e3),setTimeout(function(){t.parentElement.querySelector(".alert").remove()},2500))}function debounce(o,r,n){var l;return function(){var t=this,e=arguments;clearTimeout(l),l=setTimeout(function(){l=null,n||o.apply(t,e)},r),n&&!l&&o.apply(t,e)}} 2 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system.scss: -------------------------------------------------------------------------------- 1 | // ========================================================= 2 | // * Soft UI Design System - v1.0.1 3 | // ========================================================= 4 | // 5 | // * Product Page: https://www.creative-tim.com/product/soft-ui-design-system 6 | // * Copyright 2021 Creative Tim (https://www.creative-tim.com) 7 | // 8 | // Coded by www.creative-tim.com 9 | // 10 | // ========================================================= 11 | // 12 | // * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 13 | 14 | // Bootstrap Functions 15 | @import "soft-design-system/bootstrap/functions"; 16 | 17 | // Custom Variables 18 | @import "soft-design-system/custom/variables"; 19 | 20 | // Theme Variables 21 | @import "soft-design-system/variables"; 22 | 23 | // Bootstrap Core 24 | @import "soft-design-system/bootstrap/bootstrap"; 25 | 26 | // Theme Core 27 | @import "soft-design-system/theme"; 28 | 29 | // Custom Variables 30 | @import "soft-design-system/custom/styles"; 31 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_alert.scss: -------------------------------------------------------------------------------- 1 | @each $state, $value in $theme-gradient-colors { 2 | .alert-#{$state} { 3 | @include gradient-directional(nth($value, 1) 0%, darken(nth($value, -1), 8%) 100%, $deg: 310deg); 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_buttons.scss: -------------------------------------------------------------------------------- 1 | .btn { 2 | margin-bottom: $btn-margin-bottom; 3 | letter-spacing: $a-letter-spacing; 4 | text-transform: uppercase; 5 | box-shadow: $btn-box-shadow; 6 | background-size: $btn-background-size; 7 | background-position-x: $btn-background-position-x; 8 | 9 | &:not([class*="btn-outline-"]) { 10 | border: 0; 11 | } 12 | 13 | &:active, 14 | &:active:focus, 15 | &:active:hover { 16 | box-shadow: $btn-hover-box-shadow; 17 | transform: $btn-active-hover-transform; 18 | opacity: $btn-hover-opacity; 19 | } 20 | 21 | @include hover { 22 | box-shadow: $btn-hover-box-shadow; 23 | transform: $btn-hover-transform; 24 | } 25 | 26 | &.bg-white { 27 | @include hover { 28 | color: $body-color; 29 | } 30 | } 31 | 32 | &.btn-link{ 33 | box-shadow: none; 34 | font-weight: $btn-font-weight; 35 | 36 | &:hover, 37 | &:focus{ 38 | box-shadow: none; 39 | } 40 | } 41 | &.btn-round { 42 | border-radius: $btn-border-rounded; 43 | } 44 | // Button Just Icon 45 | 46 | &.btn-icon-only { 47 | width: $btn-just-icon-width; 48 | height: $btn-just-icon-height; 49 | padding: 0; 50 | } 51 | 52 | // Button Icon Sizes 53 | 54 | &.btn-sm { 55 | &.btn-icon-only { 56 | width: $btn-just-icon-width-sm; 57 | height: $btn-just-icon-height-sm; 58 | } 59 | 60 | i { 61 | font-size: $btn-just-icon-sm-font-size; 62 | } 63 | } 64 | 65 | &.btn-lg { 66 | &.btn-icon-only { 67 | width: $btn-just-icon-width-lg; 68 | height: $btn-just-icon-height-lg; 69 | } 70 | 71 | i { 72 | font-size: $btn-just-icon-lg-font-size; 73 | position: $btn-just-icon-lg-position; 74 | top: $btn-just-icon-lg-top; 75 | } 76 | } 77 | 78 | &.btn-rounded { 79 | border-radius: $btn-border-rounded; 80 | } 81 | } 82 | 83 | .icon-move-right { 84 | i { 85 | transition: $btn-icon-transition; 86 | } 87 | &:hover, 88 | &:focus { 89 | i { 90 | transform: $btn-icon-transform; 91 | } 92 | } 93 | } 94 | 95 | @each $color, $value in $theme-colors { 96 | .btn-#{$color}, 97 | .btn.bg-gradient-#{$color} { 98 | @include hover { 99 | background-color: $value; 100 | border-color: $value; 101 | } 102 | .btn.bg-outline-#{$color} { 103 | border: $border-width solid $value; 104 | } 105 | 106 | &:not(:disabled):not(.disabled).active, 107 | &:not(:disabled):not(.disabled):active, 108 | .show > &.dropdown-toggle { 109 | color: color-yiq($value); 110 | background-color: $value; 111 | } 112 | 113 | @if $value != $white { 114 | &.focus, 115 | &:focus { 116 | color: $white; 117 | } 118 | } 119 | } 120 | 121 | .btn-outline-#{$color} { 122 | box-shadow: none; 123 | @include hover { 124 | background-color: transparent; 125 | opacity: .75; 126 | box-shadow: none; 127 | color: $value; 128 | } 129 | } 130 | } 131 | 132 | .btn-outline-white{ 133 | border-color: rgba($white, .75); 134 | background: rgba($white, .1); 135 | } 136 | 137 | @each $color, $value in $btn-font-colors { 138 | .btn-#{$color}, 139 | .btn.bg-gradient-#{$color} { 140 | color: $value; 141 | @include hover { 142 | color: $value; 143 | } 144 | } 145 | } 146 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_cards.scss: -------------------------------------------------------------------------------- 1 | .card { 2 | box-shadow: $card-box-shadow; 3 | .card-header { 4 | padding: $card-header-padding; 5 | } 6 | 7 | .card-body { 8 | font-family: $font-family-sans-serif; 9 | padding: $card-body-padding; 10 | } 11 | 12 | &.card-plain { 13 | background-color: $card-plain-bg-color; 14 | box-shadow: $card-plain-box-shadow; 15 | } 16 | 17 | .card-footer { 18 | padding: $card-footer-padding; 19 | background-color: transparent; 20 | } 21 | } 22 | 23 | .author { 24 | display: $card-author-display; 25 | 26 | .name > span { 27 | line-height: $card-author-name-line-height; 28 | font-weight: $font-weight-bold; 29 | font-size: $font-size-sm; 30 | color: $card-author-name-color; 31 | } 32 | 33 | .stats { 34 | font-size: $font-size-sm; 35 | font-weight: $font-weight-normal; 36 | } 37 | } 38 | 39 | @import 'cards/card-background'; 40 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_footer.scss: -------------------------------------------------------------------------------- 1 | .footer { 2 | .nav-link { 3 | color: $dark; 4 | font-weight: $font-weight-normal; 5 | font-size: $font-size-sm; 6 | padding-top: 0; 7 | padding-bottom: $nav-link-footer-padding; 8 | 9 | &:hover { 10 | opacity: 1 !important; 11 | transition: $footer-link-animation; 12 | } 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_gradients.scss: -------------------------------------------------------------------------------- 1 | @each $prop, $value in $theme-gradient-colors { 2 | .bg-gradient-#{$prop} { 3 | @include gradient-directional(nth($value, 1) 0%, nth($value, -1) 100%, $deg: 310deg); 4 | } 5 | } 6 | 7 | @each $prop, $value in $theme-colors { 8 | .bg-gradient-faded-#{$prop} { 9 | background-image: radial-gradient(370px circle at 80% 50%,rgba($value, .6) 0,darken($value, 10%) 100%) 10 | } 11 | } 12 | 13 | 14 | @each $prop, $value in $theme-colors { 15 | &.bg-gradient-faded-#{$prop}-vertical{ 16 | background-image: radial-gradient(200px circle at 50% 70%, rgba($value, .3) 0, $value 100%); 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_header.scss: -------------------------------------------------------------------------------- 1 | .page-header { 2 | padding: $page-header-padding; 3 | position: $page-header-position; 4 | overflow: $page-header-overflow; 5 | display: $page-header-display; 6 | align-items: $page-header-align-items; 7 | background-size: $page-header-bg-size; 8 | background-position: $page-header-bg-position; 9 | 10 | .container { 11 | z-index: $page-header-conteiner-index; 12 | } 13 | } 14 | 15 | .oblique { 16 | transform: $header-oblique-transform; 17 | overflow: $header-oblique-overflow; 18 | width: $header-oblique-img-width; 19 | right: $header-oblique-img-right; 20 | border-bottom-left-radius: $border-radius-lg; 21 | 22 | .oblique-image { 23 | transform: $header-oblique-img-transform; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_nav.scss: -------------------------------------------------------------------------------- 1 | .nav { 2 | &.nav-pills { 3 | background: $nav-pills-background; 4 | border-radius: $nav-pills-border-radius; 5 | position: relative; 6 | 7 | &.nav-pills-vertical { 8 | border-radius: $nav-pills-vertical-radius; 9 | 10 | .nav-link { 11 | &.active { 12 | border-radius: $nav-pills-vertical-link-radius; 13 | } 14 | } 15 | } 16 | 17 | .nav-link { 18 | z-index: 3; 19 | color: $dark; 20 | border-radius: $nav-pills-link-border-radius; 21 | background-color: inherit; 22 | 23 | &.active { 24 | animation: $nav-pills-link-active-animation; 25 | box-shadow: $nav-pills-link-box-shadow; 26 | background-color: $white !important; 27 | } 28 | 29 | &:hover:not(.active) { 30 | color: $dark; 31 | } 32 | } 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_navbar.scss: -------------------------------------------------------------------------------- 1 | .navbar { 2 | box-shadow: $navbar-box-shadow; 3 | 4 | .navbar-brand { 5 | color: $dark; 6 | @include font-size($font-size-sm); 7 | } 8 | .nav-link { 9 | color: $dark; 10 | padding: $navbar-nav-link-padding; 11 | font-weight: $font-weight-normal; 12 | font-size: $font-size-sm; 13 | } 14 | 15 | &.navbar-absolute { 16 | position: absolute; 17 | width: 100%; 18 | z-index: 1; 19 | } 20 | 21 | &.navbar-transparent { 22 | .nav-link { 23 | color: $white; 24 | 25 | &:hover, 26 | &:focus { 27 | color: rgba($white, .75); 28 | } 29 | } 30 | 31 | .navbar-toggler { 32 | .navbar-toggler-icon { 33 | .navbar-toggler-bar { 34 | background: $white; 35 | } 36 | } 37 | } 38 | 39 | .navbar-collapse{ 40 | border-radius: $border-radius-xl; 41 | } 42 | } 43 | 44 | &.navbar-dark { 45 | .navbar-collapse.show, 46 | .navbar-collapse.collapsing 47 | { 48 | .dropdown-header.text-dark{ 49 | color: $white !important; 50 | } 51 | } 52 | } 53 | } 54 | .navbar-light { 55 | background-color: $white !important; 56 | .navbar-toggler{ 57 | border: none; 58 | &:focus{ 59 | box-shadow: none; 60 | } 61 | } 62 | } 63 | 64 | .navbar-toggler { 65 | .navbar-toggler-icon { 66 | background-image: none; 67 | 68 | .navbar-toggler-bar { 69 | display: $navbar-toggler-bar-display; 70 | position: $navbar-toggler-bar-position; 71 | width: $navbar-toggler-bar-width; 72 | height: $navbar-toggler-bar-height; 73 | border-radius: $navbar-toggler-bar-radius; 74 | background: $gray-600; 75 | transition: $navbar-toggler-bar-transition; 76 | margin: 0 auto; 77 | 78 | &.bar2, 79 | &.bar3 { 80 | margin-top: $navbar-toggler-bar-margin-top; 81 | } 82 | } 83 | } 84 | 85 | &[aria-expanded="true"] { 86 | .navbar-toggler-bar { 87 | &.bar1 { 88 | transform: $navbar-toggler-bar-1-transform; 89 | transform-origin: $navbar-toggler-bar-1-transform-origin; 90 | margin-top: $navbar-toggler-bar-1-margin-top; 91 | } 92 | 93 | &.bar2 { 94 | opacity: $navbar-toggler-bar-2-opacity; 95 | } 96 | 97 | &.bar3 { 98 | transform: $navbar-toggler-bar-3-transform; 99 | transform-origin: $navbar-toggler-bar-3-transform-origin; 100 | margin-top: $navbar-toggler-bar-3-margin-top; 101 | } 102 | } 103 | } 104 | } 105 | 106 | @include media-breakpoint-down(lg) { 107 | .navbar{ 108 | &.navbar-transparent{ 109 | .navbar-collapse.collapsing{ 110 | background: $white; 111 | } 112 | 113 | .navbar-collapse.show{ 114 | background: $white; 115 | .nav-link{ 116 | color: $dark; 117 | } 118 | } 119 | } 120 | } 121 | } 122 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_pagination.scss: -------------------------------------------------------------------------------- 1 | .page-item { 2 | &.active .page-link { 3 | box-shadow: $pagination-active-box-shadow; 4 | } 5 | 6 | .page-link, 7 | span { 8 | display: $page-link-display; 9 | align-items: $page-link-align-items; 10 | justify-content: $page-link-justify-content; 11 | color: $secondary; 12 | padding: 0; 13 | margin: $page-link-margin; 14 | border-radius: $page-link-radius !important; 15 | width: $page-link-width; 16 | height: $page-link-height; 17 | font-size: $font-size-sm; 18 | } 19 | } 20 | 21 | .pagination-lg { 22 | .page-item { 23 | .page-link, 24 | span { 25 | width: $page-link-width-lg; 26 | height: $page-link-height-lg; 27 | line-height: $page-link-line-height-lg; 28 | } 29 | } 30 | } 31 | 32 | .pagination-sm { 33 | .page-item { 34 | .page-link, 35 | span { 36 | width: $page-link-width-sm; 37 | height: $page-link-height-sm; 38 | line-height: $page-link-line-height-sm; 39 | } 40 | } 41 | } 42 | 43 | 44 | // Colors 45 | .pagination { 46 | @each $name, $value in $theme-gradient-colors { 47 | &.pagination-#{$name} { 48 | .page-item.active > .page-link { 49 | &, 50 | &:focus, 51 | &:hover { 52 | @include gradient-directional(nth($value, 1) 0%, nth($value, -1) 100%, $deg: 310deg); 53 | border: none; 54 | } 55 | } 56 | } 57 | } 58 | } 59 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_popovers.scss: -------------------------------------------------------------------------------- 1 | .popover { 2 | box-shadow: $popover-box-shadow; 3 | } 4 | 5 | // popover title 6 | .popover { 7 | .popover-header { 8 | font-weight: 600; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_progress.scss: -------------------------------------------------------------------------------- 1 | .progress-bar { 2 | height: $progress-bar-height; 3 | border-radius: $border-radius; 4 | margin-top: -2px; 5 | } 6 | 7 | .progress { 8 | overflow: visible; 9 | 10 | &.progress-sm { 11 | height: $progress-height-sm; 12 | } 13 | &.progress-lg { 14 | height: $progress-height-lg; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/_tooltips.scss: -------------------------------------------------------------------------------- 1 | .bs-tooltip-auto[x-placement^=right] .tooltip-arrow, 2 | .bs-tooltip-right .tooltip-arrow { 3 | left: $tooltip-arrow-left; 4 | } 5 | 6 | .bs-tooltip-auto[x-placement^=left] .tooltip-arrow, 7 | .bs-tooltip-left .tooltip-arrow { 8 | right: $tooltip-arrow-right; 9 | } 10 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/avatars/_avatar-group.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Avatar group 3 | // 4 | 5 | // General styles 6 | 7 | .avatar-group { 8 | .avatar { 9 | position: relative; 10 | z-index: $avatar-group-zindex; 11 | border: $avatar-group-border solid $card-bg; 12 | 13 | &:hover { 14 | z-index: $avatar-group-zindex-hover; 15 | } 16 | } 17 | 18 | .avatar + .avatar { 19 | margin-left: $avatar-group-double; 20 | 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/avatars/_avatar.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Avatar 3 | // 4 | 5 | // General styles 6 | 7 | .avatar { 8 | color: $white; 9 | display: inline-flex; 10 | align-items: center; 11 | justify-content: center; 12 | font-size: $avatar-font-size; 13 | border-radius: $border-radius-lg; 14 | height: $avatar-height; 15 | width: $avatar-width; 16 | transition: all .2s ease-in-out; 17 | 18 | img { 19 | width: 100%; 20 | border-radius: $border-radius; 21 | } 22 | 23 | &.rounded-circle { 24 | img { 25 | @extend .rounded-circle; 26 | } 27 | } 28 | 29 | + .avatar-content { 30 | display: inline-block; 31 | margin-left: $avatar-content-margin; 32 | } 33 | 34 | 35 | &.avatar-raised { 36 | margin-top: -($avatar-height / 2); 37 | } 38 | 39 | &.avatar-scale-up:hover { 40 | transform: scale(1.2); 41 | 42 | } 43 | } 44 | 45 | // Style for the Testimonials Carousel 46 | .active { 47 | .avatar.avatar-scale-up { 48 | transform: scale(1.2); 49 | } 50 | } 51 | 52 | 53 | // Avatar size variations 54 | 55 | .avatar-xxl { 56 | width: $avatar-xxl-width !important; 57 | height: $avatar-xxl-height !important; 58 | 59 | &.avatar-raised { 60 | margin-top: -($avatar-xxl-height / 2); 61 | } 62 | } 63 | 64 | .avatar-xl { 65 | width: $avatar-xl-width !important; 66 | height: $avatar-xl-height !important; 67 | 68 | &.avatar-raised { 69 | margin-top: -($avatar-xl-height / 2); 70 | } 71 | } 72 | 73 | .avatar-lg { 74 | width: $avatar-lg-width !important; 75 | height: $avatar-lg-height !important; 76 | font-size: $font-size-sm; 77 | 78 | &.avatar-raised { 79 | margin-top: -($avatar-lg-height / 2); 80 | } 81 | } 82 | 83 | .avatar-sm { 84 | width: $avatar-sm-width !important; 85 | height: $avatar-sm-height !important; 86 | font-size: $font-size-sm; 87 | 88 | &.avatar-raised { 89 | margin-top: -($avatar-sm-height / 2); 90 | } 91 | } 92 | 93 | .avatar-xs { 94 | width: $avatar-xs-width !important; 95 | height: $avatar-xs-height !important; 96 | font-size: $font-size-xs; 97 | 98 | &.avatar-raised { 99 | margin-top: -($avatar-xs-height / 2); 100 | } 101 | } 102 | 103 | // avatar group 104 | @import "avatar-group"; 105 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_alert.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Base styles 3 | // 4 | 5 | .alert { 6 | position: relative; 7 | padding: $alert-padding-y $alert-padding-x; 8 | margin-bottom: $alert-margin-bottom; 9 | border: $alert-border-width solid transparent; 10 | @include border-radius($alert-border-radius); 11 | } 12 | 13 | // Headings for larger alerts 14 | .alert-heading { 15 | // Specified to prevent conflicts of changing $headings-color 16 | color: inherit; 17 | } 18 | 19 | // Provide class for links that match alerts 20 | .alert-link { 21 | font-weight: $alert-link-font-weight; 22 | } 23 | 24 | 25 | // Dismissible alerts 26 | // 27 | // Expand the right padding and account for the close button's positioning. 28 | 29 | .alert-dismissible { 30 | padding-right: $alert-dismissible-padding-r; 31 | 32 | // Adjust close link position 33 | .btn-close { 34 | position: absolute; 35 | top: 0; 36 | right: 0; 37 | z-index: $stretched-link-z-index + 1; 38 | padding: $alert-padding-y * 1.25 $alert-padding-x; 39 | } 40 | } 41 | 42 | 43 | // scss-docs-start alert-modifiers 44 | // Generate contextual modifier classes for colorizing the alert. 45 | 46 | @each $state, $value in $theme-colors { 47 | $alert-background: shift-color($value, $alert-bg-scale); 48 | $alert-border: shift-color($value, $alert-border-scale); 49 | $alert-color: shift-color($value, $alert-color-scale); 50 | @if (contrast-ratio($alert-background, $alert-color) < $min-contrast-ratio) { 51 | $alert-color: mix($value, color-contrast($alert-background), abs($alert-color-scale)); 52 | } 53 | .alert-#{$state} { 54 | @include alert-variant($alert-background, $alert-border, $alert-color); 55 | } 56 | } 57 | // scss-docs-end alert-modifiers 58 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_badge.scss: -------------------------------------------------------------------------------- 1 | // Base class 2 | // 3 | // Requires one of the contextual, color modifier classes for `color` and 4 | // `background-color`. 5 | 6 | .badge { 7 | display: inline-block; 8 | padding: $badge-padding-y $badge-padding-x; 9 | @include font-size($badge-font-size); 10 | font-weight: $badge-font-weight; 11 | line-height: 1; 12 | color: $badge-color; 13 | text-align: center; 14 | white-space: nowrap; 15 | vertical-align: baseline; 16 | @include border-radius($badge-border-radius); 17 | @include gradient-bg(); 18 | 19 | // Empty badges collapse automatically 20 | &:empty { 21 | display: none; 22 | } 23 | } 24 | 25 | // Quick fix for badges in buttons 26 | .btn .badge { 27 | position: relative; 28 | top: -1px; 29 | } 30 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_breadcrumb.scss: -------------------------------------------------------------------------------- 1 | .breadcrumb { 2 | display: flex; 3 | flex-wrap: wrap; 4 | padding: $breadcrumb-padding-y $breadcrumb-padding-x; 5 | margin-bottom: $breadcrumb-margin-bottom; 6 | @include font-size($breadcrumb-font-size); 7 | list-style: none; 8 | background-color: $breadcrumb-bg; 9 | @include border-radius($breadcrumb-border-radius); 10 | } 11 | 12 | .breadcrumb-item { 13 | // The separator between breadcrumbs (by default, a forward-slash: "/") 14 | + .breadcrumb-item { 15 | padding-left: $breadcrumb-item-padding-x; 16 | 17 | &::before { 18 | float: left; // Suppress inline spacings and underlining of the separator 19 | padding-right: $breadcrumb-item-padding-x; 20 | color: $breadcrumb-divider-color; 21 | content: var(--#{$variable-prefix}breadcrumb-divider, escape-svg($breadcrumb-divider)) #{"/* rtl:"} var(--#{$variable-prefix}breadcrumb-divider, escape-svg($breadcrumb-divider-flipped)) #{"*/"}; 22 | } 23 | } 24 | 25 | &.active { 26 | color: $breadcrumb-active-color; 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_buttons.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Base styles 3 | // 4 | 5 | .btn { 6 | display: inline-block; 7 | font-family: $btn-font-family; 8 | font-weight: $btn-font-weight; 9 | line-height: $btn-line-height; 10 | color: $body-color; 11 | text-align: center; 12 | text-decoration: if($link-decoration == none, null, none); 13 | white-space: $btn-white-space; 14 | vertical-align: middle; 15 | cursor: if($enable-button-pointers, pointer, null); 16 | user-select: none; 17 | background-color: transparent; 18 | border: $btn-border-width solid transparent; 19 | @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-border-radius); 20 | @include transition($btn-transition); 21 | 22 | &:hover { 23 | color: $body-color; 24 | text-decoration: if($link-hover-decoration == underline, none, null); 25 | } 26 | 27 | .btn-check:focus + &, 28 | &:focus { 29 | outline: 0; 30 | box-shadow: $btn-focus-box-shadow; 31 | } 32 | 33 | .btn-check:checked + &, 34 | .btn-check:active + &, 35 | &:active, 36 | &.active { 37 | @include box-shadow($btn-active-box-shadow); 38 | 39 | &:focus { 40 | @include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow); 41 | } 42 | } 43 | 44 | &:disabled, 45 | &.disabled, 46 | fieldset:disabled & { 47 | pointer-events: none; 48 | opacity: $btn-disabled-opacity; 49 | @include box-shadow(none); 50 | } 51 | } 52 | 53 | 54 | // 55 | // Alternate buttons 56 | // 57 | 58 | @each $color, $value in $theme-colors { 59 | .btn-#{$color} { 60 | @include button-variant($value, $value); 61 | } 62 | } 63 | 64 | @each $color, $value in $theme-colors { 65 | .btn-outline-#{$color} { 66 | @include button-outline-variant($value); 67 | } 68 | } 69 | 70 | 71 | // 72 | // Link buttons 73 | // 74 | 75 | // Make a button look and behave like a link 76 | .btn-link { 77 | font-weight: $font-weight-normal; 78 | color: $btn-link-color; 79 | text-decoration: $link-decoration; 80 | 81 | &:hover { 82 | color: $btn-link-hover-color; 83 | text-decoration: $link-hover-decoration; 84 | } 85 | 86 | &:focus { 87 | text-decoration: $link-hover-decoration; 88 | } 89 | 90 | &:disabled, 91 | &.disabled { 92 | color: $btn-link-disabled-color; 93 | } 94 | 95 | // No need for an active state here 96 | } 97 | 98 | 99 | // 100 | // Button Sizes 101 | // 102 | 103 | .btn-lg { 104 | @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-border-radius-lg); 105 | } 106 | 107 | .btn-sm { 108 | @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-border-radius-sm); 109 | } 110 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_close.scss: -------------------------------------------------------------------------------- 1 | // transparent background and border properties included for button version. 2 | // iOS requires the button element instead of an anchor tag. 3 | // If you want the anchor version, it requires `href="#"`. 4 | // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile 5 | 6 | .btn-close { 7 | box-sizing: content-box; 8 | width: $btn-close-width; 9 | height: $btn-close-height; 10 | padding: $btn-close-padding-y $btn-close-padding-x; 11 | color: $btn-close-color; 12 | background: transparent escape-svg($btn-close-bg) center / $btn-close-width auto no-repeat; // include transparent for button elements 13 | border: 0; // for button elements 14 | @include border-radius(); 15 | opacity: $btn-close-opacity; 16 | 17 | // Override 's hover style 18 | &:hover { 19 | color: $btn-close-color; 20 | text-decoration: none; 21 | opacity: $btn-close-hover-opacity; 22 | } 23 | 24 | &:focus { 25 | outline: 0; 26 | box-shadow: $btn-close-focus-shadow; 27 | opacity: $btn-close-focus-opacity; 28 | } 29 | 30 | &:disabled, 31 | &.disabled { 32 | pointer-events: none; 33 | user-select: none; 34 | opacity: $btn-close-disabled-opacity; 35 | } 36 | } 37 | 38 | .btn-close-white { 39 | filter: $btn-close-white-filter; 40 | } 41 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_containers.scss: -------------------------------------------------------------------------------- 1 | // Container widths 2 | // 3 | // Set the container width, and override it for fixed navbars in media queries. 4 | 5 | @if $enable-grid-classes { 6 | // Single container class with breakpoint max-widths 7 | .container, 8 | // 100% wide container at all breakpoints 9 | .container-fluid { 10 | @include make-container(); 11 | } 12 | 13 | // Responsive containers that are 100% wide until a breakpoint 14 | @each $breakpoint, $container-max-width in $container-max-widths { 15 | .container-#{$breakpoint} { 16 | @extend .container-fluid; 17 | } 18 | 19 | @include media-breakpoint-up($breakpoint, $grid-breakpoints) { 20 | %responsive-container-#{$breakpoint} { 21 | max-width: $container-max-width; 22 | } 23 | 24 | // Extend each breakpoint which is smaller or equal to the current breakpoint 25 | $extend-breakpoint: true; 26 | 27 | @each $name, $width in $grid-breakpoints { 28 | @if ($extend-breakpoint) { 29 | .container#{breakpoint-infix($name, $grid-breakpoints)} { 30 | @extend %responsive-container-#{$breakpoint}; 31 | } 32 | 33 | // Once the current breakpoint is reached, stop extending 34 | @if ($breakpoint == $name) { 35 | $extend-breakpoint: false; 36 | } 37 | } 38 | } 39 | } 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_forms.scss: -------------------------------------------------------------------------------- 1 | @import "forms/labels"; 2 | @import "forms/form-text"; 3 | @import "forms/form-control"; 4 | @import "forms/form-select"; 5 | @import "forms/form-check"; 6 | @import "forms/form-range"; 7 | @import "forms/floating-labels"; 8 | @import "forms/input-group"; 9 | @import "forms/validation"; 10 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_grid.scss: -------------------------------------------------------------------------------- 1 | // Row 2 | // 3 | // Rows contain your columns. 4 | 5 | @if $enable-grid-classes { 6 | .row { 7 | @include make-row(); 8 | 9 | > * { 10 | @include make-col-ready(); 11 | } 12 | } 13 | } 14 | 15 | 16 | // Columns 17 | // 18 | // Common styles for small and large grid columns 19 | 20 | @if $enable-grid-classes { 21 | @include make-grid-columns(); 22 | } 23 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_helpers.scss: -------------------------------------------------------------------------------- 1 | @import "helpers/clearfix"; 2 | @import "helpers/colored-links"; 3 | @import "helpers/ratio"; 4 | @import "helpers/position"; 5 | @import "helpers/visually-hidden"; 6 | @import "helpers/stretched-link"; 7 | @import "helpers/text-truncation"; 8 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_images.scss: -------------------------------------------------------------------------------- 1 | // Responsive images (ensure images don't scale beyond their parents) 2 | // 3 | // This is purposefully opt-in via an explicit class rather than being the default for all ``s. 4 | // We previously tried the "images are responsive by default" approach in Bootstrap v2, 5 | // and abandoned it in Bootstrap v3 because it breaks lots of third-party widgets (including Google Maps) 6 | // which weren't expecting the images within themselves to be involuntarily resized. 7 | // See also https://github.com/twbs/bootstrap/issues/18178 8 | .img-fluid { 9 | @include img-fluid(); 10 | } 11 | 12 | 13 | // Image thumbnails 14 | .img-thumbnail { 15 | padding: $thumbnail-padding; 16 | background-color: $thumbnail-bg; 17 | border: $thumbnail-border-width solid $thumbnail-border-color; 18 | @include border-radius($thumbnail-border-radius); 19 | @include box-shadow($thumbnail-box-shadow); 20 | 21 | // Keep them at most 100% wide 22 | @include img-fluid(); 23 | } 24 | 25 | // 26 | // Figures 27 | // 28 | 29 | .figure { 30 | // Ensures the caption's text aligns with the image. 31 | display: inline-block; 32 | } 33 | 34 | .figure-img { 35 | margin-bottom: $spacer / 2; 36 | line-height: 1; 37 | } 38 | 39 | .figure-caption { 40 | @include font-size($figure-caption-font-size); 41 | color: $figure-caption-color; 42 | } 43 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_mixins.scss: -------------------------------------------------------------------------------- 1 | // Toggles 2 | // 3 | // Used in conjunction with global variables to enable certain theme features. 4 | 5 | // Vendor 6 | @import "vendor/rfs"; 7 | 8 | // Deprecate 9 | @import "mixins/deprecate"; 10 | 11 | // Helpers 12 | @import "mixins/breakpoints"; 13 | @import "mixins/image"; 14 | @import "mixins/resize"; 15 | @import "mixins/visually-hidden"; 16 | @import "mixins/reset-text"; 17 | @import "mixins/text-truncate"; 18 | 19 | // Utilities 20 | @import "mixins/utilities"; 21 | 22 | // Components 23 | @import "mixins/alert"; 24 | @import "mixins/buttons"; 25 | @import "mixins/caret"; 26 | @import "mixins/pagination"; 27 | @import "mixins/lists"; 28 | @import "mixins/list-group"; 29 | @import "mixins/forms"; 30 | @import "mixins/table-variants"; 31 | 32 | // Skins 33 | @import "mixins/border-radius"; 34 | @import "mixins/box-shadow"; 35 | @import "mixins/gradients"; 36 | @import "mixins/transition"; 37 | 38 | // Layout 39 | @import "mixins/clearfix"; 40 | @import "mixins/container"; 41 | @import "mixins/grid"; 42 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_nav.scss: -------------------------------------------------------------------------------- 1 | // Base class 2 | // 3 | // Kickstart any navigation component with a set of style resets. Works with 4 | // ``s, ``s or ``s. 5 | 6 | .nav { 7 | display: flex; 8 | flex-wrap: wrap; 9 | padding-left: 0; 10 | margin-bottom: 0; 11 | list-style: none; 12 | } 13 | 14 | .nav-link { 15 | display: block; 16 | padding: $nav-link-padding-y $nav-link-padding-x; 17 | @include font-size($nav-link-font-size); 18 | font-weight: $nav-link-font-weight; 19 | color: $nav-link-color; 20 | text-decoration: if($link-decoration == none, null, none); 21 | @include transition($nav-link-transition); 22 | 23 | &:hover, 24 | &:focus { 25 | color: $nav-link-hover-color; 26 | text-decoration: if($link-hover-decoration == underline, none, null); 27 | } 28 | 29 | // Disabled state lightens text 30 | &.disabled { 31 | color: $nav-link-disabled-color; 32 | pointer-events: none; 33 | cursor: default; 34 | } 35 | } 36 | 37 | // 38 | // Tabs 39 | // 40 | 41 | .nav-tabs { 42 | border-bottom: $nav-tabs-border-width solid $nav-tabs-border-color; 43 | 44 | .nav-link { 45 | margin-bottom: -$nav-tabs-border-width; 46 | background: none; 47 | border: $nav-tabs-border-width solid transparent; 48 | @include border-top-radius($nav-tabs-border-radius); 49 | 50 | &:hover, 51 | &:focus { 52 | border-color: $nav-tabs-link-hover-border-color; 53 | // Prevents active .nav-link tab overlapping focus outline of previous/next .nav-link 54 | isolation: isolate; 55 | } 56 | 57 | &.disabled { 58 | color: $nav-link-disabled-color; 59 | background-color: transparent; 60 | border-color: transparent; 61 | } 62 | } 63 | 64 | .nav-link.active, 65 | .nav-item.show .nav-link { 66 | color: $nav-tabs-link-active-color; 67 | background-color: $nav-tabs-link-active-bg; 68 | border-color: $nav-tabs-link-active-border-color; 69 | } 70 | 71 | .dropdown-menu { 72 | // Make dropdown border overlap tab border 73 | margin-top: -$nav-tabs-border-width; 74 | // Remove the top rounded corners here since there is a hard edge above the menu 75 | @include border-top-radius(0); 76 | } 77 | } 78 | 79 | 80 | // 81 | // Pills 82 | // 83 | 84 | .nav-pills { 85 | .nav-link { 86 | background: none; 87 | border: 0; 88 | @include border-radius($nav-pills-border-radius); 89 | } 90 | 91 | .nav-link.active, 92 | .show > .nav-link { 93 | color: $nav-pills-link-active-color; 94 | @include gradient-bg($nav-pills-link-active-bg); 95 | } 96 | } 97 | 98 | 99 | // 100 | // Justified variants 101 | // 102 | 103 | .nav-fill { 104 | > .nav-link, 105 | .nav-item { 106 | flex: 1 1 auto; 107 | text-align: center; 108 | } 109 | } 110 | 111 | .nav-justified { 112 | > .nav-link, 113 | .nav-item { 114 | flex-basis: 0; 115 | flex-grow: 1; 116 | text-align: center; 117 | } 118 | } 119 | 120 | 121 | // Tabbable tabs 122 | // 123 | // Hide tabbable panes to start, show them when `.active` 124 | 125 | .tab-content { 126 | > .tab-pane { 127 | display: none; 128 | } 129 | > .active { 130 | display: block; 131 | } 132 | } 133 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_pagination.scss: -------------------------------------------------------------------------------- 1 | .pagination { 2 | display: flex; 3 | @include list-unstyled(); 4 | } 5 | 6 | .page-link { 7 | position: relative; 8 | display: block; 9 | color: $pagination-color; 10 | text-decoration: if($link-decoration == none, null, none); 11 | background-color: $pagination-bg; 12 | border: $pagination-border-width solid $pagination-border-color; 13 | @include transition($pagination-transition); 14 | 15 | &:hover { 16 | z-index: 2; 17 | color: $pagination-hover-color; 18 | text-decoration: if($link-hover-decoration == underline, none, null); 19 | background-color: $pagination-hover-bg; 20 | border-color: $pagination-hover-border-color; 21 | } 22 | 23 | &:focus { 24 | z-index: 3; 25 | color: $pagination-focus-color; 26 | background-color: $pagination-focus-bg; 27 | outline: $pagination-focus-outline; 28 | box-shadow: $pagination-focus-box-shadow; 29 | } 30 | } 31 | 32 | .page-item { 33 | &:not(:first-child) .page-link { 34 | margin-left: $pagination-margin-start; 35 | } 36 | 37 | &.active .page-link { 38 | z-index: 3; 39 | color: $pagination-active-color; 40 | @include gradient-bg($pagination-active-bg); 41 | border-color: $pagination-active-border-color; 42 | } 43 | 44 | &.disabled .page-link { 45 | color: $pagination-disabled-color; 46 | pointer-events: none; 47 | background-color: $pagination-disabled-bg; 48 | border-color: $pagination-disabled-border-color; 49 | } 50 | } 51 | 52 | 53 | // 54 | // Sizing 55 | // 56 | @include pagination-size($pagination-padding-y, $pagination-padding-x, null, $pagination-border-radius); 57 | 58 | .pagination-lg { 59 | @include pagination-size($pagination-padding-y-lg, $pagination-padding-x-lg, $font-size-lg, $pagination-border-radius-lg); 60 | } 61 | 62 | .pagination-sm { 63 | @include pagination-size($pagination-padding-y-sm, $pagination-padding-x-sm, $font-size-sm, $pagination-border-radius-sm); 64 | } 65 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_progress.scss: -------------------------------------------------------------------------------- 1 | // Disable animation if transitions are disabled 2 | @if $enable-transitions { 3 | @keyframes progress-bar-stripes { 4 | 0% { background-position-x: $progress-height; } 5 | } 6 | } 7 | 8 | .progress { 9 | display: flex; 10 | height: $progress-height; 11 | overflow: hidden; // force rounded corners by cropping it 12 | @include font-size($progress-font-size); 13 | background-color: $progress-bg; 14 | @include border-radius($progress-border-radius); 15 | @include box-shadow($progress-box-shadow); 16 | } 17 | 18 | .progress-bar { 19 | display: flex; 20 | flex-direction: column; 21 | justify-content: center; 22 | overflow: hidden; 23 | color: $progress-bar-color; 24 | text-align: center; 25 | white-space: nowrap; 26 | background-color: $progress-bar-bg; 27 | @include transition($progress-bar-transition); 28 | } 29 | 30 | .progress-bar-striped { 31 | @include gradient-striped(); 32 | background-size: $progress-height $progress-height; 33 | } 34 | 35 | @if $enable-transitions { 36 | .progress-bar-animated { 37 | animation: $progress-bar-animation-timing progress-bar-stripes; 38 | 39 | @if $enable-reduced-motion { 40 | @media (prefers-reduced-motion: reduce) { 41 | animation: none; 42 | } 43 | } 44 | } 45 | } 46 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_root.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | // Custom variable values only support SassScript inside `#{}`. 3 | @each $color, $value in $colors { 4 | --#{$variable-prefix}#{$color}: #{$value}; 5 | } 6 | 7 | @each $color, $value in $theme-colors { 8 | --#{$variable-prefix}#{$color}: #{$value}; 9 | } 10 | 11 | // Use `inspect` for lists so that quoted items keep the quotes. 12 | // See https://github.com/sass/sass/issues/2383#issuecomment-336349172 13 | --#{$variable-prefix}font-sans-serif: #{inspect($font-family-sans-serif)}; 14 | --#{$variable-prefix}font-monospace: #{inspect($font-family-monospace)}; 15 | --#{$variable-prefix}gradient: #{$gradient}; 16 | } 17 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_spinners.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Rotating border 3 | // 4 | 5 | @keyframes spinner-border { 6 | to { transform: rotate(360deg) #{"/* rtl:ignore */"}; } 7 | } 8 | 9 | .spinner-border { 10 | display: inline-block; 11 | width: $spinner-width; 12 | height: $spinner-height; 13 | vertical-align: text-bottom; 14 | border: $spinner-border-width solid currentColor; 15 | border-right-color: transparent; 16 | // stylelint-disable-next-line property-disallowed-list 17 | border-radius: 50%; 18 | animation: $spinner-animation-speed linear infinite spinner-border; 19 | } 20 | 21 | .spinner-border-sm { 22 | width: $spinner-width-sm; 23 | height: $spinner-height-sm; 24 | border-width: $spinner-border-width-sm; 25 | } 26 | 27 | // 28 | // Growing circle 29 | // 30 | 31 | @keyframes spinner-grow { 32 | 0% { 33 | transform: scale(0); 34 | } 35 | 50% { 36 | opacity: 1; 37 | transform: none; 38 | } 39 | } 40 | 41 | .spinner-grow { 42 | display: inline-block; 43 | width: $spinner-width; 44 | height: $spinner-height; 45 | vertical-align: text-bottom; 46 | background-color: currentColor; 47 | // stylelint-disable-next-line property-disallowed-list 48 | border-radius: 50%; 49 | opacity: 0; 50 | animation: $spinner-animation-speed linear infinite spinner-grow; 51 | } 52 | 53 | .spinner-grow-sm { 54 | width: $spinner-width-sm; 55 | height: $spinner-height-sm; 56 | } 57 | 58 | @if $enable-reduced-motion { 59 | @media (prefers-reduced-motion: reduce) { 60 | .spinner-border, 61 | .spinner-grow { 62 | animation-duration: $spinner-animation-speed * 2; 63 | } 64 | } 65 | } 66 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_toasts.scss: -------------------------------------------------------------------------------- 1 | .toast { 2 | width: $toast-max-width; 3 | max-width: 100%; 4 | @include font-size($toast-font-size); 5 | color: $toast-color; 6 | pointer-events: auto; 7 | background-color: $toast-background-color; 8 | background-clip: padding-box; 9 | border: $toast-border-width solid $toast-border-color; 10 | box-shadow: $toast-box-shadow; 11 | @include border-radius($toast-border-radius); 12 | 13 | &:not(.showing):not(.show) { 14 | opacity: 0; 15 | } 16 | 17 | &.hide { 18 | display: none; 19 | } 20 | } 21 | 22 | .toast-container { 23 | width: max-content; 24 | max-width: 100%; 25 | pointer-events: none; 26 | 27 | > :not(:last-child) { 28 | margin-bottom: $toast-spacing; 29 | } 30 | } 31 | 32 | .toast-header { 33 | display: flex; 34 | align-items: center; 35 | padding: $toast-padding-y $toast-padding-x; 36 | color: $toast-header-color; 37 | background-color: $toast-header-background-color; 38 | background-clip: padding-box; 39 | border-bottom: $toast-border-width solid $toast-header-border-color; 40 | @include border-top-radius(subtract($toast-border-radius, $toast-border-width)); 41 | 42 | .btn-close { 43 | margin-right: $toast-padding-x / -2; 44 | margin-left: $toast-padding-x; 45 | } 46 | } 47 | 48 | .toast-body { 49 | padding: $toast-padding-x; // apply to both vertical and horizontal 50 | word-wrap: break-word; 51 | } 52 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_tooltip.scss: -------------------------------------------------------------------------------- 1 | // Base class 2 | .tooltip { 3 | position: absolute; 4 | z-index: $zindex-tooltip; 5 | display: block; 6 | margin: $tooltip-margin; 7 | // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element. 8 | // So reset our font and text properties to avoid inheriting weird values. 9 | @include reset-text(); 10 | @include font-size($tooltip-font-size); 11 | // Allow breaking very long words so they don't overflow the tooltip's bounds 12 | word-wrap: break-word; 13 | opacity: 0; 14 | 15 | &.show { opacity: $tooltip-opacity; } 16 | 17 | .tooltip-arrow { 18 | position: absolute; 19 | display: block; 20 | width: $tooltip-arrow-width; 21 | height: $tooltip-arrow-height; 22 | 23 | &::before { 24 | position: absolute; 25 | content: ""; 26 | border-color: transparent; 27 | border-style: solid; 28 | } 29 | } 30 | } 31 | 32 | .bs-tooltip-top { 33 | padding: $tooltip-arrow-height 0; 34 | 35 | .tooltip-arrow { 36 | bottom: 0; 37 | 38 | &::before { 39 | top: -1px; 40 | border-width: $tooltip-arrow-height ($tooltip-arrow-width / 2) 0; 41 | border-top-color: $tooltip-arrow-color; 42 | } 43 | } 44 | } 45 | 46 | .bs-tooltip-end { 47 | padding: 0 $tooltip-arrow-height; 48 | 49 | .tooltip-arrow { 50 | left: 0; 51 | width: $tooltip-arrow-height; 52 | height: $tooltip-arrow-width; 53 | 54 | &::before { 55 | right: -1px; 56 | border-width: ($tooltip-arrow-width / 2) $tooltip-arrow-height ($tooltip-arrow-width / 2) 0; 57 | border-right-color: $tooltip-arrow-color; 58 | } 59 | } 60 | } 61 | 62 | .bs-tooltip-bottom { 63 | padding: $tooltip-arrow-height 0; 64 | 65 | .tooltip-arrow { 66 | top: 0; 67 | 68 | &::before { 69 | bottom: -1px; 70 | border-width: 0 ($tooltip-arrow-width / 2) $tooltip-arrow-height; 71 | border-bottom-color: $tooltip-arrow-color; 72 | } 73 | } 74 | } 75 | 76 | .bs-tooltip-start { 77 | padding: 0 $tooltip-arrow-height; 78 | 79 | .tooltip-arrow { 80 | right: 0; 81 | width: $tooltip-arrow-height; 82 | height: $tooltip-arrow-width; 83 | 84 | &::before { 85 | left: -1px; 86 | border-width: ($tooltip-arrow-width / 2) 0 ($tooltip-arrow-width / 2) $tooltip-arrow-height; 87 | border-left-color: $tooltip-arrow-color; 88 | } 89 | } 90 | } 91 | 92 | .bs-tooltip-auto { 93 | &[data-popper-placement^="top"] { 94 | @extend .bs-tooltip-top; 95 | } 96 | &[data-popper-placement^="right"] { 97 | @extend .bs-tooltip-end; 98 | } 99 | &[data-popper-placement^="bottom"] { 100 | @extend .bs-tooltip-bottom; 101 | } 102 | &[data-popper-placement^="left"] { 103 | @extend .bs-tooltip-start; 104 | } 105 | } 106 | 107 | // Wrapper for the tooltip content 108 | .tooltip-inner { 109 | max-width: $tooltip-max-width; 110 | padding: $tooltip-padding-y $tooltip-padding-x; 111 | color: $tooltip-color; 112 | text-align: center; 113 | background-color: $tooltip-bg; 114 | @include border-radius($tooltip-border-radius); 115 | } 116 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_transitions.scss: -------------------------------------------------------------------------------- 1 | .fade { 2 | @include transition($transition-fade); 3 | 4 | &:not(.show) { 5 | opacity: 0; 6 | } 7 | } 8 | 9 | .collapse { 10 | &:not(.show) { 11 | display: none; 12 | } 13 | } 14 | 15 | .collapsing { 16 | height: 0; 17 | overflow: hidden; 18 | @include transition($transition-collapse); 19 | } 20 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/_type.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Headings 3 | // 4 | .h1 { 5 | @extend h1; 6 | } 7 | 8 | .h2 { 9 | @extend h2; 10 | } 11 | 12 | .h3 { 13 | @extend h3; 14 | } 15 | 16 | .h4 { 17 | @extend h4; 18 | } 19 | 20 | .h5 { 21 | @extend h5; 22 | } 23 | 24 | .h6 { 25 | @extend h6; 26 | } 27 | 28 | 29 | .lead { 30 | @include font-size($lead-font-size); 31 | font-weight: $lead-font-weight; 32 | } 33 | 34 | // Type display classes 35 | @each $display, $font-size in $display-font-sizes { 36 | .display-#{$display} { 37 | @include font-size($font-size); 38 | font-weight: $display-font-weight; 39 | line-height: $display-line-height; 40 | } 41 | } 42 | 43 | // 44 | // Emphasis 45 | // 46 | .small { 47 | @extend small; 48 | } 49 | 50 | .mark { 51 | @extend mark; 52 | } 53 | 54 | // 55 | // Lists 56 | // 57 | 58 | .list-unstyled { 59 | @include list-unstyled(); 60 | } 61 | 62 | // Inline turns list items into inline-block 63 | .list-inline { 64 | @include list-unstyled(); 65 | } 66 | .list-inline-item { 67 | display: inline-block; 68 | 69 | &:not(:last-child) { 70 | margin-right: $list-inline-padding; 71 | } 72 | } 73 | 74 | 75 | // 76 | // Misc 77 | // 78 | 79 | // Builds on `abbr` 80 | .initialism { 81 | @include font-size($initialism-font-size); 82 | text-transform: uppercase; 83 | } 84 | 85 | // Blockquotes 86 | .blockquote { 87 | margin-bottom: $blockquote-margin-y; 88 | @include font-size($blockquote-font-size); 89 | 90 | > :last-child { 91 | margin-bottom: 0; 92 | } 93 | } 94 | 95 | .blockquote-footer { 96 | margin-top: -$blockquote-margin-y; 97 | margin-bottom: $blockquote-margin-y; 98 | @include font-size($blockquote-footer-font-size); 99 | color: $blockquote-footer-color; 100 | 101 | &::before { 102 | content: "\2014\00A0"; // em dash, nbsp 103 | } 104 | } 105 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/bootstrap-grid.scss: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap Grid v5.0.0-beta2 (https://getbootstrap.com/) 3 | * Copyright 2011-2021 The Bootstrap Authors 4 | * Copyright 2011-2021 Twitter, Inc. 5 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) 6 | */ 7 | 8 | $include-column-box-sizing: true !default; 9 | 10 | @import "functions"; 11 | @import "variables"; 12 | 13 | @import "mixins/lists"; 14 | @import "mixins/breakpoints"; 15 | @import "mixins/container"; 16 | @import "mixins/grid"; 17 | @import "mixins/utilities"; 18 | 19 | @import "vendor/rfs"; 20 | 21 | @import "containers"; 22 | @import "grid"; 23 | 24 | @import "utilities"; 25 | // Only use the utilities we need 26 | // stylelint-disable-next-line scss/dollar-variable-default 27 | $utilities: map-get-multiple( 28 | $utilities, 29 | ( 30 | "display", 31 | "order", 32 | "flex", 33 | "flex-direction", 34 | "flex-grow", 35 | "flex-shrink", 36 | "flex-wrap", 37 | "justify-content", 38 | "align-items", 39 | "align-content", 40 | "align-self", 41 | "margin", 42 | "margin-x", 43 | "margin-y", 44 | "margin-top", 45 | "margin-end", 46 | "margin-bottom", 47 | "margin-start", 48 | "negative-margin", 49 | "negative-margin-x", 50 | "negative-margin-y", 51 | "negative-margin-top", 52 | "negative-margin-end", 53 | "negative-margin-bottom", 54 | "negative-margin-start", 55 | "padding", 56 | "padding-x", 57 | "padding-y", 58 | "padding-top", 59 | "padding-end", 60 | "padding-bottom", 61 | "padding-start", 62 | ) 63 | ); 64 | 65 | @import "utilities/api"; 66 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/bootstrap-reboot.scss: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap Reboot v5.0.0-beta2 (https://getbootstrap.com/) 3 | * Copyright 2011-2021 The Bootstrap Authors 4 | * Copyright 2011-2021 Twitter, Inc. 5 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) 6 | * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md) 7 | */ 8 | 9 | @import "functions"; 10 | @import "variables"; 11 | // Prevent the usage of custom properties since we don't add them to `:root` in reboot 12 | $font-family-base: $font-family-sans-serif; // stylelint-disable-line scss/dollar-variable-default 13 | $font-family-code: $font-family-monospace; // stylelint-disable-line scss/dollar-variable-default 14 | @import "mixins"; 15 | @import "reboot"; 16 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/bootstrap-utilities.scss: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap Utilities v5.0.0-beta2 (https://getbootstrap.com/) 3 | * Copyright 2011-2021 The Bootstrap Authors 4 | * Copyright 2011-2021 Twitter, Inc. 5 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) 6 | */ 7 | 8 | // Configuration 9 | @import "functions"; 10 | @import "variables"; 11 | @import "mixins"; 12 | @import "utilities"; 13 | 14 | // Helpers 15 | @import "helpers"; 16 | 17 | // Utilities 18 | @import "utilities/api"; 19 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/bootstrap.scss: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap v5.0.0-beta2 (https://getbootstrap.com/) 3 | * Copyright 2011-2021 The Bootstrap Authors 4 | * Copyright 2011-2021 Twitter, Inc. 5 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) 6 | */ 7 | 8 | // scss-docs-start import-stack 9 | // Configuration 10 | @import "functions"; 11 | @import "variables"; 12 | @import "mixins"; 13 | @import "utilities"; 14 | 15 | // Layout & components 16 | @import "root"; 17 | @import "reboot"; 18 | @import "type"; 19 | @import "images"; 20 | @import "containers"; 21 | @import "grid"; 22 | @import "tables"; 23 | @import "forms"; 24 | @import "buttons"; 25 | @import "transitions"; 26 | @import "dropdown"; 27 | @import "button-group"; 28 | @import "nav"; 29 | @import "navbar"; 30 | @import "card"; 31 | @import "accordion"; 32 | @import "breadcrumb"; 33 | @import "pagination"; 34 | @import "badge"; 35 | @import "alert"; 36 | @import "progress"; 37 | @import "list-group"; 38 | @import "close"; 39 | @import "toasts"; 40 | @import "modal"; 41 | @import "tooltip"; 42 | @import "popover"; 43 | @import "carousel"; 44 | @import "spinners"; 45 | 46 | // Helpers 47 | @import "helpers"; 48 | 49 | // Utilities 50 | @import "utilities/api"; 51 | // scss-docs-end import-stack 52 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/forms/_floating-labels.scss: -------------------------------------------------------------------------------- 1 | .form-floating { 2 | position: relative; 3 | 4 | > .form-control, 5 | > .form-select { 6 | height: $form-floating-height; 7 | padding: $form-floating-padding-y $form-floating-padding-x; 8 | } 9 | 10 | > label { 11 | position: absolute; 12 | top: 0; 13 | left: 0; 14 | height: 100%; // allow textareas 15 | padding: $form-floating-padding-y $form-floating-padding-x; 16 | pointer-events: none; 17 | border: $input-border-width solid transparent; // Required for aligning label's text with the input as it affects inner box model 18 | transform-origin: 0 0; 19 | @include transition($form-floating-transition); 20 | } 21 | 22 | // stylelint-disable no-duplicate-selectors 23 | > .form-control { 24 | &::placeholder { 25 | color: transparent; 26 | } 27 | 28 | &:focus, 29 | &:not(:placeholder-shown) { 30 | padding-top: $form-floating-input-padding-t; 31 | padding-bottom: $form-floating-input-padding-b; 32 | } 33 | // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped 34 | &:-webkit-autofill { 35 | padding-top: $form-floating-input-padding-t; 36 | padding-bottom: $form-floating-input-padding-b; 37 | } 38 | } 39 | 40 | > .form-select { 41 | padding-top: $form-floating-input-padding-t; 42 | padding-bottom: $form-floating-input-padding-b; 43 | } 44 | 45 | > .form-control:focus, 46 | > .form-control:not(:placeholder-shown), 47 | > .form-select { 48 | ~ label { 49 | opacity: $form-floating-label-opacity; 50 | transform: $form-floating-label-transform; 51 | } 52 | } 53 | // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped 54 | > .form-control:-webkit-autofill { 55 | ~ label { 56 | opacity: $form-floating-label-opacity; 57 | transform: $form-floating-label-transform; 58 | } 59 | } 60 | // stylelint-enable no-duplicate-selectors 61 | } 62 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/forms/_form-range.scss: -------------------------------------------------------------------------------- 1 | // Range 2 | // 3 | // Style range inputs the same across browsers. Vendor-specific rules for pseudo 4 | // elements cannot be mixed. As such, there are no shared styles for focus or 5 | // active states on prefixed selectors. 6 | 7 | .form-range { 8 | width: 100%; 9 | height: add($form-range-thumb-height, $form-range-thumb-focus-box-shadow-width * 2); 10 | padding: 0; // Need to reset padding 11 | background-color: transparent; 12 | appearance: none; 13 | 14 | &:focus { 15 | outline: 0; 16 | 17 | // Pseudo-elements must be split across multiple rulesets to have an effect. 18 | // No box-shadow() mixin for focus accessibility. 19 | &::-webkit-slider-thumb { box-shadow: $form-range-thumb-focus-box-shadow; } 20 | &::-moz-range-thumb { box-shadow: $form-range-thumb-focus-box-shadow; } 21 | } 22 | 23 | &::-moz-focus-outer { 24 | border: 0; 25 | } 26 | 27 | &::-webkit-slider-thumb { 28 | width: $form-range-thumb-width; 29 | height: $form-range-thumb-height; 30 | margin-top: ($form-range-track-height - $form-range-thumb-height) / 2; // Webkit specific 31 | @include gradient-bg($form-range-thumb-bg); 32 | border: $form-range-thumb-border; 33 | @include border-radius($form-range-thumb-border-radius); 34 | @include box-shadow($form-range-thumb-box-shadow); 35 | @include transition($form-range-thumb-transition); 36 | appearance: none; 37 | 38 | &:active { 39 | @include gradient-bg($form-range-thumb-active-bg); 40 | } 41 | } 42 | 43 | &::-webkit-slider-runnable-track { 44 | width: $form-range-track-width; 45 | height: $form-range-track-height; 46 | color: transparent; // Why? 47 | cursor: $form-range-track-cursor; 48 | background-color: $form-range-track-bg; 49 | border-color: transparent; 50 | @include border-radius($form-range-track-border-radius); 51 | @include box-shadow($form-range-track-box-shadow); 52 | } 53 | 54 | &::-moz-range-thumb { 55 | width: $form-range-thumb-width; 56 | height: $form-range-thumb-height; 57 | @include gradient-bg($form-range-thumb-bg); 58 | border: $form-range-thumb-border; 59 | @include border-radius($form-range-thumb-border-radius); 60 | @include box-shadow($form-range-thumb-box-shadow); 61 | @include transition($form-range-thumb-transition); 62 | appearance: none; 63 | 64 | &:active { 65 | @include gradient-bg($form-range-thumb-active-bg); 66 | } 67 | } 68 | 69 | &::-moz-range-track { 70 | width: $form-range-track-width; 71 | height: $form-range-track-height; 72 | color: transparent; 73 | cursor: $form-range-track-cursor; 74 | background-color: $form-range-track-bg; 75 | border-color: transparent; // Firefox specific? 76 | @include border-radius($form-range-track-border-radius); 77 | @include box-shadow($form-range-track-box-shadow); 78 | } 79 | 80 | &:disabled { 81 | pointer-events: none; 82 | 83 | &::-webkit-slider-thumb { 84 | background-color: $form-range-thumb-disabled-bg; 85 | } 86 | 87 | &::-moz-range-thumb { 88 | background-color: $form-range-thumb-disabled-bg; 89 | } 90 | } 91 | } 92 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/forms/_form-select.scss: -------------------------------------------------------------------------------- 1 | // Select 2 | // 3 | // Replaces the browser default select with a custom one, mostly pulled from 4 | // https://primer.github.io/. 5 | 6 | .form-select { 7 | display: block; 8 | width: 100%; 9 | padding: $form-select-padding-y $form-select-indicator-padding $form-select-padding-y $form-select-padding-x; 10 | font-family: $form-select-font-family; 11 | @include font-size($form-select-font-size); 12 | font-weight: $form-select-font-weight; 13 | line-height: $form-select-line-height; 14 | color: $form-select-color; 15 | background-color: $form-select-bg; 16 | background-image: escape-svg($form-select-indicator); 17 | background-repeat: no-repeat; 18 | background-position: $form-select-bg-position; 19 | background-size: $form-select-bg-size; 20 | border: $form-select-border-width solid $form-select-border-color; 21 | @include border-radius($form-select-border-radius, 0); 22 | @include box-shadow($form-select-box-shadow); 23 | appearance: none; 24 | 25 | &:focus { 26 | border-color: $form-select-focus-border-color; 27 | outline: 0; 28 | @if $enable-shadows { 29 | @include box-shadow($form-select-box-shadow, $form-select-focus-box-shadow); 30 | } @else { 31 | // Avoid using mixin so we can pass custom focus shadow properly 32 | box-shadow: $form-select-focus-box-shadow; 33 | } 34 | } 35 | 36 | &[multiple], 37 | &[size]:not([size="1"]) { 38 | padding-right: $form-select-padding-x; 39 | background-image: none; 40 | } 41 | 42 | &:disabled { 43 | color: $form-select-disabled-color; 44 | background-color: $form-select-disabled-bg; 45 | border-color: $form-select-disabled-border-color; 46 | } 47 | 48 | // Remove outline from select box in FF 49 | &:-moz-focusring { 50 | color: transparent; 51 | text-shadow: 0 0 0 $form-select-color; 52 | } 53 | } 54 | 55 | .form-select-sm { 56 | padding-top: $form-select-padding-y-sm; 57 | padding-bottom: $form-select-padding-y-sm; 58 | padding-left: $form-select-padding-x-sm; 59 | @include font-size($form-select-font-size-sm); 60 | } 61 | 62 | .form-select-lg { 63 | padding-top: $form-select-padding-y-lg; 64 | padding-bottom: $form-select-padding-y-lg; 65 | padding-left: $form-select-padding-x-lg; 66 | @include font-size($form-select-font-size-lg); 67 | } 68 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/forms/_form-text.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Form text 3 | // 4 | 5 | .form-text { 6 | margin-top: $form-text-margin-top; 7 | @include font-size($form-text-font-size); 8 | font-style: $form-text-font-style; 9 | font-weight: $form-text-font-weight; 10 | color: $form-text-color; 11 | } 12 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/forms/_labels.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Labels 3 | // 4 | 5 | .form-label { 6 | margin-bottom: $form-label-margin-bottom; 7 | @include font-size($form-label-font-size); 8 | font-style: $form-label-font-style; 9 | font-weight: $form-label-font-weight; 10 | color: $form-label-color; 11 | } 12 | 13 | // For use with horizontal and inline forms, when you need the label (or legend) 14 | // text to align with the form controls. 15 | .col-form-label { 16 | padding-top: add($input-padding-y, $input-border-width); 17 | padding-bottom: add($input-padding-y, $input-border-width); 18 | margin-bottom: 0; // Override the `` default 19 | @include font-size(inherit); // Override the `` default 20 | font-style: $form-label-font-style; 21 | font-weight: $form-label-font-weight; 22 | line-height: $input-line-height; 23 | color: $form-label-color; 24 | } 25 | 26 | .col-form-label-lg { 27 | padding-top: add($input-padding-y-lg, $input-border-width); 28 | padding-bottom: add($input-padding-y-lg, $input-border-width); 29 | @include font-size($input-font-size-lg); 30 | } 31 | 32 | .col-form-label-sm { 33 | padding-top: add($input-padding-y-sm, $input-border-width); 34 | padding-bottom: add($input-padding-y-sm, $input-border-width); 35 | @include font-size($input-font-size-sm); 36 | } 37 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/forms/_validation.scss: -------------------------------------------------------------------------------- 1 | // Form validation 2 | // 3 | // Provide feedback to users when form field values are valid or invalid. Works 4 | // primarily for client-side validation via scoped `:invalid` and `:valid` 5 | // pseudo-classes but also includes `.is-invalid` and `.is-valid` classes for 6 | // server-side validation. 7 | 8 | // scss-docs-start form-validation-states-loop 9 | @each $state, $data in $form-validation-states { 10 | @include form-validation-state($state, $data...); 11 | } 12 | // scss-docs-end form-validation-states-loop 13 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/helpers/_clearfix.scss: -------------------------------------------------------------------------------- 1 | .clearfix { 2 | @include clearfix(); 3 | } 4 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/helpers/_colored-links.scss: -------------------------------------------------------------------------------- 1 | @each $color, $value in $theme-colors { 2 | .link-#{$color} { 3 | color: $value; 4 | 5 | @if $link-shade-percentage != 0 { 6 | &:hover, 7 | &:focus { 8 | color: if(color-contrast($value) == $color-contrast-light, shade-color($value, $link-shade-percentage), tint-color($value, $link-shade-percentage)); 9 | } 10 | } 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/helpers/_position.scss: -------------------------------------------------------------------------------- 1 | // Shorthand 2 | 3 | .fixed-top { 4 | position: fixed; 5 | top: 0; 6 | right: 0; 7 | left: 0; 8 | z-index: $zindex-fixed; 9 | } 10 | 11 | .fixed-bottom { 12 | position: fixed; 13 | right: 0; 14 | bottom: 0; 15 | left: 0; 16 | z-index: $zindex-fixed; 17 | } 18 | 19 | // Responsive sticky top 20 | @each $breakpoint in map-keys($grid-breakpoints) { 21 | @include media-breakpoint-up($breakpoint) { 22 | $infix: breakpoint-infix($breakpoint, $grid-breakpoints); 23 | 24 | .sticky#{$infix}-top { 25 | position: sticky; 26 | top: 0; 27 | z-index: $zindex-sticky; 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/helpers/_ratio.scss: -------------------------------------------------------------------------------- 1 | // Credit: Nicolas Gallagher and SUIT CSS. 2 | 3 | .ratio { 4 | position: relative; 5 | width: 100%; 6 | 7 | &::before { 8 | display: block; 9 | padding-top: var(--#{$variable-prefix}aspect-ratio); 10 | content: ""; 11 | } 12 | 13 | > * { 14 | position: absolute; 15 | top: 0; 16 | left: 0; 17 | width: 100%; 18 | height: 100%; 19 | } 20 | } 21 | 22 | @each $key, $ratio in $aspect-ratios { 23 | .ratio-#{$key} { 24 | --#{$variable-prefix}aspect-ratio: #{$ratio}; 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/helpers/_stretched-link.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Stretched link 3 | // 4 | 5 | .stretched-link { 6 | &::#{$stretched-link-pseudo-element} { 7 | position: absolute; 8 | top: 0; 9 | right: 0; 10 | bottom: 0; 11 | left: 0; 12 | z-index: $stretched-link-z-index; 13 | content: ""; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/helpers/_text-truncation.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Text truncation 3 | // 4 | 5 | .text-truncate { 6 | @include text-truncate(); 7 | } 8 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/helpers/_visually-hidden.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Visually hidden 3 | // 4 | 5 | .visually-hidden, 6 | .visually-hidden-focusable:not(:focus):not(:focus-within) { 7 | @include visually-hidden(); 8 | } 9 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_alert.scss: -------------------------------------------------------------------------------- 1 | @mixin alert-variant($background, $border, $color) { 2 | color: $color; 3 | @include gradient-bg($background); 4 | border-color: $border; 5 | 6 | .alert-link { 7 | color: shade-color($color, 20%); 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_border-radius.scss: -------------------------------------------------------------------------------- 1 | // stylelint-disable property-disallowed-list 2 | // Single side border-radius 3 | 4 | // Helper function to replace negative values with 0 5 | @function valid-radius($radius) { 6 | $return: (); 7 | @each $value in $radius { 8 | @if type-of($value) == number { 9 | $return: append($return, max($value, 0)); 10 | } @else { 11 | $return: append($return, $value); 12 | } 13 | } 14 | @return $return; 15 | } 16 | 17 | @mixin border-radius($radius: $border-radius, $fallback-border-radius: false) { 18 | @if $enable-rounded { 19 | border-radius: valid-radius($radius); 20 | } 21 | @else if $fallback-border-radius != false { 22 | border-radius: $fallback-border-radius; 23 | } 24 | } 25 | 26 | @mixin border-top-radius($radius: $border-radius) { 27 | @if $enable-rounded { 28 | border-top-left-radius: valid-radius($radius); 29 | border-top-right-radius: valid-radius($radius); 30 | } 31 | } 32 | 33 | @mixin border-end-radius($radius: $border-radius) { 34 | @if $enable-rounded { 35 | border-top-right-radius: valid-radius($radius); 36 | border-bottom-right-radius: valid-radius($radius); 37 | } 38 | } 39 | 40 | @mixin border-bottom-radius($radius: $border-radius) { 41 | @if $enable-rounded { 42 | border-bottom-right-radius: valid-radius($radius); 43 | border-bottom-left-radius: valid-radius($radius); 44 | } 45 | } 46 | 47 | @mixin border-start-radius($radius: $border-radius) { 48 | @if $enable-rounded { 49 | border-top-left-radius: valid-radius($radius); 50 | border-bottom-left-radius: valid-radius($radius); 51 | } 52 | } 53 | 54 | @mixin border-top-start-radius($radius: $border-radius) { 55 | @if $enable-rounded { 56 | border-top-left-radius: valid-radius($radius); 57 | } 58 | } 59 | 60 | @mixin border-top-end-radius($radius: $border-radius) { 61 | @if $enable-rounded { 62 | border-top-right-radius: valid-radius($radius); 63 | } 64 | } 65 | 66 | @mixin border-bottom-end-radius($radius: $border-radius) { 67 | @if $enable-rounded { 68 | border-bottom-right-radius: valid-radius($radius); 69 | } 70 | } 71 | 72 | @mixin border-bottom-start-radius($radius: $border-radius) { 73 | @if $enable-rounded { 74 | border-bottom-left-radius: valid-radius($radius); 75 | } 76 | } 77 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_box-shadow.scss: -------------------------------------------------------------------------------- 1 | @mixin box-shadow($shadow...) { 2 | @if $enable-shadows { 3 | $result: (); 4 | 5 | @each $value in $shadow { 6 | @if $value != null { 7 | $result: append($result, $value, "comma"); 8 | } 9 | @if $value == none and length($shadow) > 1 { 10 | @warn "The keyword 'none' must be used as a single argument."; 11 | } 12 | } 13 | 14 | @if (length($result) > 0) { 15 | box-shadow: $result; 16 | } 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_caret.scss: -------------------------------------------------------------------------------- 1 | @mixin caret-down { 2 | border-top: $caret-width solid; 3 | border-right: $caret-width solid transparent; 4 | border-bottom: 0; 5 | border-left: $caret-width solid transparent; 6 | } 7 | 8 | @mixin caret-up { 9 | border-top: 0; 10 | border-right: $caret-width solid transparent; 11 | border-bottom: $caret-width solid; 12 | border-left: $caret-width solid transparent; 13 | } 14 | 15 | @mixin caret-end { 16 | border-top: $caret-width solid transparent; 17 | border-right: 0; 18 | border-bottom: $caret-width solid transparent; 19 | border-left: $caret-width solid; 20 | } 21 | 22 | @mixin caret-start { 23 | border-top: $caret-width solid transparent; 24 | border-right: $caret-width solid; 25 | border-bottom: $caret-width solid transparent; 26 | } 27 | 28 | @mixin caret($direction: down) { 29 | @if $enable-caret { 30 | &::after { 31 | display: inline-block; 32 | margin-left: $caret-spacing; 33 | vertical-align: $caret-vertical-align; 34 | content: ""; 35 | @if $direction == down { 36 | @include caret-down(); 37 | } @else if $direction == up { 38 | @include caret-up(); 39 | } @else if $direction == end { 40 | @include caret-end(); 41 | } 42 | } 43 | 44 | @if $direction == start { 45 | &::after { 46 | display: none; 47 | } 48 | 49 | &::before { 50 | display: inline-block; 51 | margin-right: $caret-spacing; 52 | vertical-align: $caret-vertical-align; 53 | content: ""; 54 | @include caret-start(); 55 | } 56 | } 57 | 58 | &:empty::after { 59 | margin-left: 0; 60 | } 61 | } 62 | } 63 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_clearfix.scss: -------------------------------------------------------------------------------- 1 | // scss-docs-start clearfix 2 | @mixin clearfix() { 3 | &::after { 4 | display: block; 5 | clear: both; 6 | content: ""; 7 | } 8 | } 9 | // scss-docs-end clearfix 10 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_container.scss: -------------------------------------------------------------------------------- 1 | // Container mixins 2 | 3 | @mixin make-container($gutter: $container-padding-x) { 4 | width: 100%; 5 | padding-right: var(--#{$variable-prefix}gutter-x, #{$gutter}); 6 | padding-left: var(--#{$variable-prefix}gutter-x, #{$gutter}); 7 | margin-right: auto; 8 | margin-left: auto; 9 | } 10 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_deprecate.scss: -------------------------------------------------------------------------------- 1 | // Deprecate mixin 2 | // 3 | // This mixin can be used to deprecate mixins or functions. 4 | // `$enable-deprecation-messages` is a global variable, `$ignore-warning` is a variable that can be passed to 5 | // some deprecated mixins to suppress the warning (for example if the mixin is still be used in the current version of Bootstrap) 6 | @mixin deprecate($name, $deprecate-version, $remove-version, $ignore-warning: false) { 7 | @if ($enable-deprecation-messages != false and $ignore-warning != true) { 8 | @warn "#{$name} has been deprecated as of #{$deprecate-version}. It will be removed entirely in #{$remove-version}."; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_gradients.scss: -------------------------------------------------------------------------------- 1 | // Gradients 2 | 3 | // scss-docs-start gradient-bg-mixin 4 | @mixin gradient-bg($color: null) { 5 | background-color: $color; 6 | 7 | @if $enable-gradients { 8 | background-image: var(--#{$variable-prefix}gradient); 9 | } 10 | } 11 | // scss-docs-end gradient-bg-mixin 12 | 13 | // scss-docs-start gradient-mixins 14 | // Horizontal gradient, from left to right 15 | // 16 | // Creates two color stops, start and end, by specifying a color and position for each color stop. 17 | @mixin gradient-x($start-color: $gray-700, $end-color: $gray-800, $start-percent: 0%, $end-percent: 100%) { 18 | background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent); 19 | } 20 | 21 | // Vertical gradient, from top to bottom 22 | // 23 | // Creates two color stops, start and end, by specifying a color and position for each color stop. 24 | @mixin gradient-y($start-color: $gray-700, $end-color: $gray-800, $start-percent: null, $end-percent: null) { 25 | background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); 26 | } 27 | 28 | @mixin gradient-directional($start-color: $gray-700, $end-color: $gray-800, $deg: 45deg) { 29 | background-image: linear-gradient($deg, $start-color, $end-color); 30 | } 31 | 32 | @mixin gradient-x-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) { 33 | background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color); 34 | } 35 | 36 | @mixin gradient-y-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) { 37 | background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color); 38 | } 39 | 40 | @mixin gradient-radial($inner-color: $gray-700, $outer-color: $gray-800) { 41 | background-image: radial-gradient(circle, $inner-color, $outer-color); 42 | } 43 | 44 | @mixin gradient-striped($color: rgba($white, .15), $angle: 45deg) { 45 | background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent); 46 | } 47 | // scss-docs-end gradient-mixins 48 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_image.scss: -------------------------------------------------------------------------------- 1 | // Image Mixins 2 | // - Responsive image 3 | // - Retina image 4 | 5 | 6 | // Responsive image 7 | // 8 | // Keep images from scaling beyond the width of their parents. 9 | 10 | @mixin img-fluid { 11 | // Part 1: Set a maximum relative to the parent 12 | max-width: 100%; 13 | // Part 2: Override the height to auto, otherwise images will be stretched 14 | // when setting a width and height attribute on the img element. 15 | height: auto; 16 | } 17 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_list-group.scss: -------------------------------------------------------------------------------- 1 | // List Groups 2 | 3 | @mixin list-group-item-variant($state, $background, $color) { 4 | .list-group-item-#{$state} { 5 | color: $color; 6 | background-color: $background; 7 | 8 | &.list-group-item-action { 9 | &:hover, 10 | &:focus { 11 | color: $color; 12 | background-color: shade-color($background, 10%); 13 | } 14 | 15 | &.active { 16 | color: $white; 17 | background-color: $color; 18 | border-color: $color; 19 | } 20 | } 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_lists.scss: -------------------------------------------------------------------------------- 1 | // Lists 2 | 3 | // Unstyled keeps list items block level, just removes default browser padding and list-style 4 | @mixin list-unstyled { 5 | padding-left: 0; 6 | list-style: none; 7 | } 8 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_pagination.scss: -------------------------------------------------------------------------------- 1 | // Pagination 2 | 3 | @mixin pagination-size($padding-y, $padding-x, $font-size, $border-radius) { 4 | .page-link { 5 | padding: $padding-y $padding-x; 6 | @include font-size($font-size); 7 | } 8 | 9 | .page-item { 10 | @if $pagination-margin-start == (-$pagination-border-width) { 11 | &:first-child { 12 | .page-link { 13 | @include border-start-radius($border-radius); 14 | } 15 | } 16 | 17 | &:last-child { 18 | .page-link { 19 | @include border-end-radius($border-radius); 20 | } 21 | } 22 | } @else { 23 | //Add border-radius to all pageLinks in case they have left margin 24 | .page-link { 25 | @include border-radius($border-radius); 26 | } 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_reset-text.scss: -------------------------------------------------------------------------------- 1 | @mixin reset-text { 2 | font-family: $font-family-base; 3 | // We deliberately do NOT reset font-size or overflow-wrap / word-wrap. 4 | font-style: normal; 5 | font-weight: $font-weight-normal; 6 | line-height: $line-height-base; 7 | text-align: left; // Fallback for where `start` is not supported 8 | text-align: start; 9 | text-decoration: none; 10 | text-shadow: none; 11 | text-transform: none; 12 | letter-spacing: normal; 13 | word-break: normal; 14 | word-spacing: normal; 15 | white-space: normal; 16 | line-break: auto; 17 | } 18 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_resize.scss: -------------------------------------------------------------------------------- 1 | // Resize anything 2 | 3 | @mixin resizable($direction) { 4 | overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible` 5 | resize: $direction; // Options: horizontal, vertical, both 6 | } 7 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_table-variants.scss: -------------------------------------------------------------------------------- 1 | // scss-docs-start table-variant 2 | @mixin table-variant($state, $background) { 3 | .table-#{$state} { 4 | $color: color-contrast(opaque($body-bg, $background)); 5 | $hover-bg: mix($color, $background, percentage($table-hover-bg-factor)); 6 | $striped-bg: mix($color, $background, percentage($table-striped-bg-factor)); 7 | $active-bg: mix($color, $background, percentage($table-active-bg-factor)); 8 | 9 | --#{$variable-prefix}table-bg: #{$background}; 10 | --#{$variable-prefix}table-striped-bg: #{$striped-bg}; 11 | --#{$variable-prefix}table-striped-color: #{color-contrast($striped-bg)}; 12 | --#{$variable-prefix}table-active-bg: #{$active-bg}; 13 | --#{$variable-prefix}table-active-color: #{color-contrast($active-bg)}; 14 | --#{$variable-prefix}table-hover-bg: #{$hover-bg}; 15 | --#{$variable-prefix}table-hover-color: #{color-contrast($hover-bg)}; 16 | 17 | color: $color; 18 | border-color: mix($color, $background, percentage($table-border-factor)); 19 | } 20 | } 21 | // scss-docs-end table-variant 22 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_text-truncate.scss: -------------------------------------------------------------------------------- 1 | // Text truncate 2 | // Requires inline-block or block for proper styling 3 | 4 | @mixin text-truncate() { 5 | overflow: hidden; 6 | text-overflow: ellipsis; 7 | white-space: nowrap; 8 | } 9 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_transition.scss: -------------------------------------------------------------------------------- 1 | // stylelint-disable property-disallowed-list 2 | @mixin transition($transition...) { 3 | @if length($transition) == 0 { 4 | $transition: $transition-base; 5 | } 6 | 7 | @if length($transition) > 1 { 8 | @each $value in $transition { 9 | @if $value == null or $value == none { 10 | @warn "The keyword 'none' or 'null' must be used as a single argument."; 11 | } 12 | } 13 | } 14 | 15 | @if $enable-transitions { 16 | @if nth($transition, 1) != null { 17 | transition: $transition; 18 | } 19 | 20 | @if $enable-reduced-motion and nth($transition, 1) != null and nth($transition, 1) != none { 21 | @media (prefers-reduced-motion: reduce) { 22 | transition: none; 23 | } 24 | } 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_utilities.scss: -------------------------------------------------------------------------------- 1 | // Utility generator 2 | // Used to generate utilities & print utilities 3 | @mixin generate-utility($utility, $infix, $is-rfs-media-query: false) { 4 | $values: map-get($utility, values); 5 | 6 | // If the values are a list or string, convert it into a map 7 | @if type-of($values) == "string" or type-of(nth($values, 1)) != "list" { 8 | $values: zip($values, $values); 9 | } 10 | 11 | @each $key, $value in $values { 12 | $properties: map-get($utility, property); 13 | 14 | // Multiple properties are possible, for example with vertical or horizontal margins or paddings 15 | @if type-of($properties) == "string" { 16 | $properties: append((), $properties); 17 | } 18 | 19 | // Use custom class if present 20 | $property-class: if(map-has-key($utility, class), map-get($utility, class), nth($properties, 1)); 21 | $property-class: if($property-class == null, "", $property-class); 22 | 23 | // State params to generate pseudo-classes 24 | $state: if(map-has-key($utility, state), map-get($utility, state), ()); 25 | 26 | $infix: if($property-class == "" and str-slice($infix, 1, 1) == "-", str-slice($infix, 2), $infix); 27 | 28 | // Don't prefix if value key is null (eg. with shadow class) 29 | $property-class-modifier: if($key, if($property-class == "" and $infix == "", "", "-") + $key, ""); 30 | 31 | @if map-get($utility, rfs) { 32 | // Inside the media query 33 | @if $is-rfs-media-query { 34 | $val: rfs-value($value); 35 | 36 | // Do not render anything if fluid and non fluid values are the same 37 | $value: if($val == rfs-fluid-value($value), null, $val); 38 | } 39 | @else { 40 | $value: rfs-fluid-value($value); 41 | } 42 | } 43 | 44 | $is-rtl: map-get($utility, rtl); 45 | 46 | @if $value != null { 47 | @if $is-rtl == false { 48 | /* rtl:begin:remove */ 49 | } 50 | .#{$property-class + $infix + $property-class-modifier} { 51 | @each $property in $properties { 52 | #{$property}: $value if($enable-important-utilities, !important, null); 53 | } 54 | } 55 | 56 | @each $pseudo in $state { 57 | .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} { 58 | @each $property in $properties { 59 | #{$property}: $value if($enable-important-utilities, !important, null); 60 | } 61 | } 62 | } 63 | @if $is-rtl == false { 64 | /* rtl:end:remove */ 65 | } 66 | } 67 | } 68 | } 69 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/mixins/_visually-hidden.scss: -------------------------------------------------------------------------------- 1 | // stylelint-disable declaration-no-important 2 | 3 | // Hide content visually while keeping it accessible to assistive technologies 4 | // 5 | // See: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/ 6 | // See: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/ 7 | 8 | @mixin visually-hidden() { 9 | position: absolute !important; 10 | width: 1px !important; 11 | height: 1px !important; 12 | padding: 0 !important; 13 | margin: -1px !important; // Fix for https://github.com/twbs/bootstrap/issues/25686 14 | overflow: hidden !important; 15 | clip: rect(0, 0, 0, 0) !important; 16 | white-space: nowrap !important; 17 | border: 0 !important; 18 | } 19 | 20 | // Use to only display content when it's focused, or one of its child elements is focused 21 | // (i.e. when focus is within the element/container that the class was applied to) 22 | // 23 | // Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1 24 | 25 | @mixin visually-hidden-focusable() { 26 | &:not(:focus):not(:focus-within) { 27 | @include visually-hidden(); 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/bootstrap/utilities/_api.scss: -------------------------------------------------------------------------------- 1 | // Loop over each breakpoint 2 | @each $breakpoint in map-keys($grid-breakpoints) { 3 | 4 | // Generate media query if needed 5 | @include media-breakpoint-up($breakpoint) { 6 | $infix: breakpoint-infix($breakpoint, $grid-breakpoints); 7 | 8 | // Loop over each utility property 9 | @each $key, $utility in $utilities { 10 | // The utility can be disabled with `false`, thus check if the utility is a map first 11 | // Only proceed if responsive media queries are enabled or if it's the base media query 12 | @if type-of($utility) == "map" and (map-get($utility, responsive) or $infix == "") { 13 | @include generate-utility($utility, $infix); 14 | } 15 | } 16 | } 17 | } 18 | 19 | // RFS rescaling 20 | @media (min-width: $rfs-mq-value) { 21 | @each $breakpoint in map-keys($grid-breakpoints) { 22 | $infix: breakpoint-infix($breakpoint, $grid-breakpoints); 23 | 24 | @if (map-get($grid-breakpoints, $breakpoint) < $rfs-breakpoint) { 25 | // Loop over each utility property 26 | @each $key, $utility in $utilities { 27 | // The utility can be disabled with `false`, thus check if the utility is a map first 28 | // Only proceed if responsive media queries are enabled or if it's the base media query 29 | @if type-of($utility) == "map" and map-get($utility, rfs) and (map-get($utility, responsive) or $infix == "") { 30 | @include generate-utility($utility, $infix, true); 31 | } 32 | } 33 | } 34 | } 35 | } 36 | 37 | 38 | // Print utilities 39 | @media print { 40 | @each $key, $utility in $utilities { 41 | // The utility can be disabled with `false`, thus check if the utility is a map first 42 | // Then check if the utility needs print styles 43 | @if type-of($utility) == "map" and map-get($utility, print) == true { 44 | @include generate-utility($utility, "-print"); 45 | } 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/custom/_styles.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/scss/soft-design-system/custom/_styles.scss -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/custom/_variables.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/static/assets/scss/soft-design-system/custom/_variables.scss -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/forms/_form-check.scss: -------------------------------------------------------------------------------- 1 | .form-check:not(.form-switch) .form-check-input { 2 | &[type="checkbox"], 3 | &[type="radio"] { 4 | border: 1px solid darken($gray-200, 10%); 5 | margin-top: $form-text-margin-top; 6 | position: relative; 7 | 8 | &:checked { 9 | border: 0; 10 | } 11 | } 12 | 13 | &[type="checkbox"] { 14 | &:after { 15 | transition: opacity $form-check-transition-time ease-in-out; 16 | font-family: "FontAwesome"; 17 | content: "\f00c"; 18 | width: 100%; 19 | height: 100%; 20 | color: $form-check-input-checked-color; 21 | position: absolute; 22 | display: flex; 23 | justify-content: center; 24 | align-items: center; 25 | font-size: $font-size-sm - .205; 26 | opacity: 0; 27 | } 28 | 29 | &:checked:after { 30 | opacity: 1; 31 | } 32 | } 33 | 34 | &[type="radio"] { 35 | transition: border 0s; 36 | 37 | &:after { 38 | transition: opacity $form-check-transition-time ease-in-out; 39 | content: ""; 40 | position: absolute; 41 | width: $form-check-radio-after-width; 42 | height: $form-check-radio-after-width; 43 | border-radius: 50%; 44 | background-color: $white; 45 | opacity: 0; 46 | } 47 | 48 | &:checked { 49 | padding: 6px; 50 | } 51 | 52 | &:checked:after { 53 | opacity: 1; 54 | } 55 | } 56 | } 57 | 58 | .form-check-label, 59 | .form-check-input[type="checkbox"] { 60 | cursor: pointer; 61 | } 62 | 63 | .form-check-label{ 64 | font-size:$font-size-sm; 65 | font-weight: $font-weight-normal; 66 | } 67 | 68 | .form-check-input{ 69 | -webkit-appearance: none; 70 | -moz-appearance: none; 71 | appearance: none; 72 | } 73 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/forms/_form-select.scss: -------------------------------------------------------------------------------- 1 | .form-select { 2 | transition: $input-transition; 3 | } 4 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/forms/_form-switch.scss: -------------------------------------------------------------------------------- 1 | .form-switch{ 2 | .form-check-input{ 3 | border: 1px solid $gray-200; 4 | position: relative; 5 | background-color: rgba($dark-gradient-state, .1); 6 | height: $form-check-input-width + .02; 7 | 8 | &:after { 9 | transition: transform $form-check-transition-time ease-in-out, background-color $form-check-transition-time ease-in-out; 10 | content: ""; 11 | width: $form-switch-check-after-width; 12 | height: $form-switch-check-after-width; 13 | border-radius: 50%; 14 | position: absolute; 15 | background-color: $white; 16 | transform: translateX($form-switch-translate-x-start); 17 | box-shadow: $form-switch-round-box-shadow; 18 | top: 1px; 19 | } 20 | 21 | &:checked:after { 22 | transform: translateX($form-switch-translate-x-end); 23 | } 24 | 25 | &:checked { 26 | border-color: rgba($dark-gradient-state, .95); 27 | background-color: rgba($dark-gradient-state, .95); 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/forms/_forms.scss: -------------------------------------------------------------------------------- 1 | @import 'input-group'; 2 | @import 'form-check'; 3 | @import 'form-switch'; 4 | @import 'form-select'; 5 | @import 'labels'; 6 | @import 'inputs'; 7 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/forms/_input-group.scss: -------------------------------------------------------------------------------- 1 | .input-group { 2 | @include border-radius($input-border-radius, 0); 3 | 4 | &, 5 | .input-group-text { 6 | transition: $input-transition; 7 | } 8 | 9 | & > :not(:first-child):not(.dropdown-menu) { 10 | margin-left: 0; 11 | } 12 | 13 | .form-control { 14 | &:focus { 15 | border-left: $input-border-width solid $input-focus-border-color !important; 16 | border-right: $input-border-width solid $input-focus-border-color !important; 17 | } 18 | 19 | &:not(:first-child) { 20 | border-left: 0; 21 | padding-left: 0; 22 | } 23 | &:not(:last-child) { 24 | border-right: 0; 25 | padding-right: 0; 26 | } 27 | 28 | & + .input-group-text { 29 | border-left: 0; 30 | border-right: $input-border-width solid $input-border-color; 31 | } 32 | } 33 | 34 | .input-group-text { 35 | border-right: 0; 36 | } 37 | } 38 | 39 | 40 | .form-group { 41 | margin-bottom: 1rem; 42 | } 43 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/forms/_inputs.scss: -------------------------------------------------------------------------------- 1 | .form-control{ 2 | &.is-invalid{ 3 | &:focus{ 4 | box-shadow: 0 0 0 2px rgba($form-feedback-invalid-color, .6); 5 | } 6 | } 7 | 8 | &.is-valid{ 9 | &:focus{ 10 | box-shadow: 0 0 0 2px rgba($form-feedback-valid-color, .65); 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/forms/_labels.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Labels 3 | // 4 | 5 | label, 6 | .form-label { 7 | font-size: $form-label-font-size; 8 | font-weight: $form-label-font-weight; 9 | margin-bottom: $form-label-margin-bottom; 10 | color: $form-label-color; 11 | margin-left: $form-label-margin-left; 12 | } 13 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/mixins/_hover.scss: -------------------------------------------------------------------------------- 1 | 2 | @mixin hover() { 3 | &:hover { @content; } 4 | } 5 | 6 | @mixin hover-focus() { 7 | &:hover, 8 | &:focus { 9 | @content; 10 | } 11 | } 12 | 13 | @mixin plain-hover-focus() { 14 | &, 15 | &:hover, 16 | &:focus { 17 | @content; 18 | } 19 | } 20 | 21 | @mixin hover-focus-active() { 22 | &:hover, 23 | &:focus, 24 | &:active { 25 | @content; 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/mixins/mixins.scss: -------------------------------------------------------------------------------- 1 | @import "hover"; 2 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/theme.scss: -------------------------------------------------------------------------------- 1 | /*! 2 | 3 | ========================================================= 4 | * Soft UI Design System - v1.0.1 5 | ========================================================= 6 | 7 | * Product Page: https://www.creative-tim.com/product/soft-ui-design-system 8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com) 9 | * Licensed under MIT (site.license) 10 | 11 | * Coded by www.creative-tim.com 12 | 13 | ========================================================= 14 | 15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 16 | 17 | */ 18 | 19 | // {{ site.product.name }} components 20 | 21 | // Mixin 22 | @import "mixins/mixins"; 23 | 24 | // Core Components - extra styling 25 | @import "alert"; 26 | @import "avatars/avatar"; 27 | @import "buttons"; 28 | @import "cards"; 29 | @import "dropdown"; 30 | @import "forms/forms"; 31 | @import "footer"; 32 | @import "gradients"; 33 | @import "header"; 34 | @import "info-areas"; 35 | @import "misc"; 36 | @import "navbar"; 37 | @import "nav"; 38 | @import "pagination"; 39 | @import "popovers"; 40 | @import "progress"; 41 | @import "typography"; 42 | @import "tooltips"; 43 | @import "utilities"; 44 | 45 | // Plugins 46 | @import "vendor/plugins"; 47 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/variables/_animations.scss: -------------------------------------------------------------------------------- 1 | // Waves Animation & Styling 2 | 3 | $waves-position: relative !default; 4 | $waves-width: 100% !default; 5 | $waves-height: 16vh !default; 6 | $waves-min-height: 100px !default; 7 | $waves-max-height: 150px !default; 8 | $waves-margin-bottom: -7px !default; 9 | $waves-height-sm: 50px !default; 10 | $waves-min-height-sm: $waves-height-sm !default; 11 | $waves-rotate: rotate(180deg) !default; 12 | $waves-mobile-height: 40px !default; 13 | 14 | $moving-waves-keyframe-0: translate3d(-90px,0,0) !default; 15 | $moving-waves-keyframe-100: translate3d(85px,0,0) !default; 16 | $moving-waves-animation: move-forever 40s cubic-bezier(.55,.5,.45,.5) infinite !default; 17 | $moving-waves-child-1-delay: -2s !default; 18 | $moving-waves-child-1-duration: 11s !default; 19 | $moving-waves-child-2-delay: -4s !default; 20 | $moving-waves-child-2-duration: 13s !default; 21 | $moving-waves-child-3-delay: -3s !default; 22 | $moving-waves-child-3-duration: 15s !default; 23 | $moving-waves-child-4-delay: -4s !default; 24 | $moving-waves-child-4-duration: 20s !default; 25 | $moving-waves-child-5-delay: -4s !default; 26 | $moving-waves-child-5-duration: 25s !default; 27 | $moving-waves-child-6-delay: -3s !default; 28 | $moving-waves-child-6-duration: 30s !default; 29 | 30 | // Fade In 31 | 32 | $fade-in-animation-name: fadeInBottom !default; 33 | $fade-in-animation-top-name: fadeInTop !default; 34 | $fade-in-bottom-transform: translateY(100%) !default; 35 | $fade-in-top-transform: translateY(-100%) !default; 36 | 37 | 38 | $fade-in-1-animation-duration: 1.5s !default; 39 | $fade-in-2-animation-duration: 1.75s !default; 40 | $fade-in-3-animation-duration: 2s !default; 41 | $fade-in-4-animation-duration: 2.25s !default; 42 | $fade-in-5-animation-duration: 2.5s !default; 43 | 44 | 45 | $floating-man-width: 350px !default; 46 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/variables/_avatars.scss: -------------------------------------------------------------------------------- 1 | // Avatar 2 | $avatar-height: 48px !default; 3 | $avatar-width: 48px !default; 4 | 5 | $avatar-xs-height: 24px !default; 6 | $avatar-xs-width: 24px !default; 7 | 8 | $avatar-sm-height: 36px !default; 9 | $avatar-sm-width: 36px !default; 10 | 11 | $avatar-lg-height: 58px !default; 12 | $avatar-lg-width: 58px !default; 13 | 14 | $avatar-xl-height: 74px !default; 15 | $avatar-xl-width: 74px !default; 16 | 17 | $avatar-xxl-height: 110px !default; 18 | $avatar-xxl-width: 110px !default; 19 | 20 | $avatar-font-size: 1rem !default; 21 | $avatar-content-margin: .75rem !default; 22 | 23 | 24 | // Avatar Group 25 | $avatar-group-border: 2px !default; 26 | $avatar-group-zindex: 2 !default; 27 | $avatar-group-zindex-hover: 3 !default; 28 | $avatar-group-double: -1rem !default; 29 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/variables/_cards.scss: -------------------------------------------------------------------------------- 1 | $card-box-shadow: 0 20px 27px 0 rgba(0,0,0,0.05) !default; 2 | $card-background-blur: rgba(255, 255, 255, 0.8) !default; 3 | 4 | $card-header-padding: 1.5rem !default; 5 | 6 | $card-body-padding: $card-header-padding !default; 7 | $card-plain-bg-color: transparent !default; 8 | $card-plain-box-shadow: none !default; 9 | 10 | $card-footer-padding: $card-body-padding !default; 11 | 12 | $card-title-font-weight: $font-weight-bold !default; 13 | $card-title-line-height: 1.2 !default; 14 | 15 | $card-author-display: flex !default; 16 | $card-author-name-line-height: 1.571 !default; 17 | $card-author-name-color: #3A416F !default; 18 | $card-author-stats-color: #5D6494 !default; 19 | $card-avatar-width: 30px !default; 20 | $card-avatar-height: $card-avatar-width !default; 21 | $card-avatar-overflow: hidden !default; 22 | $card-avatar-radius: 50% !default; 23 | $card-avatar-mr: 5px !default; 24 | $card-stats-name-mt: -4px !default; 25 | $card-name-ml: .25rem !default; 26 | 27 | $card-badge-text-transform: uppercase !default; 28 | $card-badge-bg-color: #FAFAFF !default; 29 | 30 | 31 | // Card Background 32 | $card-bg-align-items: center !default; 33 | $card-bg-body-position: relative !default; 34 | $card-bg-body-z-index: 2 !default; 35 | $card-bg-content-min-height: 330px !default; 36 | $card-bg-content-max-width: 450px !default; 37 | $card-bg-content-pt: 60px !default; 38 | $card-bg-content-pb: $card-bg-content-pt !default; 39 | $card-bg-body-left-width: 90% !default; 40 | 41 | $card-bg-description-margin: 24px !default; 42 | 43 | $card-bg-filter-position: absolute !default; 44 | $card-bg-filter-top: 0 !default; 45 | $card-bg-filter-bottom: $card-bg-filter-top !default; 46 | $card-bg-filter-left: $card-bg-filter-top !default; 47 | $card-bg-filter-height: 100% !default; 48 | $card-bg-filter-width: $card-bg-filter-height !default; 49 | $card-bg-filter-z-index: 1 !default; 50 | $card-bg-filter-display: block !default; 51 | $card-bg-filter-content: "" !default; 52 | $card-bg-filter-bg: rgba(0,0,0,.4) !default; 53 | $card-bg-filter-mask-bg: rgba(0,0,0,.2) !default; 54 | $card-bg-filter-radius: 1rem !default; 55 | 56 | $card-full-bg-bg-position: 50% !default; 57 | $card-full-bg-bg-size: cover !default; 58 | $card-full-bg-mb: 30px !default; 59 | $card-full-bg-width: 100% !default; 60 | $card-full-bg-height: $card-full-bg-width !default; 61 | $card-full-bg-position: absolute !default; 62 | $card-full-bg-radius: $card-bg-filter-radius !default; 63 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/variables/_choices.scss: -------------------------------------------------------------------------------- 1 | $choices-box-shadow: $dropdown-box-shadow !default; 2 | $choices-border-radius: .5rem !default; 3 | $choices-animation: .3s cubic-bezier(.23,1,.32,1) !default; 4 | $choices-transition: $dropdown-transition !default; 5 | $choices-transform: perspective(999px) rotateX(-10deg) translateZ(0) translate3d(0px, 37px, 0px) !important !default; 6 | $choices-transform-show: perspective(999px) rotateX(0deg) translateZ(0) translate3d(0,37px,5px) !important !default; 7 | $choices-padding-y: 1rem !default; 8 | $choices-padding-x: .5rem !default; 9 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/variables/_dropdowns.scss: -------------------------------------------------------------------------------- 1 | $dropdown-subitem-position: 101% !default; 2 | $dropdown-transition: visibility .25s,opacity .25s,transform .25s !default; 3 | $dropdown-transform-origin: 50% 0 !default; 4 | $dropdown-transform: perspective(999px) rotateX(-10deg) translateZ(0) translate3d(0px, 37px, 0px) !important !default; 5 | $dropdown-transform-show: perspective(999px) rotateX(0deg) translateZ(0) translate3d(0, 37px,5px) !important !default; 6 | 7 | $dropdown-multilevel-transform: perspective(999px) rotateX(-10deg) translateZ(0) translate3d(0px, 0px, 0px) !important !default; 8 | $dropdown-multilevel-transform-show: perspective(999px) rotateX(0deg) translateZ(0) translate3d(0, 0px,5px) !important !default; 9 | 10 | $dropup-transform-origin: bottom !default; 11 | $dropup-transform: perspective(999px) rotateX(12deg) translateZ(0) translate3d(0px, 0px, 0px) !important !default; 12 | $dropup-transform-show: perspective(999px) rotateX(0deg) translateZ(0) translate3d(1px,0px,5px) !important !default; 13 | 14 | $dropdown-icon-margin-right: .75rem !default; 15 | 16 | $dropdown-toggle-arrow-transform: rotate(180deg) !default; 17 | $dropdown-toggle-arrow-transition: .3s ease !default; 18 | 19 | $dropdown-button-after-margin-top: 3px !default; 20 | 21 | $dropdown-animation-arrow-left-position: 28px !default; 22 | $dropup-animation-arrow-bottom-position: 22px !default; 23 | $dropdown-animation-arrow-font-size: 22px !default; 24 | $dropup-animation-arrow-transition: bottom .35s ease !default; 25 | $dropdown-animation-arrow-transition: top .35s ease !default; 26 | $dropup-mb: .5rem !default; 27 | 28 | $dropdown-mt: 8px !default; 29 | $dropdown-hover-after-bottom-pos: -24px !default; 30 | $dropdown-hover-after-bottom-pos: -24px !default; 31 | $dropdown-hover-arrow-active-top: -20px !default; 32 | 33 | $dropdown-subitem-position-right: -197px !default; 34 | $dropdown-subitem-left-hover: -8px !default; 35 | $dropdown-subitem-arrow-rotate: rotate(-90deg) !default; 36 | 37 | $dropdown-md-min-width: 15rem !default; 38 | $dropdown-lg-min-width: 23rem !default; 39 | $dropdown-lg-width-responsive: 19rem !default; 40 | $dropdown-xl-min-width: 40rem !default; 41 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/variables/_form-switch.scss: -------------------------------------------------------------------------------- 1 | $slider-dim: 15px !default; 2 | $slider-position: 2px !default; 3 | $moving-circle: translateX(21px) !default; 4 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/variables/_header.scss: -------------------------------------------------------------------------------- 1 | $page-header-padding: 0 !default; 2 | $page-header-position: relative !default; 3 | $page-header-overflow: hidden !default; 4 | $page-header-display: flex !default; 5 | $page-header-align-items: center !default; 6 | $page-header-bg-size: cover !default; 7 | $page-header-bg-position: 50% !default; 8 | 9 | $mask-position: absolute !default; 10 | $mask-bg-size: cover !default; 11 | $mask-bg-position: center center !default; 12 | $mask-top: 0 !default; 13 | $mask-left: $mask-top !default; 14 | $mask-width: 100% !default; 15 | $mask-height: $mask-width !default; 16 | $mask-opacity: .8 !default; 17 | 18 | $page-header-conteiner-index: 1 !default; 19 | 20 | $header-oblique-img-width: 60% !default; 21 | $header-oblique-img-right: -10rem !default; 22 | $header-oblique-transform: skewX(-10deg) !default; 23 | $header-oblique-overflow: hidden !default; 24 | $header-oblique-img-transform: skewX(10deg) !default; 25 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/variables/_info-areas.scss: -------------------------------------------------------------------------------- 1 | $icon-shape-bg-image: linear-gradient(310deg,#7928CA,#FF0080) !default; 2 | $icon-shape-bg-position: center !default; 3 | 4 | $icon-striped-bg-md: 85px !default; 5 | $icon-striped-bg-lg: 111px !default; 6 | $icon-striped-bg-xl: 80px !default; 7 | 8 | $icon-striped-icon-mt: 25% !default; 9 | $icon-striped-icon-ml: -24% !default; 10 | 11 | $icon-shape-icon-opacity: .8 !default; 12 | $info-icon-top: 11px !default; 13 | $info-icon-top-xs: -4px !default; 14 | $info-icon-top-sm: 2px !default; 15 | $info-icon-top-md: 22% !default; 16 | $info-icon-top-lg: 31% !default; 17 | $info-icon-top-xl: 37% !default; 18 | $info-icon-position: relative !default; 19 | 20 | $icon-xs-width: 24px !default; 21 | $icon-xs-height: $icon-xs-width !default; 22 | $icon-sm-width: 32px !default; 23 | $icon-sm-height: $icon-sm-width !default; 24 | $icon-md-width: 48px !default; 25 | $icon-md-height: $icon-md-width !default; 26 | $icon-lg-width: 64px !default; 27 | $icon-lg-height: $icon-lg-width !default; 28 | $icon-xl-width: 100px !default; 29 | $icon-xl-height: $icon-xl-width !default; 30 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/variables/_misc.scss: -------------------------------------------------------------------------------- 1 | // Horizontal Faded Line 2 | $hr-bg: transparent !default; 3 | $hr-transform: rotate(90deg) !default; 4 | $hr-bg-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)) !default; 5 | $hr-bg-dark-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, .4), rgba(0, 0, 0, 0)) !default; 6 | 7 | 8 | // Gradient Animation 9 | $gradient-animation-background: linear-gradient(-45deg, $info-gradient, $danger, $warning, $primary-gradient, $dark) !default; 10 | $gradient-animation-bg-size: 400% 400% !default; 11 | 12 | // Device Wrapper 13 | $device-wrapper-radius: 3.5rem !default; 14 | $device-wrapper-box-shadow: 0 12px 15px rgba(140, 152, 164, 0.1) !default; 15 | $device-wrapper-animation: gradient 10s ease infinite !default; 16 | 17 | 18 | // Nav pills 19 | $nav-pills-link-border-radius: 0.5rem !default; 20 | $nav-pills-link-box-shadow: 0px 1px 5px 1px #ddd !default; 21 | $nav-pills-link-active-padding: 7px 15px !default; 22 | $nav-pills-link-active-margin: 1px !default; 23 | $nav-pills-link-active-animation: .2s ease !default; 24 | 25 | // Table Progress 26 | 27 | $table-progress-width: 120px !default; 28 | $table-progress-height: 3px !default; 29 | $table-progress-margin: 0 !default; 30 | 31 | // Tooltip Arrow 32 | 33 | $tooltip-arrow-left: 1px !default; 34 | $tooltip-arrow-right: $tooltip-arrow-left !default; 35 | 36 | // Footer Link hover animation 37 | 38 | $footer-link-animation: opacity .3 ease !default; 39 | 40 | // Blur background 41 | 42 | $blur-light-background: rgba(255, 255, 255, 0.4) !default; 43 | $blur-dark-background: rgba(0, 0, 0, 0.3) !default; 44 | 45 | // HR w/ opacity 46 | 47 | $hr-bg-color: transparent !default; 48 | $hr-width: 1px !default; 49 | $hr-margin: .75rem 0 !default; 50 | $hr-horizontal-bg-image-light: linear-gradient(to right, rgba(255, 255, 255, 0), white, rgba(255, 255, 255, 0)) !default; 51 | $hr-horizontal-bg-image-dark: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, .4), rgba(0, 0, 0, 0)) !default; 52 | $hr-vertical-bg-image-light: linear-gradient(to bottom, rgba(255, 255, 255, 0), white, rgba(255, 255, 255, 0)) !default; 53 | $hr-vertical-bg-image-dark: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, .4), rgba(0, 0, 0, 0)) !default; 54 | 55 | // Tilt Animation 56 | 57 | $tilt-transform-style: preserve-3d !default; 58 | $tilt-transform-up-transform: translateZ(50px) scale(0.7) !default; 59 | $tilt-transform-up-transition: all 0.5s !default; 60 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/variables/_navbar.scss: -------------------------------------------------------------------------------- 1 | // Navbar toggler icon on responsive styling 2 | 3 | $navbar-toggler-bar-display: block !default; 4 | $navbar-toggler-bar-position: relative !default; 5 | $navbar-toggler-bar-width: 22px !default; 6 | $navbar-toggler-bar-height: 1px !default; 7 | $navbar-toggler-bar-radius: 1px !default; 8 | $navbar-toggler-bar-transition: all 0.2s !default; 9 | $navbar-toggler-bar-margin-top: 7px !default; 10 | 11 | $navbar-toggler-bar-1-transform: rotate(45deg) !default; 12 | $navbar-toggler-bar-1-transform-origin: 10% 10% !default; 13 | $navbar-toggler-bar-1-margin-top: 4px !default; 14 | $navbar-toggler-bar-2-opacity: 0 !default; 15 | $navbar-toggler-bar-3-transform: rotate(-45deg) !default; 16 | $navbar-toggler-bar-3-transform-origin: 10% 90% !default; 17 | $navbar-toggler-bar-3-margin-top: 3px !default; 18 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/variables/_pagination.scss: -------------------------------------------------------------------------------- 1 | // Pagination 2 | 3 | $pagination-active-box-shadow: $btn-hover-box-shadow !default; 4 | 5 | $page-link-display: flex !default; 6 | $page-link-align-items: center !default; 7 | $page-link-justify-content: $page-link-align-items !default; 8 | $page-link-margin: 0 3px !default; 9 | $page-link-radius: 50% !default; 10 | $page-link-width: 36px !default; 11 | $page-link-height: $page-link-width !default; 12 | 13 | $page-link-width-lg: 46px !default; 14 | $page-link-height-lg: $page-link-width-lg !default; 15 | $page-link-line-height-lg: $page-link-width-lg !default; 16 | 17 | $page-link-width-sm: 30px !default; 18 | $page-link-height-sm: $page-link-width-sm !default; 19 | $page-link-line-height-sm: $page-link-width-sm !default; 20 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/vendor/_prism.scss: -------------------------------------------------------------------------------- 1 | /* PrismJS 1.23.0 2 | https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */ 3 | /** 4 | * prism.js default theme for JavaScript, CSS and HTML 5 | * Based on dabblet (http://dabblet.com) 6 | * @author Lea Verou 7 | */ 8 | 9 | code[class*="language-"], 10 | pre[class*="language-"] { 11 | color: black; 12 | background: none; 13 | text-shadow: 0 1px white; 14 | font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; 15 | font-size: 1em; 16 | text-align: left; 17 | white-space: pre; 18 | word-spacing: normal; 19 | word-break: normal; 20 | word-wrap: normal; 21 | line-height: 1.5; 22 | 23 | -moz-tab-size: 4; 24 | -o-tab-size: 4; 25 | tab-size: 4; 26 | 27 | -webkit-hyphens: none; 28 | -moz-hyphens: none; 29 | -ms-hyphens: none; 30 | hyphens: none; 31 | } 32 | 33 | pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection, 34 | code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection { 35 | text-shadow: none; 36 | background: #b3d4fc; 37 | } 38 | 39 | pre[class*="language-"]::selection, pre[class*="language-"] ::selection, 40 | code[class*="language-"]::selection, code[class*="language-"] ::selection { 41 | text-shadow: none; 42 | background: #b3d4fc; 43 | } 44 | 45 | @media print { 46 | code[class*="language-"], 47 | pre[class*="language-"] { 48 | text-shadow: none; 49 | } 50 | } 51 | 52 | /* Code blocks */ 53 | pre[class*="language-"] { 54 | padding: 1em; 55 | overflow: auto; 56 | border-radius: .75rem; 57 | } 58 | 59 | :not(pre) > code[class*="language-"], 60 | pre[class*="language-"] { 61 | background: $gray-100; 62 | } 63 | 64 | /* Inline code */ 65 | :not(pre) > code[class*="language-"] { 66 | padding: .1em; 67 | border-radius: .3em; 68 | white-space: normal; 69 | } 70 | 71 | .token.comment, 72 | .token.prolog, 73 | .token.doctype, 74 | .token.cdata { 75 | color: slategray; 76 | } 77 | 78 | .token.punctuation { 79 | color: #999; 80 | } 81 | 82 | .token.namespace { 83 | opacity: .7; 84 | } 85 | 86 | .token.property, 87 | .token.tag, 88 | .token.boolean, 89 | .token.number, 90 | .token.constant, 91 | .token.symbol, 92 | .token.deleted { 93 | color: #905; 94 | } 95 | 96 | .token.selector, 97 | .token.attr-name, 98 | .token.string, 99 | .token.char, 100 | .token.builtin, 101 | .token.inserted { 102 | color: #690; 103 | } 104 | 105 | .token.operator, 106 | .token.entity, 107 | .token.url, 108 | .language-css .token.string, 109 | .style .token.string { 110 | color: #9a6e3a; 111 | /* This background color was intended by the author of this theme. */ 112 | background: hsla(0, 0%, 100%, .5); 113 | } 114 | 115 | .token.atrule, 116 | .token.attr-value, 117 | .token.keyword { 118 | color: #07a; 119 | } 120 | 121 | .token.function, 122 | .token.class-name { 123 | color: #DD4A68; 124 | } 125 | 126 | .token.regex, 127 | .token.important, 128 | .token.variable { 129 | color: #e90; 130 | } 131 | 132 | .token.important, 133 | .token.bold { 134 | font-weight: bold; 135 | } 136 | .token.italic { 137 | font-style: italic; 138 | } 139 | 140 | .token.entity { 141 | cursor: help; 142 | } 143 | -------------------------------------------------------------------------------- /products/static/assets/scss/soft-design-system/vendor/plugins.scss: -------------------------------------------------------------------------------- 1 | @import "choices"; 2 | @import "flatpickr"; 3 | @import "nouislider.scss"; 4 | @import "prism.scss"; 5 | -------------------------------------------------------------------------------- /products/templates/ecommerce/modal-warning.html: -------------------------------------------------------------------------------- 1 | 4 | 5 | 6 | 7 | 8 | Warning 9 | 10 | 11 | 12 | Stripe Secrets not provided in environment 13 | 14 | Update your configuration or get support. 15 | 16 | 17 | 20 | 21 | 22 | 23 | 24 | 25 | -------------------------------------------------------------------------------- /products/templates/ecommerce/payment-cancelled.html: -------------------------------------------------------------------------------- 1 | {% extends 'layouts/base.html' %} 2 | {% load static %} 3 | 4 | {% block title %} Payment Error {% endblock title %} 5 | 6 | 7 | {% block stylesheets %}{% endblock stylesheets %} 8 | 9 | {% block body_class %} contact-us {% endblock body_class %} 10 | 11 | {% block content %} 12 | 13 | {% include "includes/navigation-light.html" %} 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | Payment Canceled. 27 | 28 | 29 | Please contact support. 30 | 31 | 32 | 33 | 34 | 35 | HOME 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | {% endblock content %} 48 | 49 | 50 | {% block javascripts %} 51 | 52 | 53 | 54 | {% endblock javascripts %} 55 | -------------------------------------------------------------------------------- /products/templates/ecommerce/payment-success.html: -------------------------------------------------------------------------------- 1 | {% extends 'layouts/base.html' %} 2 | {% load static %} 3 | 4 | {% block title %} Payment OK {% endblock title %} 5 | 6 | 7 | {% block stylesheets %}{% endblock stylesheets %} 8 | 9 | {% block body_class %} contact-us {% endblock body_class %} 10 | 11 | {% block content %} 12 | 13 | {% include "includes/navigation-light.html" %} 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | Thank You! The payment was successful. 27 | 28 | 29 | Soon we will deliver the product. 30 | 31 | 32 | 33 | 34 | 35 | HOME 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | {% endblock content %} 48 | 49 | 50 | {% block javascripts %} 51 | 52 | 53 | 54 | {% endblock javascripts %} 55 | -------------------------------------------------------------------------------- /products/templates/includes/scripts.html: -------------------------------------------------------------------------------- 1 | {% load static %} 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /products/templates/layouts/base-fullscreen.html: -------------------------------------------------------------------------------- 1 | 14 | 15 | {% load static %} 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | Django Stripe Starter - {% block title %}{% endblock %} | AppSeed 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | {% block stylesheets %}{% endblock stylesheets %} 42 | 43 | 44 | 45 | 46 | {% block content %}{% endblock content %} 47 | 48 | {% include "includes/scripts.html" %} 49 | 50 | 51 | {% block javascripts %}{% endblock javascripts %} 52 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /products/templates/layouts/base-presentation.html: -------------------------------------------------------------------------------- 1 | 14 | 15 | {% load static %} 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | Django Stripe Starter - {% block title %}{% endblock %} | AppSeed 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | {% block stylesheets %}{% endblock stylesheets %} 42 | 43 | 44 | 45 | 46 | 47 | {% include "includes/navigation.html" %} 48 | 49 | {% block content %}{% endblock content %} 50 | 51 | {% include "includes/footer.html" %} 52 | 53 | {% include "includes/scripts.html" %} 54 | 55 | 56 | {% block javascripts %}{% endblock javascripts %} 57 | 58 | 59 | 60 | -------------------------------------------------------------------------------- /products/templates/layouts/base.html: -------------------------------------------------------------------------------- 1 | 14 | 15 | {% load static %} 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | Django Stripe Starter - {% block title %}{% endblock %} | AppSeed 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | {% block stylesheets %}{% endblock stylesheets %} 42 | 43 | 44 | 45 | 46 | {% block content %}{% endblock content %} 47 | 48 | {% include "includes/footer.html" %} 49 | 50 | {% include "includes/scripts.html" %} 51 | 52 | 53 | {% block javascripts %}{% endblock javascripts %} 54 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /products/templates/pages/page-403.html: -------------------------------------------------------------------------------- 1 | {% extends 'layouts/base.html' %} 2 | {% load static %} 3 | 4 | {% block title %} Error 403 {% endblock title %} 5 | 6 | 7 | {% block stylesheets %}{% endblock stylesheets %} 8 | 9 | {% block body_class %} contact-us {% endblock body_class %} 10 | 11 | {% block content %} 12 | 13 | {% include "includes/navigation-light.html" %} 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | Error 403 27 | 28 | 29 | Access denied. Please contact support or authenticate. 30 | 31 | 32 | 33 | 34 | 35 | HOME 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | {% endblock content %} 48 | 49 | 50 | {% block javascripts %} 51 | 52 | 53 | 54 | {% endblock javascripts %} 55 | -------------------------------------------------------------------------------- /products/templates/pages/page-404.html: -------------------------------------------------------------------------------- 1 | {% extends 'layouts/base.html' %} 2 | {% load static %} 3 | 4 | {% block title %} Error 404 {% endblock title %} 5 | 6 | 7 | {% block stylesheets %}{% endblock stylesheets %} 8 | 9 | {% block body_class %} contact-us {% endblock body_class %} 10 | 11 | {% block content %} 12 | 13 | {% include "includes/navigation-light.html" %} 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | Error 404 27 | 28 | 29 | The page you're looking for doesn't exist. 30 | 31 | 32 | 33 | 34 | 35 | HOME 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | {% endblock content %} 48 | 49 | 50 | {% block javascripts %} 51 | 52 | 53 | 54 | {% endblock javascripts %} 55 | -------------------------------------------------------------------------------- /products/templates/pages/page-500.html: -------------------------------------------------------------------------------- 1 | {% extends 'layouts/base.html' %} 2 | {% load static %} 3 | 4 | {% block title %} Error 500 {% endblock title %} 5 | 6 | 7 | {% block stylesheets %}{% endblock stylesheets %} 8 | 9 | {% block body_class %} contact-us {% endblock body_class %} 10 | 11 | {% block content %} 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | Error 500 25 | 26 | 27 | Server Error. If the problem persists, please contact support. 28 | 29 | 30 | 31 | 32 | 33 | HOME 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | {% endblock content %} 46 | 47 | 48 | {% block javascripts %} 49 | 50 | 51 | 52 | {% endblock javascripts %} 53 | -------------------------------------------------------------------------------- /products/templates/pages/page-contact-us.html: -------------------------------------------------------------------------------- 1 | {% extends 'layouts/base.html' %} 2 | {% load static %} 3 | 4 | {% block title %} Contact US {% endblock title %} 5 | 6 | 7 | {% block stylesheets %}{% endblock stylesheets %} 8 | 9 | {% block body_class %} contact-us {% endblock body_class %} 10 | 11 | {% block content %} 12 | 13 | {% include "includes/navigation-light.html" %} 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | Contact us 26 | 27 | For further questions, including partnership opportunities, please email hello@creative-tim.com 28 | or contact using our contact form. 29 | 30 | 31 | 32 | 33 | 34 | 35 | Full Name 36 | 37 | 38 | 39 | 40 | 41 | Email 42 | 43 | 44 | 45 | 46 | 47 | 48 | How can we help you? 49 | 50 | 51 | 52 | 53 | Send Message 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | {% endblock content %} 66 | 67 | 68 | {% block javascripts %} 69 | 70 | 71 | 72 | {% endblock javascripts %} 73 | -------------------------------------------------------------------------------- /products/templates/products/featured.json: -------------------------------------------------------------------------------- 1 | { 2 | "id": "prod_Mdq6AVJsC9YBCN", 3 | "name": "Shoes", 4 | "currency": "usd", 5 | "price": "300.0", 6 | "full_description": "shoes", 7 | "info": "shoes", 8 | "img_main": "https://files.stripe.com/links/MDB8YWNjdF8xTDdpY25LenQ5V284UGFMfGZsX3Rlc3RfVGlObm1JQVFSSVM0cm1VWVZiS2JVdXFR00syxYnKKC", 9 | "img_card": "", 10 | "img_1": "", 11 | "img_2": "", 12 | "img_3": "" 13 | } -------------------------------------------------------------------------------- /products/templatetags/__init__.py: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/products/templatetags/__init__.py -------------------------------------------------------------------------------- /products/templatetags/string_to_json.py: -------------------------------------------------------------------------------- 1 | import json 2 | from django import template 3 | 4 | register = template.Library() 5 | 6 | @register.filter 7 | def product_name(obj): 8 | return json.loads(obj)['name'] 9 | 10 | @register.filter 11 | def product_price(obj): 12 | return json.loads(obj)['price'] 13 | 14 | @register.filter 15 | def product_description(obj): 16 | return json.loads(obj)['full_description'] 17 | 18 | @register.filter 19 | def product_info(obj): 20 | return json.loads(obj)['info'] 21 | 22 | @register.filter 23 | def product_main_image(obj): 24 | return json.loads(obj)['img_main'] 25 | 26 | @register.filter 27 | def product_card_image(obj): 28 | return json.loads(obj)['img_card'] 29 | 30 | @register.filter 31 | def product_image1(obj): 32 | return json.loads(obj)['img_1'] 33 | 34 | @register.filter 35 | def product_image2(obj): 36 | return json.loads(obj)['img_2'] 37 | 38 | @register.filter 39 | def product_image3(obj): 40 | return json.loads(obj)['img_3'] 41 | 42 | 43 | @register.filter 44 | def product_slug(obj): 45 | name = json.loads(obj)['name'] 46 | slug = name.lower().replace(' ', '-') 47 | return slug -------------------------------------------------------------------------------- /products/tests.py: -------------------------------------------------------------------------------- 1 | # -*- encoding: utf-8 -*- 2 | """ 3 | Copyright (c) 2019 - present AppSeed.us 4 | """ 5 | 6 | from django.test import TestCase 7 | 8 | # Create your tests here. 9 | -------------------------------------------------------------------------------- /products/urls.py: -------------------------------------------------------------------------------- 1 | # -*- encoding: utf-8 -*- 2 | """ 3 | Copyright (c) 2019 - present AppSeed.us 4 | """ 5 | 6 | from django.urls import path 7 | from products import views 8 | from django.conf import settings 9 | from django.conf.urls.static import static 10 | 11 | urlpatterns = [ 12 | path('', views.index, name="products_index"), 13 | path('product//', views.product_details, name='product_details'), 14 | path('load-product/', views.load_product_json, name='load_product'), 15 | path('create-product/', views.create_new_product, name='create_product'), 16 | path('update-product//', views.update_product, name='update_product'), 17 | path('delete-product//', views.delete_product, name='delete_product'), 18 | path('create-checkout-session//', views.create_checkout_session, name="create-checkout-session"), 19 | path('success/', views.success, name="success"), 20 | path('cancelled/', views.cancelled, name="cancelled"), 21 | path('config/', views.get_publishable_key, name="config"), 22 | 23 | # pages 24 | path('presentation/', views.presentation, name="presentation"), 25 | path('about-us/', views.about_us, name="about_us"), 26 | path('contact-us/', views.contact_us, name="contact_us"), 27 | path('author/', views.author, name="author"), 28 | path('signin/', views.signin, name="signin"), 29 | path('signup/', views.signup, name="signup"), 30 | path('page404/', views.page404, name="page404"), 31 | 32 | # blocks 33 | path('page-header/', views.page_header, name="page_header"), 34 | path('features/', views.features, name="features"), 35 | path('navbars/', views.navbars, name="navbars"), 36 | path('navtabs/', views.navtabs, name="navtabs"), 37 | path('paginations/', views.paginations, name="paginations"), 38 | path('input-areas/', views.input_areas, name="input_areas"), 39 | path('input-forms/', views.input_forms, name="input_forms"), 40 | path('alerts/', views.alerts, name="alerts"), 41 | path('modals/', views.modals, name="modals"), 42 | path('tooltips/', views.tooltips, name="tooltips"), 43 | path('buttons/', views.buttons, name="buttons"), 44 | path('avatars/', views.avatars, name="avatars"), 45 | path('dropdowns/', views.dropdowns, name="dropdowns"), 46 | path('toggles/', views.toggles, name="toggles"), 47 | path('breadcrumbs/', views.breadcrumbs, name="breadcrumbs"), 48 | path('badges/', views.badges, name="badges"), 49 | path('typography/', views.typography, name="typography"), 50 | path('progressbar/', views.progressbar, name="progressbar"), 51 | 52 | ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) 53 | -------------------------------------------------------------------------------- /products/utils.py: -------------------------------------------------------------------------------- 1 | # -*- encoding: utf-8 -*- 2 | """ 3 | Copyright (c) 2019 - present AppSeed.us 4 | """ 5 | 6 | import os, fnmatch, json 7 | from core.settings import BASE_DIR 8 | 9 | class Product: 10 | id = '' 11 | name = '' 12 | price = 0 13 | currency = '' 14 | info = '' 15 | full_description = '' 16 | slug = '' 17 | img_main = '' 18 | img_card = '' 19 | img_1 = '' 20 | img_2 = '' 21 | img_3 = '' 22 | 23 | def get_templates_dir(): 24 | return os.path.join(BASE_DIR, 'products/templates' ) 25 | 26 | def get_products_dir(): 27 | return os.path.join(BASE_DIR, 'products/templates', 'products' ) 28 | 29 | def get_product_path( aSlug ): 30 | return os.path.join(BASE_DIR, 'products/templates', 'products', aSlug ) 31 | 32 | def get_files( aPath, ext='html' ): 33 | matches = [] 34 | for root, dirnames, filenames in os.walk( aPath ): 35 | for filename in fnmatch.filter(filenames, '*.'+ ext): 36 | item = os.path.join(root, filename) 37 | matches.append( item ) 38 | return matches 39 | 40 | def get_product( ): 41 | return get_files( get_products_dir(), 'json' ) 42 | 43 | def get_slug( aPath, aExt='json' ): 44 | if aPath: 45 | head, tail = os.path.split( aPath ) # get file name 46 | return tail.replace('.' + aExt, '') # remove extension 47 | return None 48 | 49 | def load_json_product( aJSONPath ): 50 | f = open(aJSONPath, 'r') 51 | if not f: 52 | return None 53 | 54 | # Read Product Info 55 | data = json.load( f ) 56 | 57 | return data 58 | 59 | def load_product( aJSONPath ): 60 | f = open(aJSONPath, 'r') 61 | if not f: 62 | return None 63 | 64 | # Read Product Info 65 | data = json.load( f ) 66 | 67 | if not data: 68 | return None 69 | 70 | product = Product() 71 | 72 | product.name = data["name"] 73 | product.info = data["info"] 74 | product.currency = data["currency"] 75 | product.price = int( float(data["price"]) ) 76 | product.full_description = data["full_description"] 77 | product.slug = get_slug( aJSONPath ) 78 | try: 79 | product.img_main = data['img_main'] 80 | product.img_card = data['img_card'] 81 | product.img_1 = data['img_1'] 82 | product.img_2 = data['img_2'] 83 | product.img_3 = data['img_3'] 84 | product.id = data['id'] 85 | except: 86 | product.id = get_slug( aJSONPath ) 87 | 88 | return product 89 | 90 | def load_product_by_slug( aSlug ): 91 | aJSONPath = get_product_path( aSlug + '.json' ) 92 | return load_product( aJSONPath ) 93 | 94 | def load_product_by_id( id ): 95 | aJSONPath = get_product_path( id + '.json' ) 96 | return load_product( aJSONPath ) 97 | -------------------------------------------------------------------------------- /requirements.txt: -------------------------------------------------------------------------------- 1 | asgiref==3.5.2 2 | certifi==2022.9.24 3 | charset-normalizer==2.1.1 4 | Django==4.1.2 5 | gunicorn==20.1.0 6 | Pillow==9.2.0 7 | python-dotenv==0.21.0 8 | python-stripe==0.0.5 9 | requests==2.28.1 10 | sqlparse==0.4.3 11 | stripe==4.2.0 12 | urllib3==1.26.12 13 | idna 14 | -------------------------------------------------------------------------------- /static/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/app-generator/ecommerce-django-stripe/28a0ed0ee3885d5d9b57a7211e4e30d0c4605e69/static/.gitkeep --------------------------------------------------------------------------------
29 | Please contact support. 30 |
29 | Soon we will deliver the product. 30 |
29 | Access denied. Please contact support or authenticate. 30 |
29 | The page you're looking for doesn't exist. 30 |
27 | Server Error. If the problem persists, please contact support. 28 |
27 | For further questions, including partnership opportunities, please email hello@creative-tim.com 28 | or contact using our contact form. 29 |