<div class='row'>
<div class="line line__horizontal"></div>
<div class="line line__vertical line__vertical_left"></div>
<div class="line line__vertical line__vertical_center"></div>
<div class="line line__vertical line__vertical_right"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
</div>body {
background: radial-gradient(#22394d 10%, #202a38);
height: 100vh;
}
.row {
display: flex;
gap: 10px;
position: relative;
padding-top: 100px;
}
.line {
border: solid 1px #304150;
&__horizontal {
position: absolute;
top: 10%;
left: 5%;
right: 5%;
}
&__vertical {
position: absolute;
top: 10%;
height: 20px;
&_left {
left: 5%;
}
&_center{
top: 5%;
left: 50%;
height: 40px;
transform: translateX(-50%)
}
&_right{
right: 5%;
}
}
}
.box {
display: block;
width: 100%;
height: 300px;
background-color: #7092be;
}и еще хотел момент один уточнить, не знаю как его оформить в виде полноценного вопроса, поэтому спрошу тут
в дизайне, визуально кажется что оранжевый блок, выходит за пределы синего и попадает на серый, скажите это просто так фон сделан через background: linear-gradient или это что-то другое, таких мест в макете может быть несколько, но при этом фон в макете чередуется в цветах постоянно, условно сначала серый фон, затем синий, потом снова серый и тд
<a href={`/posts/${id}`}>{title}</a><input onChange={() => handleChange('name')} />
handleChange = (name) => ({ target }) => {
this.setState({ [name]: target.value });
};handleChange = function(name) {
return function({ target }) {
this.setState({ [name]: target.value });
};
};handleChange = function(name) {
return function(obj) {
this.setState({ [name]: obj.target.value });
};
};
interface MyPosition {
x: number | undefined
y: number | undefined
}
interface MyPositionWithDefault extends MyPosition {
default: string
}
function position(): MyPosition;
function position(a: number, b: number): MyPosition;
function position(a: number): MyPositionWithDefault;
function position(a?: number, b?: number): MyPosition | MyPositionWithDefault { // вот тут
if (a===undefined && b===undefined) {
return {x: undefined, y: undefined}
}
if (a!==undefined && b===undefined) {
return {x: a, y: undefined, default: a.toString()}
}
return {x: a, y: b}
}
console.log('Empty: ', position())
console.log('One param: ', position(42))
console.log('Two params: ', position(10, 15))
printNumbers(1, 5);
function printNumbers(from, to) {
let current = from;
let timerId = setTimeout(function go() {
timerId = setTimeout(go, 1000);
console.log(`current: ${current}`);
if (current === to) {
clearTimeout(timerId);
}
current++;
}, 1000);
}
