This commit is contained in:
2023-07-12 23:57:32 +03:00
parent 6479e24800
commit f55912467b
7 changed files with 210 additions and 19 deletions

View File

@@ -0,0 +1,30 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Creator: CorelDRAW -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="102.923mm" height="58.2084mm" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 15844.29 8960.78"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
<defs>
<style type="text/css">
<![CDATA[
.fil0 {fill:url(#id0);fill-rule:nonzero}
.fil1 {fill:url(#id1);fill-rule:nonzero}
]]>
</style>
<radialGradient id="id0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-1.06138 -0.543579 1.309 -2.55591 22256 31038)" cx="14893.63" cy="6451.76" r="7922.15" fx="14893.63" fy="6451.76">
<stop offset="0" style="stop-opacity:1; stop-color:#B41B92"/>
<stop offset="1" style="stop-opacity:1; stop-color:black"/>
</radialGradient>
<radialGradient id="id1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0.193265 -1.20954 2.20442 0.352231 -19974 7245)" cx="950.66" cy="9408.82" r="5862.39" fx="950.66" fy="9408.82">
<stop offset="0" style="stop-opacity:1; stop-color:#5E1BB4"/>
<stop offset="1" style="stop-opacity:0; stop-color:#5E1BB4"/>
<stop offset="1" style="stop-opacity:0; stop-color:#5E1BB4"/>
</radialGradient>
</defs>
<g id="Слой_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="fil0" d="M814.62 0l14215.05 0c449.82,0 814.62,364.8 814.62,814.62l0 7331.54c0,449.81 -364.8,814.61 -814.62,814.61l-14215.05 0.02c-449.81,-0.02 -814.61,-364.81 -814.61,-814.64l-0.02 -7331.53c0.02,-449.82 364.81,-814.62 814.64,-814.62z"/>
<path class="fil1" d="M814.62 0l14215.05 0c449.82,0 814.62,364.8 814.62,814.62l0 7331.54c0,449.81 -364.8,814.61 -814.62,814.61l-14215.05 0.02c-449.81,-0.02 -814.61,-364.81 -814.61,-814.64l-0.02 -7331.53c0.02,-449.82 364.81,-814.62 814.64,-814.62z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.0 KiB

View File

@@ -0,0 +1,30 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Creator: CorelDRAW -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="102.923mm" height="58.2084mm" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 19207.88 10863.07"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
<defs>
<style type="text/css">
<![CDATA[
.fil0 {fill:url(#id0);fill-rule:nonzero}
.fil1 {fill:url(#id1);fill-rule:nonzero}
]]>
</style>
<radialGradient id="id0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0.0594644 -1.4085 2.54898 0.107614 -27990 11802)" cx="1152.48" cy="11406.22" r="9603.94" fx="1152.48" fy="11406.22">
<stop offset="0" style="stop-opacity:1; stop-color:#6BFFFF"/>
<stop offset="1" style="stop-opacity:0; stop-color:#5E1BB4"/>
<stop offset="1" style="stop-opacity:1; stop-color:#5E1BB4"/>
</radialGradient>
<radialGradient id="id1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-0.842837 -0.653441 1.5085 -1.94573 16375 39079)" cx="16710.85" cy="9559.5" r="9603.94" fx="16710.85" fy="9559.5">
<stop offset="0" style="stop-opacity:1; stop-color:#96FD65"/>
<stop offset="1" style="stop-opacity:1; stop-color:black"/>
</radialGradient>
</defs>
<g id="Слой_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="fil0" d="M987.56 0l17232.76 0c545.31,0 987.56,442.24 987.56,987.56l0 8887.96c0,545.3 -442.24,987.54 -987.56,987.54l-17232.76 0.02c-545.3,-0.02 -987.54,-442.26 -987.54,-987.58l-0.02 -8887.94c0.02,-545.31 442.26,-987.56 987.58,-987.56z"/>
<path class="fil1" d="M987.56 0l17232.76 0c545.31,0 987.56,442.24 987.56,987.56l0 8887.96c0,545.3 -442.24,987.54 -987.56,987.54l-17232.76 0.02c-545.3,-0.02 -987.54,-442.26 -987.54,-987.58l-0.02 -8887.94c0.02,-545.31 442.26,-987.56 987.58,-987.56z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.0 KiB

View File

@@ -88,26 +88,98 @@ h1{
width: 100%;
}
.level-border-1{
border: 4px solid #C7A4FF;
}
.level-border-2{
border: 4px solid #6BFFFF;
}
.level-cont{
border-radius: 20px;
border: 4px solid #C7A4FF;
opacity: 0.699999988079071;
background: rgba(255, 255, 255, 0.15);
width: 390px;
height: 220px;
margin-left: 45px;
}
.level-cont:first-of-type{
margin-left: 0;
border-radius: 20px;
background: rgba(255, 255, 255, 0.15);
width: 390px;
height: 220px;
}
.level-grad-1{
/*background: radial-gradient(88.47% 79.48% at 5.97% 105.30%, #5E1BB4 0%, rgba(94, 27, 180, 0.00) 99.78%);*/
background: radial-gradient(45.47% 85.48% at 7.97% 105.3%, #5E1BB4 0%, rgba(94, 27, 180, 0.00) 99.78%);
height: 100%;
width: 100%;
border-radius: 20px;
.level-background-1{
background-image: url("background_for_table_1.svg") ;
}
.level-grad-2{
.level-background-2{
background-image: url("background_for_table_2.svg") ;
}
.container-background-level{
height: 100%;
width: 100%;
border-radius: 20px;
background: radial-gradient(246.21% 71.62% at 94.36% 72.44%, #B41B92 0%, #000 100%);
}
.container-content-level{
width: calc(100% - 36px);
height: calc(100% - 43px);
padding: 33px 18px 10px 18px;
}
.container-content-level h2{
color: #FFFFFF;
margin: 0;
height: 72%;
}
.bottom-part_w{
width: 100%;
}
.description-level-card{
color: rgba(255, 255, 255, 0.68);
font-family: 'Inter';
font-size: 16px;
width: fit-content;
float: left;
}
.description-level-card span:first-of-type{
color: rgba(255, 255, 255, 0.68);
font-family: 'Inter';
font-size: 18px;
width: fit-content;
float: left;
}
.button-level-card{
width: fit-content;
float: right;
}
.button-level-card button{
width: 130px;
height: 30px;
border-radius: 20px;
background: #FFF;
font-family: 'Montserrat';
font-size: 18px;
font-weight: 500;
border: none;
}
.color-button-level-card-1{
color: #8D2C78;
}
.color-button-level-card-2{
color: #7FB47B;
}

View File

@@ -0,0 +1,30 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Creator: CorelDRAW -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="102.923mm" height="58.2084mm" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 15844.29 8960.78"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
<defs>
<style type="text/css">
<![CDATA[
.fil0 {fill:url(#id0);fill-rule:nonzero}
.fil1 {fill:url(#id1);fill-rule:nonzero}
]]>
</style>
<radialGradient id="id0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-1.06138 -0.543579 1.309 -2.55591 22256 31038)" cx="14893.63" cy="6451.76" r="7922.15" fx="14893.63" fy="6451.76">
<stop offset="0" style="stop-opacity:1; stop-color:#B41B92"/>
<stop offset="1" style="stop-opacity:1; stop-color:black"/>
</radialGradient>
<radialGradient id="id1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0.193265 -1.20954 2.20442 0.352231 -19974 7245)" cx="950.66" cy="9408.82" r="5862.39" fx="950.66" fy="9408.82">
<stop offset="0" style="stop-opacity:1; stop-color:#5E1BB4"/>
<stop offset="1" style="stop-opacity:0; stop-color:#5E1BB4"/>
<stop offset="1" style="stop-opacity:0; stop-color:#5E1BB4"/>
</radialGradient>
</defs>
<g id="Слой_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="fil0" d="M814.62 0l14215.05 0c449.82,0 814.62,364.8 814.62,814.62l0 7331.54c0,449.81 -364.8,814.61 -814.62,814.61l-14215.05 0.02c-449.81,-0.02 -814.61,-364.81 -814.61,-814.64l-0.02 -7331.53c0.02,-449.82 364.81,-814.62 814.64,-814.62z"/>
<path class="fil1" d="M814.62 0l14215.05 0c449.82,0 814.62,364.8 814.62,814.62l0 7331.54c0,449.81 -364.8,814.61 -814.62,814.61l-14215.05 0.02c-449.81,-0.02 -814.61,-364.81 -814.61,-814.64l-0.02 -7331.53c0.02,-449.82 364.81,-814.62 814.64,-814.62z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.0 KiB

View File

@@ -4,5 +4,6 @@
<h1>Выберите уровень</h1>
<div class="block-levels">
{% include "widgets/w_level.html" %}
{% include "widgets/w_level_2.html" %}
</div>
{% endblock %}

View File

@@ -1,13 +1,20 @@
{% load static %}
<div class="level-cont">
<div class="level-cont-1">
<div class="level-cont-2">
<div class="level-cont level-border-1">
<div class="container-background-level level-background-1">
<div class="container-content-level">
<h2>
УРОВЕНЬ 1 <br/> Лёгкий
</h2>
<div class="bottom-part_w">
<div class="description-level-card">
<div>Можно выиграть: +150%</div>
<div>Цена входа: 1$</div>
</div>
<div class="button-level-card">
<button class="color-button-level-card-1">Начать</button>
</div>
</div>
</div>
</div>
<div class="container-content-level">
<h2>
УРОВЕНЬ 1 <br/> Лёгкий
</h2>
</div>
</div>

View File

@@ -0,0 +1,21 @@
{% load static %}
<div class="level-cont level-border-2">
<div class="container-background-level level-background-2">
<div class="container-content-level">
<h2>
УРОВЕНЬ 2 <br/> Средний
</h2>
<div class="bottom-part_w">
<div class="description-level-card">
<div>Можно выиграть: +150%</div>
<div>Цена входа: 1$</div>
</div>
<div class="button-level-card">
<button class="color-button-level-card-2">Начать</button>
</div>
</div>
</div>
</div>
</div>