BrainLog

Hymns in Church

Written by Z on May 4, 2013 Categories: Skubala Tags: Christian hymns, church hymns, hymns for the living church, old church hymns, old hymns of the church, popular church hymns

Earlier this year I played a camp where the music was mostly hymns. Out of the whole weekend, there may have been only two songs that weren’t traditional hymns. We did them using modern arrangements from a variety of artists (I don’t have the list, I may have to see if I can get that up here).

A guy doing pictures of the weekend caught a pretty sweet picture of our drummer and bassist puttin’ down some serious rhythm. Being that this is 2013 and internet meems are the thing, I took advantage of the situation and made a meem out of all this:

How your church does hymns vs how our church does hymns

No Comments

Idiot Obama

Written by Z on May 3, 2013 Categories: Skubala Tags: idiot obama, obama idiot, obama idiot quotes, obama is an idiot

Wow… can talk out of both sides of his mouth more boldly? He blames the US for Mexico’s gun violence, without actually confessing to his on role in providing guns to criminals in Mexico. Then he tells us how he’s sworn to uphold the constitution (he left out the “over a paper shredder” part), but then claims that he’s trying to pass “common-sense” reforms that keep guns out of the hands of criminals and dangerous people… which of course, in the Liberal’s mind, a dangerous person is anybody with a gun… This reminds me of Clinton era speeches and thinking.

No Comments

Disabling Internet Explorer Enhanced Security Configuration

Written by Z on Categories: Knowledgebase, Windows Server 2008, Windows Server 2008 R2, Windows Server 2012 Tags: disable internet explorer enhanced security configuration, disable internet explorer enhanced security configuration gpo, internet explorer enhanced security configuration, turn off internet explorer enhanced security configuration

Server 2012:

Start the Server Manager
Click on Local Server
In the Properties box, scroll to “IE Enhanced Security Configuration.” Click on that option
Turn it off according to your tastes

Server 2008 R2:

Load the Server Manager
Visit the root folder
Scroll to Security Information Section and click on Configure IE ESC
Disable according to your tastes

No Comments

Mobile Browsers and Auto-Resizing a Page

Written by Z on April 17, 2013 Categories: CSS3, Knowledgebase Tags: mobile image resize, mobile web page, mobile website design, mobile website template

If you insert this meta tag in your header:

<meta name="viewport" content="initial-scale=2.0,width=device-width" />

Then you can kind of control how mobile browsers will attempt to render your page. Using 2, means they’ll render it at twice the size of their viewport, 1 means they’ll attempt to squeeze everything in to the viewport you have. Different browsers on different devices all seem to react to this differently. Meta viewport settings aren’t perfect, but they can help you tweak a visitor’s experience. W3C is trying to create a way for CSS to do the dirty work here, but that’s still in draft mode as of today.

You can see the code in action here.

You can also use this meta tag to control how a user can zoom (why would you do this?).

<meta name="viewport" content="width=device-width, maximum-scale=3, minimum-scale=0.5" />

Prevent zooming (again, why would you do this?):

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

No Comments

Media Queries, What They Are and Syntax

Written by Z on April 16, 2013 Categories: CSS3, Knowledgebase Tags: media queries screen size, media queries smartphone, media query, media query smartphone, responsive web design media query, responsive web media queries

Media queries are supported by Firefox 3.6, Safari 4, Chrome 4, Opera 9.5, iOS Safari 3.2, Opera Mobile 10, Android 2.1, and Internet Explorer 9 and greater for all these browsers.
There are JavaScript based fixes or other browsers that don’t support media queries like IE 6-8. The W3C specification for media queries can be found here.
Media queries give us the ability to create specific CSS for specific devices.
Media queries provide us the ability to create styles based on the capability and features of a device instead of the type.

Produce this HTML:

<body>
  
  <h1>
      H1 Tag
    </h1>
  
    <h2> 
      H2 Tag
    </h2>

</body>

With this CSS:

body {
  background-color: grey;
   
}

h1 {
  color: black;
  border: 1px solid black
}

