@festo-ui/web-essentials 6.0.0-dev.224 → 6.0.0-dev.229

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 (11) hide show
  1. package/dist/css/festo-web-essentials.css +49 -42
  2. package/dist/css/festo-web-essentials.css.map +1 -1
  3. package/dist/css/festo-web-essentials.min.css +2 -2
  4. package/dist/css/festo-web-essentials.min.css.map +1 -1
  5. package/dist/css/themes/flatpickr/festo.css +1 -1
  6. package/dist/css/themes/flatpickr/festo.min.css +1 -1
  7. package/dist/scss/_radio.scss +51 -42
  8. package/dist/scss/festo-web-essentials.scss +1 -1
  9. package/dist/scss/themes/flatpickr/festo.scss +1 -1
  10. package/package.json +1 -1
  11. package/scss/_radio.scss +51 -42
package/dist/css/festo-web-essentials.css CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * Festo UI - Web Essentials v6.0.0-dev.224 (https://storybook.festo.design/)
2
+ * Festo UI - Web Essentials v6.0.0-dev.229 (https://storybook.festo.design/)
3
3
  * Copyright 2022 Festo SE & Co. KG
4
4
  * Licensed under Apache-2.0
5
5
  */
@@ -14997,14 +14997,9 @@ label.fwe-switch.fwe-switch-label-below .fwe-radio-label-content, label.fwe-chec
14997
14997
  .fwe-radio-group.fwe-radio-lg label.fwe-radio .fwe-radio-checkmark {
14998
14998
  height: 24px;
14999
14999
  width: 24px;
15000
- min-height: 24px;
15001
- min-width: 24px;
15002
15000
  }
15003
- .fwe-radio-group.fwe-radio-lg label.fwe-radio .fwe-radio-checkmark:after {
15004
- height: 24px;
15005
- width: 24px;
15006
- min-height: 24px;
15007
- min-width: 24px;
15001
+ .fwe-radio-group.fwe-radio-lg label.fwe-radio .fwe-radio-checkmark::after {
15002
+ border-width: 7px;
15008
15003
  }
15009
15004
  .fwe-radio-group.fwe-radio-lg label.fwe-radio .fwe-radio-label-content {
15010
15005
  line-height: 32px;
@@ -15020,43 +15015,48 @@ label.fwe-radio {
15020
15015
  user-select: none;
15021
15016
  }
15022
15017
  label.fwe-radio .fwe-radio-checkmark {
15023
- box-sizing: border-box;
15024
15018
  position: relative;
15025
15019
  height: 16px;
15026
15020
  width: 16px;
15027
- min-height: 16px;
15028
- min-width: 16px;
15029
- border: 1px solid var(--fwe-control-border);
15030
- background-color: var(--fwe-white);
15031
- border-radius: 50%;
15021
+ box-sizing: border-box;
15022
+ display: inline-block;
15032
15023
  }
15033
- label.fwe-radio .fwe-radio-checkmark:after {
15024
+ label.fwe-radio .fwe-radio-checkmark::before {
15034
15025
  content: "";
15035
15026
  position: absolute;
15027
+ top: 0;
15028
+ left: 0;
15036
15029
  box-sizing: border-box;
15030
+ width: 100%;
15031
+ height: 100%;
15032
+ border-width: 1px;
15033
+ border-style: solid;
15037
15034
  border-radius: 50%;
15035
+ border-color: var(--fwe-control-border);
15038
15036
  background-color: var(--fwe-white);
15037
+ }
15038
+ label.fwe-radio .fwe-radio-checkmark::after {
15039
+ content: "";
15039
15040
  position: absolute;
15040
- left: -1px;
15041
- top: -1px;
15042
- height: 16px;
15043
- width: 16px;
15044
- min-height: 16px;
15045
- min-width: 16px;
15046
- transition: transform ease-out 0.3s, background-color ease-out 0.3s;
15047
- transform: scale(0.001);
15041
+ top: 0;
15042
+ left: 0;
15043
+ box-sizing: border-box;
15044
+ width: 100%;
15045
+ height: 100%;
15046
+ transform: scale(0, 0);
15047
+ border-width: 5px;
15048
+ border-style: solid;
15049
+ border-radius: 50%;
15050
+ border-color: var(--fwe-white);
15051
+ background-color: var(--fwe-white);
15052
+ transition: none;
15048
15053
  }
15049
15054
  label.fwe-radio.fwe-radio-lg .fwe-radio-checkmark {
15050
15055
  height: 24px;
15051
15056
  width: 24px;
15052
- min-height: 24px;
15053
- min-width: 24px;
15054
15057
  }
15055
- label.fwe-radio.fwe-radio-lg .fwe-radio-checkmark:after {
15056
- height: 24px;
15057
- width: 24px;
15058
- min-height: 24px;
15059
- min-width: 24px;
15058
+ label.fwe-radio.fwe-radio-lg .fwe-radio-checkmark::after {
15059
+ border-width: 7px;
15060
15060
  }
15061
15061
  label.fwe-radio.fwe-radio-lg .fwe-radio-label-content {
15062
15062
  line-height: 32px;
@@ -15070,28 +15070,35 @@ label.fwe-radio input[type=radio] {
15070
15070
  opacity: 0;
15071
15071
  cursor: pointer;
15072
15072
  }
15073
- label.fwe-radio input[type=radio]:hover:not(:disabled) ~ .fwe-radio-checkmark {
15073
+ label.fwe-radio input[type=radio]:hover:not(:disabled) ~ .fwe-radio-checkmark::before {
15074
15074
  background-color: var(--fwe-control);
15075
15075
  }
15076
- label.fwe-radio input[type=radio]:active ~ .fwe-radio-checkmark {
15077
- background-color: var(--fwe-control-dark);
15076
+ label.fwe-radio input[type=radio]:hover:checked:not(:disabled) ~ .fwe-radio-checkmark::after {
15077
+ border-color: var(--fwe-hero-dark);
15078
15078
  }
15079
- label.fwe-radio input[type=radio]:checked ~ .fwe-radio-checkmark {
15080
- background-color: var(--fwe-hero);
15081
- border-color: var(--fwe-hero);
15079
+ label.fwe-radio input[type=radio]:active ~ .fwe-radio-checkmark::before {
15080
+ border-color: var(--fwe-control-dark);
15081
+ background-color: var(--fwe-white);
15082
15082
  }
15083
- label.fwe-radio input[type=radio]:hover:checked:not(:disabled) ~ .fwe-radio-checkmark {
15084
- background-color: var(--fwe-hero-dark);
15085
- border-color: var(--fwe-hero-dark);
15083
+ label.fwe-radio input[type=radio]:checked ~ .fwe-radio-checkmark::before {
15084
+ border-color: var(--fwe-border);
15085
+ background-color: var(--fwe-hero);
15086
15086
  }
15087
- label.fwe-radio input[type=radio]:checked ~ .fwe-radio-checkmark:after {
15088
- transform: scale(0.4);
15087
+ label.fwe-radio input[type=radio]:checked ~ .fwe-radio-checkmark::after {
15088
+ border-color: var(--fwe-hero);
15089
+ transition: transform ease-out 0.15s;
15090
+ transform: scale(1, 1);
15089
15091
  }
15090
- label.fwe-radio input[type=radio]:disabled ~ .fwe-radio-checkmark {
15092
+ label.fwe-radio input[type=radio]:disabled ~ .fwe-radio-checkmark::before {
15091
15093
  background-color: var(--fwe-control-disabled);
15092
15094
  border-color: var(--fwe-control-disabled);
15093
15095
  cursor: not-allowed;
15094
15096
  }
15097
+ label.fwe-radio input[type=radio]:disabled ~ .fwe-radio-checkmark::after {
15098
+ background-color: var(--fwe-white);
15099
+ border-color: var(--fwe-control-disabled);
15100
+ cursor: not-allowed;
15101
+ }
15095
15102
  label.fwe-radio input[type=radio]:disabled {
15096
15103
  cursor: not-allowed;
15097
15104
  }