mirror of
https://github.com/Ai-hack-MAGNUM-OPUS/frontend.git
synced 2024-11-10 19:56:41 +03:00
add mobile adaptive
This commit is contained in:
parent
679c463d0c
commit
d4cdd3cee1
|
@ -86,3 +86,11 @@
|
|||
gap:5px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1000px) {
|
||||
.card{
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
|
||||
}
|
|
@ -48,3 +48,26 @@
|
|||
background: #13377D;
|
||||
transition: 0.3s;
|
||||
}
|
||||
.burger{
|
||||
display: none;
|
||||
}
|
||||
@media screen and (max-width: 1500px) {
|
||||
.logo{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1000px) {
|
||||
.header{
|
||||
flex-direction: column;
|
||||
}
|
||||
.itemWrapper{
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.burger{
|
||||
display: block;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,17 +1,18 @@
|
|||
import { useRouter } from "next/router";
|
||||
import React from "react";
|
||||
import React, { useState } from "react";
|
||||
import styles from "./header.module.css"
|
||||
import 'antd/dist/antd.css';
|
||||
|
||||
export const Header:React.FC = () =>{
|
||||
let router = useRouter()
|
||||
|
||||
const [open, setOpen] = useState(true)
|
||||
return(
|
||||
<div className={styles.header}>
|
||||
<div className={styles.logo} onClick={()=>router.push("/")}>
|
||||
<img src="/images/logo.svg"></img>
|
||||
</div>
|
||||
<div className={styles.itemWrapper}>
|
||||
<img src="/images/logo.svg" className={styles.burger} onClick={()=>setOpen(!open)}></img>
|
||||
<div className={styles.itemWrapper} style={{display: open? "":"none"}}>
|
||||
<div className={styles.item} onClick={()=>router.push("/")}>
|
||||
Проверить документы
|
||||
</div>
|
||||
|
|
|
@ -221,3 +221,38 @@
|
|||
/* main/black */
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1000px) {
|
||||
.h1{
|
||||
font-size: 24px;
|
||||
}
|
||||
.main{
|
||||
padding:0px 25px;
|
||||
padding-top: 150px;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.pagination{
|
||||
gap:50px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
}
|
||||
.progress{
|
||||
width: 100%;
|
||||
}
|
||||
.downloadStars{
|
||||
display: none;
|
||||
}
|
||||
.programs{
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.profileWrapper{
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.profileCard{
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
}
|
Loading…
Reference in New Issue
Block a user