Commit 8896922020ca8943ef6ac26a25219c2c7e5a0911

Authored by ykxie
1 parent fe3f1362

add single style

src/css/mobile-single.css 0 → 100644
  1 +@media screen and (max-width: 768px) {
  2 + .full {
  3 + display: none; }
  4 + #previewpanel .nav-tabs > li > a {
  5 + padding: 4px 18px !important; } }
src/css/mobile.css
@@ -81,4 +81,8 @@ @@ -81,4 +81,8 @@
81 left: 50%; 81 left: 50%;
82 transform: translate(-50%, -50%); } 82 transform: translate(-50%, -50%); }
83 .ladda-button[data-style=expand-right][data-loading] { 83 .ladda-button[data-style=expand-right][data-loading] {
84 - padding-right: 0 !important; } } 84 + padding-right: 0 !important; }
  85 + .player_volume_wrapper {
  86 + display: none; }
  87 + .full {
  88 + display: none; } }
src/js/gbreplayer.js
@@ -414,8 +414,8 @@ $(function(){ @@ -414,8 +414,8 @@ $(function(){
414 compileMode(langid); 414 compileMode(langid);
415 console.log(coderecords); 415 console.log(coderecords);
416 $("#play_audio").attr('src', "http://gxb-file.oss-cn-beijing.aliyuncs.com" + coderecords.audioUrl); 416 $("#play_audio").attr('src', "http://gxb-file.oss-cn-beijing.aliyuncs.com" + coderecords.audioUrl);
417 - if (_languageid == 35) {  
418 - $('#cmprun-tabs').hide(); 417 + if (_languageid != 35) {
  418 + $('#cmprun-tabs').show();
419 } 419 }
420 if (_role ==0) { 420 if (_role ==0) {
421 player.init({ 421 player.init({
@@ -1239,7 +1239,7 @@ $(function(){ @@ -1239,7 +1239,7 @@ $(function(){
1239 $("#resultpanel").height($(window).height() - $resultpanel.top - 16 - 34); 1239 $("#resultpanel").height($(window).height() - $resultpanel.top - 16 - 34);
1240 $(".CodeMirror").height($(window).height() - $recordpanel.top - 288); 1240 $(".CodeMirror").height($(window).height() - $recordpanel.top - 288);
1241 } 1241 }
1242 - $('#resultoutput').find('.tab-content').height($(window).height() - $resultoutput.top - 164).css({'overflow-y': "scroll"}) 1242 + $('#resultoutput').find('.tab-content').height($(window).height() - $resultoutput.top - 40).css({'overflow': "auto"})
1243 1243
1244 /*保证编辑器都尺寸自动变化(包括滚动条)*/ 1244 /*保证编辑器都尺寸自动变化(包括滚动条)*/
1245 if(typeof GBCodePlayBack.htmleditor !=='undefined'&&typeof GBCodePlayBack.csseditor!=='undefined'&&typeof GBCodePlayBack.jseditor!=='undefined'){ 1245 if(typeof GBCodePlayBack.htmleditor !=='undefined'&&typeof GBCodePlayBack.csseditor!=='undefined'&&typeof GBCodePlayBack.jseditor!=='undefined'){
@@ -1742,7 +1742,7 @@ $(function(){ @@ -1742,7 +1742,7 @@ $(function(){
1742 // $('#comprunbtngrp').html('<button id="runnow" type="button" data-style="expand-right" class="btn" title="运行代码">&nbsp; 运行</button>'); 1742 // $('#comprunbtngrp').html('<button id="runnow" type="button" data-style="expand-right" class="btn" title="运行代码">&nbsp; 运行</button>');
1743 }else{ 1743 }else{
1744 $('#fontendrun').addClass('hidden'); 1744 $('#fontendrun').addClass('hidden');
1745 - $('#comprunbtngrp').html('<button id="comprun" type="button" data-run="1" data-style="expand-right" class="btn comprun" title="编译并运行代码">&nbsp;编译&运行</button>'); 1745 + $('#comprunbtngrp').html('<button id="comprun" type="button" data-run="1" data-style="expand-right" class="btn comprun" title="编译并运行代码"><span class="pc">编译&运行</span><span class="m-label"><p>编译</p><p>运行</p></span></button>');
1746 1746
1747 $('#ifrcontainer').addClass('hidden'); 1747 $('#ifrcontainer').addClass('hidden');
1748 $('#cmprun-output').removeClass('hidden'); 1748 $('#cmprun-output').removeClass('hidden');
src/player.html
@@ -16,6 +16,7 @@ @@ -16,6 +16,7 @@
16 <!-- <link href="css/main.css" rel="stylesheet"> --> 16 <!-- <link href="css/main.css" rel="stylesheet"> -->
17 <link href="css/recording.css" rel="stylesheet"> 17 <link href="css/recording.css" rel="stylesheet">
18 <link rel="stylesheet" href="js/audioPlayer/theme.default.css"> 18 <link rel="stylesheet" href="js/audioPlayer/theme.default.css">
  19 + <!-- <link rel="stylesheet" href="css/mobile-single.css"> -->
19 20
20 <script> 21 <script>
21 var gxb_api = "https://restful.gaoxiaobang.com"; 22 var gxb_api = "https://restful.gaoxiaobang.com";
@@ -99,6 +100,7 @@ @@ -99,6 +100,7 @@
99 overflow: hidden; 100 overflow: hidden;
100 margin: 3px 10px !important; 101 margin: 3px 10px !important;
101 color: #fff; 102 color: #fff;
  103 + display: none;
102 } 104 }
103 #previewpanel .nav-tabs > li > a { 105 #previewpanel .nav-tabs > li > a {
104 margin-right: 0; 106 margin-right: 0;
@@ -163,6 +165,61 @@ @@ -163,6 +165,61 @@
163 background-color: #62DCF5; 165 background-color: #62DCF5;
164 transition: 1s; 166 transition: 1s;
165 } 167 }
  168 + .m-label{
  169 + display: none;
  170 + }
  171 +
  172 + @media screen and (max-width: 768px) {
  173 + p{
  174 + margin: 0;
  175 + }
  176 + .full{
  177 + display: none
  178 + }
  179 + .m-label{
  180 + display: block;
  181 + }
  182 + .pc{
  183 + display: none;
  184 + }
  185 + #previewpanel .nav-tabs > li > a{
  186 + padding: 4px 18px !important;
  187 + }
  188 + #comprunbtngrp {
  189 + height: 56px;
  190 + padding-top: 0;
  191 + position: absolute;
  192 + right: 16px;
  193 + bottom: 54px;
  194 + z-index: 9999;
  195 + }
  196 + .comprun{
  197 + position: relative;
  198 + bottom: -40px;
  199 + padding: 0;
  200 + height: 56px;
  201 + width: 56px;
  202 + border-radius: 50%;
  203 + color: #FFF;
  204 + background-image: -webkit-linear-gradient(left, #1FB6FF 0%, #62DCF5 100%);
  205 + background-image: linear-gradient(to right, #1FB6FF 0%, #62DCF5 100%);
  206 + }
  207 + .toolbar .btn{
  208 + padding: 3px 14px;
  209 + }
  210 + .toolbar #comprunbtngrp {
  211 + margin-right: 14px;
  212 + padding-top: 0;
  213 + }
  214 + .ladda-button .ladda-spinner{
  215 + top: 50%;
  216 + left: 50%;
  217 + transform: translate(-50%, -50%);
  218 + }
  219 + .player_volume_wrapper{
  220 + display: none !important;
  221 + }
  222 + }
166 </style> 223 </style>
167 </head> 224 </head>
168 <body> 225 <body>
@@ -210,7 +267,8 @@ @@ -210,7 +267,8 @@
210 <li><a href="#stderr" role="tab" data-toggle="tab" class="text">错误</a></li> 267 <li><a href="#stderr" role="tab" data-toggle="tab" class="text">错误</a></li>
211 <li><a href="#output" role="tab" data-toggle="tab" class="text">结果</a></li> 268 <li><a href="#output" role="tab" data-toggle="tab" class="text">结果</a></li>
212 </ul> 269 </ul>
213 - <div class="btn-group pull-right" id="comprunbtngrp"></div> 270 + <div class="btn-group pull-right" id="comprunbtngrp">
  271 + </div>
214 <div class="full"> 272 <div class="full">
215 <a id="full-screen" class="fb"> 273 <a id="full-screen" class="fb">
216 <img src="img/full-screen-icon.svg" alt=""> 274 <img src="img/full-screen-icon.svg" alt="">
src/scss/mobile-single.scss 0 → 100644
  1 +@media screen and (max-width: 768px) {
  2 +
  3 + .full{
  4 + display: none
  5 + }
  6 +
  7 + #previewpanel .nav-tabs > li > a{
  8 + padding: 4px 18px !important;
  9 + }
  10 +}
0 \ No newline at end of file 11 \ No newline at end of file
src/scss/mobile.scss
@@ -116,6 +116,12 @@ @@ -116,6 +116,12 @@
116 padding-right: 0 !important; 116 padding-right: 0 !important;
117 } 117 }
118 118
  119 + .player_volume_wrapper{
  120 + display: none;
  121 + }
  122 + .full{
  123 + display: none
  124 + }
119 } 125 }
120 126
121 127