h2 {
  color: black;
  border: 1px solid black;
}

@media screen and (max-width: 960px) {
  body {
    background-color: red;
  }
  
  h1 {
    color: orange;
    border: 1px solid blue;
  }
  
  h2 {
    color: magenta; 
    border: 1px solid green;
  
  
}

@media screen and (max-width: 768px) {
  body {
    background-color: orange;
  }
    
   h1 {
     color: red;
     border: 1px solid green;
   }
    
   h2 {
     color: yellow;
     border: 1px dotted blue;
    }
}

@media screen and (max-width: 550px) {
  body {
    background-color: yellow;
  }
    
  h1 {
    color: blue;
    border: 1px solid green;
  }
    
  h2 {
    color: red;
    border: 3px dotted magenta;
  }
}
  
@media screen and (max-width: 320px) {
  body {
    background-color: green;
  }
}

And this is the result. Slide the output window to the left and right and the background color should change. Of course, if you’re using an antiquated browser, it isn’t going to work right.

You can produce media queries based on a variety of factors. For example:

The following HTML will tell a device’s browser to load the CSS file when in portrait mode:

<link rel="stylesheet" media="screen and (orientation: portrait)" href="portrait-screen.css" />

This HTML string of multiple expressions will tell a browser to load the CSS called 800WidePortraitScreen.css when the view port is wider than 800px:

<link rel="stylesheet" media="screen and (orientation: portrait) and (min-width: 800px)" href="800WidePortraitScreen.css" />

This list of media queries will load various CSS files if the conditions are found to be true:

<link rel="stylesheet" media="screen and (orientation: portrait) and (min-width: 800px), projection" href="800WidePortraitScreen.CSS" />

You can do exclusions as well:

<link rel="stylesheet=" media="not screen and (orientation: portrait)" href="portraitScreen.css" />

Remember that commas separate each media query
You can import CSS into a style sheet as well:

@importat url("phone.css") screen and (max-width:360px);

Media queries can look for a number of conditions:
- width: The viewport’s width
- height: The height of the viewport
- device-width: the screen width of a device
- device-height: the screen height of a device
- orientation: is the device in portrait or landscape mode?
- aspect-ratio: The ratio of width to height based on the viewport’s width and height. 16:9 has an aspect-ratio of 16/9
- device-aspect-ratio: This is almost like the aspect-ratio query, but this is based on screen size instead of the viewport.
- color: This checks for the number of bits per color component. If you use “min-color: 16″ then the CSS will load your requirements for a browser that has at least 16-bit color capabilities.
- color-index: This feature describes the number of entries in the color look-up table of the output device. IF the device does not use a color look-up table, the value is zero.
- monochrome: This one tests the number of bits per pixel can be found in a monochrom frame buffer. This value is an integer and may be expressed like this: “monochrome: 3″ this also cannot be a negative number.
- resolution: You can use this to test print or screen resolution; “min-resolution: 300dpi” will display the given CSS For devices that have the ability do deal with at least 300dpi. You can also use dots per centimeter: “min-resolution: 118dpcm.
- scan: This can distinguish between interlace or progressive features found in mostly television sets. 720P HD TVs use progressive scanning while 1080i HD TV would use interlaced methods. ”scan: interlace” or “scan: progressive” would call the CSS file according to what kind of scan the device is using.
- grid: This will determine whether or not the device has grid or bitmap based.
With the exception of scan and grid, each feature can be appended with min- or max- so that you can create ranges:

@import url("phone.css") screen and (min-width:200px) and (max-width: 360px;);

No Comments

CSS3 Gradient Backgrounds

Written by Z on April 14, 2013 Categories: CSS3, Knowledgebase Tags: create gradient background, create gradient background css, creating gradients, css3 background gradient, CSS3 Gradient Backgrounds, radial gradient background css3

If you’re looking for gradient backgrounds the following should do you well:

Here is the HTML:

<a class="first" href="http://brainlog.coryzipperle.com">First Link</a>
<a class="second" href="http://brainlog.coryzipperle.com">Second Link</a>
<a class="third" href="http://brainlog.coryzipperle.com">Third Link</a>
<a class="fourth" href="http://brainlog.coryzipperle.com">Fourth Link</a>
<a class="fifth" href="http://brainlog.coryzipperle.com">Fifth Link</a>
<a class="sixth" href="http://brainlog.coryzipperle.com">Sixth Link</a>

Here is the CSS for a top to bottom gradient:

a {
   height: 40px;
  line-height: 40px;
  padding-left: 0.8em;
  padding-right: 0.8em;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  color: #000;
  text-decoration: none;
  
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#42c264), to(#4fec50));

  /* Safari 5.1, Chrome 10+ */
  background: -webkit-linear-gradient(top, #4fec50, #42c264);

  /* Firefox 3.6+ */
  background: -moz-linear-gradient(top, #4fec50, #42c264);

  /* IE 10 */
  background: -ms-linear-gradient(top, #4fec50, #42c264);

  /* Opera 11.10+ */
  background: -o-linear-gradient(top, #4fec50, #42c264);


}

If you’re looking to go from left to right:

a.second {
  
  height: 40px;
  line-height: 40px;
  padding-left: 0.8em;
  padding-right: 0.8em;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  color: #000;
  text-decoration: none;
  
  /* fallback */
  background-color: #42c264;
  background-image: url(images/linear_bg_1.png);
  background-repeat: repeat-y;

  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(linear, left top, right top, from(#42c264), to(#4fec50));

  /* Safari 5.1, Chrome 10+ */
  background: -webkit-linear-gradient(left, #4fec50, #42c264);

  /* Firefox 3.6+ */
  background: -moz-linear-gradient(left, #4fec50, #42c264);

  /* IE 10 */
  background: -ms-linear-gradient(left, #4fec50, #42c264);

  /* Opera 11.10+ */
  background: -o-linear-gradient(left, #4fec50, #42c264);
}

If you’re looking to stick gradients in the middle somewhere:

a.third {
  
  height: 40px;
  line-height: 40px;
  padding-left: 0.8em;
  padding-right: 0.8em;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  color: #000;
  text-decoration: none;
  
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(linear, left top, right top, from(#42c264), color-stop(0.25, #4fec50), color-stop(0.5, #42c264), color-stop(0.75, #4fec50), to(#42c264));

  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-linear-gradient(left, #42c264, #4fec50, #42c264, #4fec50, #42c264);

  /* Firefox 3.6+ */
  background: -moz-linear-gradient(left, #42c264, #4fec50, #42c264, #4fec50, #42c264);

  /* IE 10 */
  background: -ms-linear-gradient(left, #42c264, #4fec50, #42c264, #4fec50, #42c264);

  /* Opera 11.10+ */
  background: -o-linear-gradient(left, #42c264, #4fec50, #42c264, #4fec50, #42c264);
}

It’s always good to toss in some kind of fallback code so that you give browsers that don’t know what to do with all this gradient stuff can still play on your website too:

a {
   height: 40px;
  line-height: 40px;
  padding-left: 0.8em;
  padding-right: 0.8em;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  color: #000;
  text-decoration: none;

  /* fallback */
  background-color: #1a82f7;
  background: url(images/linear_bg_2.png);
  background-repeat: repeat-x;
  
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#42c264), to(#4fec50));

  /* Safari 5.1, Chrome 10+ */
  background: -webkit-linear-gradient(top, #4fec50, #42c264);

  /* Firefox 3.6+ */
  background: -moz-linear-gradient(top, #4fec50, #42c264);

  /* IE 10 */
  background: -ms-linear-gradient(top, #4fec50, #42c264);

  /* Opera 11.10+ */
  background: -o-linear-gradient(top, #4fec50, #42c264);


}

If you’re looking for gradients that stop on the edges somewhere:

a.fourth {
  
  height: 40px;
  line-height: 40px;
  padding-left: 0.8em;
  padding-right: 0.8em;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  color: #000;
  text-decoration: none;  

  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(linear, left top, right top, from(#42c264), color-stop(0.05, #4fec50), color-stop(0.5, #42c264), color-stop(0.95, #4fec50), to(#42c264));

  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-linear-gradient(left, #42c264, #4fec50 5%, #42c264, #4fec50 95%, #42c264);

  /* Firefox 3.6+ */
  background: -moz-linear-gradient(left, #42c264, #4fec50 5%, #42c264, #4fec50 95%, #42c264);

  /* IE 10 */
  background: -ms-linear-gradient(left, #42c264, #4fec50 5%, #42c264, #4fec50 95%, #42c264);

  /* Opera 11.10+ */
  background: -o-linear-gradient(left, #42c264, #4fec50 5%, #42c264, #4fec50 95%, #42c264);
}

Gradient that centers with a hot spot. It’s kind of difficult to see with this example, but the code is there for you to try on your own:

a.fifth {
  
    height: 40px;
  line-height: 40px;
  padding-left: 0.8em;
  padding-right: 0.8em;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  color: #000;
  text-decoration: none;
  
  /* fallback */
  background-color: #4fec50;
  background-image: url(images/just-in-case.png);
  background-position: center center;
  background-repeat: no-repeat;

  /* Safari 4-5, Chrome 1-9 */
  /* You can't specify a percentage */
  background: -webkit-gradient(radial, center center, 0, center center, 460, from(#42c264), to(#4fec50));

  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(circle, #42c264, #4fec50);

  /* Firefox 3.6+ */
  background: -moz-radial-gradient(circle, #42c264, #4fec50);

  /* IE 10 */
  background: -ms-radial-gradient(circle, #42c264, #4fec50);

  /* Opera had trouble doing this style of gradient, then at some point they started supporting the -webkit- syntax, now it almost works but it doesn't do sizing) */
}

And lastly, a Gradient that puts a spot in there somewhere:

a.sixth {
  
  height: 40px;
  line-height: 40px;
  padding-left: 0.8em;
  padding-right: 0.8em;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  color: #000;
  text-decoration: none;
  
  /* fallback */
  background-color: #4fec50;
  background-image: url(images/just-in-case.png);
  background-position: 80% 20%;
  background-repeat: no-repeat;

  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 80% 20%, 0, 80% 40%, 100, from(#42c264), to(#4fec50));

  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(80% 20%, closest-corner, #42c264, #4fec50);

  /* Firefox 3.6+ */
  background: -moz-radial-gradient(80% 20%, closest-corner, #42c264, #4fec50);

  /* IE 10 */
  background: -ms-radial-gradient(80% 20%, closest-corner, #42c264, #4fec50);

  /* Opera cannot do radial gradients yet */
}

Look at the code in action.

No Comments

What is The Church?

Written by Z on Categories: kom-uhn-ter-ee Tags: church growth strategies, house church, how to start a church, missional church, non-denominational church, what is the church

Church is an event isolated to a time and place. The Church is people out in the open acting as servants to all.

In reality, there is only one church for every 10,000 people. So while churches appear to be everywhere to most of us, the reality is that they only contain a small percentage of the population. Most of the criticisms directed to The Church, and Christians in general comes from folks who don’t really know the difference between church and The Church. Most of their criticisms, which are typically directed towards The Church really should be directed at churches. The “why” here is another post entirely, but most of my The Church friends will understand this right out.

The sad thing is, while I think many public criticisms of church are well founded, they typically ignore The Church all together. I think a lot of this is our “canned and categorized” society. We like to tightly identify and define things (which is fine, that has it’s place) so that we can apply some understanding to them, but we don’t leave much wiggle room (which is never good, and has no place). Therefore, the deserved stereotypes that plague many churches also end up encompassing The Church.

Of course, you have to deal with the fact that many churches are trying to break out of their church molds and trying to exhort their members to becoming The Church. This is, without fail, a dirty and messy battle. Too many in churches don’t want to be The Church because being The Church is difficult and requires quite a bit of self-sacrifice.

The reason I think many people mistake churches for The Church is because The Church isn’t found very well in the media, or in personal recollections of experiences. Churches have plenty of time to muck around and flutter and stammer about all the things that upset them – many of them are good at making scenes on one level or another. The Church simply does not. There’s a crisis at hand, and there’s too much work to be done to really flutter about with trivial matters. The Church is too busy doing the wide variety of tasks set forth by the Gospel. For now, in this country, that’s not really news or note worthy. But give it time. As we continue our path, the work that The Church is doing now will be considered more and more notorious… all based on those church stereotypes.

No Comments

Creating a Tabbed Box With CSS Without an Image

Written by Z on April 13, 2013 Categories: CSS3, Knowledgebase Tags: css tabbed box, css tabbed navigation box, css3 navigation bar, tabbed css menu, tabbed menu

Here’s the HTML:

<a href="http://brainlog.coryzipperle.com">Brainlog.coryzipperle.com</a>

Here’s the CSS:

a {
  height: 40px;
  line-height: 40px;
  padding-left: 0.8em;
  padding-right: 0.8em;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  background-color: blue;
  color: white;
  text-decoration: none;
}

The results.

No Comments

Basic HTML 5 Doctype and Stuff

Written by Z on April 10, 2013 Categories: HTML5, Knowledgebase Tags: create HTML 5 website, html 5 layout, html web page, web page html

Doctype:

<!DOCTYPE html>

Linking to JavaScript:

<script src="filename"></script>

Linking to CSS files:

<link rel="stylesheet" href="filename" type="text/css">

HTML5 isn’t as picky about capitalization and quotes as previous versions of HTML5. W3schools still shows that you want to use quote marks when you’re calling an external file, however, it doesn’t appear that the validator cares if you put them in there.

No Comments

Financial Crash Part 2?

Written by Z on April 3, 2013 Categories: Uncategorized Tags: andy cuomo, conservative financial news, cuomo obama, financial crisis commission, financial inquiry commission

Back in the mid 90s I was working at a bank. During that time Clinton was in office. Cuomo, who was running the urban development office created a policy, with Clinton’s blessing, that allowed FHA to insure loans to just about anybody for any amount despite their lack of ability to pay. It was veiled as an anti-discrimination move. Thus banks were being pushed by federal regulators to lend money to people who couldn’t afford to pay that money back – generating bad loans.

The president of the bank I was working at said it best by noting that this federal practice was going to cause a huge problem in the housing market.

He was totally right, less than 10 years later, the financial crisis hit, erupting from bum housing loans.

But the Democrats, being the people that they are, are doing the same thing again.

There’s a reason we’re supposed to learn history. It’s so that we don’t generate a repeat. Looks like Obama needs to review his history so that he doesn’t repeat Clinton’s mistakes. I doubt that’s going to happen as Obama hasn’t demonstrated good stewardship skills (except for maybe his own well being) since he took office.

http://www.villagevoice.com/2008-08-05/news/how-andrew-cuomo-gave-birth-to-the-crisis-at-fannie-mae-and-freddie-mac/

Phil Fairbanks (August 21, 2010). “Cuomo’s HUD career under scrutiny”. The Buffalo News. Archived from the original on August 25, 2010. Retrieved September 17, 2010.

“Andrew Cuomo bio box”. The Ithaca Journal. October 23, 2010. Retrieved November 13, 2010.

No Comments

Hymns in Church

Idiot Obama

Disabling Internet Explorer Enhanced Security Configuration

Mobile Browsers and Auto-Resizing a Page

Media Queries, What They Are and Syntax

CSS3 Gradient Backgrounds

What is The Church?

Creating a Tabbed Box With CSS Without an Image

Basic HTML 5 Doctype and Stuff

Financial Crash Part 2?

Search

Pages

Categories

Related Posts

Related Posts

Related Posts

Related Posts

Related Posts

Related Posts

Related Posts

Related Posts

Related Posts

Related Posts

Search

Pages

Categories

Tags