/ Published in: Ruby
For all the advanced personal mobile technology over here in Japan, most mobile phone carriers remain quirky, inconsistent and downright annoying in their handling of modern web technologies.
I use the following simple ruby CSS class to streamline the process of in-lining CSS declarations in dynamically generated markup, when designing sites geared towards the Japanese mobile market.
Expand |
Embed | Plain Text
########################################### #Class: CSSdef - Sitewide CSS styling. ########################################### class CSSdef #Public/instance variables. attr_accessor :body_css attr_accessor :width_100 attr_accessor :center_css attr_accessor :left_css attr_accessor :right_css attr_accessor :whiteborder_css attr_accessor :underlinetxt_css attr_accessor :tinytinytxt_css attr_accessor :tinytxt_css attr_accessor :smalltxt_css attr_accessor :mediumtxt_css attr_accessor :orangetxt_css attr_accessor :boldorangetxt_css attr_accessor :boldwhitetxt_css attr_accessor :tinygreytxt_css attr_accessor :smallgreytxt_css attr_accessor :mediumgreytxt_css attr_accessor :defaultgreytxt_css attr_accessor :blueunderlinetxt_css attr_accessor :blue_css attr_accessor :purple_css attr_accessor :pink_css attr_accessor :orange_css attr_accessor :yellow_css attr_accessor :lightgrey_css attr_accessor :imglarge_css attr_accessor :darkred_css attr_accessor :hr_css attr_accessor :a_link attr_accessor :a_visited attr_accessor :a_hover attr_accessor :a_active attr_accessor :pinklink_css attr_accessor :bluelink_css #Constructor. def initialize() #Structure. @body_css = "font-size: medium; background: #ffffff; width: 100%; color: #404040;" @width_100 = "width: 100%;" #Containers. @center_css = "width: 100%; text-align: center;" @left_css = "width: 100%; text-align: left;" @right_css = "width: 100%; text-align: right;" @whiteborder_css = "border-width: 1px; border-style:solid; border-color: #FFFFFF;" #Text. @tinytinytxt_css = "font-size: xx-small;" @tinytxt_css = "font-size: x-small;" @smalltxt_css = "font-size: small;" @mediumtxt_css = "font-size: medium;" @orangetxt_css = "color: #FFC000;" @boldorangetxt_css = "color: #FFC000; font-weight: bold; font-size: medium;" @boldwhitetxt_css = "color: #FFFFFF; font-weight: bold; font-size: medium;" @tinygreytxt_css = "color: #B2B2B2; font-size: x-small;" @smallgreytxt_css = "color: #B2B2B2; font-size: small;" @mediumgreytxt_css = "color: #B2B2B2; font-size: medium;" @underlinetxt_css = "text-decoration: underline;" @blueunderlinetxt_css = "border-bottom: 1px solid #00b0f0;" @defaultgreytxt_css = "color: #404040;" #Basic colors. @blue_css = "color: #558ed5;" @purple_css = "color: #7030a0;" @pink_css = "color: #ff0066;" @orange_css = "color: #ff6600;" @yellow_css = "color: #ffc000;" @lightgrey_css = "color: #d9d9d9;" @darkred_css = "color: #a60000;" #Horizontal ruler @hr_css = "color: #FFFFFF;" #Images. @imglarge_css = "width: 240px;" #Links. @pinklink_css = "color: #ff0066;" @bluelink_css = "color: #00b0f0;" @a_link = "font-size: medium; text-decoration: underline; color: #fff;" @a_visited = "font-size: medium; text-decoration: underline; color: #fff;" @a_hover = "font-size: medium; text-decoration: underline; color: #76C5E9;" @a_active = "font-size: medium; text-decoration: underline; color: #76C5E9;" end ########################################### #Public methods. public() ########################################### #Method: printStyle(). def printStyle(styledec_a, styledec_b = nil, styledec_c = nil) stylestring = "style=" if(styledec_b) stylestring.concat("\"#{styledec_a} #{styledec_b}\"") elsif(styledec_c) stylestring.concat("\"#{styledec_a} #{styledec_b} #{styledec_c}\"") else stylestring.concat("\"#{styledec_a}\"") end end ########################################### ########################################### #Private methods. private() ########################################### ########################################### ########################################### #Protected methods. protected() ########################################### ########################################### end ###########################################
You need to login to post a comment.
