@@ -861,178 +861,173 @@ html {
861
861
}
862
862
863
863
@media only screen and (width <= 800px ) {
864
- & :not ([no-rdm ]) {
865
- flex-direction : column ;
866
- min-height : $small-main-section-height + $small-secondary-section-height ;
864
+ flex-direction : column ;
865
+ min-height : $small-main-section-height + $small-secondary-section-height ;
867
866
868
- & ::before {
869
- width : $split-section-width ;
870
- }
867
+ & ::before {
868
+ width : $split-section-width ;
869
+ }
871
870
872
- .section-secondary ,
873
- .section-main {
874
- width : $split-section-width ;
875
- }
871
+ .section-secondary ,
872
+ .section-main {
873
+ width : $split-section-width ;
874
+ }
876
875
877
- .section-secondary {
878
- --mr-secondary-background-position-y : top ;
879
- --mr-secondary-position : center var (--mr-secondary-background-position-y ) / 75% ;
876
+ .section-secondary {
877
+ --mr-secondary-background-position-y : top ;
878
+ --mr-secondary-position : center var (--mr-secondary-background-position-y ) / 75% ;
880
879
881
- border-radius : 8px 8px 0 0 ;
882
- margin : auto auto 0 ;
883
- height : $small-secondary-section-height ;
880
+ border-radius : 8px 8px 0 0 ;
881
+ margin : auto auto 0 ;
882
+ height : $small-secondary-section-height ;
884
883
885
- .hero-image img {
886
- margin : 6px 0 ;
887
- }
884
+ .hero-image img {
885
+ margin : 6px 0 ;
886
+ }
888
887
889
- .message-text {
890
- margin-inline : auto ;
891
- }
888
+ .message-text {
889
+ margin-inline : auto ;
890
+ }
892
891
893
- h1 {
894
- font-size : 35px ;
895
- text-align : center ;
896
- white-space : normal ;
897
- margin-inline : auto ;
898
- margin-block : 14px 6px ;
899
- }
892
+ h1 {
893
+ font-size : 35px ;
894
+ text-align : center ;
895
+ white-space : normal ;
896
+ margin-inline : auto ;
897
+ margin-block : 14px 6px ;
898
+ }
900
899
901
- & :dir (rtl ) {
902
- margin : auto auto 0 ;
903
- border-radius : 8px 8px 0 0 ;
904
- }
900
+ & :dir (rtl ) {
901
+ margin : auto auto 0 ;
902
+ border-radius : 8px 8px 0 0 ;
903
+ }
905
904
906
- & .with-secondary-section-hidden {
907
- display : none ;
908
- }
905
+ & .with-secondary-section-hidden {
906
+ display : none ;
909
907
}
908
+ }
910
909
911
- migration-wizard {
912
- & ::part (deck ){
913
- min-width : 330px ;
914
- margin-inline : 36px ;
915
- }
910
+ migration-wizard {
911
+ & ::part (deck ){
912
+ min-width : 330px ;
913
+ margin-inline : 36px ;
916
914
}
915
+ }
917
916
918
- .section-main {
919
- margin : 0 auto auto ;
920
- height : $small-main-section-height ;
917
+ .section-main {
918
+ margin : 0 auto auto ;
919
+ height : $small-main-section-height ;
921
920
922
- migration-wizard ::part (buttons ) {
923
- flex-direction : column ;
924
- margin-inline : 46px ;
925
- }
921
+ migration-wizard ::part (buttons ) {
922
+ flex-direction : column ;
923
+ margin-inline : 46px ;
924
+ }
925
+
926
+ & [hide-secondary-section = ' responsive' ] {
927
+ height : $split-screen-height ;
928
+ margin : auto ;
926
929
927
- & [hide-secondary-section = ' responsive' ] {
928
- height : $split-screen-height ;
930
+ & :dir (rtl ) {
929
931
margin : auto ;
932
+ }
930
933
931
- & :dir ( rtl ) {
932
- margin : auto ;
933
- }
934
+ .main-content {
935
+ padding : 50 px 0 0 ;
936
+ border-radius : 8 px ;
934
937
935
- .main-content {
936
- padding : 50px 0 0 ;
938
+ & :dir (rtl ) {
937
939
border-radius : 8px ;
938
-
939
- & :dir (rtl ) {
940
- border-radius : 8px ;
941
- }
942
940
}
943
941
}
942
+ }
944
943
945
- .main-content {
946
- border-radius : 0 0 8px 8px ;
947
- padding : 30px 0 0 ;
944
+ .main-content {
945
+ border-radius : 0 0 8px 8px ;
946
+ padding : 30px 0 0 ;
948
947
949
- .main-content-inner {
950
- align-items : center ;
951
- }
948
+ .main-content-inner {
949
+ align-items : center ;
950
+ }
952
951
953
- .logo-container {
954
- text-align : center ;
952
+ .logo-container {
953
+ text-align : center ;
955
954
956
- .brand-logo {
957
- min-height : 25px ;
955
+ .brand-logo {
956
+ min-height : 25px ;
958
957
959
- & ,
960
- & :dir (rtl ) {
961
- background-position : center ;
962
- }
958
+ & ,
959
+ & :dir (rtl ) {
960
+ background-position : center ;
963
961
}
962
+ }
964
963
965
- .logo-alt {
966
- width : inherit ;
967
- height : inherit ;
968
- }
964
+ .logo-alt {
965
+ width : inherit ;
966
+ height : inherit ;
969
967
}
968
+ }
970
969
971
- .welcome-text {
972
- align-items : center ;
973
- text-align : center ;
974
- margin-inline : 0 ;
975
- padding-inline : 30px ;
970
+ .welcome-text {
971
+ align-items : center ;
972
+ text-align : center ;
973
+ margin-inline : 0 ;
974
+ padding-inline : 30px ;
976
975
977
- .spacer-bottom ,
978
- .spacer-top {
979
- display : none ;
980
- }
976
+ .spacer-bottom ,
977
+ .spacer-top {
978
+ display : none ;
981
979
}
980
+ }
982
981
983
- .action-buttons {
984
- text-align : center ;
985
-
986
- .checkbox-container {
987
- display : none ;
988
- }
982
+ .action-buttons {
983
+ text-align : center ;
989
984
990
- .secondary-cta {
991
- position : relative ;
992
- margin-block : 10px 0 ;
993
- bottom : 0 ;
994
- }
985
+ .checkbox-container {
986
+ display : none ;
995
987
}
996
988
997
- .primary ,
998
- .secondary {
999
- min-width : 240 px ;
1000
- margin-inline : 0 ;
989
+ .secondary-cta {
990
+ position : relative ;
991
+ margin-block : 10 px 0 ;
992
+ bottom : 0 ;
1001
993
}
994
+ }
1002
995
1003
- .steps {
1004
- padding-block : 0 ;
1005
- margin : 0 ;
1006
-
1007
- & .progress-bar {
1008
- margin-inline : 0 ;
1009
- }
1010
- }
996
+ .primary ,
997
+ .secondary {
998
+ min-width : 240px ;
999
+ margin-inline : 0 ;
1011
1000
}
1012
1001
1013
- .additional-cta {
1014
- & .cta-link {
1015
- align-self : center ;
1002
+ .steps {
1003
+ padding-block : 0 ;
1004
+ margin : 0 ;
1005
+
1006
+ & .progress-bar {
1007
+ margin-inline : 0 ;
1016
1008
}
1017
1009
}
1010
+ }
1018
1011
1019
- .dismiss-button {
1020
- top : - $small-secondary-section-height ;
1012
+ .additional-cta {
1013
+ & .cta-link {
1014
+ align-self : center ;
1021
1015
}
1016
+ }
1022
1017
1023
- & :dir (rtl ) {
1024
- margin : 0 auto auto ;
1018
+ .dismiss-button {
1019
+ top : - $small-secondary-section-height ;
1020
+ }
1025
1021
1026
- .main-content {
1027
- border-radius : 0 0 8px 8px ;
1028
- }
1022
+ & :dir (rtl ) {
1023
+ margin : 0 auto auto ;
1024
+
1025
+ .main-content {
1026
+ border-radius : 0 0 8px 8px ;
1029
1027
}
1030
1028
}
1031
1029
}
1032
1030
1033
- & [no-rdm ] {
1034
- width : 800px ;
1035
- }
1036
1031
}
1037
1032
1038
1033
@media only screen and (height <= 650px ) {
@@ -1805,7 +1800,7 @@ html {
1805
1800
.screen :not (.dialog-initial ) {
1806
1801
.tiles-theme-section ,
1807
1802
.multi-select-container
1808
- {
1803
+ {
1809
1804
transition-delay : 0.2s ;
1810
1805
}
1811
1806
0 commit comments