sendmodal.module.scss
1 // sendmodal.module.scss 2 3 $primary-color: #012060; 4 .DialogOverlay { 5 background-color: rgba(0, 0, 0, 0.5); 6 position: fixed; 7 top: 0; 8 left: 0; 9 right: 0; 10 bottom: 0; 11 } 12 .DialogContent { 13 background-color: white; 14 padding: 30px; 15 border-radius: 10px; 16 box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); 17 width: 90%; 18 max-width: 500px; 19 position: fixed; 20 top: 50%; 21 left: 50%; 22 transform: translate(-50%, -50%); 23 z-index: 1001; 24 text-align: left; 25 } 26 27 .DialogCloseButton { 28 background: none; 29 border: none; 30 cursor: pointer; 31 color: $primary-color; 32 position: absolute; 33 top: 15px; 34 right: 15px; 35 } 36 37 .DialogTitle { 38 font-size: 24px; 39 font-weight: bold; 40 margin-bottom: 20px; 41 color: $primary-color; 42 text-align: center; 43 } 44 45 .SendModalLabel { 46 font-size: 16px; 47 font-weight: bold; 48 margin-bottom: 10px; 49 display: block; 50 text-align: left; 51 } 52 53 .SendModalInput { 54 padding: 10px; 55 width: 100%; 56 border: 2px solid $primary-color; 57 border-radius: 5px; 58 margin-bottom: 15px; 59 } 60 61 .AddressContainer { 62 display: flex; 63 align-items: center; 64 justify-content: left; 65 margin-top: 10px; 66 margin-bottom: 10px; 67 } 68 69 .AddressLabel { 70 font-size: 16px; 71 margin-right: 5px; 72 font-weight: bold; 73 } 74 75 .AddressValue { 76 font-size: 16px; 77 font-weight: normal; 78 } 79 80 .ButtonContainer { 81 display: flex; 82 justify-content: flex-end; 83 margin-top: 20px; 84 } 85 86 .Button { 87 cursor: pointer; 88 padding: 12px; 89 font-size: 16px; 90 border-radius: 5px; 91 width: auto; 92 margin-left: 10px; 93 } 94 95 .SendModalCancelButton { 96 background-color: white; 97 color: $primary-color; 98 border: 2px solid $primary-color; 99 } 100 101 .SendModalNextButton { 102 background-color: $primary-color; 103 color: white; 104 border: none; 105 }