Beanz/flatpress
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Leggero v1 is now responsive, thanks again Matthias! :)

Browse Source
This commit is contained in:
azett 2020-09-06 11:28:12 +02:00
parent 04900d4154
commit 27622c0c50
5 changed files with 135 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
fp-interface/themes/leggero/header.tpl
View File

@ -1,10 +1,10 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <html xmlns="http://www.w3.org/1999/xhtml" lang="{$fp_config.locale.lang}">
<head> <head>
<title>{$flatpress.title|tag:wp_title:'&laquo;'}</title> <title>{$flatpress.title|tag:wp_title:'&laquo;'}</title>
<meta http-equiv="Content-Type" content="text/html; charset={$flatpress.charset}" /> <meta http-equiv="Content-Type" content="text/html; charset={$flatpress.charset}" />
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700" rel="stylesheet" type="text/css" /> <link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700' rel='stylesheet' type='text/css'/>
{action hook=wp_head} {action hook=wp_head}
</head> </head>

BIN
fp-interface/themes/leggero/leggero-v2/imgs/backshade.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 979 B

18
fp-interface/themes/leggero/leggero/res/column.css
View File

@ -7,8 +7,11 @@ Ispired by: http://pluxml.org theme default
Name: Leggero Name: Leggero
Author: NoWhereMan & drudo Author: NoWhereMan & drudo
Version: 0.1 Version: 0.2
Module: style.css Module: style.css
last change: 2020-08-08
*/ */
@ -16,14 +19,17 @@ Module: style.css
/* ===== COLUMN ===== */ /* ===== COLUMN ===== */
#column { #column {
float: right; float: right;
width: 195px !important; /* width: 195px !important;
width: 180px; width: 180px; */
width: 28%;
font-size: 80% !important; font-size: 80% !important;
font-size: 75%; font-size: 75%;
height:1%; height:1%;
margin-bottom: 5px; margin: 1em;
padding: 10px; padding: 0.7em;
border-left: solid 1px #ccc /* margin-bottom: 5px;
padding: 10px; */
/* border-left: solid 1px #ccc */
} }
#column h4 { #column h4 {

77
fp-interface/themes/leggero/leggero/res/common.css
View File

