Snippets

MeS NA MeS PayHere css examples

Created by MeS NA
View revision

File default_mobile.css Added

  • Ignore whitespace
  • Hide word diff 
+
+#merchantLogoBox, #mesLogoBox, #verisignLogoBox, #pageFooter, 
+#paymentForm, #paymentReceipt, #printReceipt, #formHeader, #formMessage, 
+#receiptHeader, #formContent, #receiptContent, #formButton, #processingMessage {
+  margin-left:   auto;
+  margin-right:  auto;
+  text-align:    center;
+  width:         600px;
+}
+
+#formMessage {
+  border-top:    #2A3178 2px solid;
+  border-left:   #2A3178 2px solid;
+  border-right:  #2A3178 2px solid;
+  border-bottom: #2A3178 2px solid;
+  margin-top:    8px;
+}
+.errorMessage {
+  font-family:  Arial, Helvetica, sans-serif;
+  font-size:     10pt;
+  font-weight:   bold;
+  color:         red;
+}
+
+#printReceipt {
+  background-color: #ffffff;
+  padding:       10 10 30 10;
+}
+
+#merchantLogoBox img {
+  max-height:    185px;
+  max-width:     600px;
+}
+
+#pageFooter img {
+  max-height:    100px;
+  max-width:     600px;
+}
+
+#formHeader, #receiptHeader {
+  display:       table;
+  background-color: orange;
+}
+
+#formSectionHeader, #formFooter, #receiptSectionHeader, 
+#printSectionHeader, #billingExplaination {
+  margin-left:   auto;
+  margin-right:  auto;
+  margin-top:    5px;
+  text-align:    center;
+  width:         600px;
+  background-color: #DDDFE3;
+}
+
+#billingExplaination {
+  text-align:    center;
+}
+
+#cvvHelp {
+  float:         left;
+  padding:       2px 0 0 2px;
+  width:         auto;
+}
+
+#formButton {
+  margin-top:    25px;
+  margin-bottom: 10px;
+}
+
+#submitMessage {
+  text-align:    center;
+}
+
+#submitBtn, #returnBtn {
+  float:         left;
+  margin:        0 2px 0 0;
+  text-align:    right;
+  width:         50%;
+}
+
+#cancelBtn, #printBtn {
+  text-align:    left;
+}
+
+#ccLogoBox {
+  float:         right;
+  margin:        3px 0 0 0;
+  text-align:    left;
+  width:         354px;
+}
+
+#printReceiptHeader, #printReceiptFooter {
+  width:         500px;
+  font-size:     9pt;
+  font-family:   verdana, helvetica, sans-serif;
+  text-align:    left;
+  margin:        8px auto;
+}
+
+#printReceiptLogo {
+  width:         500px;
+  margin-left:   auto;
+  margin-right:  auto;
+  text-align:    center;
+}
+
+.formHeaderContent, .receiptHeaderContent {
+  color:         blue;
+  font-family:   Verdana,Tahoma,Arial;
+  font-size:     12pt;
+  font-weight:   bold;
+  text-align:    center;
+}
+
+.formSectionTitle, .receiptSectionTitle {
+  background-color: #8DA8C3;
+  color:         #FFFFFF;
+  border-color:  #FFFFFF;
+  border-style:  solid;
+  border-width:  1px;
+  font-family:   verdana,helvetica,sans-serif;
+  font-size:     8pt;
+  font-weight:   bold;
+  height:        18px;
+  line-height:   18px;
+}
+
+.printSectionTitle {
+  background-color: #ffffff;
+  color:         #000000;
+  font-weight:   bold;
+  font-size:     8pt;
+  border-style:  solid;
+  border-width:  1px;
+  font-family:   verdana,helvetica,sans-serif;
+  height:        18px;
+  line-height:   18px;
+}
+
+.fieldLabel, .receiptFieldLabel {
+  float:         left;
+  font-family:   Verdana,Tahoma,Arial;
+  font-size:     8pt;
+  padding-top:   5px;
+  text-align:    right;
+  width:         240px;
+}
+
+.fieldData, .receiptFieldData {
+  float:         left;
+  font-family:   Verdana,Tahoma,Arial;
+  font-size:     8pt;
+  padding-top:   4px;
+  padding-left:  6px;
+  text-align:    left;
+}
+
+.formField {
+    font-family: Verdana,Tahoma,Arial;
+    font-size:   8pt;
+}
+
+.formText {
+    float:       left;
+    font-family: Verdana,Tahoma,Arial;
+    font-size:   7pt;
+    padding:     4px 0 0;
+    text-align:  left;
+}
+
+.smallText { 
+    font-family: Arial, Helvetica, sans-serif;
+    font-size:   7pt;
+    line-height: 9pt;
+    color:       #777777;
+    text-align:  left;
+}
+
+.buttonText {
+  font-family:   Verdana,Tahoma,Arial;
+  font-size:     8pt;
+  text-align:    center;
+}
+
+.errorText {
+  font-family:   Arial, Helvetica, sans-serif;
+  font-size:     9pt;
+  line-height:   18pt;
+}
+
+.messageText {
+  font-family:   Arial, Helvetica, sans-serif;
+  font-size:     9pt;
+  font-weight:   bold;
+}
+
+@media only screen and (max-width: 800px) {
+  #paymentForm, #paymentReceipt, #formHeader, #receiptHeader, #mesLogoBox, 
+  #merchantLogoBox, #verisignLogoBox, #pageFooter, #formMessage {
+    width: 97%;
+  }
+  
+  #formContent, #receiptContent, #formSectionHeader, #receiptSectionHeader, 
+  #formFooter, #formButton, #submitBtn, #returnBtn, #cancelBtn, processingMessage,
+  #printBtn, .buttonText {
+    width: 100%;
+  }
+  
+  #printSectionHeader {
+    width: 90%;
+  }
+  
+  #merchantLogoBox img {
+    max-width: 97%;
+    max-height: 80px;
+  }
+  
+  #verisignLogoBox img, #mesLogoBox img, #pageFooter img {
+    max-width: 97%; 
+    max-height: 40px;
+  }
+  
+  #formButton { 
+    margin-top: 5px; 
+    margin-bottom: 5px;
+  }
+  
+  #cvvHelp, #billingExplaination, #formFooter {
+    display: none;
+  }
+  
+  #submitBtn, #returnBtn, #cancelBtn, #printBtn { 
+    float: none; 
+    margin-bottom: 3px;
+  }
+  
+  #formMessage { 
+    border-width: 1px; 
+    margin-top: 4px; 
+  }
+  
+  #ccLogoBox {
+     width: 66%;
+     margin-right: -6px;
+   }
+  
+  .errorMessage { 
+    font-size: 8pt; 
+  }
+  
+  .errorText { 
+    font-size: 7pt; 
+    line-height: 10pt; 
+  }
+  
+  .formHeaderContent, .receiptHeaderContent { 
+    font-size: 8pt; 
+  }
+  
+  .formField, .buttonText, .fieldLabel, .fieldData, 
+  .receiptFieldLabel, .receiptFieldData, .messageText { 
+    font-size: 7pt; 
+  }
+  
+  .buttonText { 
+    height: 22px;
+  }
+  
+  .fieldLabel { 
+    width: 34%; 
+  }
+  
+  .receiptFieldLabel { 
+    width: 45%;
+  }
+}

