github.com/EngineerKamesh/gofullstack@v0.0.0-20180609171605-d41341d7d4ee/volume3/section5/gopherface/static/css/gopherface.css (about) 1 body { 2 3 font-family: arial, helvetica; 4 margin-left: 18px; 5 6 } 7 8 body p { 9 font-size: 16pt; 10 } 11 12 h1 { 13 font-size: 1.8em; 14 } 15 .smpostContainer { 16 17 border: 1px solid #CCC; 18 width: 540px; 19 min-height: 108px; 20 padding: 18px; 21 box-shadow: 1px 1px 3px #888; 22 margin-bottom: 18px; 23 } 24 25 .smpostFormContainer { 26 width: 720px; 27 } 28 29 .uploadFormContainer { 30 width: 720px; 31 } 32 33 #messageBody { 34 min-height: 207px; 35 } 36 37 .author { 38 39 clear: right; 40 41 } 42 43 .authorMood { 44 font-size: 18pt; 45 } 46 47 .authorImage { 48 width: 108px; 49 float: left; 50 clear: none; 51 } 52 53 .caption { 54 padding-top:9px; 55 font-weight: bold; 56 font-size: 18pt; 57 float: left; 58 clear: right; 59 width: 405px; 60 } 61 62 .createdBy a { 63 font-size: 14pt; 64 text-decoration: none; 65 color: blue; 66 } 67 68 .creationtime { 69 70 } 71 72 .createdby { 73 color: blue; 74 } 75 76 .imagePreview { 77 text-align: center; 78 margin-top: 18px; 79 } 80 81 .msgBody { 82 margin-top: 36px; 83 84 } 85 86 /* pure overrides */ 87 .pure-form-message-inline { 88 color: red !important; 89 } 90 91 .pure-control-group label, label{ 92 color: gray; 93 font-weight: bold; 94 font-size: 0.93em; 95 } 96 97 .imageContainer { 98 99 display: inline; 100 margin-right: 27px; 101 } 102 103 .videoContainer { 104 display: inline; 105 } 106 107 108 109 110 ul { 111 list-style-type: none; 112 margin: 0; 113 padding: 0; 114 overflow: hidden; 115 background-color: rgb(0,117,183); 116 margin-left: -18px; 117 } 118 119 li { 120 float: left; 121 border-right:1px solid #bbb; 122 } 123 124 li:last-child { 125 float: right; 126 } 127 128 li a { 129 font-size: 1.2em; 130 display: block; 131 color: white; 132 text-align: center; 133 padding: 14px 16px; 134 text-decoration: none; 135 } 136 137 li a:hover:not(.active) { 138 background-color: rgb(0,76,142) 139 140 } 141 142 .active { 143 background-color: #4CAF50; 144 } 145 146 #sitelogo { 147 font-size: 3.6em; 148 font-family: 'Lobster', serif; 149 color: rgb(4,147,227); 150 margin-bottom: 18px; 151 /* 152 text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135; 153 */ 154 } 155 156 .magnifyingGlass { 157 color: white; 158 font-size: 13pt; 159 font-weight: bold; 160 -webkit-transform: rotate(45deg); 161 -moz-transform: rotate(45deg); 162 -o-transform: rotate(45deg); 163 transform: rotate(45deg); 164 } 165 166 .upload-btn-wrapper { 167 position: relative; 168 overflow: hidden; 169 display: inline-block; 170 } 171 172 .upload-btn-wrapper input[type=file] { 173 font-size: 100px; 174 position: absolute; 175 left: 0; 176 top: 0; 177 opacity: 0; 178 } 179 180 181 #friendsListContainer{ 182 width: 540px; 183 } 184 185 186 .followingFriendsListItem { 187 clear: none; 188 float: left; 189 width: 126px; 190 margin-left: 36px; 191 text-align: center; 192 font-size: 14pt; 193 194 } 195 196 .listItemImage { 197 margin-bottom: 9px; 198 199 } 200 201 202 .listItemLink { 203 text-decoration: none; 204 color: blue; 205 206 } 207 208 .listItemLink:hover { 209 font-weight: bold; 210 } 211 212 #aboutTextArea { 213 width: 504px; 214 height: 144px; 215 } 216 217 #locationInput, #interestsInput, #friendSearchInput { 218 width: 504px; 219 } 220 221 .createdby a { 222 text-decoration: none; 223 } 224 225 .gopherUsername { 226 margin-bottom: 9px; 227 } 228 229 .searchEntry img { 230 margin-bottom: 9px; 231 } 232 233 .searchName { 234 font-weight: bold; 235 } 236 237 .searchUsername a { 238 color: blue; 239 text-decoration: none; 240 font-weight: bold; 241 } 242 243 #gopherProfileContainer, #friendsListContainer { 244 margin-bottom: 18px; 245 } 246 247 #gopherProfileContainer { 248 margin-left: 18px; 249 }