create theme chocolate
This commit is contained in:
415
app/static/themes/chocolate/css/base.css
Normal file
415
app/static/themes/chocolate/css/base.css
Normal file
@@ -0,0 +1,415 @@
|
||||
@font-face{
|
||||
font-family:"Rosa Black Sans";
|
||||
src:url("fonts/hinted-RosaSans-Black.ttf") format("truetype");
|
||||
font-weight:normal;
|
||||
font-style:normal
|
||||
}
|
||||
|
||||
@font-face
|
||||
{
|
||||
font-family:"Rosa Black Italic";
|
||||
src:url("fonts/hinted-RosaSans-BlackItalic.ttf") format("truetype");
|
||||
font-weight:normal;font-style:italic
|
||||
}
|
||||
|
||||
@font-face
|
||||
{
|
||||
font-family:"Rosa Black Bold";
|
||||
src:url("fonts/hinted-RosaSans-Bold.ttf") format("truetype");
|
||||
font-weight:bold;
|
||||
font-style:normal
|
||||
}
|
||||
|
||||
html
|
||||
{
|
||||
height:100%;
|
||||
width:80%;
|
||||
margin-left:10%
|
||||
}
|
||||
|
||||
body, .modal-content
|
||||
{
|
||||
color:#fff487;
|
||||
background-color:#45050c
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-top:2vw;
|
||||
}
|
||||
|
||||
.icon
|
||||
{
|
||||
margin-bottom:5px
|
||||
}
|
||||
|
||||
.icons img
|
||||
{
|
||||
width:2vw;
|
||||
height:2vw;
|
||||
margin-top:10px;
|
||||
display:inline-block;
|
||||
align-items:center
|
||||
}
|
||||
|
||||
|
||||
hr
|
||||
{
|
||||
color:#fff487
|
||||
}
|
||||
|
||||
*
|
||||
{
|
||||
-moz-box-sizing:border-box;
|
||||
box-sizing:border-box
|
||||
}
|
||||
|
||||
a
|
||||
{
|
||||
color:#d39050;text-decoration:none
|
||||
}
|
||||
|
||||
a:hover{
|
||||
color: #fff487;
|
||||
}
|
||||
|
||||
.date
|
||||
{
|
||||
margin-bottom:0
|
||||
}
|
||||
|
||||
.slug
|
||||
{
|
||||
text-align:left;
|
||||
margin-bottom:2rem;
|
||||
}
|
||||
|
||||
.readmore
|
||||
{
|
||||
text-align:right
|
||||
}
|
||||
|
||||
.readmore a
|
||||
{
|
||||
color:#fff487;
|
||||
text-decoration:underline
|
||||
}
|
||||
|
||||
.menugauche
|
||||
{
|
||||
position:fixed;
|
||||
max-width:100px
|
||||
}
|
||||
|
||||
.menu img
|
||||
{
|
||||
max-width:20px;
|
||||
max-height:20px;
|
||||
}
|
||||
|
||||
|
||||
.copyleft
|
||||
{
|
||||
display:inline-block;
|
||||
transform:rotate(180deg);
|
||||
padding-bottom:-15px
|
||||
}
|
||||
|
||||
pre
|
||||
{
|
||||
white-space:pre-wrap;
|
||||
white-space:-moz-pre-wrap;
|
||||
white-space:-pre-wrap;
|
||||
white-space:-o-pre-wrap;
|
||||
word-wrap:break-word;
|
||||
}
|
||||
|
||||
.toggle
|
||||
{
|
||||
background-color:#fff487;
|
||||
text-align:center;
|
||||
height:100px;
|
||||
width:100px;
|
||||
border-radius:50%;
|
||||
position:fixed;
|
||||
margin:140px;
|
||||
margin-left:10%;
|
||||
top:20%;
|
||||
bottom:0px;
|
||||
left:0px;
|
||||
right:0px
|
||||
}
|
||||
|
||||
.toggle h2
|
||||
{
|
||||
margin-top:1.5em;
|
||||
color:#45050c
|
||||
}
|
||||
|
||||
.menu{
|
||||
background-color:#d39050;
|
||||
height:100px;
|
||||
width:100px;
|
||||
transform:scale(0);
|
||||
border-radius:50%;
|
||||
border-style:double;
|
||||
border-color:#fff487;
|
||||
position:fixed;
|
||||
margin-top:140px;
|
||||
margin-left:10%;
|
||||
top:20%;
|
||||
bottom:0px;
|
||||
left:0px;
|
||||
right:0px;
|
||||
z-index:-1;
|
||||
transition:.7s
|
||||
}
|
||||
|
||||
.menu a{
|
||||
display:inline-block;
|
||||
position:fixed;
|
||||
font-size:15px;
|
||||
color:#45050c
|
||||
}
|
||||
|
||||
ul{
|
||||
list-style-type:none;
|
||||
margin:0;
|
||||
padding:0
|
||||
}
|
||||
|
||||
.menu p
|
||||
{
|
||||
margin-top:-4px;
|
||||
font-size:5px;
|
||||
}
|
||||
|
||||
.post
|
||||
{
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.articles, .modal-content
|
||||
{
|
||||
margin-left:10vw;
|
||||
margin-right:10vw;
|
||||
margin-top:5rem;
|
||||
margin-bottom:3rem;
|
||||
padding:.5em;
|
||||
/*border:7px double;
|
||||
border-color:#fff487;
|
||||
border-radius:10px 10px 10px 10px;*/
|
||||
line-height:1.5;
|
||||
letter-spacing:.1vw;
|
||||
}
|
||||
|
||||
.articles ul, ol
|
||||
{
|
||||
list-style-type:disc;
|
||||
margin:5vw;
|
||||
padding-top:1vw;
|
||||
padding-bottom:1vw;
|
||||
padding-left:1.5vw;
|
||||
}
|
||||
|
||||
.articles h2,h3,h4
|
||||
{
|
||||
color:#d39050;
|
||||
}
|
||||
|
||||
.articles .titre
|
||||
{
|
||||
color:#d39050;
|
||||
text-align:center
|
||||
}
|
||||
|
||||
.articles img
|
||||
{
|
||||
display:block;
|
||||
margin-left:auto;
|
||||
margin-right:auto;
|
||||
margin-bottom:2vw;
|
||||
}
|
||||
|
||||
.articles .description
|
||||
{
|
||||
font-weight:300;
|
||||
font-size:1vw;
|
||||
padding-bottom:30px;
|
||||
color:#fff487
|
||||
}
|
||||
|
||||
.pagination a
|
||||
{
|
||||
border:1px solid;
|
||||
border-color:#d39050;
|
||||
padding:3px;
|
||||
font-size:13px
|
||||
}
|
||||
|
||||
.center
|
||||
{
|
||||
margin:auto;
|
||||
width:50%;
|
||||
padding:10px
|
||||
}
|
||||
|
||||
.contact
|
||||
{
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
footer
|
||||
{
|
||||
position:relative;
|
||||
bottom:0px;
|
||||
width:100%;
|
||||
text-align:center
|
||||
}
|
||||
|
||||
.btn:hover a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 980px)
|
||||
{
|
||||
.articles .description{
|
||||
font-size:4vw
|
||||
}
|
||||
|
||||
.articles
|
||||
{
|
||||
margin-left:0;
|
||||
position:relative;
|
||||
font-size:3.5vw
|
||||
}
|
||||
|
||||
.toggle
|
||||
{
|
||||
display:none
|
||||
}
|
||||
|
||||
.menugauche
|
||||
{
|
||||
max-width:unset;
|
||||
position:sticky;
|
||||
top:0px;
|
||||
z-index:5;
|
||||
width:100%
|
||||
}
|
||||
|
||||
.menu {
|
||||
width:100%;
|
||||
height:13vw;
|
||||
border-radius:0%;
|
||||
border:5px double;
|
||||
border-color:#fff487;
|
||||
position:sticky;
|
||||
margin-top:0rem;
|
||||
border-radius:10px 10px 10px 10px;
|
||||
margin-bottom:0px;
|
||||
margin-left:0;
|
||||
transform:none
|
||||
}
|
||||
|
||||
.menu a{
|
||||
display:inline-block;
|
||||
position:absolute
|
||||
}
|
||||
|
||||
.menu img{
|
||||
transform:scale(4)}
|
||||
.menu p{margin:.3rem;
|
||||
font-size:13px
|
||||
}
|
||||
|
||||
.menu img:hover
|
||||
{
|
||||
transform:scale(5)
|
||||
}
|
||||
|
||||
a:nth-child(1)
|
||||
{
|
||||
top:4vw;
|
||||
left:20%
|
||||
}
|
||||
|
||||
a:nth-child(4)
|
||||
{
|
||||
top:4vw;
|
||||
left:40%
|
||||
}
|
||||
|
||||
a:nth-child(2)
|
||||
{
|
||||
top:4vw;
|
||||
left:60%
|
||||
}
|
||||
|
||||
a:nth-child(3)
|
||||
{
|
||||
top:4vw;
|
||||
left:80%
|
||||
}
|
||||
|
||||
footer
|
||||
{
|
||||
font-size:3vw
|
||||
}
|
||||
.icons img
|
||||
{
|
||||
width:7vw;
|
||||
height:7vw;
|
||||
margin:20px;
|
||||
display:inline-block;
|
||||
align-items:center
|
||||
}
|
||||
|
||||
.articles img{
|
||||
display:block;
|
||||
margin-left:auto;
|
||||
margin-right:auto;
|
||||
width:80%
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 980px)
|
||||
{
|
||||
html
|
||||
{
|
||||
height:100%;
|
||||
width:100%;
|
||||
margin:0
|
||||
}
|
||||
.menu p
|
||||
{
|
||||
display:none
|
||||
}
|
||||
|
||||
.menu
|
||||
{
|
||||
align-self:center
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px)
|
||||
{
|
||||
.menu{height:15vw}
|
||||
.menu img
|
||||
{
|
||||
max-width:10px;
|
||||
max-height:10px
|
||||
}
|
||||
.title h1
|
||||
{
|
||||
font-size:5vw
|
||||
}
|
||||
|
||||
.icons img{
|
||||
width:7vw;
|
||||
height:7vw;
|
||||
margin:20px;
|
||||
display:inline-block;
|
||||
align-items:center;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user