@ -7,8 +7,11 @@ Ispired by: http://pluxml.org theme default
Name: Leggero Name: Leggero
Author: NoWhereMan & drudo Author: NoWhereMan & drudo
Version: 0.1 Version: 0.2
Module: common.css Module: common.css
last change: 2020-08-08
*/ */
@ -24,9 +27,10 @@ html {
body { body {
font-size: 100%; font-size: 100%;
padding: 0; padding: 0;
text-align:center; /* text-align: center; */
background: white url(../imgs/backshade.png) repeat-x; background: white url(../imgs/backshade.png) repeat-x;
color: black; color: black;
width: 100%
} }
hr { display: none } hr { display: none }
@ -35,6 +39,12 @@ p { margin: .5em 0 }
img { border: none } img { border: none }
/* Responsive Design img */
img {
max-width: 100%;
height: auto;
}
blockquote { blockquote {
width: 90%; width: 90%;
color: #666; color: #666;
@ -122,7 +132,7 @@ h1 {
/* Title of the blog */ /* Title of the blog */
font-size: 2em; font-size: 2em;
letter-spacing: 2px; letter-spacing: 2px;
margin: 2em 0 0 0 margin: 2em 0 0 0.5em
} }
h2 { } /* see h2.date */ h2 { } /* see h2.date */
@ -133,7 +143,8 @@ h3 {
font-style: italic; font-style: italic;
font-size: 1.5em; font-size: 1.5em;
color: #333333; color: #333333;
margin: 0 margin: 0;
padding: 1em 0 1em 0;
} }
h4 { font-size: 1.2em; } h4 { font-size: 1.2em; }
@ -143,10 +154,13 @@ h4 { font-size: 1.2em; }
/* ===== DIV CONTAINER ALL ELEMENTS BLOCK ===== */ /* ===== DIV CONTAINER ALL ELEMENTS BLOCK ===== */
#body-container { #body-container {
text-align: left; text-align: left;
width: 760px !important; /*width: 760px !important;
width: 748px; /* fix for I.E. */ width: 748px; /* fix for I.E. */
margin: 0 auto 0 auto; width: 85%;
padding: 5px; margin: 0 auto;
max-width: 68em;
/* padding: 5px; */
padding: 0.3em;
border: solid 1px #ccc; border: solid 1px #ccc;
background-color: white background-color: white
} }
@ -155,31 +169,40 @@ h4 { font-size: 1.2em; }
/* ===== HEAD ===== */ /* ===== HEAD ===== */
#head { #head {
clear: both;
font-family: 'book antiqua', georgia, garamond, times, 'times new roman', serif; font-family: 'book antiqua', georgia, garamond, times, 'times new roman', serif;
padding: 95px 10px 5px 5px; /* padding: 95px 10px 5px 5px;
margin: 10px; margin: 10px;
background: #c37676 url('../imgs/shade.png') repeat-x; background: #c37676 url('../imgs/shade.png') repeat-x;
border: #bbb 1px solid border: #bbb 1px solid */
margin: 1em;
padding: 7em 0.6em 0.5em 0.5em;
border-radius: 1em;
border: 0;
background-image: linear-gradient( #aa4142, #c37576);
/* background: #aa4142 */
} }
#head a { color: white; text-decoration: none } #head a { color: white; text-decoration: none }
#head a:hover { color: white; text-decoration: underline }
.subtitle { .subtitle {
font-size: 100%; font-size: 100%;
font-style: oblique; font-style: oblique;
color: #F1F1F1; color: #F1F1F1;
margin: .5em 0 0 0 margin: .5em 0 1em 1.2em
} }
/* ===== DIV CONTAINER "MAIN" ===== */ /* ===== DIV CONTAINER "MAIN" ===== */
#outer-container { #outer-container {
position: relative; /* position: relative;
height: 1%; height: 1%;
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
border-top: 1px solid white; /* problem with I.E. */ border-top: 1px solid white; /* problem with I.E. */
width: 100%;
background-color: white background-color: white
} }
@ -189,17 +212,20 @@ h4 { font-size: 1.2em; }
#main h4 { margin: 2em 0 0 0} #main h4 { margin: 2em 0 0 0}
#main { #main {
float:left; float: left;
position: relative; /* position: relative;
width: 508px !important; width: 508px !important;
width: 478px; width: 478px; */
width: 62%;
font-size: 100%; font-size: 100%;
margin: 12px; margin: 1em;
} }
#main p { line-height: 1.5em; margin-top: 1.2em; } #main p { line-height: 1.5em; margin-top: 1.2em; }
#main img { margin: .5em } #main img { margin: 0.5em }
#main img.emoticon { margin: 0; padding: 0 }
/* === List === */ /* === List === */
#main ul { #main ul {
@ -224,7 +250,7 @@ h4 { font-size: 1.2em; }
/* === Class of main block === */ /* === Class of main block === */
h2.date { h2.date {
font-size: 0.5em; font-size: 80%;
color: #aaa; color: #aaa;
} }
@ -232,7 +258,7 @@ h4 { font-size: 1.2em; }
font-size: 80%; font-size: 80%;
font-style: oblique; font-style: oblique;
color: gray; color: gray;
margin: .2em 0 .8em 0 margin: .2em 0 0 0
} }
/* .entry class */ /* .entry class */
@ -284,6 +310,9 @@ h4 { font-size: 1.2em; }
clear: both; clear: both;
font-size: 80%; font-size: 80%;
color: #555; color: #555;
padding: 5px; background-color: #dcdcdc;
padding: 1em;
margin: 0 1em 1em 1em;
text-align: center;
border-top: #bbb 1px solid border-top: #bbb 1px solid
} }

69
fp-interface/themes/leggero/leggero/res/style.css
View File

@ -7,8 +7,11 @@ Ispired by: http://pluxml.org theme default
Name: Leggero Name: Leggero
Author: NoWhereMan & drudo Author: NoWhereMan & drudo
Version: 0.1 Version: 0.2
Module: style.css Module: style.css
last change: 2020-08-08
*/ */
@ -30,5 +33,67 @@ body { margin: 80px 0 0 0 }
#comments li.comment-admin strong.comment-name { font-size:140% } #comments li.comment-admin strong.comment-name { font-size:140% }
#widget-searchbox form { #widget-searchbox form {
text-align: center; /* text-align: center; */
} }
/* 800er Bildschirme zum Beispiel iPad Hochformat */
@media only screen and (max-width: 768px) {
#outer-container {
margin: 0;
padding: 0;
width: 100%;
}
#main {
width: 100%;
padding: 0.5em;
/* border: 1px solid yellow; */
}
#column {
width: 100%;
font-size: 80%;
margin-bottom: 2em;
padding: 0.5em;
/* border: 1px solid red; */
overflow: auto; /* shit, bei 84% Bildbreite wird es eng! */
}
}
/* Kleinbildschirme */
@media only screen and (max-width: 480px) {
#body-container {
margin: 0;
padding: 0;
width: 98%;
}
#head {
margin: 0;
padding: 0;
width: 100%;
}
#outer-container {
margin: 0;
padding: 0;
width: 100%;
}
#main {
margin: 0;
padding: 0;
width: 100%;
}
#column {
margin: 0;
padding: 0;
width: 100%;
}
}