@navikt/ds-css 3.2.2 → 3.2.3

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.
@@ -1192,12 +1192,23 @@
1192
1192
 
1193
1193
  min-height: 2rem;
1194
1194
  }
1195
+ .navds-copybutton--xsmall {
1196
+ --__ac-copybutton-padding: var(--a-spacing-05) var(--a-spacing-2);
1197
+
1198
+ min-height: 1.5rem;
1199
+ }
1195
1200
  .navds-copybutton--icon-only {
1196
1201
  --__ac-copybutton-padding: var(--a-spacing-3);
1197
1202
  }
1198
1203
  .navds-copybutton--small.navds-copybutton--icon-only {
1199
1204
  --__ac-copybutton-padding: var(--a-spacing-1);
1200
1205
  }
1206
+ .navds-copybutton--xsmall.navds-copybutton--icon-only {
1207
+ --__ac-copybutton-padding: var(--a-spacing-05);
1208
+ }
1209
+ .navds-copybutton--xsmall .navds-copybutton__icon {
1210
+ font-size: 1.25rem;
1211
+ }
1201
1212
  .navds-copybutton__icon {
1202
1213
  font-size: 1.5rem;
1203
1214
  display: flex;
@@ -1206,6 +1217,9 @@
1206
1217
  .navds-copybutton__icon:only-child {
1207
1218
  margin: 0;
1208
1219
  }
1220
+ :where(.navds-copybutton--small, .navds-copybutton--xsmall):where(:not(:only-child)) {
1221
+ margin: -2px;
1222
+ }
1209
1223
  .navds-copybutton:focus-visible {
1210
1224
  outline: none;
1211
1225
  box-shadow: var(--a-shadow-focus);
@@ -1258,6 +1272,9 @@
1258
1272
  justify-content: center;
1259
1273
  gap: var(--a-spacing-2);
1260
1274
  }
1275
+ .navds-copybutton--xsmall > .navds-copybutton__content {
1276
+ gap: var(--a-spacing-1);
1277
+ }
1261
1278
  .navds-copybutton--active > .navds-copybutton__content {
1262
1279
  animation: var(--ac-copybutton-animation, akselCopyButtonAnimation 0.4s linear);
1263
1280
  }
@@ -2870,10 +2887,10 @@
2870
2887
  color: var(--ac-date-caption-text, var(--a-text-default));
2871
2888
  }
2872
2889
  .navds-date__field-input {
2873
- padding-right: var(--a-spacing-12);
2890
+ padding-right: var(--a-spacing-14);
2874
2891
  }
2875
2892
  .navds-form-field--small .navds-date__field-input {
2876
- padding-right: var(--a-spacing-8);
2893
+ padding-right: var(--a-spacing-10);
2877
2894
  }
2878
2895
  /* Error-handling */
2879
2896
  .navds-date__field--error .navds-date__field-input:not(:hover):not(:disabled) {
@@ -2890,21 +2907,46 @@
2890
2907
  }
2891
2908
  .navds-date__field-button {
2892
2909
  position: absolute;
2893
- right: var(--a-spacing-2);
2910
+ right: 1px;
2894
2911
  top: 50%;
2895
2912
  transform: translateY(-50%);
2896
2913
  color: var(--ac-date-input-button-text, var(--a-text-default));
2914
+ display: inline-flex;
2915
+ cursor: pointer;
2916
+ margin: 0;
2917
+ text-decoration: none;
2918
+ border: none;
2919
+ background: none;
2920
+ border-radius: 3px;
2921
+ padding: var(--a-spacing-3);
2922
+ align-items: center;
2923
+ justify-content: center;
2924
+ font-size: 1.5rem;
2925
+ height: calc(100% - 2px);
2926
+ border-start-start-radius: 0;
2927
+ border-end-start-radius: 0;
2897
2928
  }
2898
2929
  .navds-form-field--small .navds-date__field-button {
2899
- right: var(--a-spacing-2);
2900
- height: 1.5rem;
2901
- width: 1.5rem;
2930
+ padding: var(--a-spacing-1);
2902
2931
  }
2903
- .navds-form-field--small .navds-date__field-button svg {
2904
- font-size: var(--a-font-size-medium);
2932
+ .navds-date__field-button:hover:where(:not([disabled])) {
2933
+ color: var(--ac-date-input-button-hover-text, var(--a-text-action-on-action-subtle));
2934
+ background-color: var(--ac-date-input-button-hover-bg, var(--a-surface-action-subtle-hover));
2905
2935
  }
2906
2936
  .navds-form-field--disabled .navds-date__field-button {
2907
2937
  opacity: 1;
2938
+ cursor: not-allowed;
2939
+ }
2940
+ .navds-date__field-button:focus-visible {
2941
+ outline: none;
2942
+ box-shadow: var(--a-shadow-focus);
2943
+ border-radius: var(--a-border-radius-medium);
2944
+ }
2945
+ @supports not selector(:focus-visible) {
2946
+ .navds-date__field-button:focus {
2947
+ outline: none;
2948
+ box-shadow: var(--a-shadow-focus);
2949
+ }
2908
2950
  }
2909
2951
  .navds-date__caption__year {
2910
2952
  width: 5rem;