m52mxtq3o
/
educoder
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

新建实训end

Browse Source
chromesetting
杨树明 6 years ago
parent 4f1da97219
commit 58f943919c
3 changed files with 204 additions and 186 deletions
Show Stats Download Patch File Download Diff File

8
public/react/src/modules/modals/Bottomsubmit.js
Unescape View File

@ -9,7 +9,9 @@ class Bottomsubmit extends Component {
} }
} }
cannelfun=()=>{
window.location.href=this.props.url
}
render() { render() {
@ -27,8 +29,8 @@ class Bottomsubmit extends Component {
</style> </style>
<div className="clearfix bor-bottom-greyE edu-back-white orderingbox newshixunbottombtn"> <div className="clearfix bor-bottom-greyE edu-back-white orderingbox newshixunbottombtn">
<div className=" edu-txt-center padding13-30"> <div className=" edu-txt-center padding13-30">
<button type="button" className="ant-btn mr20 newshixunmode backgroundFFF" ><span>取 消</span></button> <button type="button" className="ant-btn mr20 newshixunmode backgroundFFF" onClick={()=>this.cannelfun()}><span>取 消</span></button>
<button type="button" className="ant-btn newshixunmode mr40 ant-btn-primary" type="primary" htmlType="submit" onClick={this.handleSubmit}><span>确 定</span></button> <button type="button" className="ant-btn newshixunmode mr40 ant-btn-primary" type="primary" htmlType="submit" onClick={()=>this.props.onSubmits()}><span>确 定</span></button>
</div> </div>
</div> </div>
</div> </div>

378
public/react/src/modules/tpm/newshixuns/Newshixuns.js
Unescape View File

@ -4,15 +4,11 @@ import {TPMIndexHOC} from '../TPMIndexHOC';
import {SnackbarHOC} from 'educoder'; import {SnackbarHOC} from 'educoder';
import {Select, Radio, Input, Modal, Button, Form, Tooltip, Upload,Icon} from 'antd'; import {Select, Radio, Input, Modal, Button, Form, Tooltip, Upload, Icon} from 'antd';
import locale from 'antd/lib/date-picker/locale/zh_CN';
import axios from 'axios'; import axios from 'axios';
import {getUrl,getUploadActionUrl} from 'educoder'; import {getUploadActionUrl} from 'educoder';
import moment from 'moment';
import './css/Newshixuns.css'; import './css/Newshixuns.css';
@ -20,20 +16,8 @@ import TPMMDEditor from "../challengesnew/TPMMDEditor";
import Bottomsubmit from "../../modals/Bottomsubmit"; import Bottomsubmit from "../../modals/Bottomsubmit";
let path = getUrl("/editormd/lib/");
const $ = window.$;
let timeout;
let currentValue;
const Option = Select.Option; const Option = Select.Option;
const RadioGroup = Radio.Group;
const confirm = Modal.confirm;
class Newshixuns extends Component { class Newshixuns extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
@ -41,20 +25,21 @@ class Newshixuns extends Component {
this.state = { this.state = {
shixunName: undefined, shixunName: undefined,
NAME_COUNT: 60, NAME_COUNT: 60,
Radiovalue: "1", is_jupyter: "1",
newshixunlist: undefined, newshixunlist: undefined,
languagewrite:undefined, language: undefined,
systemenvironment:undefined, runtime: undefined,
testcoderunmode:undefined, run_method: undefined,
postapplyvisible:undefined postapplyvisible: undefined,
} }
} }
componentDidMount() { componentDidMount() {
this.props.form.setFieldsValue({ this.props.form.setFieldsValue({
radiogroup: `1`, is_jupyter: `1`,
}); });
let newshixunUrl = `/shixuns/new.json`; let newshixunUrl = `/shixuns/new.json`;
axios.get(newshixunUrl).then((response) => { axios.get(newshixunUrl).then((response) => {
if (response.status === 200) { if (response.status === 200) {
@ -62,10 +47,8 @@ class Newshixuns extends Component {
this.setState({ this.setState({
newshixunlist: response.data newshixunlist: response.data
}); });
this.contentMdRef.current.setValue(!response.data.sample[0][1] ? "" : response.data.sample[0][1]); this.contentMdRef.current.setValue(!response.data.sample[0][1] ? "" : response.data.sample[0][1]);
} }
} }
}).catch((error) => { }).catch((error) => {
console.log(error) console.log(error)
@ -84,7 +67,7 @@ class Newshixuns extends Component {
console.log(error) console.log(error)
}); });
// const mdContnet = this.contentMdRef.current.getValue().trim();
} }
shixunNameInput = (e) => { shixunNameInput = (e) => {
@ -103,11 +86,42 @@ class Newshixuns extends Component {
}); });
}; };
handleSubmit = e => { handleSubmit = (e) => {
e.preventDefault(); const mdContnet = this.contentMdRef.current.getValue().trim();
this.props.form.validateFieldsAndScroll((err, values) => { this.props.form.validateFieldsAndScroll((err, values) => {
if (!err) { if (!err) {
console.log('Received values of form: ', values); console.log('Received values of form: ', values);
let Url = `/api/shixuns.json`;
axios.post(Url, {
description: mdContnet,
main_type: values.main_type,
is_jupyter: values.is_jupyter === "2" ? true : false,
sub_type: values.sub_type,
shixun: {
name: values.name,
trainee: values.select,
task_pass: 1
}
}
).then((response) => {
if (response.status === 200) {
debugger
window.location.href = "/shixuns/" + response.data.shixun_identifier + "/challenges";
// window.open("/shixuns/"+response.data.shixun_identifier+"/challenges");
} else {
this.setState({
bottonloading: false
})
}
}).catch((error) => {
console.log(error)
this.setState({
bottonloading: false
})
})
} }
}); });
}; };
@ -117,15 +131,15 @@ class Newshixuns extends Component {
}); });
} }
selectleft = (value) => { main_type = (value) => {
this.props.form.setFieldsValue({ this.props.form.setFieldsValue({
selectleft: value, main_type: value,
}); });
} }
selectright=(value)=>{ sub_type = (value) => {
this.props.form.setFieldsValue({ this.props.form.setFieldsValue({
selectright: value, sub_type: value,
}); });
} }
@ -136,132 +150,106 @@ class Newshixuns extends Component {
} }
sendhideModaly = () => { sendhideModaly = () => {
this.setState({ this.setState({
postapplyvisible: false, postapplyvisible: false,
}) })
if(this.state.file !== undefined){ if (this.state.file !== undefined) {
console.log("580");
// this.deleteAttachment(this.state.file); // this.deleteAttachment(this.state.file);
this.setState({ this.setState({
file:undefined, file: undefined,
deleteisnot:true, deleteisnot: true,
languagewrite:"", language: "",
systemenvironment:"", runtime: "",
testcoderunmode:"", run_method: "",
fileList:[] fileList: []
}) })
}else { } else {
this.setState({ this.setState({
file:undefined, file: undefined,
deleteisnot:true, deleteisnot: true,
languagewrite:"", language: "",
systemenvironment:"", runtime: "",
testcoderunmode:"", run_method: "",
fileList:[] fileList: []
}) })
} }
} }
sendsure_apply = () => { sendsure_apply = () => {
let {languagewrite,systemenvironment,testcoderunmode} = this.state; let {language, runtime, run_method} = this.state;
// console.log("点击确定")
// console.log("languagewrite"+languagewrite); if (!language || language === "") {
// console.log("systemenvironment"+systemenvironment);
// console.log("testcoderunmode"+testcoderunmode);
// let attachment_ids = undefined
// if (this.state.fileList) {
// attachment_ids = this.state.fileList.map(item => {
// return item.response ? item.response.id : item.id
// })
// }
if(languagewrite === undefined || languagewrite === "" ){
// this.props.showNotification(`请填写该镜像是基于什么语言`); // this.props.showNotification(`请填写该镜像是基于什么语言`);
this.setState({ this.setState({
languagewritetype:true languagewritetype: true
}) })
return return
} }
if(systemenvironment === undefined || systemenvironment === ""){ if (!runtime || runtime === "") {
// this.props.showNotification(`请填写该镜像是基于什么语言系统环境`); // this.props.showNotification(`请填写该镜像是基于什么语言系统环境`);
this.setState({ this.setState({
systemenvironmenttype:true systemenvironmenttype: true
}) })
return; return;
} }
if(testcoderunmode === undefined || testcoderunmode === "") { if (!run_method || run_method === "") {
// this.props.showNotification(`请填写该镜像中测试代码运行方式`); // this.props.showNotification(`请填写该镜像中测试代码运行方式`);
this.setState({ this.setState({
testcoderunmodetype:true testcoderunmodetype: true
}) })
return; return;
} }
var attachment_ids=undefined;
var attachment_ids = undefined;
if (this.state.fileList) { if (this.state.fileList) {
attachment_ids = this.state.fileList.map(item => { attachment_ids = this.state.fileList.map(item => {
return item.response ? item.response.id : item.id return item.response ? item.response.id : item.id
}) })
} }
if( attachment_ids === undefined || attachment_ids.length===0){ if (attachment_ids === undefined || attachment_ids.length === 0) {
// notification.open(
// {
// message: '提示',
// description:
// '请上传附件！',
//
// }
// )
this.setState({ this.setState({
attachmentidstype:true attachmentidstype: true
}) })
return; return;
} }
// console.log("attachment_ids"+attachment_ids);
// alert(languagewrite +" "+systemenvironment +" "+testcoderunmode + " "+attachment_ids);
var data={ var data = {
language:languagewrite, language: language,
runtime:systemenvironment, runtime: runtime,
run_method:testcoderunmode, run_method: run_method,
attachment_id:attachment_ids[0], attachment_id: attachment_ids[0],
} }
var url =`/shixuns/apply_shixun_mirror.json`; var url = `/shixuns/apply_shixun_mirror.json`;
axios.post(url,data axios.post(url, data
).then((response) => { ).then((response) => {
try { try {
if (response.data) { if (response.data) {
// const { id } = response.data;
// if (id) { if (this.state.file !== undefined) {
if(this.state.file !== undefined){
console.log("549");
// this.deleteAttachment(this.state.file);
this.setState({ this.setState({
file:undefined, file: undefined,
deleteisnot:true, deleteisnot: true,
languagewrite:"", language: "",
systemenvironment:"", runtime: "",
testcoderunmode:"", run_method: "",
fileList:[] fileList: []
}) })
}else { } else {
this.setState({ this.setState({
file:undefined, file: undefined,
deleteisnot:true, deleteisnot: true,
languagewrite:"", language: "",
systemenvironment:"", runtime: "",
testcoderunmode:"", run_method: "",
fileList:[] fileList: []
}) })
} }
// this.props.showNotification('提交成功！');
notification.open( notification.open(
{ {
message: '提示', message: '提示',
@ -271,10 +259,9 @@ class Newshixuns extends Component {
} }
) )
this.sendhideModaly() this.sendhideModaly()
// this.props.history.push(`/courses/${cid}/graduation_topics`);
// }
} }
}catch (e) { } catch (e) {
} }
@ -282,19 +269,47 @@ class Newshixuns extends Component {
} }
setlanguage = (e) => {
this.setState({
language: e.target.value
})
if (e.target.value) {
this.setState({
languagewritetype: false
})
}
}
setruntime = (e) => {
this.setState({
runtime: e.target.value
})
if (e.target.value) {
this.setState({
systemenvironmenttype: false
})
}
}
setrun_method = (e) => {
this.setState({
run_method: e.target.value
})
if (e.target.value) {
this.setState({
testcoderunmodetype: false
})
}
}
render() { render() {
const {getFieldDecorator} = this.props.form; const {getFieldDecorator} = this.props.form;
const {newshixunlist,languagewrite,systemenvironment,testcoderunmode,fileList,postapplytitle,postapplyvisible} = this.state; const {newshixunlist, fileList, postapplytitle, postapplyvisible} = this.state;
const uploadProps = { const uploadProps = {
width: 600, width: 600,
fileList, fileList,
multiple: true, multiple: true,
// https://github.com/ant-design/ant-design/issues/15505 action: `${getUploadActionUrl()}`,
// showUploadList={false}，然后外部拿到 fileList 数组自行渲染列表。
// showUploadList: false,
action: `${getUploadActionUrl()}`,
onChange: this.handleChange, onChange: this.handleChange,
onRemove: this.onAttachmentRemove, onRemove: this.onAttachmentRemove,
beforeUpload: (file, fileList) => { beforeUpload: (file, fileList) => {
@ -302,10 +317,10 @@ class Newshixuns extends Component {
if (this.state.fileList.length >= 1) { if (this.state.fileList.length >= 1) {
return false return false
} }
// console.log('beforeUpload', file.name);
const isLt150M = file.size / 1024 / 1024 < 50; const isLt150M = file.size / 1024 / 1024 < 50;
if (!isLt150M) { if (!isLt150M) {
// this.props.showNotification(`文件大小必须小于50MB`);
notification.open( notification.open(
{ {
message: '提示', message: '提示',
@ -315,18 +330,15 @@ class Newshixuns extends Component {
} }
) )
} }
if(this.state.file !== undefined){ if (this.state.file !== undefined) {
console.log("763")
this.setState({ this.setState({
file:file file: file
}) })
}else { } else {
this.setState({ this.setState({
file:file file: file
}) })
} }
console.log("handleChange2");
return isLt150M; return isLt150M;
}, },
} }
@ -336,7 +348,7 @@ class Newshixuns extends Component {
<div className="educontent mt20 mb60 clearfix"> <div className="educontent mt20 mb60 clearfix">
<div className="new_shixun"> <div className="new_shixun">
<div className="mb10 edu-back-white"> <div className="mb10 edu-back-white pd40px">
<div className="padding10-20 bor-bottom-greyE color-grey-3 clearfix"> <div className="padding10-20 bor-bottom-greyE color-grey-3 clearfix">
<span className="fl font-18 lineh-35">新建实训项目</span> <span className="fl font-18 lineh-35">新建实训项目</span>
@ -345,9 +357,9 @@ class Newshixuns extends Component {
target="_blank">实训制作指南</a> : ""} target="_blank">实训制作指南</a> : ""}
</div> </div>
<div className="padding10-20 color-grey-3 clearfix"> <div className="padding10-20 color-grey-3 clearfix">
<Form onSubmit={this.handleSubmit}> <Form>
<Form.Item label="实训类型"> <Form.Item label="实训类型">
{getFieldDecorator('radiogroup')( {getFieldDecorator('is_jupyter')(
<Radio.Group onChange={this.RadiovalueonChange}> <Radio.Group onChange={this.RadiovalueonChange}>
<Radio value="1">普通实训</Radio> <Radio value="1">普通实训</Radio>
<Radio value="2">Jupyter实训</Radio> <Radio value="2">Jupyter实训</Radio>
@ -363,8 +375,8 @@ class Newshixuns extends Component {
required: true, message: '请输入选题名称', required: true, message: '请输入选题名称',
}, { }, {
max: 60, message: '请输入名称，最大限制60个字符', max: 60, message: '请输入名称，最大限制60个字符',
},{ }, {
whitespace:true,message:'请勿输入空格' whitespace: true, message: '请勿输入空格'
}], }],
})( })(
<Input placeholder="请输入名称，最大限制60个字符" <Input placeholder="请输入名称，最大限制60个字符"
@ -402,8 +414,8 @@ class Newshixuns extends Component {
> >
<Option value={1}>初级</Option> <Option value={1}>初级</Option>
<Option value={2}>中级</Option> <Option value={2}>中级</Option>
<Option value={3}>中高级</Option> <Option value={3}>高级</Option>
<Option value={4}>高级</Option> <Option value={4}>顶级</Option>
</Select> </Select>
</div> </div>
@ -412,22 +424,21 @@ class Newshixuns extends Component {
</Form.Item> </Form.Item>
<Form.Item
<Form.Item
label={"实验环境"} label={"实验环境"}
style={{"borderBottom": 'none','width': '18%','float': 'left'}} style={{"borderBottom": 'none', 'width': '18%', 'float': 'left'}}
className="chooseDes pr" className="chooseDes pr"
> >
<div> <div>
{getFieldDecorator('selectleft', { {getFieldDecorator('main_type', {
rules: [{required: true, message: '请选择主类别'}], rules: [{required: true, message: '请选择主类别'}],
})( })(
<div className="width100 fl mr20"> <div className="width100 fl mr20">
<Select placeholder="请选择主类别" <Select placeholder="请选择主类别"
style={{width: 180}} style={{width: 180}}
onChange={this.selectleft} onChange={this.main_type}
defaultOpen={false} defaultOpen={false}
> >
{ {
@ -447,20 +458,21 @@ class Newshixuns extends Component {
</div> </div>
)} )}
</div> </div>
</Form.Item> </Form.Item>
<Form.Item <Form.Item
style={{"borderBottom": 'none','width': '61%','float': 'left','margin-top': '40px'}} style={{"borderBottom": 'none', 'width': '61%', 'float': 'left', 'marginTop': '40px'}}
className="chooseDes pr" className="chooseDes pr"
> >
<div className=" fl pr mr20"> <div className=" fl pr mr20">
{getFieldDecorator('selectright', { {getFieldDecorator('sub_type', {
rules: [{required: true, message: '请选择小类别'}], rules: [{required: true, message: '请选择小类别'}],
})( })(
<div className=" fl pr mr20"> <div className=" fl pr mr20">
<Select placeholder="请选择小类别" <Select placeholder="请选择小类别"
mode="multiple"
style={{width: 180}} style={{width: 180}}
onChange={this.selectright} onChange={this.sub_type}
defaultOpen={false} defaultOpen={false}
> >
{ {
@ -477,7 +489,6 @@ class Newshixuns extends Component {
} }
</Select> </Select>
</div> </div>
)} )}
<span className="fl ml20 color-grey lineh-20"> <span className="fl ml20 color-grey lineh-20">
<div> <div>
@ -493,22 +504,21 @@ class Newshixuns extends Component {
</Form.Item> </Form.Item>
</Form> </Form>
<div className={"both"}></div> <div className={"both"}></div>
<div className=" color-grey lineh-20"> <div className=" color-grey lineh-20">
没有实验环境？ 没有实验环境？
<a className="color-blue" onClick={this.post_apply}> 申请新建</a> <a className="color-blue" onClick={this.post_apply}> 申请新建</a>
</div> </div>
{postapplyvisible===true?<style> {postapplyvisible === true ? <style>
{ {
` `
body{ body{
overflow: hidden !important; overflow: hidden !important;
} }
` `
} }
</style>:""} </style> : ""}
<Modal <Modal
keyboard={false} keyboard={false}
@ -520,49 +530,54 @@ class Newshixuns extends Component {
heigth={720} heigth={720}
> >
<div> <div>
<li className="clearfix ml82" > <li className="clearfix ml82">
<label className="fl mt10 "><span <label className="fl mt10 "><span
className="color-red fl mt3">*</span>语言：&nbsp;&nbsp;</label> className="color-red fl mt3">*</span>语言：&nbsp;&nbsp;</label>
<textarea className={this.state.languagewritetype===true?"fl task-form-80 task-height-150 bor-reds":"fl task-form-80 task-height-150"} <textarea
style={{width:'89%',height:'100px'}} className={this.state.languagewritetype === true ? "fl task-form-80 task-height-150 bor-reds" : "fl task-form-80 task-height-150"}
onInput={this.setlanguagewrite} style={{width: '89%', height: '100px'}}
value={languagewrite} onInput={this.setlanguage}
placeholder="请填写该镜像是基于什么语言：示例：Python" value={this.state.language}
id="demand_info"></textarea> placeholder="请填写该镜像是基于什么语言：示例：Python"
id="demand_info"></textarea>
</li> </li>
<div className={"color-red shixunspanred"}>{this.state.languagewritetype===true?"请填写该镜像语言":""}</div> <div
className={"color-red shixunspanred"}>{this.state.languagewritetype === true ? "请填写该镜像语言" : ""}</div>
<li className="clearfix ml1"> <li className="clearfix ml1">
<label className="panel-form-label fl ml50"><span <label className="panel-form-label fl ml50"><span
className="color-red fl mt3">*</span>系统环境：&nbsp;&nbsp;</label> className="color-red fl mt3">*</span>系统环境：&nbsp;&nbsp;</label>
<textarea className={this.state.systemenvironmenttype===true?"fl task-form-80 task-height-150 bor-reds":"fl task-form-80 task-height-150"} <textarea
onInput={this.setsystemenvironment} className={this.state.systemenvironmenttype === true ? "fl task-form-80 task-height-150 bor-reds" : "fl task-form-80 task-height-150"}
style={{height:'100px'}} onInput={this.setruntime}
value={systemenvironment} style={{height: '100px'}}
placeholder="请填写该镜像是基于什么linux系统环境,代码运行环境" value={this.state.runtime}
id="demand_info"></textarea> placeholder="请填写该镜像是基于什么linux系统环境,代码运行环境"
id="demand_info"></textarea>
</li> </li>
<div className={"color-red shixunspanred"}>{this.state.systemenvironmenttype===true?"请填写该镜像语言系统环境":""}</div> <div
className={"color-red shixunspanred"}>{this.state.systemenvironmenttype === true ? "请填写该镜像语言系统环境" : ""}</div>
<li className="clearfix"> <li className="clearfix">
<label className="fl mt10" ><span <label className="fl mt10"><span
className="color-red fl mt3">*</span>测试代码运行方式：&nbsp;&nbsp;</label> className="color-red fl mt3">*</span>测试代码运行方式：&nbsp;&nbsp;</label>
<textarea <textarea
className={this.state.testcoderunmodetype===true?"fl task-form-80 task-height-150 bor-reds":"fl task-form-80 task-height-150"} className={this.state.testcoderunmodetype === true ? "fl task-form-80 task-height-150 bor-reds" : "fl task-form-80 task-height-150"}
onInput={this.settestcoderunmode} onInput={this.setrun_method}
value={testcoderunmode} value={this.state.run_method}
style={{height:'100px'}} style={{height: '100px'}}
placeholder="请填写该镜像中测试代码运行方式" placeholder="请填写该镜像中测试代码运行方式"
id="demand_info"></textarea> id="demand_info"></textarea>
</li> </li>
<div className={"color-red shixunspanred"}>{this.state.testcoderunmodetype===true?"请填写该镜像测试代码运行方式":""}</div> <div
className={"color-red shixunspanred"}>{this.state.testcoderunmodetype === true ? "请填写该镜像测试代码运行方式" : ""}</div>
<li className="clearfix ml50"> <li className="clearfix ml50">
<label className="panel-form-label fl mt-5"><span <label className="panel-form-label fl mt-5"><span
className="color-red fl">*</span>测试代码：&nbsp;&nbsp;</label> className="color-red fl">*</span>测试代码：&nbsp;&nbsp;</label>
<div className="mt10" style={{ <div className="mt10" style={{
display: "inline-block" display: "inline-block"
}}> }}>
<Upload {...uploadProps}> <Upload {...uploadProps}>
<Icon type="upload" className="fl mt3" > </Icon> <Icon type="upload" className="fl mt3"> </Icon>
<span className="color-blue fl cdefault">上传附件</span> <span className="color-blue fl cdefault">上传附件</span>
<span className="color-grey-c fl ml10 ">(单个文件50M以内)</span> <span className="color-grey-c fl ml10 ">(单个文件50M以内)</span>
@ -571,13 +586,13 @@ class Newshixuns extends Component {
</li> </li>
<div className={"color-red shixunspanred"}> <div className={"color-red shixunspanred"}>
{this.state.attachmentidstype===true?"请上传附件":""} {this.state.attachmentidstype === true ? "请上传附件" : ""}
</div> </div>
<li className="edu-txt-center clearfix "> <li className="edu-txt-center clearfix ">
<a className="pop_close task-btn mr30" <a className="pop_close task-btn mr30"
onClick={() => this.sendhideModaly()} onClick={() => this.sendhideModaly()}
>取消</a> >取消</a>
<Button type="primary" onClick={()=>this.sendsure_apply()} <Button type="primary" onClick={() => this.sendsure_apply()}
className="task-btn task-btn-orange">确定</Button> className="task-btn task-btn-orange">确定</Button>
</li> </li>
<div className="cl"></div> <div className="cl"></div>
@ -586,7 +601,6 @@ class Newshixuns extends Component {
</Modal> </Modal>
<Modal <Modal
keyboard={false} keyboard={false}
title="提示" title="提示"
@ -612,9 +626,7 @@ class Newshixuns extends Component {
</div> </div>
</div> </div>
</div> </div>
<Bottomsubmit url={"/shixuns"} onSubmits={() => this.handleSubmit()}/>
<Bottomsubmit/>
</div> </div>
); );

4
public/react/src/modules/tpm/newshixuns/css/Newshixuns.css
Unescape View File

@ -826,4 +826,8 @@ a.white-btn.use_scope-btn:hover{
.relative{ .relative{
position: relative; position: relative;
}
.pd40px{
padding-bottom: 40px;
} }
Write Preview
Loading…
Cancel
Save