java/sql-vyuka/web/styl.css
author František Kučera <franta-hg@frantovo.cz>
Sun Apr 07 18:38:36 2013 +0200 (2013-04-07)
changeset 81 6fb319847482
parent 64 b9a61f912f6a
permissions -rw-r--r--
Oprava: Obecné ECMAScriptové nahrazování řetězců.
Chyba se projevovala v Chromiu, ve FF to fungovalo.
Při kliknutí na SQL v průvodci (např. „Restrikce – operátory“), které obsahuje víc > se nahradil jen první výskyt (ignorování nestandardního "g").
https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/String/replace
     1 /** Obrázky s odkazem bez rámečku */
     2 a img {
     3     border: none;
     4 }
     5 
     6 /** Pozadí stránky a text */
     7 html {
     8     background: #42afdc;
     9     color:black;
    10 }
    11 
    12 /** Bezpatkové písmo */
    13 body {
    14     font-family: sans-serif;
    15     font-size: 12px;
    16 }
    17 
    18 /** České uvozovky: „ */
    19 q:before {
    20     content: "\201E";
    21 }
    22 
    23 /** České uvozovky: “ */
    24 q:after {
    25     content: "\201C";
    26 }
    27 
    28 /** Prostor pro logo a název programu */
    29 #zahlavi {
    30     height: 48px;
    31     width: 400px;
    32     background-image: url('grafika/logo.png');
    33     background-repeat: no-repeat;
    34     margin-left: 5px;
    35     cursor: pointer;
    36 }
    37 
    38 #zahlavi h1 {
    39     display: none;
    40 }
    41 
    42 /** Obal kolem bloků */
    43 #bloky {
    44     width: 1040px;
    45     text-align: justify;
    46 }
    47 
    48 .blok {
    49     margin: 10px;
    50 }
    51 
    52 /** Vstup, výstup nebo nápověda */
    53 .vnitrekBloku {
    54     background-image: url('grafika/blok-pozadi.gif');
    55     margin: 0px;
    56     padding: 10px;
    57 }
    58 
    59 #vstup .vnitrekBloku {
    60     height: 150px;
    61     text-align: right;
    62 }
    63 
    64 #stavovePole {
    65     width: 300px;
    66     border: none;
    67     background-color: transparent;
    68     color: gray;
    69     font-size: 11px;
    70 }
    71 
    72 #vstup textarea {
    73     width: 640px;
    74     height: 108px;
    75     padding: 8px;
    76     border: 1px solid silver;
    77 }
    78 
    79 fieldset {
    80     display: inline;
    81     border: none;
    82     padding: 0px;
    83     margin: 0px;
    84 }
    85 
    86 #vstup button {
    87     height: 20px;
    88     border: none;
    89     margin-right: 0px;
    90     margin-top: 5px;
    91     padding: 0px;
    92     cursor: pointer;
    93     background-repeat: no-repeat;
    94 }
    95 
    96 #vstup button.zobrazitHistorii {
    97     background-image: url('grafika/tlacitko-historie.png');
    98     background-color: transparent;
    99     background-position: center;
   100     width: 20px;
   101 }
   102 
   103 #vstup button.vykonatSQL {
   104     background-image: url('grafika/tlacitko-sql.png');
   105     width: 146px;
   106 }
   107 
   108 #vystup .vnitrekBloku {
   109     overflow: auto;
   110     height: 280px;
   111 }
   112 
   113 #napoveda .vnitrekBloku {
   114     height: 484px;
   115 }
   116 
   117 #napovedniPole {
   118     overflow: auto;
   119     margin: 0px;
   120     padding: 0px;
   121     height: 460px;
   122 }
   123 
   124 #napoveda h1 {
   125     font-size: 18px;
   126     font-weight: bold;
   127 }
   128 
   129 /** Nadpisy bloků */
   130 .blok h2 {
   131     font-size: 12px;
   132     padding: 2px;
   133     padding-top: 4px;
   134     padding-left: 32px;
   135     margin: 0px;
   136     color: gray;
   137     height: 20px;
   138 }
   139 
   140 #napoveda h2 {
   141     background-image: url('grafika/blok-nadpis-320.png');
   142 }
   143 
   144 #napoveda #napovedniPole h2 {
   145     background-image: none;
   146     font-size: 14px;
   147     padding: 0px;
   148     margin: 0px;
   149     color: black;
   150     height: auto;
   151 }
   152 
   153 #napoveda pre {
   154     color: gray;
   155     cursor: pointer;
   156 }
   157 
   158 #napoveda ol.obsah {
   159     margin-top: -4px;
   160     margin-bottom: -16px;
   161 
   162 }
   163 
   164 #napoveda a {
   165     text-decoration: none;
   166 }
   167 
   168 #napoveda a:hover {
   169     text-decoration: underline;
   170 }
   171 
   172 #navigace {
   173     background-image: url('grafika/navigace-pozadi.png');
   174     height: 21px;
   175     width: 300px;
   176     position: relative;
   177     bottom: 32px;
   178     left: 10px;
   179     text-align: center;
   180 }
   181 
   182 #navigace button {
   183     height: 20px;
   184     border: none;
   185     margin-right: 0px;
   186     margin-top: 5px;
   187     padding: 0px;
   188     cursor: pointer;
   189     background-repeat: no-repeat;
   190     background-color: transparent;
   191     background-position: center;
   192     width: 20px;
   193     position: relative;
   194     top: -4px;
   195 }
   196 
   197 #navigace button.zpet {
   198     background-image: url('grafika/navigace-zpet.png');
   199     margin-right: 32px;
   200 }
   201 
   202 #navigace button.vpred {
   203     background-image: url('grafika/navigace-vpred.png');
   204     margin-left: 32px;
   205 }
   206 
   207 #navigace button.nasledujici {
   208     background-image: url('grafika/navigace-nasledujici.png');
   209     margin-left: 42px;
   210 }
   211 
   212 #navigace button.predchozi {
   213     background-image: url('grafika/navigace-predchozi.png');
   214     margin-right: 42px;
   215 }
   216 
   217 #navigace button.model {
   218     background-image: url('grafika/navigace-model.png');
   219 }
   220 
   221 #navigace button.pruvodce {
   222     background-image: url('grafika/navigace-pruvodce.png');
   223 }
   224 
   225 /** Vstupně-výstupní část */
   226 #io {
   227     float: left;
   228 }
   229 
   230 #io h2 {
   231     background-image: url('grafika/blok-nadpis-680.png');
   232 }
   233 
   234 /** Blok vstupu */
   235 #vstup {
   236     width: 680px;
   237 }
   238 
   239 /** Blok výstupu */
   240 #vystup {
   241     width: 680px;
   242 }
   243 
   244 /** Blok nápovědy */
   245 #napoveda {
   246     float: right;
   247     width: 320px;
   248 }
   249 
   250 /** Formátování (výstupní) tabulky */
   251 table {
   252     border: 1px solid green;
   253     border-collapse:collapse;
   254     background-color: white;
   255     margin: 3px;
   256 }
   257 
   258 td {
   259     border: 1px solid black;
   260     padding: 4px;
   261     padding-left: 8px;
   262     padding-right: 8px;
   263     vertical-align: top;
   264     text-align: left;
   265 }
   266 
   267 td.cislo {
   268     text-align: right;
   269 }
   270 
   271 thead {
   272     background: gray;
   273     font-weight:bold;
   274     background-image: url('grafika/tabulka-zahlavi.png');
   275     background-repeat: repeat-x;
   276     height: 28px;
   277 }
   278 
   279 thead td a {
   280     color: black;
   281     text-decoration: none;
   282 }
   283 
   284 thead td {
   285     vertical-align: middle;
   286 }
   287 
   288 /** Ikonky pro zprávu k výsledku */
   289 #vystupniPole p {
   290     background-repeat: no-repeat;
   291     padding-left: 22px;
   292 }
   293 
   294 #vystupniPole p.vysledekOK {
   295     background-image: url('grafika/vysledek-ok.png');
   296 }
   297 
   298 #vystupniPole p.vysledekVarovani {
   299     background-image: url('grafika/vysledek-varovani.png');
   300 }
   301 
   302 #vystupniPole p.vysledekChyba {
   303     background-image: url('grafika/vysledek-chyba.png');
   304 }
   305 
   306 #vystupniPole p.vysledekTip {
   307     background-image: url('grafika/vysledek-tip.png');
   308     color: gray;
   309     font-style: italic;
   310 }
   311 
   312 /** Skrytý formulář sloužící pro lokalizaci JavaScriptu */
   313 #lokalizace {
   314     display: none;
   315 }
   316 
   317 /** Skrytý formulář sloužící pro uchování ID průvodce z databáze */
   318 #pruvodceData {
   319     display: none;
   320 }