...
CSS Stylesheet |
---|
/* Style the feedback div. TODO: Make this responsive */ #feedback { font-family: Arial,Helvetica,sans-serif,Verdana; width:500px; margin-top:0px; padding-top:0px; padding-bottom:100px; } /* Style the Yes and No options and images */ .yes { font-weight:bold; float:left; padding-top:10px; vertical-align:middle; } .yes img, .no img { vertical-align:middle; padding-left:10px; padding-right:10px; padding-bottom:10px; padding-top:10px; height: 40px; } .no { font-weight:bold; float:right; vertical-align:middle; margin-right:250px; padding-top:10px; } /* Style the div containing the checkboxes and comments field */ .moreinfo { display:none; margin-top:120px; line-height:10px; } p.moreinfo { padding-top:10px; } /* Style the confirmation message when a user submits the form */ #submitted { display:none; border: 1px solid #7FBA00; background-color: #ECF5D9; position:relative; margin-top:120px; height:70px; width:104%; } #submitted img { vertical-align:middle; padding:20px; height:35px; } /* Comments heading */ #commentsHeading { display:none; padding-bottom:10px; margin-top:10px; } /* Style the comment box */ textarea#comments { width:100%; height:100px; vertical-align:top; border: #5E2080 2px solid; font-family: Arial,Helvetica,sans-serif,Verdana; font-size: 11pt; display:none; } /* Style the positive comment box */ #positiveComments { width:100%; height:100px; vertical-align:top; border: #5E2080 2px solid; font-family: Arial,Helvetica,sans-serif,Verdana; font-size: 11pt; } #positiveCommentsHeading { margin-top:100px; padding-bottom:10px; } /* Remove the resizing option from the comments text area */ textarea#comments { resize: none; padding:10px; } textarea#positiveComments { resize: none; padding:10px; } #supportText { font-size:11pt; margin-right:-50px; padding-bottom:20px; color: #888; display:none; } #positiveCommentText { font-size:11pt; margin-right:-50px; padding-bottom:20px; color: #888; } #inlineSupportInfo { display:none; margin-left:28px; padding-bottom:20px; line-height:20px; color:#888; margin-top:-5px; } #inlineSupportInfo a { color:#5E2080; } #inlineMoreHelpInfo { display:none; margin-left:28px; padding-bottom:20px; line-height:20px; color:#888; margin-top:-5px; } #inlineMoreHelpInfo a { color:#5E2080; } /* Style the checkbox list */ #feedback input[type=checkbox] { display:none; } #feedback input[type=checkbox] + label:before { content: ""; display: inline-block; width: 18px; height: 18px; vertical-align:middle; margin-right: 8px; background-color: #fff; border: #5E2080 2px solid; border-radius: 100px; margin-top:0px; margin-bottom:0px; } #feedback input[type=checkbox]:checked + label:before { content:"\2714"; color:white; background-color: #5E2080; text-align:center; line-height:18px; } /* Style the checkbox labels */ label { display:block; vertical-align:middle; } /* Style the Submit button and its various states (including disabled). */ /* TODO: Set up a subclass of button to use here instead */ button { background: #5E2080; border-top: 1px solid #5E2080; border-right: 1px solid #5E2080; border-bottom: 1px solid #5E2080; border-left: 1px solid #5E2080; border-radius:30px; padding: 10px 32px; vertical-align:middle; color:#fff; float:right; font-family: Arial,Helvetica,sans-serif,Verdana; font-weight:bold; font-size: 11pt; margin-right:-25px; } button:hover { background: #4D1A6B; border-top: 2px solid #4D1A6B; border-right: 2px solid #4D1A6B; border-bottom: 2px solid #4D1A6B; border-left: 2px solid #4D1A6B; cursor: pointer; } button:active { background: #4D1A6B; border-top: 2px solid #4D1A6B; border-right: 2px solid #4D1A6B; border-bottom: 2px solid #4D1A6B; border-left: 2px solid #4D1A6B; cursor: pointer; } input#searchTerm{ line-height:15px; font-size: 11pt; height:15px; width:200px; margin-left:-5px; margin-top:10px; padding:10px; } #searchButton { margin-left: 10px; cursor: pointer; font-size: 14pt; } #positiveFeedback { display:none; } button[disabled], button[disabled]:hover, button[disabled]:active { background: #ddd; border-top: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; border-left: 1px solid #ddd; color: #8f8f8f; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; } #basicModalContent { display:none; } #simplemodal-overlay { background-color:#000; } #simplemodal-container { background-color:#fff; border:1px solid #444; border-radius:3px; padding:20px; } #simplemodal-container a.modalCloseImg { background:url(http://help.myob.com/images/close.png) no-repeat; /* adjust url as required */ width:32px; height:32px; display:inline; z-index:3200; position:absolute; top:10px; right:10px; cursor:pointer; opacity:0.3; } .answerButton { width:120px; background-color:white; color:#5E2080; padding:10px; border-radius:5px; border: 1px solid gray; cursor: pointer; /* box-shadow:2px 2px #888; */ font-size:14px; font-family:Arial, sans-serif; margin-top:20px; } .answerSpacer { width:120px; } .answerButton:hover { background-color:#eee; } .selectedAnswer { background-color:#5E2080!important; color:white!important; } .questionContainer { display:flex; justify-content:space-between; color:white; text-align:center; } .textAnswer { padding:10px; border-radius:3px; border: 1px solid gray; width:80% } .extraText { display:none; padding-top:20px; } #submitSurveyButton { border-radius:5px; font-size:13pt; cursor:pointer; border:1px solid #5fa52c; background-color: #5fa52c; position:absolute; bottom:20px!important; right:0; } #submitSurveyButton:active { background-color: #5fa52c; } #submitSurveyButton:hover { } #submitSurveyButton:disabled { background-color:##5fa52c; border:1px solid #47831c; cursor: not-allowed; opacity:0.65; } .questionText { margin-top:30px!important; } #thankyouMessage { display:none; } #closeAfterSubmitButton { border-radius:5px; font-size:13pt; cursor:pointer; border:1px solid #5fa52c; background-color: #5fa52c; position:absolute; bottom:20px!important; right:0; } #q1 { margin-top:-5px; } |
HTML |
---|
<div style="display:none;" data-swiftype-name="siteSection" data-swiftype-type="enum">help</div> <div style="display:none;" data-swiftype-name="businessType" data-swiftype-type="enum">Small Business</div> <div style="display: none;" data-swiftype-name="productFamily" data-swiftype-type="enum">MYOB Essentials</div> <div style="display: none;" data-swiftype-name="productFamily" data-swiftype-type="enum">AccountRight</div> <div style="display: none;" data-swiftype-name="productVersion" data-swiftype-type="enum">AccountRight 2017</div> <div style="display: none;" data-swiftype-name="country" data-swiftype-type="enum">Australia</div> <div style="display: none;" data-swiftype-name="country" data-swiftype-type="enum">New Zealand</div> |
...