@norges-domstoler/dds-components 17.4.0 → 17.5.0

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.
package/dist/index.css CHANGED
@@ -749,7 +749,7 @@
749
749
  :where(.Input_char-counter) {
750
750
  margin-left: auto;
751
751
  }
752
- :where(.Input_icon) {
752
+ :where(.Input_input-group__absolute-element) {
753
753
  position: absolute;
754
754
  top: 50%;
755
755
  transform: translate(0, -50%);
@@ -2826,7 +2826,7 @@
2826
2826
  }
2827
2827
  .NativeSelect_select--tiny {
2828
2828
  height: calc(1.5em + var(--dds-spacing-x0-25) + var(--dds-spacing-x0-25) + 2px);
2829
- padding-right: var(--dds-spacing-x1);
2829
+ padding-right: var(--dds-spacing-x1-5);
2830
2830
  }
2831
2831
  .NativeSelect_select--multiple {
2832
2832
  padding-right: 0;
@@ -2842,6 +2842,119 @@
2842
2842
  pointer-events: none;
2843
2843
  }
2844
2844
 
2845
+ /* src/components/PhoneInput/PhoneInput.module.css */
2846
+ .PhoneInput_inputs-container {
2847
+ display: flex;
2848
+ flex-direction: row;
2849
+ .PhoneInput_input {
2850
+ border-top-left-radius: 0;
2851
+ border-bottom-left-radius: 0;
2852
+ width: var(--dds-phone-input-width);
2853
+ }
2854
+ .PhoneInput_select {
2855
+ width: 8rem;
2856
+ border-top-right-radius: 0;
2857
+ border-bottom-right-radius: 0;
2858
+ margin-right: -1px;
2859
+ }
2860
+ .PhoneInput_select--tiny {
2861
+ width: 5rem;
2862
+ }
2863
+ }
2864
+ .PhoneInput_inputs-container--small-screen-xs {
2865
+ @media only screen and (max-width: 600px) {
2866
+ flex-direction: column;
2867
+ width: var(--dds-phone-input-width);
2868
+ .PhoneInput_input {
2869
+ border-top-left-radius: 0;
2870
+ border-top-right-radius: 0;
2871
+ width: 100%;
2872
+ }
2873
+ .PhoneInput_select {
2874
+ border-bottom-left-radius: 0;
2875
+ border-bottom-right-radius: 0;
2876
+ width: 100%;
2877
+ margin-bottom: -1px;
2878
+ }
2879
+ }
2880
+ }
2881
+ .PhoneInput_inputs-container--small-screen-sm {
2882
+ @media only screen and (max-width: 960px) {
2883
+ flex-direction: column;
2884
+ width: var(--dds-phone-input-width);
2885
+ .PhoneInput_input {
2886
+ border-top-left-radius: 0;
2887
+ border-top-right-radius: 0;
2888
+ width: 100%;
2889
+ }
2890
+ .PhoneInput_select {
2891
+ border-bottom-left-radius: 0;
2892
+ border-bottom-right-radius: 0;
2893
+ width: 100%;
2894
+ margin-bottom: -1px;
2895
+ }
2896
+ }
2897
+ }
2898
+ .PhoneInput_inputs-container--small-screen-md {
2899
+ @media only screen and (max-width: 1280px) {
2900
+ flex-direction: column;
2901
+ width: var(--dds-phone-input-width);
2902
+ .PhoneInput_input {
2903
+ border-top-left-radius: 0;
2904
+ border-top-right-radius: 0;
2905
+ width: 100%;
2906
+ }
2907
+ .PhoneInput_select {
2908
+ border-bottom-left-radius: 0;
2909
+ border-bottom-right-radius: 0;
2910
+ width: 100%;
2911
+ margin-bottom: -1px;
2912
+ }
2913
+ }
2914
+ }
2915
+ .PhoneInput_inputs-container--small-screen-lg {
2916
+ @media only screen and (max-width: 1920px) {
2917
+ flex-direction: column;
2918
+ width: var(--dds-phone-input-width);
2919
+ .PhoneInput_input {
2920
+ border-top-left-radius: 0;
2921
+ border-top-right-radius: 0;
2922
+ width: 100%;
2923
+ }
2924
+ .PhoneInput_select {
2925
+ border-bottom-left-radius: 0;
2926
+ border-bottom-right-radius: 0;
2927
+ width: 100%;
2928
+ margin-bottom: -1px;
2929
+ }
2930
+ }
2931
+ }
2932
+ .PhoneInput_inputs-container--small-screen-xl {
2933
+ flex-direction: column;
2934
+ width: var(--dds-phone-input-width);
2935
+ .PhoneInput_input {
2936
+ border-top-left-radius: 0;
2937
+ border-top-right-radius: 0;
2938
+ width: 100%;
2939
+ }
2940
+ .PhoneInput_select {
2941
+ border-bottom-left-radius: 0;
2942
+ border-bottom-right-radius: 0;
2943
+ width: 100%;
2944
+ margin-bottom: -1px;
2945
+ }
2946
+ }
2947
+ .PhoneInput_select:focus-visible,
2948
+ .PhoneInput_select:hover {
2949
+ z-index: 1;
2950
+ & ~ svg {
2951
+ z-index: 1;
2952
+ }
2953
+ }
2954
+ .PhoneInput_calling-code {
2955
+ left: var(--dds-spacing-x0-5);
2956
+ }
2957
+
2845
2958
  /* src/components/Popover/Popover.module.css */
2846
2959
  .Popover_container {
2847
2960
  position: absolute;