Chapril/banner.chapril.org
Chapril/banner.chapril.org
25
0
Fork 1
Code Issues Pull Requests Releases Activity

Splitted CSS in separted file.

Browse Source
This commit is contained in:
Christian P. MOMON 2019-11-22 01:58:49 +01:00 committed by root
parent 3e536a0400
commit 1c54ded2f5
2 changed files with 131 additions and 110 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

129
Chapril-banner/v2/chapril-banner.css Normal file
View File

@ -0,0 +1,129 @@
/*
____ _ _ _ _ ____ ____ ____
/ ___| |__ __ _ _ __ _ __(_) | | |__ __ _ _ __ _ __ ___ _ __ / ___/ ___/ ___|
| | | '_ \ / _` | '_ \| '__| | | | '_ \ / _` | '_ \| '_ \ / _ \ '__| | | \___ \___ \
| |___| | | | (_| | |_) | | | | | | |_) | (_| | | | | | | | __/ | | |___ ___) |__) |
\____|_| |_|\__,_| .__/|_| |_|_| |_.__/ \__,_|_| |_|_| |_|\___|_| \____|____/____/
|_|
*/
body
{
margin: 0;
padding: 0;
}
.chapril-banniere-Nav
{
background-color: #005184;
font-family: 'dejavu_sanscondensed', sans-serif;
text-transform: uppercase;
font-size: small;
position: relative;
display: flex;
justify-content: space-around;
align-items: center;
}
.chapril-banniere-Logo img
{
width: auto;
height: 32px;
}
.chapril-banniere-Nav a, .chapril-banniere-Nav a:visited
{
color: #fff;
text-decoration: none;
}
.chapril-banniere-Nav a:hover
{
color: #ff9759;
}
.chapril-banniere-Menu
{
display: none;
}
@media screen and (max-width: 800px)
{
.chapril-banniere-Logo
{
padding-left: 10px;
}
.chapril-banniere-Nav
{
display: block;
}
.chapril-banniere-Menu
{
display: block;
}
.chapril-banniere-Menu summary
{
height: 26px;
width: 30px;
display: block;
position: absolute;
top: 5px;
right: 10px;
border-radius: 2px;
border-style: solid;
border-width: 1px;
box-sizing: border-box;
border-color: #fff;
padding-left: 4px;
padding-top: 1px;
}
.chapril-banniere-Menu summary
{
list-style: none;
}
.chapril-banniere-Menu summary::-webkit-details-marker
{
display: none;
}
.chapril-banniere-Menu summary span
{
display: block;
margin-top: 4px;
width: 20px;
height: 2px;
border-radius: 2px;
background-color: #fff;
}
.chapril-banniere-Menu summary:hover
{
border-color: #ff9759;
cursor:pointer;
}
.chapril-banniere-Menu summary:hover span
{
background-color: #ff9759;
}
.chapril-banniere-Menu div
{
padding-top: 8px;
padding-bottom: 8px;
text-align: center;
background-color: #153a6a;
border-top: 1px solid #005184;
}
.chapril-banniere-Entree
{
display: none;
}
}

112
Chapril-banner/v2/index.html
View File

@ -1,117 +1,9 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8" />
<title>Cha ronronne !</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style>
body {
margin: 0;
padding: 0;
}
.chapril-banniere-Nav {
background-color: #005184;
font-family: 'dejavu_sanscondensed', sans-serif;
text-transform: uppercase;
font-size: small;
position: relative;
display: flex;
justify-content: space-around;
align-items: center;
}
.chapril-banniere-Logo img {
width: auto;
height: 32px;
}
.chapril-banniere-Nav a, .chapril-banniere-Nav a:visited {
color: #fff;
text-decoration: none;
}
.chapril-banniere-Nav a:hover {
color: #ff9759;
}
.chapril-banniere-Menu {
display: none;
}
@media screen and (max-width: 800px) {
.chapril-banniere-Logo {
padding-left: 10px;
}
.chapril-banniere-Nav {
display: block;
}
.chapril-banniere-Menu {
display: block;
}
.chapril-banniere-Menu summary {
height: 26px;
width: 30px;
display: block;
position: absolute;
top: 5px;
right: 10px;
border-radius: 2px;
border-style: solid;
border-width: 1px;
box-sizing: border-box;
border-color: #fff;
padding-left: 4px;
padding-top: 1px;
}
.chapril-banniere-Menu summary {
list-style: none;
}
.chapril-banniere-Menu summary::-webkit-details-marker {
display: none;
}
.chapril-banniere-Menu summary span {
display: block;
margin-top: 4px;
width: 20px;
height: 2px;
border-radius: 2px;
background-color: #fff;
}
.chapril-banniere-Menu summary:hover {
border-color: #ff9759;
cursor:pointer;
}
.chapril-banniere-Menu summary:hover span {
background-color: #ff9759;
}
.chapril-banniere-Menu div {
padding-top: 8px;
padding-bottom: 8px;
text-align: center;
background-color: #153a6a;
border-top: 1px solid #005184;
}
.chapril-banniere-Entree {
display: none;
}
}
</style>
<link rel="stylesheet" type="text/css" href="/Chapril-banner/v2/chapril-banner.css" />
</head>
<body>
<nav class="chapril-banniere-Nav">