kopia lustrzana https://github.com/badra022/digital-filter-designer
implemented system responses + allpass additions
rodzic
17d08f9d26
commit
6d861490ae
File diff suppressed because one or more lines are too long
250
index.html
250
index.html
|
@ -1,27 +1,56 @@
|
|||
<!DOCTYPE html>
|
||||
<style>
|
||||
#zplane_polezero2{border:2px solid black;}
|
||||
</style>
|
||||
<body>
|
||||
<canvas id="zplane_polezero2" width=300 height=300></canvas>
|
||||
<div id="zeros"></div>
|
||||
<div id="poles"></div>
|
||||
<button onclick="addNewPole()">New Pole</button>
|
||||
<button onclick="addNewZero()">New Zero</button>
|
||||
<button onclick="clearZeros()">clear zeros</button>
|
||||
<button onclick="clearPoles()">clear poles</button>
|
||||
<button onclick="clearAllPoints()">clear All</button><br>
|
||||
<input type="checkbox" id="conjugate" onclick="setZplane(poles, zeros)">
|
||||
<label> add Conjugates</label>
|
||||
<div align="right">
|
||||
<canvas id="mag_response" width=600 height=300></canvas>
|
||||
<canvas id="phase_response" width=600 height=300></canvas>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
|
||||
|
||||
<link rel="stylesheet" href="https://cdn.lineicons.com/2.0/LineIcons.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="flotr2.min.js"></script>
|
||||
<script src="math.js" type="text/javascript"></script>
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Hind+Vadodara:wght@300;500&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<div class="container">
|
||||
<div class="header">
|
||||
<div class="header-logo">
|
||||
<span class="site-title">All Pass Library</span>
|
||||
</div>
|
||||
<div class="header-search">
|
||||
<button class="button-menu"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 385 385">
|
||||
<path d="M12 120.3h361a12 12 0 000-24H12a12 12 0 000 24zM373 180.5H12a12 12 0 000 24h361a12 12 0 000-24zM373 264.7H132.2a12 12 0 000 24H373a12 12 0 000-24z" />
|
||||
</svg></button>
|
||||
<input type="search" placeholder="Search Documentation..." />
|
||||
</div>
|
||||
</div>
|
||||
<div class="main">
|
||||
<div class="sidebar">
|
||||
<ul>
|
||||
<li><a href="#"><i class="lni lni-text-format"></i><span>a = 2 + 2j</span></a></li>
|
||||
<li><a href="#"><i class="lni lni-text-format"></i><span>a = 2 - 2j</span></a></li>
|
||||
<li><a href="#"><i class="lni lni-text-format"></i><span>a = 1 + 2j</span></a></li>
|
||||
<li><a href="#"><i class="lni lni-text-format"></i><span>a = 2 + 1j</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="page-content">
|
||||
<canvas id="zplane_polezero2" width=300 height=300></canvas>
|
||||
<div id="zeros"></div>
|
||||
<div id="poles"></div>
|
||||
<button onclick="addNewPole()" class="btn btn-primary">New Pole</button>
|
||||
<button onclick="addNewZero()" class="btn btn-primary">New Zero</button>
|
||||
<button onclick="clearZeros()" class="btn btn-primary">clear zeros</button>
|
||||
<button onclick="clearPoles()" class="btn btn-primary">clear poles</button>
|
||||
<button onclick="clearAllPoints()" class="btn btn-primary">clear All</button><br>
|
||||
<input type="checkbox" id="conjugate" onclick="setZplane(poles, zeros)">
|
||||
<label> add Conjugates</label>
|
||||
<input type="checkbox" id="allPassEffect" onclick="setZplane(poles, zeros)">
|
||||
<label> with all Pass filters</label>
|
||||
<div id="design_responses">
|
||||
<div id="mag_response" style="width:500px;height:200px;"></div>
|
||||
<div id="phase_response" style="width:500px;height:200px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="layout.js" type="text/javascript"></script>
|
||||
<script>
|
||||
|
||||
// variables used to get mouse position on the canvas
|
||||
|
@ -42,8 +71,10 @@ var startY;
|
|||
|
||||
var zeros = new Array;
|
||||
var poles = new Array;
|
||||
var allPass = new Array;
|
||||
var zerosNum = 0;
|
||||
var polesNum = 0;
|
||||
var allPassNum = 0;
|
||||
|
||||
function addNewPole() {
|
||||
// console.log("I'm here!");
|
||||
|
@ -66,6 +97,16 @@ function addNewZero() {
|
|||
setZplane(poles, zeros);
|
||||
}
|
||||
|
||||
function addNewAllPass(a) {
|
||||
allPass.push(math.complex(a));
|
||||
}
|
||||
|
||||
function removeAllPassFilter(a) {
|
||||
allPass = allPass.filter(function(value, index, arr) {
|
||||
return !math.equal(value, math.complex(a));
|
||||
});
|
||||
}
|
||||
|
||||
function clearAllPoints() {
|
||||
poles = [];
|
||||
zeros = [];
|
||||
|
@ -89,14 +130,10 @@ var Z = new Array(100);
|
|||
var freqAxis = new Array(100);
|
||||
|
||||
for(let i = 0; i < 100; i++){
|
||||
Z[i] = Math.complex(Math.cos(Math.PI * (i/100)), Math.sin(Math.PI * (i/100)));
|
||||
Z[i] = math.complex(math.cos(math.PI * (i/100)), math.sin(math.PI * (i/100)));
|
||||
freqAxis[i] = Math.PI * (i/100);
|
||||
}
|
||||
|
||||
var magResponse = new Array;
|
||||
var phaseResponse = new Array;
|
||||
|
||||
|
||||
// this var will hold the index of the selected point in zplane
|
||||
var selectedPoint = -1;
|
||||
|
||||
|
@ -122,15 +159,15 @@ function handleMouseDown(e) {
|
|||
e.preventDefault();
|
||||
startX = parseInt(e.clientX - offsetX);
|
||||
startY = parseInt(e.clientY - offsetY);
|
||||
// console.log("you selected point [" + startX + ", " + startY + "]");
|
||||
// console.log("which is point [" + (startX-150)/100 + ", " + -(startY-150)/100 + "]");
|
||||
console.log("you selected point [" + startX + ", " + startY + "]");
|
||||
console.log("which is point [" + (startX+70)/100 + ", " + -(startY-150)/100 + "]");
|
||||
|
||||
// console.log("poles number is " + poles.length);
|
||||
// console.log("zeros number is " + zeros.length);
|
||||
totalLength = polesNum + zerosNum;
|
||||
// Put your mousedown stuff here
|
||||
for (var i = 0; i < totalLength; i++) {
|
||||
if (pointHittest((startX-150)/100, -(startY-150)/100, i)) {
|
||||
if (pointHittest((startX+70)/100, -(startY-150)/100, i)) {
|
||||
selectedPoint = i;
|
||||
if(i >= polesNum){
|
||||
// console.log("selected zero" + (i - polesNum));
|
||||
|
@ -162,7 +199,7 @@ function handleMouseMove(e) {
|
|||
startX = mouseX;
|
||||
startY = mouseY;
|
||||
// console.log("moved to point [" + startX + ", " + startY + "]");
|
||||
// console.log("which is point [" + (startX-150)/100 + ", " + -(startY-150)/100 + "]");
|
||||
// console.log("which is point [" + (startX+70)/100 + ", " + -(startY-150)/100 + "]");
|
||||
// console.log("moved by [" + dx + ", " + dy + "]");
|
||||
|
||||
if(selectedPoint >= poles.length){
|
||||
|
@ -193,15 +230,15 @@ function handleMouseClick(e) {
|
|||
// e.preventDefault();
|
||||
startX = parseInt(e.clientX - offsetX);
|
||||
startY = parseInt(e.clientY - offsetY);
|
||||
console.log("you selected point [" + startX + ", " + startY + "]");
|
||||
// console.log("which is point [" + (startX-150)/100 + ", " + -(startY-150)/100 + "]");
|
||||
// console.log("you selected point [" + startX + ", " + startY + "]");
|
||||
// console.log("which is point [" + (startX+70)/100 + ", " + -(startY-150)/100 + "]");
|
||||
|
||||
// console.log("poles number is " + poles.length);
|
||||
// console.log("zeros number is " + zeros.length);
|
||||
totalLength = polesNum + zerosNum;
|
||||
// Put your mousedown stuff here
|
||||
for (var i = 0; i < totalLength; i++) {
|
||||
if (pointHittest((startX-150)/100, -(startY-150)/100, i)) {
|
||||
if (pointHittest((startX+70)/100, -(startY-150)/100, i)) {
|
||||
if(i >= polesNum){
|
||||
zeros.splice(i - polesNum, 1);
|
||||
zerosNum = zerosNum -1;
|
||||
|
@ -310,15 +347,41 @@ function setZplane(poles, zeros) {
|
|||
ctx.stroke();
|
||||
}
|
||||
}
|
||||
|
||||
if(allPassEffect.checked){
|
||||
// allpass poles
|
||||
for (idx = 0; idx < allPass.length; idx++) {
|
||||
let x = radius + Math.round(radius * allPass[idx].re);
|
||||
let y = radius - Math.round(radius * allPass[idx].im);
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(x - pSize + pad, y - pSize + pad);
|
||||
ctx.lineTo(x + pSize + pad, y + pSize + pad);
|
||||
ctx.moveTo(x - pSize + pad, y + pSize + pad);
|
||||
ctx.lineTo(x + pSize + pad, y - pSize + pad);
|
||||
ctx.stroke();
|
||||
}
|
||||
|
||||
// allpass zeros
|
||||
for (idx = 0; idx < allPass.length; idx++) {
|
||||
let tempVar = math.divide(1, math.conj(allPass[idx]));
|
||||
let x = radius + Math.round(radius * tempVar.re);
|
||||
let y = radius - Math.round(radius * tempVar.im);
|
||||
ctx.beginPath();
|
||||
ctx.arc(x + pad, y + pad, zSize, 0, 2*Math.PI);
|
||||
ctx.stroke();
|
||||
}
|
||||
}
|
||||
drawResponses();
|
||||
}
|
||||
|
||||
function showZplane(poles, zeros) {
|
||||
function showZplaneForAllPass(a) {
|
||||
let zero = math.divide(1, math.conj(math.complex(a)));
|
||||
let pole = math.complex(a);
|
||||
var radius = 100; // radius of unit circle
|
||||
var pSize = 4; // size of pole and zero graphic
|
||||
var zSize = 4;
|
||||
|
||||
var c=document.getElementById("all_pass_filter");
|
||||
var c=document.getElementById("allpass_zplane_polezero2");
|
||||
var ctx=c.getContext("2d");
|
||||
|
||||
ctx.clearRect(0, 0, c.width, c.height);
|
||||
|
@ -346,42 +409,99 @@ function showZplane(poles, zeros) {
|
|||
ctx.fillText("Re", radius+radius+pad+2, radius+pad-2);
|
||||
ctx.stroke(); // Draw it
|
||||
|
||||
// poles
|
||||
// pole
|
||||
ctx.strokeStyle="blue";
|
||||
var idx;
|
||||
for (idx = 0; idx < poles.length; idx++) {
|
||||
var x = radius + Math.round(radius * poles[idx][0]);
|
||||
var y = radius - Math.round(radius * poles[idx][1]);
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(x - pSize + pad, y - pSize + pad);
|
||||
ctx.lineTo(x + pSize + pad, y + pSize + pad);
|
||||
ctx.moveTo(x - pSize + pad, y + pSize + pad);
|
||||
ctx.lineTo(x + pSize + pad, y - pSize + pad);
|
||||
ctx.stroke();
|
||||
let x = radius + Math.round(radius * pole.re);
|
||||
let y = radius - Math.round(radius * pole.im);
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(x - pSize + pad, y - pSize + pad);
|
||||
ctx.lineTo(x + pSize + pad, y + pSize + pad);
|
||||
ctx.moveTo(x - pSize + pad, y + pSize + pad);
|
||||
ctx.lineTo(x + pSize + pad, y - pSize + pad);
|
||||
ctx.stroke();
|
||||
|
||||
// zero
|
||||
x = radius + Math.round(radius * zero.re);
|
||||
y = radius - Math.round(radius * zero.im);
|
||||
ctx.beginPath();
|
||||
ctx.arc(x + pad, y + pad, zSize, 0, 2*Math.PI);
|
||||
ctx.stroke();
|
||||
|
||||
drawResponseOfAllPass(math.complex(a));
|
||||
}
|
||||
|
||||
function drawResponseOfAllPass() {
|
||||
let zero = math.divide(1, math.conj(a));
|
||||
let pole = a;
|
||||
let magResponse = [];
|
||||
let phaseResponse = [];
|
||||
for(let i = 0; i < 100; i++){
|
||||
let magPoint = math.complex(1,0);
|
||||
let phasePoint = math.complex(1,0);
|
||||
let temp = math.subtract(Z[i], math.complex(zero.re, zero.im));
|
||||
magPoint *= temp.abs();
|
||||
phasePoint *= temp.arg();
|
||||
temp = math.subtract(Z[i], math.complex(pole.re, pole.im));
|
||||
magPoint /= temp.abs();
|
||||
phasePoint /= temp.arg();
|
||||
|
||||
magResponse.push(magPoint);
|
||||
phaseResponse.push(phasePoint);
|
||||
}
|
||||
|
||||
// normalize
|
||||
var maxMag = Math.max(...magResponse);
|
||||
var maxPhase = Math.max(...phaseResponse);
|
||||
for(let i = 0; i < magResponse; i++) {
|
||||
magResponse[i] /= maxMag;
|
||||
phaseResponse[i] /= maxPhase;
|
||||
}
|
||||
|
||||
// zeros
|
||||
for (idx = 0; idx < zeros.length; idx++) {
|
||||
var x = radius + Math.round(radius * zeros[idx][0]);
|
||||
var y = radius - Math.round(radius * zeros[idx][1]);
|
||||
ctx.beginPath();
|
||||
ctx.arc(x + pad, y + pad, zSize, 0, 2*Math.PI);
|
||||
ctx.stroke();
|
||||
let magData = [];
|
||||
let phaseData = [];
|
||||
|
||||
for(let i = 0; i < 100; i++){
|
||||
magData.push([freqAxis[i], magResponse[i]]);
|
||||
// console.log(magResponse[i]);
|
||||
phaseData.push([freqAxis[i], phaseResponse[i]]);
|
||||
// console.log(phaseResponse[i]);
|
||||
}
|
||||
drawResponses();
|
||||
|
||||
// plot mag_response
|
||||
var container = document.getElementById('allpass_mag_response');
|
||||
graph = Flotr.draw(container, [ magData ], { yaxis: { max : 10, min : 0 } });
|
||||
|
||||
// plot phase_response
|
||||
var container = document.getElementById('allpass_phase_response');
|
||||
graph = Flotr.draw(container, [ phaseData ], { yaxis: { max : 120, min : -120 } });
|
||||
}
|
||||
|
||||
function drawResponses() {
|
||||
let magResponse = [];
|
||||
let phaseResponse = [];
|
||||
for(let i = 0; i < 100; i++){
|
||||
let magPoint = Math.complex(0,0);
|
||||
let phasePoint = Math.complex(0,0);
|
||||
let magPoint = math.complex(1,0);
|
||||
let phasePoint = math.complex(1,0);
|
||||
for(let j = 0; j < zeros.length; j++){
|
||||
magPoint *= Math.abs(Math.subtract(Z[i], Math.complex(zeros[j][0], zeros[j][1])))
|
||||
phasePoint *= Math.atan(Math.subtract(Z[i], Math.complex(zeros[j][0], zeros[j][1])))
|
||||
let temp = math.subtract(Z[i], math.complex(zeros[j][0], zeros[j][1]));
|
||||
magPoint *= temp.abs();
|
||||
phasePoint *= temp.arg();
|
||||
}
|
||||
for(let j = 0; j < poles.length; j++){
|
||||
magPoint /= Math.abs(Math.subtract(Z[i], Math.complex(poles[j][0], poles[j][1])))
|
||||
phasePoint /= Math.atan(Math.subtract(Z[i], Math.complex(poles[j][0], poles[j][1])))
|
||||
let temp = math.subtract(Z[i], math.complex(poles[j][0], poles[j][1]));
|
||||
magPoint /= temp.abs();
|
||||
phasePoint /= temp.arg();
|
||||
}
|
||||
if(allPassEffect.checked){
|
||||
for(let j = 0; j < allPass.length; j++)
|
||||
{
|
||||
let temp = math.subtract(Z[i], math.divide(1, math.conj(allPass[j])));
|
||||
magPoint *= temp.abs();
|
||||
phasePoint *= temp.arg();
|
||||
temp = math.subtract(Z[i], allPass[j]);
|
||||
magPoint /= temp.abs();
|
||||
phasePoint /= temp.arg();
|
||||
}
|
||||
}
|
||||
magResponse.push(magPoint);
|
||||
phaseResponse.push(phasePoint);
|
||||
|
@ -400,16 +520,18 @@ function drawResponses() {
|
|||
|
||||
for(let i = 0; i < 100; i++){
|
||||
magData.push([freqAxis[i], magResponse[i]]);
|
||||
// console.log(magResponse[i]);
|
||||
phaseData.push([freqAxis[i], phaseResponse[i]]);
|
||||
// console.log(phaseResponse[i]);
|
||||
}
|
||||
|
||||
// plot mag_response
|
||||
var container = document.getElementById('mag_response');
|
||||
graph = Flotr.draw(container, [ magData ], { yaxis: { max : 0, min : -120 } });
|
||||
graph = Flotr.draw(container, [ magData ], { yaxis: { max : 10, min : 0 } });
|
||||
|
||||
// plot phase_response
|
||||
var container = document.getElementById('phase_response');
|
||||
graph = Flotr.draw(container, [ phaseData ], { yaxis: { max : 60, min : -60 } });
|
||||
graph = Flotr.draw(container, [ phaseData ], { yaxis: { max : 120, min : -120 } });
|
||||
}
|
||||
|
||||
|
||||
|
|
|
@ -0,0 +1,25 @@
|
|||
let menuButton = document.querySelector(".button-menu");
|
||||
let container = document.querySelector(".container");
|
||||
let pageContent = document.querySelector(".page-content");
|
||||
let responsiveBreakpoint = 991;
|
||||
|
||||
if (window.innerWidth <= responsiveBreakpoint) {
|
||||
container.classList.add("nav-closed");
|
||||
}
|
||||
|
||||
menuButton.addEventListener("click", function () {
|
||||
container.classList.toggle("nav-closed");
|
||||
});
|
||||
|
||||
pageContent.addEventListener("click", function () {
|
||||
if (window.innerWidth <= responsiveBreakpoint) {
|
||||
container.classList.add("nav-closed");
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
window.addEventListener("resize", function () {
|
||||
if (window.innerWidth > responsiveBreakpoint) {
|
||||
container.classList.remove("nav-closed");
|
||||
}
|
||||
});
|
Plik diff jest za duży
Load Diff
File diff suppressed because one or more lines are too long
|
@ -0,0 +1,164 @@
|
|||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
body {
|
||||
font-family: "Hind Vadodara", -apple-system, BlinkMacSystemFont, Segoe UI,
|
||||
Helvetica Neue, Arial, sans-serif;
|
||||
}
|
||||
.container {
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
flex-wrap: wrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
.main {
|
||||
height: calc(100% - 50px);
|
||||
display: flex;
|
||||
flex: 1;
|
||||
}
|
||||
.sidebar {
|
||||
height: 100%;
|
||||
width: 220px;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0 0 2rem 0 rgb(0 0 0 / 5%);
|
||||
overflow: hidden;
|
||||
transition: width 0.5s ease;
|
||||
}
|
||||
.container.nav-closed .sidebar,
|
||||
.container.nav-closed .header-logo {
|
||||
width: 0;
|
||||
}
|
||||
.sidebar ul {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 5px;
|
||||
}
|
||||
.sidebar ul li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.sidebar ul li a {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.sidebar ul li a.active,
|
||||
.sidebar ul li a:hover {
|
||||
background: #e8ecef;
|
||||
}
|
||||
.sidebar ul li span {
|
||||
margin-left: 16px;
|
||||
font-size: 16px;
|
||||
font-weight: 100;
|
||||
}
|
||||
.sidebar ul li i {
|
||||
font-size: 18px;
|
||||
color: #111;
|
||||
font-weight: normal;
|
||||
}
|
||||
.header {
|
||||
height: 50px;
|
||||
background: #303f9f;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-basis: 100%;
|
||||
}
|
||||
.sidebar ul li a.active i {
|
||||
color: #303f9e;
|
||||
}
|
||||
.site-logo {
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
min-height: 32px;
|
||||
min-width: 32px;
|
||||
margin: 0 18px 0 15px;
|
||||
}
|
||||
.site-logo path {
|
||||
fill: #fff;
|
||||
}
|
||||
.site-title {
|
||||
color: #fff;
|
||||
font-size: 24px;
|
||||
letter-spacing: 1px;
|
||||
font-weight: 400;
|
||||
}
|
||||
.page-content {
|
||||
padding: 10px 20px;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
}
|
||||
.page-content h1 {
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
}
|
||||
.header-search {
|
||||
height: 100%;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
padding: 0 20px;
|
||||
flex: 1;
|
||||
}
|
||||
.header-search .button-menu {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
margin-right: 15px;
|
||||
background: none;
|
||||
border: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
.header-logo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 220px;
|
||||
overflow: hidden;
|
||||
transition: width 0.5s ease;
|
||||
}
|
||||
.header-search input[type="search"] {
|
||||
height: 100%;
|
||||
width: 300px;
|
||||
padding: 10px 20px;
|
||||
box-sizing: border-box;
|
||||
font-size: 14px;
|
||||
font-weight: 100;
|
||||
background: none;
|
||||
border: none;
|
||||
color: #fff;
|
||||
}
|
||||
.header-search input[type="search"]:focus {
|
||||
outline: none;
|
||||
}
|
||||
.header-search input[type="search"]::placeholder {
|
||||
color: #ccc;
|
||||
}
|
||||
.header-search .button-menu:focus {
|
||||
outline: none;
|
||||
border: none;
|
||||
}
|
||||
.header-search .button-menu svg path {
|
||||
fill: #fff;
|
||||
}
|
||||
@media screen and (max-width: 991px) {
|
||||
.page-content {
|
||||
width: 100vw;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 767px) {
|
||||
.header-logo {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#zplane_polezero2{border:2px solid black;}
|
||||
|
||||
#design_responses {
|
||||
|
||||
}
|
Ładowanie…
Reference in New Issue