From: senator Date: Fri, 4 Feb 2011 01:24:28 +0000 (-0500) Subject: started moving some inline styles into css classes X-Git-Url: https://old-git.evergreen-ils.org/?a=commitdiff_plain;h=81888db2be73c6afec1033b1cf9c885a2e9ed58c;p=evergreen%2Fequinox.git started moving some inline styles into css classes Here's the deal so far: all the inline styles are covered by one class in semiauto.css, but those were created programatically and reflect no understanding of the relationship between the purpose of any given element that's styled and what its style is. These auto-generated styles also are kind of redundant, since with many of them, instead of using the style with a long definition, you could use a combination of smaller styles. The existing markup uses many slightly different style attributes, so there's plenty of stuff like "width: 12", "width: 13", "width: 14", etc, so there's no way to map a lot of this to semantically meaningful names. some of these classes are just going to end up with names like "wide-fourteen" that are no better than inline styles. But others, as we find them manually, can be grouped and renamed into something meaningful, and sometimes style can be put into prexisting id and class definitions. Should be a couple more hours work. semiauto.css reflects progress with the generated classes. changes to style.css reflect early places where style could be moved into pre-existing classes. --- diff --git a/Open-ILS/web/opac/skin/kcls-wire/css/semiauto.css b/Open-ILS/web/opac/skin/kcls-wire/css/semiauto.css new file mode 100644 index 0000000000..a5fdc0868e --- /dev/null +++ b/Open-ILS/web/opac/skin/kcls-wire/css/semiauto.css @@ -0,0 +1,183 @@ +.opac-auto-001 { background: #2bb0fd; } +.opac-auto-002 { background: #54987f; } +.opac-auto-003 { background: #decc92; } +.opac-auto-004 { background: #E0F0E0; } +.opac-auto-005 { background: #ffc331; } +.gray-back { background: gray; } +.pink-back { background: pink; } +.white-back { background: white; } +.opac-auto-009 { border: 3px solid #E0E0E0; } +.opac-auto-010 { border-bottom: 1px dotted #ccc; padding-top: 10px; } +.opac-auto-011 { border-bottom: 1px dotted #ccc; padding-top: 6px; } +.opac-auto-012 { border-bottom: none; } +.opac-auto-013 { border-bottom: none; *height: 0px; } +.opac-auto-014 { border-collapse: collapse; } +.opac-auto-015 { border-left: 1px solid #e9ebf3; padding-right: 27px; } +.opac-auto-016 { border: none; } +.opac-auto-017 { border: none; width: 100%; } +.opac-auto-018 { border-top: 1px dotted #ccc; padding-top: 17px; } +.opac-auto-019 { border-top: none; } +.clear-both { clear: both; } +.common-no-pad { clear: both; height: 0px; margin: 0px; padding: 0px; } +.common-full-pad { clear: both; height: 15px; } +.opac-auto-029 { color: #333; font-weight: bold; font-size: 13px; } +.opac-auto-030 { color: #545454; } +.opac-auto-031 { color: #9999FF; padding-left: 10px; font-size: 7pt; font-weight: 300; } +.red { color: red; } +.bold-red { color: red; font-weight: bold } +.pointer { cursor: pointer; } +.no-display { display: none } +.float-left { float: left; } +.opac-auto-039 { float: left; font-weight: bold; padding-top: 5px; } +.opac-auto-040 { float: left; padding: 5px 0px 0px 10px; } +.opac-auto-042 { float: left; width: 163px; height: 30px; background: url('/opac/skin/kcls/graphics/utils-corner-mid.png') repeat-x top; } +.opac-auto-043 { float: left; width: 300px; margin-top: 20px; } +.float-right { float: right; } +.opac-auto-045 { float: right; margin-right: 17px; } +.opac-auto-046 { float: right; width: 214px; } +.opac-auto-047 { float: right; width: 353px; background: #ccc; padding: 10px; margin-top: 7px; } +.opac-auto-048 { float: right; width: 65px; } +.opac-auto-049 { float: right; width: 675px; height: 213px; color: green; overflow: hidden; } +.opac-auto-050 { float: right; width: 85px; } +.ten-px { font-size: 10px; } +.eleven-px { font-size: 11px; } +.eight-pt { font-size: 8pt; } +.opac-auto-054 { font-size: 8pt; padding-left: 20px; } +.bold { font-weight: bold; } +.opac-auto-057 { font-weight: bold; padding: 5px; margin: 5px; width: 100%; } +.opac-auto-058 { font-weight: bold; padding-left: 10px; } +.opac-auto-059 { font-weight: bold; padding-right: 10px; } +.opac-auto-060 { font-weight: normal; } +.opac-auto-061 { height: 0px; border-top: 1px solid #b7b7b7; border-bottom: 1px solid #d4d4d4; margin: 15px 0px; } +.small-height { height: 10px; } +.normal-height { height: 15px; } +.big-height { height: 20px; } +.very-big-height { height: 30px; } +.opac-auto-066 { height: 24px; background: #252525; } +.opac-auto-067 { margin: 3px; width: 100%; } +.opac-auto-068 { margin: auto; width: 974px; height: 0px; } +.opac-auto-069 { margin-bottom: 10px; } +.opac-auto-070 { margin-bottom: 20px; } +.opac-auto-071 { margin-bottom: 5px; } +.opac-auto-072 { margin-left: 20px; } +.opac-auto-073 { margin-left: 5px; margin-top: 5px; } +.opac-auto-074 { margin-left: 6px; } +.opac-auto-075 { margin-right: 20px; } +.opac-auto-076 { margin-right: 3px; } +.opac-auto-077 { margin-right: 4px; position: relative; top: -10px; } +.opac-auto-078 { margin-right: 7px; } +.opac-auto-079 { margin-top: 10px; } +.opac-auto-080 { margin-top: 10px; margin-bottom: 10px; } +.opac-auto-081 { margin-top: 13px; } +.opac-auto-082 { margin-top: 29px; } +.opac-auto-083 { margin-top: 2px; } +.opac-auto-084 { margin-top: 5px; } +.opac-auto-085 { margin-top: 6px; margin-left: 20px; width: 250px; padding: 5px; } +.opac-auto-086 { margin-top: 8px; } +.opac-auto-087 { max-width: 11em; } +.opac-auto-088 { padding: 0px; } +.opac-auto-089 { padding: 0px 10px; } +.opac-auto-090 { padding: 10px; } +.opac-auto-091 { padding: 10px 0px; } +.opac-auto-092 { padding: 4px; text-align: center; } +.pad-bottom-five { padding: 5px; } +.opac-auto-094 { padding: 5px 7px 0px 0px; } +.opac-auto-095 { padding: 5px 7px 0px 0px; white-space: nowrap; } +.opac-auto-096 { padding: 6px } +.opac-auto-097 { padding: 8px 0px 6px 0px; } +.opac-auto-098 { padding-bottom: 10px; } +.opac-auto-099 { padding-bottom: 12px; color: #666; } +.opac-auto-100 { padding-bottom: 16px; } +.opac-auto-101 { padding-bottom: 1px; } +.opac-auto-102 { padding-bottom: 7px; } +.opac-auto-103 { padding-left: 10px; } +.opac-auto-104 { padding-left: 11px; padding-right: 11px; } +.opac-auto-105 { padding-left: 11px; padding-right: 13px; } +.opac-auto-106 { padding-left: 15px; } +.opac-auto-107 { padding-left: 15px; padding-bottom: 10px; } +.opac-auto-108 { padding-left: 5px; } +.opac-auto-109 { padding-left: 5px; padding-bottom: 10px; } +.opac-auto-110 { padding-left: 6px; } +.opac-auto-111 { padding-left: 8px; } +.opac-auto-112 { padding-left: 9px; } +.opac-auto-113 { padding-right: 10px; } +.opac-auto-114 { padding-right: 15px; padding-left: 15px; } +.opac-auto-115 { padding-right: 20px; } +.opac-auto-116 { padding-right: 5px; } +.opac-auto-117 { padding-right: 7px; } +.pad-top-ten { padding-top: 10px; } +.opac-auto-119 { padding-top: 14px; } +.opac-auto-120 { padding-top: 5px; } +.opac-auto-121 { padding-top: 6px; } +.opac-auto-122 { padding-top: 7px; } +.opac-auto-123 { padding-top: 8px; } +.opac-auto-124 { position: absolute } +.opac-auto-125 { position: absolute; } +.opac-auto-126 { position: absolute; z-index: 101; } +.opac-auto-127 { position: relative; } +.opac-auto-128 { position: relative; left: -10px; } +.opac-auto-129 { position: relative; left: -19px; } +.opac-auto-130 { position: relative; left: 80px; } +.opac-auto-131 { position: relative; top: 0px; left: 55px; } +.opac-auto-132 { position: relative; top: 13px; } +.opac-auto-133 { position: relative; top: -13px; left: 2px; font-size: 10px; } +.opac-auto-134 { position: relative; top: -15px; left: 172px; } +.opac-auto-135 { position: relative; top: -15px; left: -23px; } +.opac-auto-136 { position: relative; top: 161px; left: 172px; } +.opac-auto-137 { position: relative; top: 161px; left: -23px; } +.opac-auto-138 { position: relative; top: -1px; left: 10px; } +.opac-auto-139 { position: relative; top: 1px; left: 10px; } +.opac-auto-140 { position: relative; top: -2px; } +.opac-auto-141 { position: relative; top: 2px; left: 40px; } +.opac-auto-142 { position: relative; top: 2px; left: 50px; } +.opac-auto-143 { position: relative; top: -3px; } +.opac-auto-144 { position: relative; top: 3px; left: 20px; } +.opac-auto-145 { position: relative; top: -3px; left: 3px; } +.opac-auto-146 { position: relative; top: -3px; left: -5px; } +.opac-auto-147 { position: relative; top: -5px; } +.opac-auto-148 { position: relative; top: 5px; } +.opac-auto-149 { position: relative; top: 5px; left: 25px; } +.opac-auto-150 { position: relative; top: 5px; left: 30px; } +.opac-auto-151 { position: relative; top: 75px; } +.opac-auto-152 { position: relative; top: -9px; } +.opac-auto-153 { position: relative; z-index: 100; } +.text-center { text-align: center; } +.opac-auto-156 { text-align: center; font-weight: bold; } +.opac-auto-157 { text-align: center; margin-top: 20px; width: 400px; } +.opac-auto-158 { text-align: center; margin-top: 6px; margin-bottom: 6px } +.opac-auto-159 { text-align: center; padding: 20px; width: 100% } +.opac-auto-160 { text-align: center; padding-bottom: 8px; } +.opac-auto-161 { text-align: right; padding-right: 7px; } +.opac-auto-162 { vertical-align: top; } +.nowrap { white-space: nowrap; } +.opac-auto-164 { white-space: nowrap; padding-left: 5px; } +.full-width { width: 100%; } +.opac-auto-167 { width: 100%; border: 1px solid black; padding: 6px; margin-top: 5px; } +.opac-auto-168 { width: 100%; border: 2px solid #E0F0E0; margin-bottom: 20px; } +.opac-auto-169 { width: 100%; height: 100%; } +.opac-auto-170 { width: 100%; margin-top: 20px; border-top: 1px dotted #ccc; padding-top: 8px; } +.opac-auto-171 { width: 100%; text-align: center; font-weight: 700; margin-top: 10px; } +.opac-auto-172 { width: 100%; text-align: center; padding-bottom: 5px; } +.opac-auto-173 { width: 10px; } +.opac-auto-174 { width: 111px; height: 25px; } +.opac-auto-175 { width: 125px; height: 21px; } +.opac-auto-176 { width: 129px; } +.opac-auto-177 { width: 162px; } +.opac-auto-178 { width: 174px; } +.opac-auto-179 { width: 175px; margin-right: 11px; } +.opac-auto-180 { width: 182px; color: black; padding: 5px 25px; } +.opac-auto-181 { width: 195px; } +.opac-auto-182 { width: 230px; text-align: left; margin-top: 3px; } +.opac-auto-183 { width: 250px; text-align: left; } +.opac-auto-184 { width: 26px; height: 23px; margin-top: 6px; margin-bottom: 6px; } +.opac-auto-185 { width: 324px; } +.opac-auto-186 { width: 400px; margin-top: 20px; } +.opac-auto-187 { width: 662px; } +.opac-auto-188 { width: 700px; height: 30px; border: 1px solid red; } +.opac-auto-189 { width: 742px; float: left; } +.opac-auto-190 { width: 88px; } +.opac-auto-191 { width: 90px; } +.opac-auto-192 { width: 90%; text-align: center; margin: 10px; } +.opac-auto-193 { width: 91px; } +.opac-auto-194 { width: 95%; text-align: center; padding: 15px; } +.opac-auto-195 { width: 99%; text-align: center } diff --git a/Open-ILS/web/opac/skin/kcls-wire/css/style.css b/Open-ILS/web/opac/skin/kcls-wire/css/style.css index 9c300f3027..b673f759d4 100644 --- a/Open-ILS/web/opac/skin/kcls-wire/css/style.css +++ b/Open-ILS/web/opac/skin/kcls-wire/css/style.css @@ -587,6 +587,8 @@ div.select-wrapper:hover { margin-right: 6px; } +.cached_list_div { width: 111px; height: 25px; } + .results_header_div { float: left; width: 0px; @@ -607,6 +609,7 @@ div.select-wrapper:hover { } .results_header_sel { + width: 88px; float:left; position: relative; top: 2px; @@ -869,3 +872,16 @@ div.select-wrapper:hover { font-weight: bold; font-size: 10px; } + +.advanced_div { padding-top: 15px; } +#adv_global_search select { width: 13em; } +#adv_global_input_table select { width: 7em; } +.adv_adv_link { font-size: 8pt; color: red; } +#acct_prefs_header { float: left; } +#limit_to_available { + float: left; position: relative; top: 2px; + left: -2px; margin-right: 4px; +} +#rdetail_copy_info_table { font-size: 8pt; } +#rdetail_copy_info_table td { padding: 3px; } + diff --git a/Open-ILS/web/templates/default/kcls-wire/advanced.tt2 b/Open-ILS/web/templates/default/kcls-wire/advanced.tt2 index 46d3a98284..3cd4ced6fe 100644 --- a/Open-ILS/web/templates/default/kcls-wire/advanced.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/advanced.tt2 @@ -1,13 +1,6 @@ [% WRAPPER "default/kcls-wire/parts/base.tt2"; INCLUDE "default/kcls-wire/parts/topnav.tt2"; ctx.page_title = "Advanced Search" %] -[% BLOCK html_head -%] - [% END -%]
[% INCLUDE "default/kcls-wire/parts/utils.tt2" %] @@ -30,7 +23,7 @@
[% INCLUDE "default/kcls-wire/parts/advanced/search.tt2" %]
-
+
[% END %] diff --git a/Open-ILS/web/templates/default/kcls-wire/home.tt2 b/Open-ILS/web/templates/default/kcls-wire/home.tt2 index 952422cfd0..88c748f6d2 100644 --- a/Open-ILS/web/templates/default/kcls-wire/home.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/home.tt2 @@ -10,9 +10,9 @@
-
+
[% INCLUDE "default/kcls-wire/parts/homesearch.tt2" %] -
+
[% END %] diff --git a/Open-ILS/web/templates/default/kcls-wire/login.tt2 b/Open-ILS/web/templates/default/kcls-wire/login.tt2 index 0cf55a5cbf..d45c4db8c1 100644 --- a/Open-ILS/web/templates/default/kcls-wire/login.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/login.tt2 @@ -11,7 +11,7 @@
[% INCLUDE "default/kcls-wire/parts/login/form.tt2" %] -
+
[% END %] diff --git a/Open-ILS/web/templates/default/kcls-wire/myopac/circs.tt2 b/Open-ILS/web/templates/default/kcls-wire/myopac/circs.tt2 index c793642b75..8d5546fe42 100644 --- a/Open-ILS/web/templates/default/kcls-wire/myopac/circs.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/myopac/circs.tt2 @@ -19,7 +19,7 @@
-
+
@@ -30,7 +30,7 @@ Export List
-
+
diff --git a/Open-ILS/web/templates/default/kcls-wire/myopac/holds.tt2 b/Open-ILS/web/templates/default/kcls-wire/myopac/holds.tt2 index 3ad5082acc..b176867d93 100644 --- a/Open-ILS/web/templates/default/kcls-wire/myopac/holds.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/myopac/holds.tt2 @@ -19,7 +19,7 @@
-
+
@@ -29,7 +29,7 @@ Export List
-
+
diff --git a/Open-ILS/web/templates/default/kcls-wire/myopac/lists.tt2 b/Open-ILS/web/templates/default/kcls-wire/myopac/lists.tt2 index b48e704b38..b0447158fa 100644 --- a/Open-ILS/web/templates/default/kcls-wire/myopac/lists.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/myopac/lists.tt2 @@ -58,7 +58,7 @@ -
+
+ Add new list
@@ -78,8 +78,8 @@
-
-
+
+
@@ -122,7 +122,7 @@
Remove
-
+
diff --git a/Open-ILS/web/templates/default/kcls-wire/myopac/main.tt2 b/Open-ILS/web/templates/default/kcls-wire/myopac/main.tt2 index 9e1e95e466..cc659e5781 100644 --- a/Open-ILS/web/templates/default/kcls-wire/myopac/main.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/myopac/main.tt2 @@ -98,7 +98,7 @@ -
+
diff --git a/Open-ILS/web/templates/default/kcls-wire/myopac/prefs.tt2 b/Open-ILS/web/templates/default/kcls-wire/myopac/prefs.tt2 index d884d70e5f..2be5383733 100644 --- a/Open-ILS/web/templates/default/kcls-wire/myopac/prefs.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/myopac/prefs.tt2 @@ -51,22 +51,23 @@ -
+
- Account Information and Preferences - Export List + + Account Information and Preferences + + + Export List +
-
+
-
+
diff --git a/Open-ILS/web/templates/default/kcls-wire/parts/homesearch.tt2 b/Open-ILS/web/templates/default/kcls-wire/parts/homesearch.tt2 index 77a50ca32c..acb738ea08 100644 --- a/Open-ILS/web/templates/default/kcls-wire/parts/homesearch.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/parts/homesearch.tt2 @@ -108,8 +108,8 @@ autorotate: [true, 3000] //pause time (in milliseconds)
&myopac.loading;
-
-
Locations
-
+
+
Locations
+
diff --git a/Open-ILS/web/templates/default/kcls-wire/parts/login/form.tt2 b/Open-ILS/web/templates/default/kcls-wire/parts/login/form.tt2 index 3d00bf1b44..5beabf508f 100644 --- a/Open-ILS/web/templates/default/kcls-wire/parts/login/form.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/parts/login/form.tt2 @@ -144,6 +144,6 @@ -
+
diff --git a/Open-ILS/web/templates/default/kcls-wire/parts/myopac/base.tt2 b/Open-ILS/web/templates/default/kcls-wire/parts/myopac/base.tt2 index fbae83eabb..ce26a21cbc 100644 --- a/Open-ILS/web/templates/default/kcls-wire/parts/myopac/base.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/parts/myopac/base.tt2 @@ -28,8 +28,8 @@
-
+
[% content %] -
+
diff --git a/Open-ILS/web/templates/default/kcls-wire/parts/record/body.tt2 b/Open-ILS/web/templates/default/kcls-wire/parts/record/body.tt2 index d016b3c6a7..f6ffc6f2ce 100644 --- a/Open-ILS/web/templates/default/kcls-wire/parts/record/body.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/parts/record/body.tt2 @@ -27,7 +27,7 @@ id='np_end' href='javascript:rdetailEnd();' title="&rdetail.page.last;">&rdetail.end; -
+
diff --git a/Open-ILS/web/templates/default/kcls-wire/parts/searchbar.tt2 b/Open-ILS/web/templates/default/kcls-wire/parts/searchbar.tt2 index 9a4950ad6a..6dade98be8 100644 --- a/Open-ILS/web/templates/default/kcls-wire/parts/searchbar.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/parts/searchbar.tt2 @@ -55,5 +55,5 @@ -
+
diff --git a/Open-ILS/web/templates/default/kcls-wire/parts/topnav.tt2 b/Open-ILS/web/templates/default/kcls-wire/parts/topnav.tt2 index 16d8819fc9..215a38cdd4 100644 --- a/Open-ILS/web/templates/default/kcls-wire/parts/topnav.tt2 +++ b/Open-ILS/web/templates/default/kcls-wire/parts/topnav.tt2 @@ -13,7 +13,7 @@ -
+
-
+
[% END %]