mypgs 1.3.3 → 1.3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/assets/scss/mixin/_mx-form.scss +15 -3
  2. package/dist/css/index.css +11 -90
  3. package/dist/css/index.css.map +1 -1
  4. package/dist/css/index.min.css +1 -1
  5. package/dist/javascript/index.js +0 -13
  6. package/dist/javascript/index.js.map +1 -1
  7. package/package.json +1 -1
package/assets/scss/mixin/_mx-form.scss CHANGED
@@ -83,16 +83,28 @@
83
83
  //== DISABLED
84
84
  @mixin file() {
85
85
  width: 100%;
86
- // margin-bottom: var(--gap-texts);
87
86
  background-color: var(--color-white);
88
87
  padding: var(--gap-texts);
89
- border-radius: calc( var(--border-radius-input) + var(--gap-texts));
88
+ border-radius: calc(var(--border-radius-input) + var(--gap-texts));
90
89
 
91
90
  &::file-selector-button {
92
- @include button(false);
91
+ --button-background: var(--color-box);
92
+ --button-color: var(--color-black);
93
+
93
94
  width: 40%;
94
95
  margin-bottom: var(--gap-texts);
95
96
  margin-right: var(--gap-texts);
97
+ border: none;
98
+ outline: var(--border-complete);
99
+ border-radius: var(--border-radius-input);
100
+ padding: 1.5rem 3rem;
101
+ font-family: var(--font);
102
+ font-size: 1.6rem;
103
+ font-weight: 600;
104
+ color: var(--button-color);
105
+ background: var(--button-background);
106
+ cursor: pointer;
107
+ transition: all 200ms;
96
108
  }
97
109
 
98
110
  &::file-selector-button:hover {
package/dist/css/index.css CHANGED
@@ -4676,102 +4676,23 @@ body [pgs~=bodyImg] img, [pgs~=bodyImg] object, [pgs~=bodyImg] lottie-player {
4676
4676
  padding: var(--gap-texts);
4677
4677
  border-radius: calc(var(--border-radius-input) + var(--gap-texts));
4678
4678
  }
4679
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button {
4680
- --button-border: var(--border-complete);
4681
- --button-size: 1.5rem;
4682
- --button-icon-size: 2.0rem;
4683
- --button-padding-block: var(--button-size);
4684
- --button-padding-left: calc(var(--button-size) * 2);
4685
- --button-padding-right: calc(var(--button-size) * 2);
4686
- --button-padding: var(--button-padding-block) var(--button-padding-right) var(--button-padding-block) var(--button-padding-left);
4687
- --fa-secondary-opacity: 0.5;
4688
- --fa-size: var(--button-icon-size);
4689
- }
4690
- @supports (color: contrast-color(red)) {
4691
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button {
4692
- --button-color: contrast-color(color-mix(in srgb, var(--button-background) 77%, black));
4693
- }
4694
- }
4695
- @supports not (color: contrast-color(red)) {
4696
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button {
4697
- --button-color: var(--color-black);
4698
- }
4699
- }
4700
4679
  [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button {
4701
4680
  --button-background: var(--color-box);
4702
- color: var(--button-color);
4703
- background: var(--button-background);
4704
- }
4705
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button:is(a) {
4706
- color: var(--button-color);
4707
- }
4708
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button i {
4709
- color: var(--button-color);
4710
- --fa-primary-color: var(--button-color);
4711
- --fa-secondary-color: var(--button-color);
4712
- }
4713
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button {
4681
+ --button-color: var(--color-black);
4682
+ width: 40%;
4683
+ margin-bottom: var(--gap-texts);
4684
+ margin-right: var(--gap-texts);
4685
+ border: none;
4686
+ outline: var(--border-complete);
4687
+ border-radius: var(--border-radius-input);
4688
+ padding: 1.5rem 3rem;
4714
4689
  font-family: var(--font);
4715
4690
  font-size: 1.6rem;
4716
4691
  font-weight: 600;
4717
- text-decoration: none;
4718
- -moz-user-select: none;
4719
- -webkit-user-select: none;
4720
- user-select: none;
4721
- border: none;
4722
- outline: var(--button-border);
4723
- border-radius: var(--border-radius-input);
4724
- display: flex;
4725
- gap: calc(var(--button-size) / 1.5);
4726
- align-items: center;
4727
- padding: var(--button-padding);
4728
- height: max-content;
4729
- width: max-content;
4730
- margin-block: auto;
4731
- }
4732
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button:has(i) {
4733
- --button-padding-right: calc(var(--button-size) * 2);
4734
- --button-padding-left: calc(var(--button-size) * 1.5);
4735
- }
4736
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button[pgs-option~=buttonReverse]:has(i) {
4737
- --button-padding-right: calc(var(--button-size) * 1.5);
4738
- --button-padding-left: calc(var(--button-size) * 2);
4739
- }
4740
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button {
4692
+ color: var(--button-color);
4693
+ background: var(--button-background);
4694
+ cursor: pointer;
4741
4695
  transition: all 200ms;
4742
- cursor: inherit;
4743
- }
4744
- @supports (color: contrast-color(red)) {
4745
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button[aria-current=page]:not(:hover, :focus-visible) {
4746
- --button-color-current: contrast-color(color-mix(in srgb, var(--button-background-current) 77%, black));
4747
- }
4748
- }
4749
- @supports not (color: contrast-color(red)) {
4750
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button[aria-current=page]:not(:hover, :focus-visible) {
4751
- --button-color-current: var(--color-whiteFixed);
4752
- }
4753
- }
4754
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button[aria-current=page]:not(:hover, :focus-visible) {
4755
- --button-background-current: var(--color-primary);
4756
- color: var(--button-color-current);
4757
- background: var(--button-background-current);
4758
- }
4759
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button[aria-current=page]:not(:hover, :focus-visible):is(a) {
4760
- color: var(--button-color-current);
4761
- }
4762
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button[aria-current=page]:not(:hover, :focus-visible) i {
4763
- color: var(--button-color-current);
4764
- --fa-primary-color: var(--button-color-current);
4765
- --fa-secondary-color: var(--button-color-current);
4766
- }
4767
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button:disabled {
4768
- opacity: 0.2;
4769
- cursor: not-allowed;
4770
- }
4771
- [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button {
4772
- width: 40%;
4773
- margin-bottom: var(--gap-texts);
4774
- margin-right: var(--gap-texts);
4775
4696
  }
4776
4697
  [pgs~=initP] [pgs~=form] input[type=file]::file-selector-button:hover {
4777
4698
  background-color: var(--color-primary);