A bit of responsiveness
This commit is contained in:
parent
147ff0d2d6
commit
643dbe3ab8
5
frontpage.css
Normal file
5
frontpage.css
Normal file
@ -0,0 +1,5 @@
|
||||
@import url(./style.css);
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
@ -8,7 +8,7 @@
|
||||
<meta name="author" content="Théo Thénault"/>
|
||||
<meta name="description" content="Site web personnel"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" type="text/css" href="style.css">
|
||||
<link rel="stylesheet" type="text/css" href="frontpage.css">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
@ -22,7 +22,7 @@
|
||||
|
||||
<h2><a href="cv.pdf">CV / Resume</a></h2>
|
||||
|
||||
<img src="wip.gif" style="width: 100%;"/>
|
||||
<img src="wip.gif"/>
|
||||
|
||||
</main>
|
||||
</center>
|
||||
|
@ -8,7 +8,7 @@
|
||||
<meta name="author" content="Théo Thénault"/>
|
||||
<meta name="description" content="Site web personnel"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" type="text/css" href="../style.css">
|
||||
<link rel="stylesheet" type="text/css" href="./portfolio.css">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
39
portfolio/portfolio.css
Normal file
39
portfolio/portfolio.css
Normal file
@ -0,0 +1,39 @@
|
||||
@import url(../style.css);
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
max-width: 512px;
|
||||
min-width: 256px;
|
||||
}
|
||||
|
||||
div.side-by-side {
|
||||
display: flex;
|
||||
flex: 1 1 0px;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
div.side-by-side article {
|
||||
margin: 0 32px;
|
||||
flex-basis: 100%;
|
||||
}
|
||||
|
||||
a.hidden {
|
||||
font-style: normal;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
main p {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1152px) {
|
||||
div.side-by-side {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1152px) {
|
||||
div.side-by-side {
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
21
style.css
21
style.css
@ -3,6 +3,7 @@
|
||||
html {
|
||||
color-scheme: light dark;
|
||||
width: 100%;
|
||||
min-width: 320px;
|
||||
}
|
||||
|
||||
body {
|
||||
@ -13,23 +14,3 @@ body {
|
||||
* {
|
||||
font-family: 'mononoki';
|
||||
}
|
||||
|
||||
main {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
div.side-by-side {
|
||||
display: flex;
|
||||
flex: 1 1 0px;
|
||||
}
|
||||
|
||||
div.side-by-side article {
|
||||
margin: 0 32px;
|
||||
flex-basis: 100%;
|
||||
}
|
||||
|
||||
a.hidden {
|
||||
font-style: normal;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user