DeltaLima/flatpress-theme-rainbow
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases 2 Packages Wiki Activity

made things transparent, colorful background image, header with logo wqmade in css

Browse source
This commit is contained in:
DeltaLima 2023-06-19 00:56:24 +02:00
parent 740105c7fa
commit 39f5a569d0
5 changed files with 66 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
header.tpl
View file

@ -9,8 +9,17 @@
<body> <body>
<div id="body-container"> <div id="body-container">
<div id="head"> <div id="head">
<h1><a href="index.php">{$flatpress.TITLE}</a></h1> <div id="head-bubble">
<p class="subtitle">{$flatpress.SUBTITLE}</p> <div id="title-container">
<h1><a href="index.php">{$flatpress.TITLE}</a></h1>
<p class="subtitle">{$flatpress.SUBTITLE}</p>
</div>
<div id="logo-container">
<img id="logo-img" src="/blog/fp-interface/themes/flatpress-theme-snail-orange/imgs/Mandrake-Tux_redraw.png">
</div>
<div id="clear-container"></div>
</div>
</div> </div>
<hr /> <hr />
<div id="outer-container"> <div id="outer-container">

BIN
imgs/Mandrake-Tux_redraw.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 97 KiB

BIN
imgs/header-background.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 90 KiB

14
res/column.css
View file

@ -7,13 +7,14 @@ Module: style.css
/* ===== COLUMN ===== */ /* ===== COLUMN ===== */
#column { #column {
background: #393939; /* background: #393939;*/
/* background-color: rgba(57, 57, 57, 1.0);*/
float: left; float: left;
width: 21% !important; width: 21% !important;
width: 18%; width: 18%;
font-size: 85% !important; font-size: 85% !important;
font-size: 80%; font-size: 80%;
margin: 0 0 15px 15px; margin: 0 0 15px 0;
padding: 10px; padding: 10px;
} }
@ -28,7 +29,14 @@ Module: style.css
#column ul li, #column p { font-size: 14px } #column ul li, #column p { font-size: 14px }
#column div { margin: 0 } #column div { margin: 0 }
#column div, #column ul { background: #393939 } /*#column div, #column ul { */
#column div {
/* background: #393939 */
background-color: rgba(0, 0, 0, 0.2);
border-radius: 15px;
padding: 2px;
}
#column p, #column div { margin: 10px 5px } #column p, #column div { margin: 10px 5px }
#column a:link, #column a:visited { color: #A29D7D } #column a:link, #column a:visited { color: #A29D7D }

50
res/common.css
View file

@ -18,7 +18,14 @@ body {
padding: 0; padding: 0;
text-align: center; text-align: center;
/*background: #315A94;*/ /*background: #315A94;*/
background: #222; background-image: url("../imgs/header-background.jpg");
background-size: cover;
background-position: bottom center;
background-repeat: no-repeat;
background-size:cover;
background-attachment:fixed;
background-color: #222;
} }
hr { display: none } hr { display: none }
@ -128,19 +135,48 @@ h6 { font-size: 0.9em }
width: 69%; /* fix for I.E. */ width: 69%; /* fix for I.E. */
margin: 0 auto 10px auto; margin: 0 auto 10px auto;
padding: 5px; padding: 5px;
background-color: #2D2D2D; /* background-color: #2D2D2D;*/
overflow: hidden; background-color: rgba(45, 45, 45, 0.8);
overflow: hidden;
border-radius: 15px;
} }
/* ===== HEAD ===== */ /* ===== HEAD ===== */
#head { #head {
background: url("../imgs/logo.jpg") no-repeat; /*background: url("../imgs/logo.jpg") no-repeat;*/
width: 100% !important; width: 680px; !important;
width: 95%; width: 680px;
height: 150px; height: 150px;
font-family: Tahoma, sans-serif; font-family: Tahoma, sans-serif;
float: center; float: center;
} }
#head-bubble {
background-color: rgba(0, 0, 0, 0.2);
border-radius: 15px;
width: 100% !important;
height: 128px;
margin: 5px 0 0 15px ;
}
#title-container {
width: 580px;
float: left;
}
#logo-container {
padding-right: 10px;
padding-top: 3px;
float: right;
}
#logo-img {
/*background: url("../imgs/Mandrake-Tux_redraw.png");*/
height: 120px;
}
#clear-container {
clear: both;
}
#head a { #head a {
color: white; color: white;
@ -171,7 +207,7 @@ h6 { font-size: 0.9em }
width: 69% !important; width: 69% !important;
width: 69%; width: 69%;
font-size: 100%; font-size: 100%;
margin: 0 0.5em 0 1.2em; margin: 1.5em 0.5em 0 1.2em;
} }
#main p { #main p {