diff --git a/www/data/css/styles.css b/www/data/css/styles.css
index 4042d7d..d2b25e9 100644
--- a/www/data/css/styles.css
+++ b/www/data/css/styles.css
@@ -1153,6 +1153,50 @@ html, body {
.programs_pnl_bottom_1, .programs_pnl_bottom_2 {
flex-direction: row; } }
/* 400px */
+.blog_pnl_content {
+ display: flex;
+ align-items: center;
+ flex-direction: column; }
+
+.blogpnl_base {
+ width: 100%;
+ border: solid 1px #444;
+ margin: 10px 5px;
+ color: #333;
+ text-decoration: none;
+ background-color: #BBB; }
+
+.blogpnl_date {
+ background-color: #AAA;
+ color: #333; }
+
+.blogpnl_base:hover {
+ border: solid 1px black;
+ background-color: white;
+ color: black; }
+
+.blogpnl_base:hover .blogpnl_date {
+ background-color: white;
+ color: black;
+ border-bottom: 1px solid black; }
+
+.blogpnl_date {
+ background-color: #AAA;
+ border-bottom: 1px solid transparent;
+ padding: 2px;
+ font-size: 0.8em;
+ font-style: italic; }
+
+.blogpnl_title {
+ font-weight: bold;
+ font-size: 1.2em;
+ text-align: left;
+ margin: 2px 0 2px 10px; }
+
+@media (max-width: 850px) {
+ .blogpnl_title {
+ text-align: center; } }
+/* 400px */
.bfjoust_runner_owner {
border: 1px solid #888;
background: #F8F8F8;
diff --git a/www/data/css/styles.min.css b/www/data/css/styles.min.css
index a41d41c..f41c2ac 100644
--- a/www/data/css/styles.min.css
+++ b/www/data/css/styles.min.css
@@ -278,6 +278,14 @@ html,body{margin:0;padding:0;height:100%}
.programs_pnl_bottom_sub_top{margin-left:4px;margin-right:6px}
.programs_pnl_bottom_1,.programs_pnl_bottom_2{flex-direction:row}
}
+.blog_pnl_content{display:flex;align-items:center;flex-direction:column}
+.blogpnl_base{width:100%;border:solid 1px #444;margin:10px 5px;color:#333;text-decoration:none;background-color:#BBB}
+.blogpnl_date{background-color:#AAA;color:#333}
+.blogpnl_base:hover{border:solid 1px black;background-color:white;color:black}
+.blogpnl_base:hover .blogpnl_date{background-color:white;color:black;border-bottom:1px solid black}
+.blogpnl_date{background-color:#AAA;border-bottom:1px solid transparent;padding:2px;font-size:.8em;font-style:italic}
+.blogpnl_title{font-weight:bold;font-size:1.2em;text-align:left;margin:2px 0 2px 10px}
+@media(max-width:850px){.blogpnl_title{text-align:center}}
.bfjoust_runner_owner{border:1px solid #888;background:#f8f8f8;padding:6px}
.bfjoust_runner_owner .hsplit{display:flex;flex-direction:row;flex-wrap:nowrap}
.bfjoust_runner_owner .hsplit_1{flex:1;margin:4px}
diff --git a/www/data/css/styles.scss b/www/data/css/styles.scss
index c5948b4..12a1138 100644
--- a/www/data/css/styles.scss
+++ b/www/data/css/styles.scss
@@ -15,5 +15,6 @@
@import 'styles_eulerpanel';
@import 'styles_programspanel';
+@import 'styles_blogpanel';
@import 'styles_bfjoustrunner';
@import 'styles_befungerunner';
\ No newline at end of file
diff --git a/www/data/css/styles_blogpanel.scss b/www/data/css/styles_blogpanel.scss
new file mode 100644
index 0000000..3803656
--- /dev/null
+++ b/www/data/css/styles_blogpanel.scss
@@ -0,0 +1,44 @@
+@import 'styles_config';
+
+
+.blog_pnl_content {
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+}
+
+.blogpnl_base {
+ width: 100%;
+
+ border: solid 1px #444;
+ margin: 10px 5px;
+ color: $COL_TEXT_DARK;
+ text-decoration: none;
+
+ background-color: #BBB;
+}
+
+.blogpnl_date { background-color: #AAA; color: $COL_TEXT_DARK; }
+
+.blogpnl_base:hover { border: solid 1px $COL_COMPLEXHOVER_BRD; background-color: $COL_COMPLEXHOVER_BG; color: $COL_COMPLEXHOVER_FG; }
+.blogpnl_base:hover .blogpnl_date { background-color: $COL_COMPLEXHOVER_BG; color: $COL_COMPLEXHOVER_FG; border-bottom: 1px solid $COL_COMPLEXHOVER_BRD; }
+
+.blogpnl_date {
+ background-color: #AAA;
+ border-bottom: 1px solid transparent;
+ padding: 2px;
+ font-size: 0.8em;
+ font-style: italic;
+}
+
+.blogpnl_title {
+ font-weight: bold;
+ font-size: 1.2em;
+ text-align: left;
+ margin: 2px 0 2px 10px;
+}
+
+
+@include rdmedia_range(0,1) {
+ .blogpnl_title { text-align: center; }
+}
\ No newline at end of file
diff --git a/www/fragments/blogview_euler_single.php b/www/fragments/blogview_euler_single.php
index 3b154ad..4792acd 100644
--- a/www/fragments/blogview_euler_single.php
+++ b/www/fragments/blogview_euler_single.php
@@ -56,7 +56,7 @@ $max = ceil($max / 20) * 20;
'speed' => $problem['steps'] < 500000 ? 2 : 3,
'editable' => false,
];
- echo require (__DIR__ . '/../fragments/befunge93_runner.php');
+ echo require (__DIR__ . '/../fragments/widget_befunge93.php');
if ($problem['abbreviated']) echo 'This program is too big to display/execute here, click [download] to get the full program.
';
?>
diff --git a/www/fragments/panel_blog.php b/www/fragments/panel_blog.php
new file mode 100644
index 0000000..4dd168b
--- /dev/null
+++ b/www/fragments/panel_blog.php
@@ -0,0 +1,33 @@
+
+
+