fix 3 column

This commit is contained in:
Valère 2023-04-01 08:57:33 +02:00
parent 4da3d9c794
commit b5e26b5a2e
5 changed files with 582 additions and 32 deletions

View File

@ -53,7 +53,7 @@ html, body {
body {
padding: 0;
margin: 0;
color: #181A1B;
color: #000;
font-size: 1em;
line-height: 1.4;
font-family: ClearSans;
@ -64,10 +64,14 @@ body {
.container {
max-width: 960px;
}
.wide .container {
max-width: 1150px;
}
}
a {
color: #17191A;
color: #800;
text-decoration: underline;
}
@ -84,15 +88,57 @@ nav a,
text-decoration: none;
}
nav {
text-align: center;
}
nav a {
display: inline-block;
}
nav a.text-dark:hover,
nav a.text-dark:focus {
color: #17191A !important;
color: #800 !important;
}
.avatar {
max-width: 250px;
}
.team {
display: grid;
grid-template-columns: repeat(1, 1fr);
grid-column-gap: 15px;
grid-row-gap: 15px;
margin-top: 15px;
}
.alumni {
opacity: 0.6;
}
.person-avatar {
max-width: 80px;
border-radius: 50%;
margin-right: 15px;
float: left;
}
.person-name {
display: block;
font-weight: bold;
padding-bottom: 10px;
}
.person-links {
display: inline-block;
font-size: 1.3rem;
}
.person-links a:not(:last-child) {
margin-right: 5px;
}
.page {
min-height: 100%;
margin-bottom: -92px;
@ -108,16 +154,30 @@ nav a.text-dark:focus {
font-weight: bold;
}
.section {
text-decoration: underline;
}
.services {
display: grid;
grid-template-columns: auto auto;
grid-template-columns: auto;
grid-column-gap: 40px;
grid-row-gap: 40px;
}
@media (max-width: 768px) {
@media (min-width: 768px) {
.services {
grid-template-columns: auto;
grid-template-columns: repeat(2, 1fr);
}
.team {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1200px) {
.services {
grid-template-columns: repeat(3, 1fr);
}
}
@ -127,6 +187,18 @@ nav a.text-dark:focus {
padding-right: 10px;
}
.tools h5 {
border-bottom: 1px solid gray;
}
.tool-img {
max-height: 80px;
}
.tools a.btn {
text-decoration: none;
}
.card-footer {
padding: 0 1.25rem 1rem 1.25rem;
background-color: transparent;
@ -143,7 +215,45 @@ nav a.text-dark:focus {
margin: inherit;
}
.beta {
color: gray;
}
pre,
code {
background-color: #f6f8fa;
line-height: 1.45;
font-size: 0.9rem;
padding: 5px;
color: #e83e8c;
}
pre > code {
padding: 0;
}
.extra a {
text-decoration: none;
}
footer {
margin: 10px auto 0;
text-align: center;
}
.footer-link {
display: block;
font-size: 1.1rem;
margin-bottom: 8px;
}
.footer-col {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
}
.footer-col a,
.footer-avatar {
max-width: 80px;
}

View File

@ -64,6 +64,10 @@ body {
.container {
max-width: 960px;
}
.wide .container {
max-width: 1150px;
}
}
a {
@ -84,6 +88,14 @@ nav a,
text-decoration: none;
}
nav {
text-align: center;
}
nav a {
display: inline-block;
}
nav a.text-dark:hover,
nav a.text-dark:focus {
color: #800 !important;
@ -93,6 +105,40 @@ nav a.text-dark:focus {
max-width: 250px;
}
.team {
display: grid;
grid-template-columns: repeat(1, 1fr);
grid-column-gap: 15px;
grid-row-gap: 15px;
margin-top: 15px;
}
.alumni {
opacity: 0.6;
}
.person-avatar {
max-width: 80px;
border-radius: 50%;
margin-right: 15px;
float: left;
}
.person-name {
display: block;
font-weight: bold;
padding-bottom: 10px;
}
.person-links {
display: inline-block;
font-size: 1.3rem;
}
.person-links a:not(:last-child) {
margin-right: 5px;
}
.page {
min-height: 100%;
margin-bottom: -92px;
@ -108,16 +154,30 @@ nav a.text-dark:focus {
font-weight: bold;
}
.section {
text-decoration: underline;
}
.services {
display: grid;
grid-template-columns: auto auto;
grid-template-columns: auto;
grid-column-gap: 40px;
grid-row-gap: 40px;
}
@media (max-width: 768px) {
@media (min-width: 768px) {
.services {
grid-template-columns: auto;
grid-template-columns: repeat(2, 1fr);
}
.team {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1200px) {
.services {
grid-template-columns: repeat(3, 1fr);
}
}
@ -127,6 +187,18 @@ nav a.text-dark:focus {
padding-right: 10px;
}
.tools h5 {
border-bottom: 1px solid gray;
}
.tool-img {
max-height: 80px;
}
.tools a.btn {
text-decoration: none;
}
.card-footer {
padding: 0 1.25rem 1rem 1.25rem;
background-color: transparent;
@ -143,7 +215,45 @@ nav a.text-dark:focus {
margin: inherit;
}
.beta {
color: gray;
}
pre,
code {
background-color: #f6f8fa;
line-height: 1.45;
font-size: 0.9rem;
padding: 5px;
color: #e83e8c;
}
pre > code {
padding: 0;
}
.extra a {
text-decoration: none;
}
footer {
margin: 10px auto 0;
text-align: center;
}
.footer-link {
display: block;
font-size: 1.1rem;
margin-bottom: 8px;
}
.footer-col {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
}
.footer-col a,
.footer-avatar {
max-width: 80px;
}

View File

@ -53,7 +53,7 @@ html, body {
body {
padding: 0;
margin: 0;
color: #181A1B;
color: #000;
font-size: 1em;
line-height: 1.4;
font-family: ClearSans;
@ -64,10 +64,14 @@ body {
.container {
max-width: 960px;
}
.wide .container {
max-width: 1150px;
}
}
a {
color: #17191A;
color: #800;
text-decoration: underline;
}
@ -84,15 +88,57 @@ nav a,
text-decoration: none;
}
nav {
text-align: center;
}
nav a {
display: inline-block;
}
nav a.text-dark:hover,
nav a.text-dark:focus {
color: #17191A !important;
color: #800 !important;
}
.avatar {
max-width: 250px;
}
.team {
display: grid;
grid-template-columns: repeat(1, 1fr);
grid-column-gap: 15px;
grid-row-gap: 15px;
margin-top: 15px;
}
.alumni {
opacity: 0.6;
}
.person-avatar {
max-width: 80px;
border-radius: 50%;
margin-right: 15px;
float: left;
}
.person-name {
display: block;
font-weight: bold;
padding-bottom: 10px;
}
.person-links {
display: inline-block;
font-size: 1.3rem;
}
.person-links a:not(:last-child) {
margin-right: 5px;
}
.page {
min-height: 100%;
margin-bottom: -92px;
@ -108,16 +154,30 @@ nav a.text-dark:focus {
font-weight: bold;
}
.section {
text-decoration: underline;
}
.services {
display: grid;
grid-template-columns: auto auto;
grid-template-columns: auto;
grid-column-gap: 40px;
grid-row-gap: 40px;
}
@media (max-width: 768px) {
@media (min-width: 768px) {
.services {
grid-template-columns: auto;
grid-template-columns: repeat(2, 1fr);
}
.team {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1200px) {
.services {
grid-template-columns: repeat(3, 1fr);
}
}
@ -127,6 +187,18 @@ nav a.text-dark:focus {
padding-right: 10px;
}
.tools h5 {
border-bottom: 1px solid gray;
}
.tool-img {
max-height: 80px;
}
.tools a.btn {
text-decoration: none;
}
.card-footer {
padding: 0 1.25rem 1rem 1.25rem;
background-color: transparent;
@ -143,7 +215,45 @@ nav a.text-dark:focus {
margin: inherit;
}
.beta {
color: gray;
}
pre,
code {
background-color: #f6f8fa;
line-height: 1.45;
font-size: 0.9rem;
padding: 5px;
color: #e83e8c;
}
pre > code {
padding: 0;
}
.extra a {
text-decoration: none;
}
footer {
margin: 10px auto 0;
text-align: center;
}
.footer-link {
display: block;
font-size: 1.1rem;
margin-bottom: 8px;
}
.footer-col {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
}
.footer-col a,
.footer-avatar {
max-width: 80px;
}

View File

@ -53,7 +53,7 @@ html, body {
body {
padding: 0;
margin: 0;
color: #181A1B;
color: #000;
font-size: 1em;
line-height: 1.4;
font-family: ClearSans;
@ -64,10 +64,14 @@ body {
.container {
max-width: 960px;
}
.wide .container {
max-width: 1150px;
}
}
a {
color: #17191A;
color: #800;
text-decoration: underline;
}
@ -84,15 +88,57 @@ nav a,
text-decoration: none;
}
nav {
text-align: center;
}
nav a {
display: inline-block;
}
nav a.text-dark:hover,
nav a.text-dark:focus {
color: #17191A !important;
color: #800 !important;
}
.avatar {
max-width: 250px;
}
.team {
display: grid;
grid-template-columns: repeat(1, 1fr);
grid-column-gap: 15px;
grid-row-gap: 15px;
margin-top: 15px;
}
.alumni {
opacity: 0.6;
}
.person-avatar {
max-width: 80px;
border-radius: 50%;
margin-right: 15px;
float: left;
}
.person-name {
display: block;
font-weight: bold;
padding-bottom: 10px;
}
.person-links {
display: inline-block;
font-size: 1.3rem;
}
.person-links a:not(:last-child) {
margin-right: 5px;
}
.page {
min-height: 100%;
margin-bottom: -92px;
@ -108,16 +154,30 @@ nav a.text-dark:focus {
font-weight: bold;
}
.section {
text-decoration: underline;
}
.services {
display: grid;
grid-template-columns: auto auto;
grid-template-columns: auto;
grid-column-gap: 40px;
grid-row-gap: 40px;
}
@media (max-width: 768px) {
@media (min-width: 768px) {
.services {
grid-template-columns: auto;
grid-template-columns: repeat(2, 1fr);
}
.team {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1200px) {
.services {
grid-template-columns: repeat(3, 1fr);
}
}
@ -127,6 +187,18 @@ nav a.text-dark:focus {
padding-right: 10px;
}
.tools h5 {
border-bottom: 1px solid gray;
}
.tool-img {
max-height: 80px;
}
.tools a.btn {
text-decoration: none;
}
.card-footer {
padding: 0 1.25rem 1rem 1.25rem;
background-color: transparent;
@ -143,7 +215,45 @@ nav a.text-dark:focus {
margin: inherit;
}
.beta {
color: gray;
}
pre,
code {
background-color: #f6f8fa;
line-height: 1.45;
font-size: 0.9rem;
padding: 5px;
color: #e83e8c;
}
pre > code {
padding: 0;
}
.extra a {
text-decoration: none;
}
footer {
margin: 10px auto 0;
text-align: center;
}
.footer-link {
display: block;
font-size: 1.1rem;
margin-bottom: 8px;
}
.footer-col {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
}
.footer-col a,
.footer-avatar {
max-width: 80px;
}

View File

@ -53,7 +53,7 @@ html, body {
body {
padding: 0;
margin: 0;
color: #181A1B;
color: #000;
font-size: 1em;
line-height: 1.4;
font-family: ClearSans;
@ -64,10 +64,14 @@ body {
.container {
max-width: 960px;
}
.wide .container {
max-width: 1150px;
}
}
a {
color: #17191A;
color: #800;
text-decoration: underline;
}
@ -84,15 +88,57 @@ nav a,
text-decoration: none;
}
nav {
text-align: center;
}
nav a {
display: inline-block;
}
nav a.text-dark:hover,
nav a.text-dark:focus {
color: #17191A !important;
color: #800 !important;
}
.avatar {
max-width: 250px;
}
.team {
display: grid;
grid-template-columns: repeat(1, 1fr);
grid-column-gap: 15px;
grid-row-gap: 15px;
margin-top: 15px;
}
.alumni {
opacity: 0.6;
}
.person-avatar {
max-width: 80px;
border-radius: 50%;
margin-right: 15px;
float: left;
}
.person-name {
display: block;
font-weight: bold;
padding-bottom: 10px;
}
.person-links {
display: inline-block;
font-size: 1.3rem;
}
.person-links a:not(:last-child) {
margin-right: 5px;
}
.page {
min-height: 100%;
margin-bottom: -92px;
@ -108,16 +154,30 @@ nav a.text-dark:focus {
font-weight: bold;
}
.section {
text-decoration: underline;
}
.services {
display: grid;
grid-template-columns: auto auto;
grid-template-columns: auto;
grid-column-gap: 40px;
grid-row-gap: 40px;
}
@media (max-width: 768px) {
@media (min-width: 768px) {
.services {
grid-template-columns: auto;
grid-template-columns: repeat(2, 1fr);
}
.team {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1200px) {
.services {
grid-template-columns: repeat(3, 1fr);
}
}
@ -127,6 +187,18 @@ nav a.text-dark:focus {
padding-right: 10px;
}
.tools h5 {
border-bottom: 1px solid gray;
}
.tool-img {
max-height: 80px;
}
.tools a.btn {
text-decoration: none;
}
.card-footer {
padding: 0 1.25rem 1rem 1.25rem;
background-color: transparent;
@ -143,7 +215,45 @@ nav a.text-dark:focus {
margin: inherit;
}
.beta {
color: gray;
}
pre,
code {
background-color: #f6f8fa;
line-height: 1.45;
font-size: 0.9rem;
padding: 5px;
color: #e83e8c;
}
pre > code {
padding: 0;
}
.extra a {
text-decoration: none;
}
footer {
margin: 10px auto 0;
text-align: center;
}
.footer-link {
display: block;
font-size: 1.1rem;
margin-bottom: 8px;
}
.footer-col {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
}
.footer-col a,
.footer-avatar {
max-width: 80px;
}