10 |
11 |
12 | # Django Simple E-commerce
13 |
14 | This is a simple e-commerce website built with Django. It contains the essentials for adding products and capturing payments
15 | online.
16 |
17 | This project is part of a course on [JustDjango](https://learn.justdjango.com)
18 |
19 | ---
20 |
21 |
22 |
23 | Other places you can find us:
24 |
25 |
26 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/static/scss/bootstrap/_mixins.scss:
--------------------------------------------------------------------------------
1 | // Toggles
2 | //
3 | // Used in conjunction with global variables to enable certain theme features.
4 |
5 | // Utilities
6 | @import "mixins/breakpoints";
7 | @import "mixins/hover";
8 | @import "mixins/image";
9 | @import "mixins/badge";
10 | @import "mixins/resize";
11 | @import "mixins/screen-reader";
12 | @import "mixins/size";
13 | @import "mixins/reset-text";
14 | @import "mixins/text-emphasis";
15 | @import "mixins/text-hide";
16 | @import "mixins/text-truncate";
17 | @import "mixins/visibility";
18 |
19 | // // Components
20 | @import "mixins/alert";
21 | @import "mixins/buttons";
22 | @import "mixins/caret";
23 | @import "mixins/pagination";
24 | @import "mixins/lists";
25 | @import "mixins/list-group";
26 | @import "mixins/nav-divider";
27 | @import "mixins/forms";
28 | @import "mixins/table-row";
29 |
30 | // // Skins
31 | @import "mixins/background-variant";
32 | @import "mixins/border-radius";
33 | @import "mixins/box-shadow";
34 | @import "mixins/gradients";
35 | @import "mixins/transition";
36 |
37 | // // Layout
38 | @import "mixins/clearfix";
39 | @import "mixins/grid-framework";
40 | @import "mixins/grid";
41 | @import "mixins/float";
42 |
--------------------------------------------------------------------------------
/static/scss/bootstrap/_code.scss:
--------------------------------------------------------------------------------
1 | // Inline code
2 | code {
3 | font-size: $code-font-size;
4 | color: $code-color;
5 | word-break: break-word;
6 |
7 | // Streamline the style when inside anchors to avoid broken underline and more
8 | a > & {
9 | color: inherit;
10 | }
11 | }
12 |
13 | // User input typically entered via keyboard
14 | kbd {
15 | padding: $kbd-padding-y $kbd-padding-x;
16 | font-size: $kbd-font-size;
17 | color: $kbd-color;
18 | background-color: $kbd-bg;
19 | @include border-radius($border-radius-sm);
20 | @include box-shadow($kbd-box-shadow);
21 |
22 | kbd {
23 | padding: 0;
24 | font-size: 100%;
25 | font-weight: $nested-kbd-font-weight;
26 | @include box-shadow(none);
27 | }
28 | }
29 |
30 | // Blocks of code
31 | pre {
32 | display: block;
33 | font-size: $code-font-size;
34 | color: $pre-color;
35 |
36 | // Account for some code outputs that place code tags in pre tags
37 | code {
38 | font-size: inherit;
39 | color: inherit;
40 | word-break: normal;
41 | }
42 | }
43 |
44 | // Enable scrollable blocks of code
45 | .pre-scrollable {
46 | max-height: $pre-scrollable-max-height;
47 | overflow-y: scroll;
48 | }
49 |
--------------------------------------------------------------------------------
/static/scss/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 | font-size: $badge-font-size;
10 | font-weight: $badge-font-weight;
11 | line-height: 1;
12 | text-align: center;
13 | white-space: nowrap;
14 | vertical-align: baseline;
15 | @include border-radius($badge-border-radius);
16 |
17 | // Empty badges collapse automatically
18 | &:empty {
19 | display: none;
20 | }
21 | }
22 |
23 | // Quick fix for badges in buttons
24 | .btn .badge {
25 | position: relative;
26 | top: -1px;
27 | }
28 |
29 | // Pill badges
30 | //
31 | // Make them extra rounded with a modifier to replace v3's badges.
32 |
33 | .badge-pill {
34 | padding-right: $badge-pill-padding-x;
35 | padding-left: $badge-pill-padding-x;
36 | @include border-radius($badge-pill-border-radius);
37 | }
38 |
39 | // Colors
40 | //
41 | // Contextual variations (linked badges get darker on :hover).
42 |
43 | @each $color, $value in $theme-colors {
44 | .badge-#{$color} {
45 | @include badge-variant($value);
46 | }
47 | }
48 |
--------------------------------------------------------------------------------
/static/scss/bootstrap/_grid.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 | .container {
7 | @include make-container();
8 | @include make-container-max-widths();
9 | }
10 | }
11 |
12 | // Fluid container
13 | //
14 | // Utilizes the mixin meant for fixed width containers, but with 100% width for
15 | // fluid, full width layouts.
16 |
17 | @if $enable-grid-classes {
18 | .container-fluid {
19 | @include make-container();
20 | }
21 | }
22 |
23 | // Row
24 | //
25 | // Rows contain and clear the floats of your columns.
26 |
27 | @if $enable-grid-classes {
28 | .row {
29 | @include make-row();
30 | }
31 |
32 | // Remove the negative margin from default .row, then the horizontal padding
33 | // from all immediate children columns (to prevent runaway style inheritance).
34 | .no-gutters {
35 | margin-right: 0;
36 | margin-left: 0;
37 |
38 | > .col,
39 | > [class*="col-"] {
40 | padding-right: 0;
41 | padding-left: 0;
42 | }
43 | }
44 | }
45 |
46 | // Columns
47 | //
48 | // Common styles for small and large grid columns
49 |
50 | @if $enable-grid-classes {
51 | @include make-grid-columns();
52 | }
53 |
--------------------------------------------------------------------------------
/static/scss/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 | font-size: $figure-caption-font-size;
41 | color: $figure-caption-color;
42 | }
43 |
--------------------------------------------------------------------------------
/static/scss/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 |
18 |
19 | // Retina image
20 | //
21 | // Short retina mixin for setting background-image and -size.
22 |
23 | // stylelint-disable indentation, media-query-list-comma-newline-after
24 | @mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
25 | background-image: url($file-1x);
26 |
27 | // Autoprefixer takes care of adding -webkit-min-device-pixel-ratio and -o-min-device-pixel-ratio,
28 | // but doesn't convert dppx=>dpi.
29 | // There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
30 | // Compatibility info: https://caniuse.com/#feat=css-media-resolution
31 | @media only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
32 | only screen and (min-resolution: 2dppx) { // Standardized
33 | background-image: url($file-2x);
34 | background-size: $width-1x $height-1x;
35 | }
36 | }
37 |
--------------------------------------------------------------------------------
/static/scss/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: ($close-font-size + $alert-padding-x * 2);
31 |
32 | // Adjust close link position
33 | .close {
34 | position: absolute;
35 | top: 0;
36 | right: 0;
37 | padding: $alert-padding-y $alert-padding-x;
38 | color: inherit;
39 | }
40 | }
41 |
42 |
43 | // Alternate styles
44 | //
45 | // Generate contextual modifier classes for colorizing the alert.
46 |
47 | @each $color, $value in $theme-colors {
48 | .alert-#{$color} {
49 | @include alert-variant(theme-color-level($color, $alert-bg-level), theme-color-level($color, $alert-border-level), theme-color-level($color, $alert-color-level));
50 | }
51 | }
52 |
--------------------------------------------------------------------------------
/static/scss/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 | list-style: none;
7 | background-color: $breadcrumb-bg;
8 | @include border-radius($breadcrumb-border-radius);
9 | }
10 |
11 | .breadcrumb-item {
12 | // The separator between breadcrumbs (by default, a forward-slash: "/")
13 | + .breadcrumb-item {
14 | padding-left: $breadcrumb-item-padding;
15 |
16 | &::before {
17 | display: inline-block; // Suppress underlining of the separator in modern browsers
18 | padding-right: $breadcrumb-item-padding;
19 | color: $breadcrumb-divider-color;
20 | content: $breadcrumb-divider;
21 | }
22 | }
23 |
24 | // IE9-11 hack to properly handle hyperlink underlines for breadcrumbs built
25 | // without `
5 |
6 | 
26 | 
27 |
28 |