File default_web.css Added

  • Ignore whitespace
  • Hide word diff 
+
+#merchantLogoBox, #mesLogoBox, #verisignLogoBox, #pageFooter, 
+#paymentForm, #paymentReceipt, #printReceipt, #formHeader, #formMessage, 
+#receiptHeader, #formContent, #receiptContent, #formButton, #processingMessage {
+  margin-left:   auto;
+  margin-right:  auto;
+  text-align:    center;
+  width:         600px;
+}
+
+#formMessage {
+  border-top:    #2A3178 2px solid;
+  border-left:   #2A3178 2px solid;
+  border-right:  #2A3178 2px solid;
+  border-bottom: #2A3178 2px solid;
+  margin-top:    8px;
+}
+.errorMessage {
+  font-family:  Arial, Helvetica, sans-serif;
+  font-size:     10pt;
+  font-weight:   bold;
+  color:         red;
+}
+
+#printReceipt {
+  background-color: #ffffff;
+  padding:       10 10 30 10;
+}
+
+#merchantLogoBox img {
+  max-height:    185px;
+  max-width:     600px;
+}
+
+#pageFooter img {
+  max-height:    100px;
+  max-width:     600px;
+}
+
+#formHeader, #receiptHeader {
+  display:       table;
+  background-color: orange;
+}
+
+#formSectionHeader, #formFooter, #receiptSectionHeader, 
+#printSectionHeader, #billingExplaination {
+  margin-left:   auto;
+  margin-right:  auto;
+  margin-top:    5px;
+  text-align:    center;
+  width:         600px;
+  background-color: #DDDFE3;
+}
+
+#billingExplaination {
+  text-align:    center;
+}
+
+#cvvHelp {
+  float:         left;
+  padding:       2px 0 0 2px;
+  width:         auto;
+}
+
+#formButton {
+  margin-top:    25px;
+  margin-bottom: 10px;
+}
+
+#submitMessage {
+  text-align:    center;
+}
+
+#submitBtn, #returnBtn {
+  float:         left;
+  margin:        0 2px 0 0;
+  text-align:    right;
+  width:         50%;
+}
+
+#cancelBtn, #printBtn {
+  text-align:    left;
+}
+
+#ccLogoBox {
+  float:         right;
+  margin:        3px 0 0 0;
+  text-align:    left;
+  width:         354px;
+}
+
+#printReceiptHeader, #printReceiptFooter {
+  width:         500px;
+  font-size:     9pt;
+  font-family:   verdana, helvetica, sans-serif;
+  text-align:    left;
+  margin:        8px auto;
+}
+
+#printReceiptLogo {
+  width:         500px;
+  margin-left:   auto;
+  margin-right:  auto;
+  text-align:    center;
+}
+
+.formHeaderContent, .receiptHeaderContent {
+  color:         blue;
+  font-family:   Verdana,Tahoma,Arial;
+  font-size:     12pt;
+  font-weight:   bold;
+  text-align:    center;
+}
+
+.formSectionTitle, .receiptSectionTitle {
+  background-color: #8DA8C3;
+  color:         #FFFFFF;
+  border-color:  #FFFFFF;
+  border-style:  solid;
+  border-width:  1px;
+  font-family:   verdana,helvetica,sans-serif;
+  font-size:     8pt;
+  font-weight:   bold;
+  height:        18px;
+  line-height:   18px;
+}
+
+.printSectionTitle {
+  background-color: #ffffff;
+  color:         #000000;
+  font-weight:   bold;
+  font-size:     8pt;
+  border-style:  solid;
+  border-width:  1px;
+  font-family:   verdana,helvetica,sans-serif;
+  height:        18px;
+  line-height:   18px;
+}
+
+.fieldLabel, .receiptFieldLabel {
+  float:         left;
+  font-family:   Verdana,Tahoma,Arial;
+  font-size:     8pt;
+  padding-top:   5px;
+  text-align:    right;
+  width:         240px;
+}
+
+.fieldData, .receiptFieldData {
+  float:         left;
+  font-family:   Verdana,Tahoma,Arial;
+  font-size:     8pt;
+  padding-top:   4px;
+  padding-left:  6px;
+  text-align:    left;
+}
+
+.formField {
+    font-family: Verdana,Tahoma,Arial;
+    font-size:   8pt;
+}
+
+.formText {
+    float:       left;
+    font-family: Verdana,Tahoma,Arial;
+    font-size:   7pt;
+    padding:     4px 0 0;
+    text-align:  left;
+}
+
+.smallText { 
+    font-family: Arial, Helvetica, sans-serif;
+    font-size:   7pt;
+    line-height: 9pt;
+    color:       #777777;
+    text-align:  left;
+}
+
+.buttonText {
+  font-family:   Verdana,Tahoma,Arial;
+  font-size:     8pt;
+  text-align:    center;
+}
+
+.errorText {
+  font-family:   Arial, Helvetica, sans-serif;
+  font-size:     9pt;
+  line-height:   18pt;
+}
+
+.messageText {
+  font-family:   Arial, Helvetica, sans-serif;
+  font-size:     9pt;
+  font-weight:   bold;
+}
HTTPS SSH

You can clone a snippet to your computer for local editing. Learn more.