quattro: options for posts and textareas font size

view/theme/quattro/config.php

@@ -11,8 +11,10 @@ function theme_content(&$a){
 	
 	$align = get_pconfig(local_user(), 'quattro', 'align' );
 	$color = get_pconfig(local_user(), 'quattro', 'color' );
-	
+    $tfs = get_pconfig(local_user(),"quattro","tfs");
-	return quattro_form($a,$align, $color);
+    $pfs = get_pconfig(local_user(),"quattro","pfs");    
+    
+	return quattro_form($a,$align, $color, $tfs, $pfs);
 }
 
 function theme_post(&$a){
@@ -22,6 +24,8 @@ function theme_post(&$a){
 	if (isset($_POST['quattro-settings-submit'])){
 		set_pconfig(local_user(), 'quattro', 'align', $_POST['quattro_align']);
 		set_pconfig(local_user(), 'quattro', 'color', $_POST['quattro_color']);
+		set_pconfig(local_user(), 'quattro', 'tfs', $_POST['quattro_tfs']);
+		set_pconfig(local_user(), 'quattro', 'pfs', $_POST['quattro_pfs']);
 	}
 }
 
@@ -29,25 +33,32 @@ function theme_post(&$a){
 function theme_admin(&$a){
 	$align = get_config('quattro', 'align' );
 	$color = get_config('quattro', 'color' );
-	
+    $tfs = get_config("quattro","tfs");
-	return quattro_form($a,$align, $color);
+    $pfs = get_config("quattro","pfs");    
+
+	return quattro_form($a,$align, $color, $tfs, $pfs);
 }
 
 function theme_admin_post(&$a){
 	if (isset($_POST['quattro-settings-submit'])){
 		set_config('quattro', 'align', $_POST['quattro_align']);
 		set_config('quattro', 'color', $_POST['quattro_color']);
+        set_config('quattro', 'tfs', $_POST['quattro_tfs']);
+		set_config('quattro', 'pfs', $_POST['quattro_pfs']);
 	}
 }
 
 
-function quattro_form(&$a, $align, $color){
+function quattro_form(&$a, $align, $color, $tfs, $pfs){
 	$colors = array(
 		"dark"=>"Quattro", 
 		"lilac"=>"Lilac", 
 		"green"=>"Green"
 	);
-	
+    
+    if ($tfs===false) $tfs="20";
+    if ($pfs===false) $pfs="12";
+    
 	$t = file_get_contents( dirname(__file__). "/theme_settings.tpl" );
 	$o .= replace_macros($t, array(
 		'$submit' => t('Submit'),
@@ -55,6 +66,8 @@ function quattro_form(&$a, $align, $color){
 		'$title' => t("Theme settings"),
 		'$align' => array('quattro_align', t('Alignment'), $align, '', array('left'=>t('Left'), 'center'=>t('Center'))),
 		'$color' => array('quattro_color', t('Color scheme'), $color, '', $colors),
+        '$pfs' => array('quattro_pfs', t('Posts font size'), $pfs),
+        '$tfs' => array('quattro_tfs',t('Textareas font size'), $tfs),
 	));
 	return $o;
 }

view/theme/quattro/dark/style.css

@@ -1152,9 +1152,6 @@ section {
   opacity: 0.5;
 }
 .wwto {
-  position: absolute !important;
-  width: 25px;
-  height: 25px;
   background: #FFFFFF;
   border: 2px solid #364e59;
   height: 25px;
@@ -2140,3 +2137,47 @@ footer {
 .videobb:hover {
   background-position: -112px -16px;
 }
+/** range input css **/
+/* slider root element */
+.slider {
+  height: 2px;
+  position: relative;
+  cursor: pointer;
+  border: 1px solid #333;
+  width: 200px;
+  margin: 10px 0px 10px 0px;
+  float: left;
+}
+/* progress bar (enabled with progress: true) */
+.progress {
+  height: 9px;
+  background-color: #C5FF00;
+  display: none;
+  opacity: 0.6;
+}
+/* drag handle */
+.handle {
+  background-color: #ccc;
+  height: 16px;
+  width: 8px;
+  top: -8px;
+  position: absolute;
+  display: block;
+  margin-top: 1px;
+  border: 1px solid #000;
+  cursor: move;
+  -moz-border-radius: 0 0 5px 5px;
+  -webkit-border-radius: 0 0 5px 5px;
+  border-radius: 0 0 5px 5px;
+  -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
+  -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
+  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
+}
+/* the input field */
+.range {
+  width: 20px!important;
+  font-size: 8pt;
+  margin-left: 10px;
+  border: 0px;
+  color: #999999;
+}

view/theme/quattro/green/style.css

@@ -1152,9 +1152,6 @@ section {
   opacity: 0.5;
 }
 .wwto {
-  position: absolute !important;
-  width: 25px;
-  height: 25px;
   background: #FFFFFF;
   border: 2px solid #364e59;
   height: 25px;
@@ -2140,3 +2137,47 @@ footer {
 .videobb:hover {
   background-position: -112px -16px;
 }
+/** range input css **/
+/* slider root element */
+.slider {
+  height: 2px;
+  position: relative;
+  cursor: pointer;
+  border: 1px solid #333;
+  width: 200px;
+  margin: 10px 0px 10px 0px;
+  float: left;
+}
+/* progress bar (enabled with progress: true) */
+.progress {
+  height: 9px;
+  background-color: #C5FF00;
+  display: none;
+  opacity: 0.6;
+}
+/* drag handle */
+.handle {
+  background-color: #ccc;
+  height: 16px;
+  width: 8px;
+  top: -8px;
+  position: absolute;
+  display: block;
+  margin-top: 1px;
+  border: 1px solid #000;
+  cursor: move;
+  -moz-border-radius: 0 0 5px 5px;
+  -webkit-border-radius: 0 0 5px 5px;
+  border-radius: 0 0 5px 5px;
+  -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
+  -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
+  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
+}
+/* the input field */
+.range {
+  width: 20px!important;
+  font-size: 8pt;
+  margin-left: 10px;
+  border: 0px;
+  color: #999999;
+}

view/theme/quattro/quattro.less

@@ -1457,3 +1457,48 @@ footer { height: 100px; display: table-row; }
 .videobb:hover { background-position: -112px -16px; }
 
 
+/** range input css **/
+/* slider root element */
+.slider {
+    height:2px;
+    position:relative;
+    cursor:pointer;
+    border:1px solid #333;
+    width:200px;
+    margin:10px 0px 10px 0px;
+	float: left;
+}
+
+/* progress bar (enabled with progress: true) */
+.progress {
+    height:9px;
+    background-color:#C5FF00;
+    display:none;
+    opacity:0.6;
+}
+
+/* drag handle */
+.handle {
+	background-color:#ccc;
+    height:16px;
+    width:8px;
+    top:-8px;
+    position:absolute;
+    display:block;
+    margin-top:1px;
+    border:1px solid #000;
+    cursor:move;
+	.roundbottom();
+	.shadow();
+
+}
+
+/* the input field */
+.range {
+	width: 20px!important;
+	font-size: 8pt;
+	margin-left: 10px;
+	border: 0px;
+	color: @FieldHelpColor;
+}
+

view/theme/quattro/style.php

@@ -29,10 +29,27 @@
 		";
 	}
 
-    $textarea_font_size = "20";
+    
+
+    $textarea_font_size = false;
+    $post_font_size = false;
+    
+    $site_textarea_font_size = get_config("quattro","tfs");
+    $site_post_font_size = get_config("quattro","pfs");
+    if ($site_textarea_font_size===false) $site_textarea_font_size="20";
+    if ($site_post_font_size===false) $site_post_font_size="12";
+    
+   	if (local_user()) {
+        $textarea_font_size = get_pconfig(local_user(), "quattro","tfs");
+        $post_font_size = get_pconfig(local_user(), "quattro","pfs");    
+	} 
+    
+    if ($textarea_font_size===false) $textarea_font_size = $site_textarea_font_size;
+    if ($post_font_size===false) $post_font_size = $site_post_font_size;
 
     echo "
         textarea { font-size: ${textarea_font_size}px; }
         .wall-item-comment-wrapper .comment-edit-text-full { font-size: ${textarea_font_size}px; }
         #jot .profile-jot-text:focus { font-size: ${textarea_font_size}px; }
+        .wall-item-container .wall-item-content  { font-size: ${post_font_size}px; }
     ";

view/theme/quattro/theme_settings.tpl

@@ -4,7 +4,22 @@
 
 {{inc field_select.tpl with $field=$align}}{{endinc}}
 
-<input type="range" name="rage1" value="0" min="-1" max="1" step="0.01"  />
+
+<div class="field">
+    <label for="id_$pfs.0">$pfs.1</label>
+    <input type="range" class="inputRange" id="id_$pfs.0" name="$pfs.0" value="$pfs.2" min="10" max="22" step="1"  />
+    <span class="field_help"></span>
+</div>
+
+
+<div class="field">
+    <label for="id_$tfs.0">$tfs.1</label>
+    <input type="range" class="inputRange" id="id_$tfs.0" name="$tfs.0" value="$tfs.2" min="10" max="22" step="1"  />
+    <span class="field_help"></span>
+</div>
+
+
+
 
 
 <div class="settings-submit-wrapper">
@@ -12,5 +27,6 @@
 </div>
 
 <script>
-    $(":range").rangeinput();
+    
+    $(".inputRange").rangeinput();
 </script>