jsos

college code for operating system fundamentals in js
julios-buttons.css

(2277B)
      1 [class^="icon28-"] {
      2   display: inline-block;
      3   width: 28px;
      4   height: 28px;
      5   margin-top: 4px;
      6   line-height: 28px;
      7   vertical-align: text-top;
      8   background-image: url("../images/icons28.png");
      9   background-position: 28px 28px;
     10   background-repeat: no-repeat;
     11 }
     12 .icon28-poweroff { background-position: 0 0; }
     13 .icon28-halt { background-position: -28px 0; }
     14 .icon28-reset { background-position: -56px 0; }
     15 .btnicon28 {
     16   border-radius: 1em;
     17   font-size: 30px;
     18   line-height: 1.2em;
     19   padding: 0.3em 1em;
     20   border-width: 1px;
     21   background-image: -moz-radial-gradient(50% 10%, circle, #ffffff 0%, #c1c1c1 30px);
     22   background-image: -webkit-radial-gradient(50% 10%, circle, #ffffff 0%, #c1c1c1 30px);
     23   background-image: -o-radial-gradient(50% 10%, circle, #ffffff 0%, #c1c1c1 30px);
     24   background-image: -ms-radial-gradient(50% 10%, circle, #ffffff 0%, #c1c1c1 30px);
     25   border-color: #b7b7b7;
     26   text-shadow: #fff 0px 1px 1px;
     27   box-shadow: rgba(255,255,255,0.867) 0 0 0.1em 1px inset;
     28   background-clip: padding-box;
     29   padding: 8px 0;
     30   margin: 0 3px;
     31   border-width: 2px;
     32   width: 56px;
     33 }
     34 .btnicon28[disabled] { opacity:0.4; }
     35 .btnicon28,
     36 .btnicon28:visited { color: #222 }
     37 .btnicon28:hover,
     38 .btnicon28:focus {
     39   background-color: #fff;
     40   background-image: -moz-radial-gradient(50% 10%, circle, #fcfcfc 0%, #b9b9b9 30px);
     41   background-image: -webkit-radial-gradient(50% 10%, circle, #fcfcfc 0%, #b9b9b9 30px);
     42   background-image: -o-radial-gradient(50% 10%, circle, #fcfcfc 0%, #b9b9b9 30px);
     43   background-image: -ms-radial-gradient(50% 10%, circle, #fcfcfc 0%, #b9b9b9 30px);
     44   border-color: #afafaf;
     45   text-shadow: #fff 0px 1px 1px;
     46   outline: none;
     47 }
     48 .btnicon28:hover,
     49 .btnicon28:hover:visited,
     50 .btnicon28:focus,
     51 .btnicon28:focus:visited { color: #222 }
     52 .btnicon28:active {
     53   background-color: #fff;
     54   background-image: -moz-radial-gradient(50% 10%, circle, #d8d8d8 0%, #f1f1f1 30px);
     55   background-image: -webkit-radial-gradient(50% 10%, circle, #d8d8d8 0%, #f1f1f1 30px);
     56   background-image: -o-radial-gradient(50% 10%, circle, #d8d8d8 0%, #f1f1f1 30px);
     57   background-image: -ms-radial-gradient(50% 10%, circle, #d8d8d8 0%, #f1f1f1 30px);
     58   border-color: #a7a7a7;
     59   box-shadow: #b7b7b7 0 0.08em 0.1em 1px inset;
     60 }
     61 .btnicon28:active,
     62 .btnicon28:active:visited { color: #222; }