Add languages, categorized them, add rechaptcha

This commit is contained in:
JoseluCross
2018-09-16 13:04:58 +02:00
parent 6d2466b5b1
commit d71a111fe9
14 changed files with 225 additions and 88 deletions

View File

@@ -76,13 +76,17 @@ p{
margin-bottom: 30px;
}
.codeFilterCheckBox, .codeFilterButton{
.codeFilterCheckBox, .codeFilterButton, .codeFilterTitle{
margin: 0.2em 0;
padding: 0;
width: 100px;
float: left;
}
.codeFilterTitle {
font-weight: bold;
}
.codeFilterSearch {
margin-top: 1em;
}
@@ -136,11 +140,16 @@ p{
transform: rotate(180deg);
}
#filterBlock{
.sub-depth{
border-radius: 5px;
box-shadow: inset 0px 0px 5px rgba(119, 119, 119, 0.205);
}
#filterBlock, .filterBlock{
align-content: center;
width: 90%;
margin-left: 7%;
margin-right: 3%;
margin-left: 5%;
margin-right: 5%;
}
#user{
@@ -164,6 +173,16 @@ p{
animation: spin 2s linear infinite;
}
@media (min-width: 992px) {
.nopadding {
padding: 0%;
}
}
.nomargin {
margin: 0%;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }

View File

@@ -19,7 +19,7 @@
<select id="lang" name="lang" required="required" class="form-control">
<option value=""></option>
{% for key,value in supported %}
<option value="{{ key }}">{{ value }}</option>
<option value="{{ key }}">{{ value[0] }}</option>
{% endfor %}
</select>
</div>
@@ -52,7 +52,9 @@
</div>
<div class="form-group">
<div class="col-sm-12 col-sm-12">
<button type="submit" class="btn btn-success btn-block">Submit</button>
<button type="submit" class="btn btn-success g-recaptcha btn-block"
data-sitekey="6Lc7gXAUAAAAAJRaFo99vIkOUWckuGW8IOLtUxwZ"
data-callback="YourOnSubmitFn">Submit</button>
</div>
</div>
</form>

View File

@@ -2,7 +2,6 @@
<html>
<head>
<title>{{ page.title }}</title>
<link type="text/css" rel="stylesheet" href="{{ path.css }}/bootstrap-paper.css"/>
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
<link type="text/css" rel="stylesheet" href="{{ path.css }}/main.css"/>
@@ -16,6 +15,7 @@
<script src="{{ path.js }}/highlight.pack.js"></script>
<script src="{{ path.js }}/jquery-3.2.1.min.js"></script>
<script src="{{ path.js }}/bootstrap.min.js"></script>
<script src='https://www.google.com/recaptcha/api.js'></script>
<script src="{{ path.js }}/functions.js"></script>
</head>
<body>

View File

@@ -76,7 +76,7 @@
<option value=""></option>
{% for key,value in supported %}
{% if key not in page.existedLangs %}
<option value="{{ key }}"> {{ value }} </option>
<option value="{{ key }}"> {{ value[0] }} </option>
{% endif %}
{% endfor %}
</select>

View File

@@ -1,16 +1,28 @@
<div style="text-align: center; margin-top:10px; "><button class="btn btn-default" onclick="mostrar('filterBlock')">Filters</button></div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" id="filterBlock" style="display: none;">
{% for key,value in page.supported %}
<div class='codeFilterCheckBox'><input type='checkbox' class='codeFilterCheckBoxInput' checked='true' value='{{ key }}' onclick="getAjax()"> {{ value }}</div>
{% endfor %}
<div class='codeFilterCheckBox'><button type='button' class='codeFilterCheckBoxInput btn btn-default btn-sm' onclick="unselectAll()">Unselect all</button></div>
<div class="container"></div>
<div class="container-fluid">
<div class="row">
<div class="codeFilterSearch col-md-11">
{% for key,value in page.grouped %}
<div class="col-lg-{{ value[1] }} col-md-{{ value[1] }} nopadding" style="{% if loop.first %}padding-left:15px {% elseif loop.last %}padding-right:15px{% endif %}">
<div class="row nomargin">
<div class='codeFilterCheckBox codeFilterTitle'>{{ key }}</div>
</div>
<div class="row nomargin">
{% for lang in value[0] %}
<div class='codeFilterCheckBox'><input type='checkbox' class='codeFilterCheckBoxInput' checked='true' value='{{ lang[0] }}' onclick="getAjax()"> {{ lang[1] }}</div>
{% endfor %}
</div>
</div>
{% endfor %}
</div>
<div class="row nomargin">
<div class='codeFilterCheckBox'><button type='button' class='codeFilterCheckBoxInput btn btn-default btn-sm' onclick="unselectAll()">Unselect all</button></div>
</div>
<div class="row">
<div class="codeFilterSearch col-md-12">
<input type="text" class="codeFilterSearchInput" id="search" name="search" placeholder="Code's name or description" onkeyup="getAjax()">
</div>
{#<div class="codeFilterButton col-md-4"><button class="btn btn-default" onclick="getAjax()">Filter</button></div>#}
</div>
</div>
</div>

View File

@@ -80,7 +80,9 @@
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-success">Submit</button>
<button type="submit" class="btn btn-success g-recaptcha"
data-sitekey="6Lc7gXAUAAAAAJRaFo99vIkOUWckuGW8IOLtUxwZ"
data-callback="YourOnSubmitFn">Submit</button>
</div>
</div>
<div class="col-sm-offset-1 col-sm-12">

View File

@@ -26,7 +26,8 @@ function reHightlight(){
function mostrar(div) {
obj = document.getElementById(div);
obj.style.display = (obj.style.display == 'none') ? 'block' : 'none';
$(obj).slideToggle();
//obj.style.display = (obj.style.display == 'none') ? 'block' : 'none';
}
function getAjax() {