Skip to content

Commit

Permalink
1.0.0-beta1
Browse files Browse the repository at this point in the history
  • Loading branch information
unknown committed Aug 27, 2021
1 parent a342e64 commit bdd547c
Show file tree
Hide file tree
Showing 32 changed files with 953 additions and 3 deletions.
35 changes: 35 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,30 @@
## 1.0.0-beta1 (22.03.2021)

### New components:

- [Range](https://mdbootstrap.com/docs/b5/angular/forms/range/)
- [File](https://mdbootstrap.com/docs/b5/angular/forms/file)
- [Switch](https://mdbootstrap.com/docs/b5/angular/forms/switch/)
- [Input group](https://mdbootstrap.com/docs/b5/angular/forms-input-group/)
- [Pills](https://mdbootstrap.com/docs/b5/angular/navigation/pills/)
- [Tabs](https://mdbootstrap.com/docs/b5/angular/navigation/tabs/)

### Bug fixes:

- Scrollspy - added `cursor: pointer` styles to scrollspy links,
- Sidenav - resolved problem with errors when `RouterModule` is not imported,
- Sidenav - component will be correctly updated on inputs changes,
- Sidenav - resolved problem with scroll position,
- Sidenav - added components and module exports to main library index.

### New features:

- Animations - added new animations: `slideLeft`, `slideRight`, `slideUp`, `slideDown`,
- Sidenav - added focus trap,
- Sidenav - escape button will now close the component.

---

## 1.0.0-alpha4 (08.03.2021)

### New components:
Expand All @@ -9,14 +36,18 @@
- [Validation](https://mdbootstrap.com/docs/b5/angular/forms/validation/)

### Bug fixes:

- Select - `x options selected` text will be displayed correctly when more than 5 options have been selected,
- Select - fixed clear button focusing issue.

### New features:

- Select - added new `displayedLabels` input that allows to change maximum number of comma-separated options labels displayed in the multiselect input,
- Select - added new `optionsSelectedLabel` input that allows to customize x options selected text,
- Select - added new `filterDebounce` input that allows to add delay to the options list updates when using filter input

---

## 1.0.0-alpha3 (22.02.2021)

### New components:
Expand All @@ -26,6 +57,8 @@
- [Select](https://mdbootstrap.com/docs/b5/angular/forms/select/)
- [Scrollbar](https://mdbootstrap.com/docs/b5/angular/methods/scrollbar/)

---

## 1.0.0-alpha2 (25.01.2021)

### New components:
Expand All @@ -36,6 +69,8 @@
- [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 README.txt
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
MDB 5 Angular

Version: FREE 1.0.0 Alpha 4
Version: FREE 1.0.0 Beta 1

Documentation:
https://mdbootstrap.com/docs/b5/angular/
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-alpha4",
"version": "1.0.0-beta1",
"scripts": {
"ng": "ng",
"start": "ng serve",
Expand Down
35 changes: 35 additions & 0 deletions projects/mdb-angular-ui-kit/CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,30 @@
## 1.0.0-beta1 (22.03.2021)

### New components:

- [Range](https://mdbootstrap.com/docs/b5/angular/forms/range/)
- [File](https://mdbootstrap.com/docs/b5/angular/forms/file)
- [Switch](https://mdbootstrap.com/docs/b5/angular/forms/switch/)
- [Input group](https://mdbootstrap.com/docs/b5/angular/forms-input-group/)
- [Pills](https://mdbootstrap.com/docs/b5/angular/navigation/pills/)
- [Tabs](https://mdbootstrap.com/docs/b5/angular/navigation/tabs/)

### Bug fixes:

- Scrollspy - added `cursor: pointer` styles to scrollspy links,
- Sidenav - resolved problem with errors when `RouterModule` is not imported,
- Sidenav - component will be correctly updated on inputs changes,
- Sidenav - resolved problem with scroll position,
- Sidenav - added components and module exports to main library index.

### New features:

- Animations - added new animations: `slideLeft`, `slideRight`, `slideUp`, `slideDown`,
- Sidenav - added focus trap,
- Sidenav - escape button will now close the component.

---

## 1.0.0-alpha4 (08.03.2021)

### New components:
Expand All @@ -9,14 +36,18 @@
- [Validation](https://mdbootstrap.com/docs/b5/angular/forms/validation/)

### Bug fixes:

- Select - `x options selected` text will be displayed correctly when more than 5 options have been selected,
- Select - fixed clear button focusing issue.

### New features:

- Select - added new `displayedLabels` input that allows to change maximum number of comma-separated options labels displayed in the multiselect input,
- Select - added new `optionsSelectedLabel` input that allows to customize x options selected text,
- Select - added new `filterDebounce` input that allows to add delay to the options list updates when using filter input

---

## 1.0.0-alpha3 (22.02.2021)

### New components:
Expand All @@ -26,6 +57,8 @@
- [Select](https://mdbootstrap.com/docs/b5/angular/forms/select/)
- [Scrollbar](https://mdbootstrap.com/docs/b5/angular/methods/scrollbar/)

---

## 1.0.0-alpha2 (25.01.2021)

### New components:
Expand All @@ -36,6 +69,8 @@
- [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
45 changes: 45 additions & 0 deletions projects/mdb-angular-ui-kit/assets/scss/free/_range.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
// range
.range {
position: relative;

.thumb {
position: absolute;
display: block;
height: 30px;
width: 30px;
top: -35px;
margin-left: -15px;
text-align: center;
border-radius: 50% 50% 50% 0;
transform: scale(0);
transform-origin: bottom;
transition: transform 0.2s ease-in-out;

&:after {
position: absolute;
display: block;
content: '';
transform: translateX(-50%);
width: 100%;
height: 100%;
top: 0;
border-radius: 50% 50% 50% 0;
transform: rotate(-45deg);
background: #1266f1;
z-index: -1;
}

.thumb-value {
display: block;
font-size: 12px;
line-height: 30px;
color: rgb(255, 255, 255);
font-weight: 500;
z-index: 2;
}

&.thumb-active {
transform: scale(1);
}
}
}
3 changes: 3 additions & 0 deletions projects/mdb-angular-ui-kit/assets/scss/free/_scrollspy.scss
Original file line number Diff line number Diff line change
@@ -1,4 +1,7 @@
// Scrollspy
.scrollspy-link {
cursor: pointer;
}

.nav-pills {
&.menu-sidebar {
Expand Down
19 changes: 19 additions & 0 deletions projects/mdb-angular-ui-kit/assets/scss/free/forms/_form-file.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
.form-control {
&[type='file'] {
&::-webkit-file-upload-button {
background-color: transparent;
}
}
&:hover {
&:not(:disabled):not([readonly])::-webkit-file-upload-button {
background-color: transparent;
}
}
}

.form-control-sm {
&::-webkit-file-upload-button {
padding: 0.28rem 0.5rem;
margin: -0.28rem -0.5rem;
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
// Range
//
// Style range inputs the same across browsers. Vendor-specific rules for pseudo
// elements cannot be mixed. As such, there are no shared styles for focus or
// active states on prefixed selectors.

.form-range {
&:focus {
box-shadow: none;

// Pseudo-elements must be split across multiple rulesets to have an effect.
// No box-shadow() mixin for focus accessibility.
&::-webkit-slider-thumb {
box-shadow: none;
}
&::-moz-range-thumb {
box-shadow: none;
}
&::-ms-thumb {
box-shadow: none;
}
}

&::-moz-focus-outer {
border: 0;
}

&::-webkit-slider-thumb {
margin-top: $form-range-webkit-slider-thumb-margin-top; // Webkit specific
box-shadow: none;
appearance: none;
}

&::-webkit-slider-runnable-track {
height: $form-range-webkit-slider-runnable-track-height;
border-radius: 0;
}

&::-moz-range-thumb {
box-shadow: none;
appearance: none;
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -79,3 +79,13 @@
.input-group > [class*='btn-outline-'] + [class*='btn-outline-'] {
border-left: 0;
}

.input-group div:not(:first-child).dropdown button.dropdown-toggle {
margin-left: -$input-border-width;
@include border-start-radius(0);
}

.input-group div:not(:last-child).dropdown button.dropdown-toggle {
margin-right: -$input-border-width;
@include border-end-radius(0);
}
2 changes: 2 additions & 0 deletions projects/mdb-angular-ui-kit/assets/scss/mdb.free.scss
Original file line number Diff line number Diff line change
Expand Up @@ -79,9 +79,11 @@
@import './free/tooltip';
@import './free/popover';
@import './free/dropdown';
@import './free/range';

// MDB FORMS
@import './free/forms/form-check';
@import './free/forms/form-control';
@import './free/forms/form-range';

@import '~@angular/cdk/overlay-prebuilt.css';
3 changes: 3 additions & 0 deletions projects/mdb-angular-ui-kit/assets/scss/mdb.scss
Original file line number Diff line number Diff line change
Expand Up @@ -83,11 +83,14 @@
@import './free/ripple';
@import './free/validation';
@import './free/scrollspy';
@import './free/range';

// MDB FORMS
@import './free/forms/form-check';
@import './free/forms/form-control';
@import './free/forms/form-select';
@import './free/forms/form-range';
@import './free/forms/input-group';
@import './free/forms/form-file';

@import '~@angular/cdk/overlay-prebuilt.css';
1 change: 1 addition & 0 deletions projects/mdb-angular-ui-kit/checkbox/checkbox.directive.ts
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,7 @@ export class MdbCheckboxDirective {
}
this._checked = !this._checked;
this.onChange(this.checked);
this.onCheckboxChange();
}

onCheckboxChange(): void {
Expand Down
12 changes: 12 additions & 0 deletions projects/mdb-angular-ui-kit/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,8 @@ import { MdbDropdownModule } from './dropdown/dropdown.module';
import { MdbRippleModule } from './ripple/ripple.module';
import { MdbValidationModule } from './validation/validation.module';
import { MdbScrollspyModule } from './scrollspy/scrollspy.module';
import { MdbRangeModule } from './range/range.module';
import { MdbTabsModule } from './tabs/tabs.module';

export { MdbCollapseDirective, MdbCollapseModule } from './collapse/index';
export {
Expand Down Expand Up @@ -62,6 +64,14 @@ export {
MdbScrollspyService,
MdbScrollspyModule,
} from './scrollspy/index';
export { MdbRangeComponent, MdbRangeModule } from './range/index';
export {
MdbTabComponent,
MdbTabContentDirective,
MdbTabTitleDirective,
MdbTabsComponent,
MdbTabsModule,
} from './tabs/index';

const MDB_MODULES = [
MdbCollapseModule,
Expand All @@ -75,6 +85,8 @@ const MDB_MODULES = [
MdbRippleModule,
MdbValidationModule,
MdbScrollspyModule,
MdbRangeModule,
MdbTabsModule,
];

@NgModule({
Expand Down
2 changes: 1 addition & 1 deletion projects/mdb-angular-ui-kit/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
"repository": "https://github.com/mdbootstrap/mdb-angular-ui-kit",
"author": "MDBootstrap",
"license": "MIT",
"version": "1.0.0-alpha4",
"version": "1.0.0-beta1",
"peerDependencies": {
"@angular/common": "^11.0.0",
"@angular/core": "^11.0.0",
Expand Down
1 change: 1 addition & 0 deletions projects/mdb-angular-ui-kit/range/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export * from './public_api';
2 changes: 2 additions & 0 deletions projects/mdb-angular-ui-kit/range/public_api.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
export { MdbRangeModule } from './range.module';
export { MdbRangeComponent } from './range.component';
28 changes: 28 additions & 0 deletions projects/mdb-angular-ui-kit/range/range.component.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<label for="customRange2" class="form-label">Example range</label>
<div class="range">
<input
#input
[name]="name"
type="range"
[disabled]="disabled"
[id]="id"
[min]="min"
[max]="max"
[step]="step"
[value]="value"
[(ngModel)]="value"
class="form-range"
min="0"
max="5"
[id]="id"
(input)="thumbPositionUpdate()"
(blur)="blurRangeInput()"
(mousedown)="focusRangeInput()"
(mouseup)="blurRangeInput()"
(touchstart)="focusRangeInput()"
(touchend)="blurRangeInput()"
/>
<span #thumb class="thumb" [ngStyle]="thumbStyle" [ngClass]="{ 'thumb-active': this.visibility }">
<span #thumbValue class="thumb-value">{{ value }}</span>
</span>
</div>
Loading

0 comments on commit bdd547c

Please sign in to comment.