theoludwig/FunctionProject
theoludwig/FunctionProject
Archived
1
1
Fork 0
Code Pull Requests Actions Releases Activity

Changement CSS pour mobile

Browse Source
This commit is contained in:
Divlo 2019-09-19 20:18:08 +02:00
parent 77d7791606
commit cb215f60d6
2 changed files with 24 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
css/style.css
View File

@ -47,17 +47,36 @@ header {
.navbar {
border-bottom: var(--border-header-footer);
}
#logo-small-screen {
display: none;
}
@media (max-width: 463px) {
#logo {
display: none;
}
.navbar-brand {
width: 30%;
}
#logo-small-screen {
display: inline-block;
width: 80%;
}
}
.nav-link {
text-align: center !important;
}
/* CONTENT */
@media (max-width: 576px) {
.container {
width: 90% !important;
}
}
.container {
padding-bottom: 25px;
}
.inlineInput {
width: 25% !important;
display: inline;
}
#convertIn {
width: 6.7em;

5
incl/header.php
View File

@ -53,7 +53,10 @@
<nav class="navbar navbar-expand-lg navbar-dark static-top">
<div class="container" id="header-container">
<!-- Brand -->
<a class="navbar-brand" href="/index.php"><img src="/img/FunctionProject_brand-logo.png" alt="FunctionProject"></a>
<a class="navbar-brand" href="/index.php">
<img id="logo" src="/img/FunctionProject_brand-logo.png" alt="FunctionProject">
<img id="logo-small-screen" src="/img/FunctionProject_icon.png" alt="FunctionProject">
</a>
<!-- Hamburger icon on Mobile -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>