css-lint_css_lint_demo.php
Quell Code
Css lint demo
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>CSSLint Demo</title>
<style>
html { font: 14px sans-serif; }
.error { color: #D9534F; font-weight: bold; }
.warning { color: #F0AD4E; }
</style>
<script>
(function() {
"use strict";
window.onload = function() {
document.body.onclick = function(event) {
event = event || window.event;
var target = event.target || event.srcElement,
results,
messages,
i,
len;
function log(value, level) {
var output = document.getElementById("output");
output.innerHTML += "<span class=\"" + level + "\">" + value.replace(/ /g, " ") + "</span><br>";
}
if (target.id === "lint-btn") {
document.getElementById("output").innerHTML = "";
results = CSSLint.verify(document.getElementById("input").value);
messages = results.messages;
for (i = 0, len = messages.length; i < len; i++) {
log(messages[i].message + " (line " + messages[i].line + ", col " + messages[i].col + ")", messages[i].type);
}
}
};
};
})();
</script>
</head>
<body>
<h1>CSSLint Demo</h1>
<textarea rows="30" cols="100" id="input">
@charset "UTF-8";
@import url("booya.css") print, screen;
@import "whatup.css" screen;
@import "wicked.css";
/*Error*/
@charset "UTF-8";
@namespace "http://www.w3.org/1999/xhtml";
@namespace svg "http://www.w3.org/2000/svg";
/*Warning: empty ruleset */
.foo {
}
h1 {
font-weight: bold;
}
/*Warning: qualified heading */
.foo h1 {
font-weight: bold;
}
/*Warning: adjoining classes */
.foo.bar {
zoom: 1;
}
li.inline {
width: 100%; /*Warning: 100% can be problematic*/
}
li.last {
display: inline;
padding-left: 3px !important;
padding-right: 3px;
border-right: 0px;
}
@media print {
li.inline {
color: black;
}
}
@page {
margin: 10%;
counter-increment: page;
@top-center {
font-family: sans-serif;
font-weight: bold;
font-size: 2em;
content: counter(page);
}
}
*{
padding:0;
margin:0;
}
html {
margin: 0em;
height:100vh;
overflow:auto;
width:100%;
padding-bottom:30px;
}
a {
outline:none;
}
body {
font-family: sans-serif,'trebuchet ms','lucida grande','lucida sans unicode',arial,helvetica,sans-serif;
font-size:15px;
width:100%;
height:100%;
}
input:focus, select:focus, textarea:focus, button:focus {
outline:0;
}
img {
border:0px;
}
h2 {
font-size:1.5em;
margin-bottom:5px;
}
ul {
list-style:none;
}
li {
list-style:none;
}
button {
border:none;
outline: none !important;
}
textarea, input{
font-size:14px;
font-family:sans-serif,"trebuchet ms","lucida grande","lucida sans unicode",arial,helvetica,sans-serif;
}
#wrap_login {
width:100%;
height:100%;
}
.fa {
cursor:pointer;
}
.icon_bottom_out {
margin-top:5px;
}
.icon_priv {
margin-right:10px;
font-size:1.8em;
margin-top:2px;
}
.icon_bar {
margin-left:5px;
margin-top:3px;
}
.icon_smile {
font-size:1.2em;
margin-top:1px;
margin-left:3px;
}
#private_close {
float:right;
}
#private_count{
width:20px;
height:20px;
background:red;
display:none;
position:absolute;
text-align:center;
font-size:13px;
font-weight:bold;
border-radius:10px;
border:1px solid #fff;
top:35%;
}
#chat_theme {
height:100%;
width:100px;
float:left;
}
.option_list {
clear:both;
width:100%;
display:none;
}
.option_list li {
width:96% !important;
padding:6px 2%;
cursor:pointer;
}
.option_list ul {
height:auto !important;
clear:both;
width:100% !important;
margin:5px 0;
border-radius:6px;
}
.option_list ul p {
padding-left:5px;
}
.username {
cursor:pointer;
}
.user_option_separator:last-child {
border-bottom:none;
}
.open_user {
display: flex;
overflow:hidden;
height:30px;
width:100%;
cursor:pointer;
width:98%;
padding:4px 0;
padding-left:2%;
border-radius:6px;
}
.open_user p {
padding-top:6px;
padding-bottom:5px;
}
.addon_button, .addon_button a, #submit_button, .pv_name, #user_list li , .roombutton {
cursor:pointer;
}
#external_wrap {
width:100%;
height: calc(100% - 0px);
}
.clear {
width:100%;
height:1px;
clear:both;
}
#header {
width:100%;
height:60px;
margin:0 auto;
position:relative;
top:0;
padding:10px 0;
}
#inner_header {
width:100%;
margin:0 auto;
height:100%;
padding:0 8px;
}
#inner_header img {
height:100%;
display:block;
width:auto;
float:left;
}
#asking {
float:right;
width:150px;
}
#asking p {
padding-top:15px;
padding-left:10px;
}
#room_topic {
width:100%;
font-size:17px;
padding: 10px 0 5px;
}
.topic {
margin-top:5px;
font-weight:bold;
}
#main_error {
height:15px;
width:50%;
float:right;
margin-top:-26px;
margin-bottom:3px;
z-index:2000;
display:none;
text-align:right;
}
#main_input {
height:38px;
width:100%;
margin: 4px 0 6px 0;
}
#content {
width:98%;
height:100%;
padding:0;
padding: 0 1%;
float:left;
font-size:16px;
}
#inside_group , #input_table, #td_group {
width:100%;
height:100%;
}
#inside_group , #input_table, #td_group, #inputt_left, #inputt_right, #td_input {
border-collapse: collapse;
padding:0;
}
#inputt_left {
width:85%;
height:100%;
}
#inputt_right {
width:15%;
height:100%;
}
#emo_item, #send_image {
width:38px;
height:100%;
text-align:center;
font-size:24px;
z-index:1;
position:relative;
}
#send_image {
border-radius:0px;
}
#emo_item i , #send_image i{
opacity:0.4;
}
#td_input {
height:100%;
}
.myButton:hover {
background-color:#5cbf2a;
}
.myButton:active {
position:relative;
top:1px;
}
#container_input_top{
padding:10px 10px 0px 10px;
}
#submit_button {
width:100%;
float:right;
height:100% !important;
font-weight:bold;
box-shadow:none !important;
padding:0;
border:none !important;
font-size:18px;
border-radius:0 5px 5px 0;
}
#container_chat {
margin:0 auto;
padding:8px;
border-radius:10px;
}
#inside_wrap_chat {
height:100%;
overflow:hidden;
}
#chat_left {
width:100%;
float:left;
}
#container_show_chat {
width: 100%;
height: 100%;
position:relative;
}
#show_chat {
width:100%;
height:100%;
overflow:auto;
overflow-x: hidden;
}
#wrap_chat {
height:100%;
width:100%;
}
#warp_show_chat {
height:73%;
overflow:hidden;
}
#show_chat ul {
width:100%;
z-index:1;
position:relative;
}
.ch_logs {
padding: 5px 1%;
word-wrap: break-word;
}
.avatar_chat {
display:block;
height:40px;
width:auto;
-moz-border-radius:20px;
-webkit-border-radius:20px;
border-radius:20px;
overflow:hidden;
}
.my_avatar {
float:left;
width:50px;
}
.my_text {
padding-left: 43px;
padding-right:2%;
padding-top: 6px;
line-height:24px;
}
#menu_container_inside {
margin:0 auto;
}
.delete_log {
font-weight:bold;
float:right;
cursor:pointer;
padding:0;
padding:0 4px 0 4px;
}
.my_notice {
padding:3px;
}
.advice {
font-size:12px;
}
.system, .usystem {
width:98%;
font-size:12px;
font-weight:normal !important;
}
#chat_error {
width:98%;
min-height:20px;
margin-bottom:-30px;
z-index:300;
position:relative;
padding:5px 1%;
display:none;
}
.chat_emoticon {
cursor:pointer;
}
.public {
font-size:15px;
}
.admin, .sadmin, .modo, .user, .vip, .away, .guest{
font-weight:bold;
}
.bold {
font-weight:bold;
}
.datechat2 {
font-size:13px;
}
.datechat {
font-weight:bold;
}
.roombutton p {
text-decoration:none;
margin-top:10px;
outline:0;
font-size:14px;
}
.addon_button, .test_button, .other_panels {
float:left;
margin-left:5px;
}
.private_reply {
float:right;
cursor:pointer;
padding:0 20px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
font-weight:bold;
margin-bottom:-8px;
}
#full_form_submit {
width:100%;
height:auto;
clear:both;
}
#fsubmit_control {
width:46%;
float:right;
min-width:210px;
max-width:320px;
}
#fsubmit_rules {
width:46%;
float:left;
min-width:210px;
max-width:320px;
}
.agree_rules {
margin-top:30px;
float:left;
margin-bottom:10px;
}
.agree_normal {
margin-top:14px;
margin-bottom:0;
}
.rules_p {
float:left;
margin-top:26px;
font-size:16px;
margin-left:5px;
margin-bottom:10px;
}
.rules_p_normal {
margin-top:12px;
margin-bottom:0;
}
.rules_link {
text-decoration:none;
cursor:pointer;
}
#rules_box {
}
#rules_box h4{
font-size:16px;
}
#rules_box ul {
padding:0 10px;
}
#rules_box ul li {
list-style:decimal;
margin-bottom:10px;
}
#rules_box strong {
font-size:15px;
font-weight:bold;
}
#rules_box p {
font-size:14px;
}
#menu img {
width:40px;
height:auto;
}
#menu {
width:100%;
height:100%;
}
/*
#container_login {
position:absolute;
max-width:620px;
width:620px;
height:auto;
z-index:15;
top:50%;
left:50%;
padding:20px 20px 30px 20px;
margin:-200px 0 0 -330px;
border-radius:10px;
}
*/
#container_kicked {
position:absolute;
width:320px;
height:auto;
z-index:15;
top:50%;
left:50%;
padding:20px;
margin:-165px 0 0 -180px;
border-radius:10px;
}
#header_login {
width:95%;
height:60px;
margin:0 auto;
padding-bottom:6px;
}
#header_login img {
height:100%;
width:auto;
}
#content_login {
max-width:95%;
height:auto;
margin:0 auto;
padding-top:5px;
}
#content_login_left {
width:46%;
float:left;
min-width:210px;
max-width:320px;
}
#content_login_right {
width:46%;
float:right;
height:auto;
min-width:210px;
max-width:320px;
}
#login_member_online {
padding-top:10px;
}
.member_login {
padding-top:5px;
}
#login_welcome {
margin-top:10px;
padding-bottom:10px;
}
#login_gage {
height:30px;
}
.login_select {
width:100%;
padding:9px;
}
.login_select option {
width:100%;
border:none;
padding-left:0;
padding-right:0;
}
.login_label {
padding:6px 0 2px 0;
font-size:16px;
clear:both;
}
#login_welcome p {
margin:5px 0;
}
#login_sexe {
width:48%;
float:left;
}
#login_age {
width:48%;
float:right;
}
#login_control {
width:100%;
height:auto;
}
#content_kicked {
width:95%;
height:auto;
margin:0 auto;
padding-top:5px;
text-align:center;
}
#content_kicked h1 {
margin-top:30px;
}
#content_kicked h2 {
margin-top:20px;
}
#kicked_button, #activate_button, #resend_button {
width:50%;
margin:0 auto;
height:40px;
font-size:20px;
margin-top:20px;
-moz-border-radius:20px;
-webkit-border-radius:20px;
border-radius:5px;
cursor:pointer;
}
#activate_button {
width:48%;
float:left;
}
#resend_button {
width:48%;
float:right;
}
#kicked_button p, #activate_button p, #resend_button p {
padding-top:8px;
}
.email_verification {
padding:5px 0;
}
.reason {
font-size:18px;
margin-top:5px;
}
.login_form {
width:100%;
height:auto;
margin:0 auto;
}
.input_data {
width:94%;
padding:5px 3%;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
border:none;
font-size:22px;
}
.forgot {
padding-top:5px;
padding-bottom:5px;
}
#login_button, #register_button, #recovery_button, #newpass_button, .bridge_button, .bridge_button2 {
margin-top:18px;
height:40px;
width:100%;
text-align:center;
font-weight:bold;
font-size:18px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
cursor:pointer;
}
.bridge_button2 {
margin-top:25px;
}
.bridge_button {
margin-top:8px;
}
#back_login, #guest_button, #guest_ok {
margin-top:43px;
height:40px;
width:100%;
text-align:center;
font-weight:bold;
font-size:18px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
cursor:pointer;
clear:both;
}
#login_register, #login_login{
margin-top:8px;
height:40px;
width:100%;
text-align:center;
font-weight:bold;
font-size:18px;
float:right;
border-radius:5px;
cursor:pointer;
}
#login_guest {
margin-top:10px;
height:30px;
width:100%;
text-align:center;
font-weight:bold;
font-size:16px;
cursor:pointer;
}
#login_button, #register_button, #recovery_button, #newpass_button {
float:left;
}
#login_button p, #register_button p, #recovery_button p, #back_login p, #newpass_button p, #guest_button p, #guest_ok p, .bridge_button p, .bridge_button2 p, #login_register p, #login_login p{
padding-top:9px;
}
#guest_button, #guest_ok {
margin-top:8px;
clear:both;
}
#login_error {
width:100%;
margin:0 auto;
height:auto;
}
#login_error_inside {
font-size:16px;
}
.recover_ok {
text-align:center;
}
.open_smilies {
float:none;
width:auto;
height:20px;
}
.tooltip {
display: inline;
position: relative;
}
.tooltip:hover:after {
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
bottom: 50px;
content: attr(title);
left: 20%;
padding: 5px 15px;
position: absolute;
width: auto;
z-index: 98;
}
.tooltip:hover:before {
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
border-image: none;
border-style: solid;
border-width: 6px 6px 0;
bottom: 44px;
content: "";
left: 50%;
position: absolute;
z-index: 99;
}
.tooltip2 {
display: inline;
position: relative;
}
.tooltip2:hover:after {
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
bottom: -26px;
content: attr(title);
right: 20%;
padding: 5px 15px;
position: absolute;
width: auto;
z-index: 98;
}
.tooltip2:hover:before {
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
border-image: none;
border-style: solid;
border-width: 0 6px 6px;
bottom: 0px;
content: "";
left: 50%;
position: absolute;
z-index: 99;
}
.tooltip3 {
display: inline;
position: relative;
}
.tooltip3:hover:after {
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
bottom: -26px;
color: #fff;
content: attr(title);
left: 20%;
padding: 5px 15px;
position: absolute;
width: auto;
z-index: 98;
}
.tooltip3:hover:before {
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
border-image: none;
border-style: solid;
border-width: 0 6px 6px;
bottom: 0px;
content: "";
left: 50%;
position: absolute;
z-index: 99;
}
.forgot_password {
cursor:pointer;
}
#show_chat_ads {
width:100%;
height:auto;
z-index:2;
position:absolute;
display:none;
overflow:hidden;
}
#show_chat_ads img {
display:block;
margin:0 auto;
max-width:100%;
height:auto;
width:auto;
max-height:70px;
}
.ads2, .ads3 {
display:none;
}
.avatar_userlist {
display:block;
height:30px;
width:30px;
float:left;
-moz-border-radius:15px;
-webkit-border-radius:15px;
border-radius:15px;
overflow:hidden;
cursor:pointer;
}
.chat_avatar_wrap {
cursor:pointer;
}
#logout_box {
width:280px;
height:auto;
border-radius:10px;
position:absolute;
top:50%;
left:50%;
margin-top:-150px;
margin-left:-150px;
z-index:11000;
padding:10px 10px 20px 10px;
display:none;
}
.close_logout {
display:block;
float:right;
margin-right:5px;
margin-top:5px;
}
.logout_h2 {
padding-top:5px;
margin-bottom:15px;
}
.logout_text {
padding-top:10px;
}
.out_button {
font-size:18px;
}
.box_menu {
float:left;
font-size:32px;
width:48px;
height:48px;
display:table-row;
vertical-align:middle;
position:relative;
margin-left:0px;
}
#menu_container {
height:33px;
}
#wrap_footer {
bottom: 0;
left: 0;
position: absolute;
z-index: 200;
}
#my_menu{
width:100%;
height:33px;
display:flex;
}
#my_menu > #callhelp {
padding: 2px 10px 2px 10px;
font-size: 20px;
height: 33px;
margin-top: 3px;
margin-left: 30px;
cursor:pointer;
}
.menu_header, .notify_chat, .menu_options {
padding:8px 6px;
}
.menu_options2 {
padding:10px 6px;
font-size:28px;
}
.menu_drop {
position:absolute;
width:200px;
height:80vh;
bottom:100%;
z-index:100000;
border-radius:8px;
overflow:auto;
display:none;
}
li#nichtdas {
width: 120px;
}
.head_li {
text-decoration:none;
font-size:18px;
padding:8px 0 8px 8px;
width:192px;
display:block;
height:auto;
cursor:pointer;
}
.head_li a {
color:inherit;
text-decoration:none;
display:block;
width:100%;
height:100%;
}
.login_facebook {
width:100%;
height:auto;
margin-top:20px;
}
.fbl_button {
background:#3b5998;
color:#fff;
font-size:17px;
height:40px;
width:100%;
border-radius:5px;
margin-top:25px;
cursor:pointer;
}
.fbl_button2 {
background:#3b5998;
color:#fff;
font-size:17px;
padding:8px 0px;
width:100%;
border-radius:5px;
margin-top:8px;
cursor:pointer;
}
.fbl_button:hover {
background:#1f3a72;
}
.ficon_login {
width:25px;
background:none !important;
color:#fff !important;
}
.hover_element:hover, button:hover {
transition: all 0.5s;
}
#upload_box {
width:280px;
height:auto;
position:absolute;
top:50%;
left:50%;
margin-left:-150px;
margin-top:-160px;
z-index:100000;
border-radius:8px;
padding:5px;
display:none;
}
#upload_header {
height:25px;
width:100%;
padding-bottom:20px;
}
.close_upload {
font-size:25px;
float:right;
}
#upload_control {
width:100%;
height:auto;
padding-bottom:8px;
}
#upload_content {
width:100%;
height:auto;;
}
.fileUpload {
position: relative;
overflow: hidden;
text-align:center;
height:auto;
width:100%;
font-size:25px;
font-weight:bold;
padding:8px 0;
border-radius:8px;
}
.fileUpload input.upload {
position: absolute;
top: 0;
right: 0;
margin: 0;
padding: 0;
font-size: 20px;
cursor: pointer;
opacity: 0;
filter: alpha(opacity=0);
}
#upload_span {
width:100%;
height:50px;
}
#warnupload {
height:20px;
width:100%;
font-size:18px;
display:none;
text-align:center;
}
.progress {
background-color: #f5f5f5;
border-radius: 4px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
height: 20px;
overflow: hidden;
width:100%;
display:none;
margin-top:4px;
}
.bar {
background-color: #5cb85c;
box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15) inset;
color: #fff;
float: left;
font-size: 12px;
height: 100%;
line-height: 20px;
text-align: center;
transition: width 0.6s ease 0s;
width: 0;
}
.progress_mobile {
font-size:40px;
text-align:center;
display:none;
}
#element_progress {
height:22px;
width:100%;
}
#display_file {
text-align:center;
}
#private_input {
margin-bottom:5px;
}
#private_content {
width:96%;
float:left;
border:none;
height:100%;
padding:0 2% 0 2%;
}
#p_input {
height:100%;
}
#private_left {
width:75%;
height:100%;
}
#priv_inside, #submit_private, #input_private, #private_input {
width:100%;
height:100%;
min-height:35px;
}
#priv_inside, #private_left, #private_right, #p_input, #input_private, #p_image {
border-collapse:collapse;
padding:0;
}
#p_image {
width:35px;
height:35px;
text-align:center;
font-size:24px;
}
#input_private {
border-radius:5px;
overflow:hidden;
}
#p_image i {
opacity:0.4;
}
#private_input_wrap {
width:100%;
height:35px;
}
#private_right {
width:25%;
}
#player_content {
width:120px;
height:auto;
float:left;
}
.nofb {
margin-top:25px !important;
}
.option_list ul {
overflow:hidden;
}
.a_ico { color:#999 !important; }
.sa_ico { color:yellow !important; }
.m_ico { color:#888 !important; }
.v_ico { color:#888 !important; }
.boy { color:#0066ff; }
.girl { color:#ff66ff;}
.girl, .boy, .sa_ico, .m_ico, .v_ico, .a_ico {
float:right;
margin-right:10px;
font-size:18px;
}
.keyboard{
height:45px;
width:35px;
font-size:28px;
animation:blink 2s linear infinite;
}
.userafk{
height:45px;
width:35px;
font-size:28px;
}
@keyframes blink{
0%,49.9%{
color:black;
}
50%,100%{
color:white;
}
}
#mmoption{
height:200px;
border:1px solid red;
display:flex;
justify-content:center;
align-items:center;
flex-direction:column;
font-size:20px;
}
#mmoption >h2{
}
#meineeinstellungenspeichern{
width:60%;
}
[type=checkbox]{
height:20px;
width:20px
}
#klingelan{
color:red;
animation:5s bellring linear infinite;
}
@keyframes bellring{0%{transform:rotate(-15deg)}2%{transform:rotate(15deg)}4%{transform:rotate(-18deg)}6%{transform:rotate(18deg)}8%{transform:rotate(-22deg)}10%{transform:rotate(22deg)}12%{transform:rotate(-18deg)}14%{transform:rotate(18deg)}16%{transform:rotate(-12deg)}18%{transform:rotate(12deg)}20%,100%{transform:rotate(0deg)}}
#klingelaus{
color:green;
}
.normalbutton{
background:white;
color:black;
transform:rotate(0deg);
}
.girl1{
border:2px solid #ff99ff;
}
.boy1{
border:2px solid #007399;
}
.container {
background:red;
border-radius: 50%;
width: 40px;
height: 40px;
}
.control{
background:blue;
border-radius: 50%;
position:absolute;
z-index:1;
margin:5px;
width: 30px;
height: 30px;
}
.fa-microphone{
color:white;
font-size:25px !important;
position: absolute;
top: 2px;
left:7px;
z-index: 1;
transform: scale(0.9);
cursor: pointer;
transition: background-color 750ms;
}
#run{
width:200px;
height:30px;
background:none;
border:1px solid black;
}
#pro{
width:0px;
height:30px;
color:black;
background:green;
position:relative;
display:inline-block;
top:0;
left:0;
}
.speech{
animation: pulse 2.2s linear 33;
}
@keyframes pulse {
0% {
border:5px solid white;
}
25%{
background:white;
}
75%{
border:5px solid red;
}
100% {
border:5px solid white;
background:red;
}
}
#prozent{
position:relative;
left:70px;
z-index:3;
}
canvas {
display: inline-block;
background: #202020;
box-shadow: 0px 0px 10px blue;
margin:5px;
}
#record { height: 15vh; }
#record.recording {
background: red;
background: -webkit-radial-gradient(center, ellipse cover, #ff0000 0%,lightgrey 75%,lightgrey 100%,#7db9e8 100%);
background: -moz-radial-gradient(center, ellipse cover, #ff0000 0%,lightgrey 75%,lightgrey 100%,#7db9e8 100%);
background: radial-gradient(center, ellipse cover, #ff0000 0%,lightgrey 75%,lightgrey 100%,#7db9e8 100%); }
#save, #save img { height: 10vh; }
#save { opacity: 0.25;}
#save[download] { opacity: 1;}
#viz{
display:flex;
flex-direction:row;
justify-content: space-around;
align-items: center;
}
#server{
position:relative;
height:300px;
overflow:auto;
width:100%;
border:2px solid black;
}
/* Voice einstellungs panel*/
#page-wrapper {
width: 240px;
font-size: 80%;
background: #000;
padding: 4px;
margin: 4px auto;
border-top: 1px solid #69c773;
box-shadow: 0 2px 10px rgba(0,0,0,0.8);
}
h1 {
font-size:100%;
}
input[type="text"] {
width: 90%;
padding:5%;
font-size:80%;
border-radius: 3px;
border: 1px solid #D9D9D9;
}
input[type="range"] {
width: 130px;
}
label {
display: inline-block;
float: left;
width: 50px;
}
.option ,select{
font-size:80%;
}
button {
display: inline-block;
border-radius: 3px;
border: none;
font-size:100%;
background: #69c773;
border: 1px solid #498b50;
color: white;
font-weight: bold;
margin: 0;
width: 100%;
text-align: center;
}
button:hover, button:focus {
opacity: 0.75;
cursor: pointer;
}
button:active {
opacity: 1;
box-shadow: 0 -3px 10px rgba(0, 0, 0, 0.1) inset;
}
span.rss {
font-size: 20px;
text-align: center;
}
.fa-rss{
width:30px;
height:30px;
border-radius:50%;
background:orange;
border:1px solid black;
cursor:poiter;
margin:0;
line-height: 30px;
padding:0;
display:block;
}
button.chat_zitate {
width: 15px;
height: 15px;
margin-top: 4px;
line-height: 0px;
font-size: 12px;
float: left;
border-radius: 50%;
color: white;
background:black;
}
/*
.chat_zitate:after{
content:'kompletten Text makieren für Zitat';
display:none;
width:200px;
color:red;
background:black;
top:-20px;
position:relative;
}
.chat_zitate:hover:after{
display:block;
}
*/
.chat_zitate:hover{
cursor:pointer;
}
.zit{
background:grey;
border:2px solid orange;
display:block;
width: 70%;
margin-left: 130px;
margin-top: -20px;
}}
.messages_text::selection{
background:blue;
}
</textarea>
<br>
<button id="lint-btn">Run CSSLint</button>
<p>(You may want to keep the CSS kinda small, this could take a while.)</p>
<div id="output"></div>
</body>
</html>
Comments