Skip to content

Commit

Permalink
1.0.0-alpha2
Browse files Browse the repository at this point in the history
  • Loading branch information
unknown committed Aug 27, 2021
1 parent bb18155 commit 940a5c5
Show file tree
Hide file tree
Showing 55 changed files with 2,619 additions and 3 deletions.
10 changes: 10 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,13 @@
## 1.0.0-alpha2 (25.01.2021)

### New components:

- [Popover](https://mdbootstrap.com/docs/b5/angular/components/popovers/)
- [Tooltip](https://mdbootstrap.com/docs/b5/angular/components/tooltips/)
- [Checkbox](https://mdbootstrap.com/docs/b5/angular/forms/checkbox/)
- [Input](https://mdbootstrap.com/docs/b5/angular/forms/input-fields/)
- [Radio](https://mdbootstrap.com/docs/b5/angular/forms/radio/)

## 1.0.0-alpha1 (11.01.2021)

The initial release of MDB 5 Angular Alpha 1.
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "mdb-angular-ui-kit-free",
"version": "1.0.0-alpha1",
"version": "1.0.0-alpha2",
"scripts": {
"ng": "ng",
"start": "ng serve",
Expand Down
10 changes: 10 additions & 0 deletions projects/mdb-angular-ui-kit/CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,13 @@
## 1.0.0-alpha2 (25.01.2021)

### New components:

- [Popover](https://mdbootstrap.com/docs/b5/angular/components/popovers/)
- [Tooltip](https://mdbootstrap.com/docs/b5/angular/components/tooltips/)
- [Checkbox](https://mdbootstrap.com/docs/b5/angular/forms/checkbox/)
- [Input](https://mdbootstrap.com/docs/b5/angular/forms/input-fields/)
- [Radio](https://mdbootstrap.com/docs/b5/angular/forms/radio/)

## 1.0.0-alpha1 (11.01.2021)

The initial release of MDB 5 Angular Alpha 1.
Expand Down
12 changes: 12 additions & 0 deletions projects/mdb-angular-ui-kit/assets/scss/free/_popover.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
// Popover

.popover {
border: 0;
box-shadow: $popover-box-shadow;
position: unset;
opacity: 0;
}

.popover-header {
background-color: $popover-background-color;
}
10 changes: 10 additions & 0 deletions projects/mdb-angular-ui-kit/assets/scss/free/_tooltip.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
// Tooltip

.tooltip-inner {
color: $tooltip-inner-color;
padding: $tooltip-inner-padding-y $tooltip-inner-padding-x;
font-size: $tooltip-inner-font-size;
background-color: $tooltip-inner-background-color;
border-radius: $tooltip-inner-border-radius;
opacity: 0;
}
287 changes: 287 additions & 0 deletions projects/mdb-angular-ui-kit/assets/scss/free/forms/_form-check.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,287 @@
//
// Material styles for check / radio / switch
//

.form-check {
.form-check-input {
margin-left: $form-check-input-margin-left * -1;

&[type='radio'] {
margin-left: $form-check-input-radio-margin-left * -1;
}
}

margin-bottom: 0;
min-height: auto;
}

.form-check-input {
position: relative;
width: $form-check-input-width-md;
height: $form-check-input-height;
background-color: $form-check-input-background-color;
border: $form-check-input-border-width solid $form-check-input-border-color;

&:before {
content: '';
position: absolute;
box-shadow: $form-check-input-before-box-shadow;
border-radius: $form-check-input-before-border-radius;
width: $form-check-input-before-width;
height: $form-check-input-before-height;
background-color: transparent;
opacity: 0;
pointer-events: none;
transform: $form-check-input-before-transform;
}

&:hover {
cursor: pointer;

&:before {
opacity: $form-check-input-hover-before-opacity;
box-shadow: $form-check-input-hover-before-box-shadow;
}
}

&:focus {
box-shadow: none;
border-color: $form-check-input-focus-border-color;
transition: $form-check-input-focus-transition;

&:before {
opacity: $form-check-input-focus-before-opacity;
box-shadow: $form-check-input-focus-before-box-shadow;
transform: $form-check-input-focus-before-transform;
transition: $form-check-input-focus-before-transition;
}
}

&:checked {
border-color: $form-check-input-checked-border-color;

&:before {
opacity: $form-check-input-checked-before-opacity;
}

&:after {
content: '';
position: absolute;
}

&:focus {
border-color: $form-check-input-checked-focus-border-color;

&:before {
box-shadow: $form-check-input-checked-focus-before-box-shadow;
transform: $form-check-input-checked-focus-before-transform;
transition: $form-check-input-checked-focus-before-transition;
}
}
}

&:indeterminate {
&:focus {
&:before {
box-shadow: $form-check-input-indeterminate-focus-before-box-shadow;
}
}
}

&[type='checkbox'] {
border-radius: $form-check-input-checkbox-border-radius;

&:focus {
&:after {
content: '';
position: absolute;
width: $form-check-input-checkbox-focus-after-width;
height: $form-check-input-checkbox-focus-after-height;
z-index: 1;
display: block;
border-radius: 0;
background-color: $form-check-input-checkbox-focus-after-background-color;
}
}

&:checked {
background-image: none;
background-color: $form-check-input-checkbox-checked-background-color;

&:after {
display: block;
transform: $form-check-input-checkbox-checked-after-transform #{'/*!rtl:ignore*/'};
border-width: $form-check-input-checkbox-checked-after-border-width;
border-color: $form-check-input-checkbox-checked-after-border-color;
width: $form-check-input-checkbox-checked-after-width;
height: $form-check-input-checkbox-checked-after-height;
border-style: solid;
border-top: 0;
border-left: 0 #{'/*!rtl:ignore*/'};
margin-left: $form-check-input-checkbox-checked-after-margin-left;
margin-top: $form-check-input-checkbox-checked-after-margin-top;
background-color: transparent;
}

&:focus {
background-color: $form-check-input-checkbox-checked-focus-background-color;
}
}

&:indeterminate {
background-image: none;
background-color: transparent;
border-color: $form-check-input-indeterminate-border-color;

&:after {
display: block;
transform: $form-check-input-indeterminate-checked-after-transform #{'/*!rtl:ignore*/'};
border-width: $form-check-input-indeterminate-checked-after-border-width;
border-color: $form-check-input-indeterminate-checked-after-border-color;
width: $form-check-input-indeterminate-checked-after-width;
height: $form-check-input-indeterminate-checked-after-height;
border-style: solid;
border-top: 0;
border-left: 0 #{'/*!rtl:ignore*/'};
margin-left: $form-check-input-indeterminate-checked-after-margin-left;
margin-top: 0;
}

&:focus {
background-color: $form-check-input-indeterminate-focus-background-color;
border-color: $form-check-input-indeterminate-focus-border-color;
}
}
}

&[type='radio'] {
border-radius: $form-check-input-radio-border-radius;
width: $form-check-input-radio-width;
height: $form-check-input-radio-height;

&:before {
width: $form-check-input-radio-before-width;
height: $form-check-input-radio-before-height;
}

&:after {
content: '';
position: absolute;
width: $form-check-input-radio-after-width;
height: $form-check-input-radio-after-height;
z-index: 1;
display: block;
border-radius: $form-check-input-radio-after-border-radius;
background-color: $form-check-input-radio-after-background-color;
}

&:checked {
background-image: none;
background-color: $form-check-input-radio-checked-background-color;

&:after {
border-radius: $form-check-input-radio-checked-after-border-radius;
width: $form-check-input-radio-checked-after-width;
height: $form-check-input-radio-checked-after-height;
border-color: $form-check-input-radio-checked-after-border-color;
background-color: $form-check-input-radio-checked-after-background-color;
margin-top: $form-check-input-radio-checked-after-margin-top;
margin-left: $form-check-input-radio-checked-after-margin-left;
transition: $form-check-input-radio-checked-after-transition;
}

&:focus {
background-color: $form-check-input-radio-checked-focus-background-color;
}
}
}
}

.form-check-label {
&:hover {
cursor: pointer;
}
}

//
// Switch
//

.form-switch {
padding-left: $form-switch-padding-left;

.form-check-input {
background-image: none;
border-width: 0;
border-radius: $form-switch-form-check-input-border-radius;
width: $form-switch-form-check-input-width;
height: $form-switch-form-check-input-height;
background-color: $form-switch-form-check-input-background-color;
margin-top: $form-switch-form-check-input-margin-top;
margin-right: $form-switch-form-check-input-margin-right;

&:after {
content: '';
position: absolute;
border: none;
z-index: 2;
border-radius: $form-switch-form-check-input-after-border-radius;
width: $form-switch-form-check-input-after-width;
height: $form-switch-form-check-input-after-height;
background-color: $form-switch-form-check-input-after-background-color;
margin-top: $form-switch-form-check-input-after-margin-top;
box-shadow: $form-switch-form-check-input-after-box-shadow;
transition: $form-switch-form-check-input-after-transition;
}

&:focus {
background-image: none;

&:before {
box-shadow: $form-switch-form-check-input-focus-before-box-shadow;
transform: $form-switch-form-check-input-focus-before-transform;
transition: $form-switch-form-check-input-focus-before-transition;
}

&:after {
border-radius: $form-switch-form-check-input-focus-after-border-radius;
width: $form-switch-form-check-input-focus-after-width;
height: $form-switch-form-check-input-focus-after-height;
}
}

&:checked {
background-image: none;

&:focus {
background-image: none;

&:before {
margin-left: $form-switch-form-check-input-checked-focus-before-margin-left;
box-shadow: $form-switch-form-check-input-checked-focus-before-box-shadow;
transform: $form-switch-form-check-input-checked-focus-before-transform;
transition: $form-switch-form-check-input-checked-focus-before-transition;
}
}

&[type='checkbox'] {
background-image: none;

&:after {
content: '';
position: absolute;
border: none;
z-index: 2;
border-radius: $form-switch-form-check-input-checked-checkbox-after-border-radius;
width: $form-switch-form-check-input-checked-checkbox-after-width;
height: $form-switch-form-check-input-checked-checkbox-after-height;
background-color: $form-switch-form-check-input-checked-checkbox-after-background-color;
margin-top: $form-switch-form-check-input-checked-checkbox-after-margin-top;
margin-left: $form-switch-form-check-input-checked-checkbox-after-margin-left;
box-shadow: $form-switch-form-check-input-checked-checkbox-after-box-shadow;
transition: $form-switch-form-check-input-checked-checkbox-after-transition;
}
}
}
}
}
Loading

0 comments on commit 940a5c5

Please sign in to comment.