Changeset bfe8c65 for installer


Ignore:
Timestamp:
Feb 10, 2017 4:37:15 PM (3 years ago)
Author:
str4d <str4d@…>
Branches:
master
Children:
bff3f04
Parents:
a22bf6b
Message:

SusiDNS changes:

  • Additional column on hostname list page for helper address with icon, and iconfication of b32 addresses
  • Added minified identicon to hostname column
  • Changed destination address display on list/details from textarea to div to accomodate automatic height adjustment (no need to manually specify height and hope for the best)
    • Also allows us to display the full Destination on the details page
  • Tooltips for eraser icon + new address helper icon & minified identicons
  • Consolidation of Hostname/host name/name referenced: now all "Hostname"
  • Theme tweaks and whitespace removal
Location:
installer/resources/themes
Files:
2 added
4 edited

Legend:

Unmodified
Added
Removed
  • installer/resources/themes/susidns/classic/susidns.css

    ra22bf6b rbfe8c65  
    3030}
    3131
     32*, *:active {
     33     outline: none;
     34}
     35
    3236hr {
    3337     display: none;
     
    5862}
    5963
     64.book th:last-child {
     65     background: url(/themes/console/images/buttons/delete.png) center center no-repeat, linear-gradient(to bottom, #fff 0%, #fff 50%, #eff2ff 50%, #eff2ff 100%);
     66}
     67
    6068table.book tr:hover textarea {
    6169     background: #fff;
     
    6977}
    7078
    71 
    72 table.book td:first-child        {
    73      width: 20px;
     79table.book td:last-child {
     80     width: 36px;
    7481     white-space: no-wrap;
    75 }
    76 
    77 table.book td:nth-child(2) {
     82     text-align: center;
     83     padding: 0 5px;
     84}
     85
     86table.book td:first-child {
    7887     width: 200px;
    7988     white-space: nowrap;
    8089}
    8190
    82 table.book td:nth-child(3) {
     91table.book td:nth-child(2) {
    8392     width: 30px;
    8493     white-space: nowrap;
     
    8695}
    8796
    88 .book td:nth-child(4) {
     97.book td:nth-child(3) {
    8998     text-align: center;
    9099     width: 20px;
    91      padding: 2px 25px 2px 0 !important;
    92 }
    93 
    94 .book td:nth-child(4) a:not(old) {
     100     padding: 2px 20px 2px 0 !important;
     101}
     102
     103.book td:nth-child(3) a:not(old) {
    95104     font-size: 0 !important;
    96105}
    97106
    98 .book td:nth-child(4) .addrhlpr a::after {
     107.book td:nth-child(3) .addrhlpr a::after {
    99108     content: url(/themes/console/images/buttons/fullview.png);
    100109     text-align: center;
     
    134143     margin: -1px -11px 0;
    135144     padding: 0;
    136 }
    137 
    138 .iframed #navi p {
    139      margin: 8px 0 7px;
    140145}
    141146
     
    174179div.help {
    175180     border: 1px solid #89f;
     181     margin: 0 0 10px;
     182     background: #eef;
     183}
     184
     185.iframed #helpsubs {
    176186     margin: 0 0 -1px;
    177      background: #eef;
    178 }
    179 
    180 /*
    181 .iframed #help {
    182      margin: 0 -10px -1px;
    183 }
    184 */
     187}
    185188
    186189#helpconfig {
     
    199202     margin-left: -25px;
    200203     list-style-type: square;
    201 }
    202 
    203 #navi p {
    204      text-align: center !important;
    205      text-transform: capitalize;
    206      font-weight: bold;
    207      line-height: 130%;
    208204}
    209205
     
    268264     font-size:10pt;
    269265     background: linear-gradient(to bottom, #fff 0%, #fff 50%, #eff2ff 50%, #eff2ff 100%);
    270      border-bottom: 1px solid #89f; 
     266     border-bottom: 1px solid #89f;
    271267}
    272268
     
    320316p.book, #messages + p {
    321317     background: url(/themes/susidns/images/addressbook.png) center left no-repeat;
    322      padding: 10px 10px 10px 38px; 
     318     padding: 10px 10px 10px 38px;
    323319}
    324320
    325321p.footer {
    326      font-size: 7pt;
    327      text-align: center;
    328      padding: 0;
    329      margin: 12px auto -15px;
    330      border: 1px solid #89f;
    331      border-radius: 0 0 3px 3px;
    332      width: 200px;
    333      background: #fff;
     322     position: absolute;
     323     top: 0;
     324     left: -24px;
     325     border: none;
     326     background: none;
     327     opacity: 0.3;
     328     font-size: 8pt !important;
     329     display: none;
    334330}
    335331
     
    409405     margin: 0 5px !important;
    410406     display:inline-block;
    411      padding: 1px 5px; 
     407     padding: 1px 5px;
    412408}
    413409
     
    454450}
    455451
    456 #buttons + div > table {
    457      width: 50%;
    458      margin: auto;
    459 }
     452#visualid {
     453     padding: 0;
     454}
     455
     456#visualid h3 {
     457     text-transform: none;
     458}
     459
     460#visualid table {
     461     width: 100%;
     462     border-collapse: collapse;
     463     margin: 0;
     464}
     465
     466#visualid tr:first-child td {
     467     padding: 10px 10px 20px;
     468}
     469
     470#visualid td:first-child {
     471     text-align: right;
     472}
     473
     474#visualid td[colspan="2"] {
     475     border-top: 1px solid #89f;
     476     padding: 15px 0;
     477}
     478
     479.iframed #visualid td[colspan="2"] {
     480     padding-bottom: 0;
     481}
    460482
    461483img[src*="imagegen"] {
     
    495517}
    496518
    497 button, input, select {
     519.fakebutton, input, select {
    498520     font: 9pt/130% "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Helvetica, sans-serif;
    499521}
     
    533555
    534556td.destinations textarea, td.destinations textarea:focus {
     557     font: normal 8.5pt "Noto Mono", "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", Courier, mono;*/
    535558     resize: none;
    536559     font-size: 8pt;
     
    538561     border: none;
    539562     border-left: 1px solid #888 !important;
     563     border-right: 1px solid #888 !important;
    540564     border-radius: 0;
    541      margin: 0px !important;
     565     margin: 0 0 0 5px !important;
    542566     background: none;
    543567     box-shadow: 0 none !important;
    544568}
    545569
    546 button, input[type="submit"], input[type="reset"] {
     570.fakebutton, input[type="submit"], input[type="reset"] {
    547571     padding: 4px 3px !important;
    548572     border-radius: 2px;
     
    553577     margin: 2px 0 2px 4px;
    554578     filter: drop-shadow(0 0 1px #ccc);
    555      color: #333;
    556 }
    557 
    558 button:hover, input[type="submit"]:hover, input[type="reset"]:hover,
    559 button:focus, input[type="submit"]:focus, input[type="reset"]:focus {
     579     color: #333 !important;
     580}
     581
     582.fakebutton:hover, input[type="submit"]:hover, input[type="reset"]:hover,
     583.fakebutton:focus, input[type="submit"]:focus, input[type="reset"]:focus {
    560584     background: #fff;
    561585     background: linear-gradient(to bottom, #ddd 0%, #fff 100%);
     
    566590}
    567591
    568 button:active, input[type="submit"]:active, input[type="reset"]:active {
     592.fakebutton:active, input[type="submit"]:active, input[type="reset"]:active {
    569593     box-shadow: inset 3px 3px 3px #999;
    570594     box-shadow: inset 0 0 0 1px #fff, inset 3px 3px 3px #999;
     
    591615#navi {
    592616     padding: 3px !important;
     617     text-align: center !important;
    593618}
    594619
     
    656681}
    657682
    658 #navi p {
    659      text-align: center !important;
    660      text-transform: capitalize;
    661      font-weight: bold;
    662      padding: 2px 5px !important;
    663      margin: 0 !important;
    664 }
    665 
    666 #navi p > * {
    667      vertical-align: middle;
    668 }
    669 
    670683.headline + #book > table {
    671684     margin-top: 10px !important;
    672 } 
     685}
    673686
    674687/* page titles */
     
    725738}
    726739
     740/*
    727741p.footer {
    728742     margin: 12px auto -21px !important;
    729743}
     744*/
    730745
    731746#export {
     
    736751     font-size: 11pt !important;
    737752}
    738 
    739753}
    740754
    741755/* end responsive layout */
    742 
    743756
    744757/* export hosts */
     
    750763}
    751764
    752 /* hide export button on published page when empty */ 
     765/* hide export button on published page when empty */
    753766#messages + form[action="export"] {
    754767     display: none;
     
    768781#book p {
    769782     margin-left: 2px;
    770 } 
     783}
    771784
    772785p.book {
     
    774787     background-position: left center !important;
    775788}
     789
     790/* host details page */
     791
     792#host_details td {
     793     padding: 5px 10px !important;
     794}
     795
     796#host_details td:first-child {
     797     min-width: 10px !important;
     798     width: 10%;
     799     white-space: nowrap;
     800     font-weight: bold;
     801     text-align: right;
     802}
     803
     804#host_details td:last-child {
     805     width: 90%;
     806     text-align: left;
     807     border-left: none !important;
     808     border-right: none !important;
     809}
     810
     811#host_details td.destinations {
     812     background: none;
     813}
     814
     815#host_details tr:hover {
     816     background: #ffd;
     817}
     818
     819#host_details .destaddress {
     820     font-family: "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", Courier, mono !important;
     821     word-break: break-all !important;
     822     white-space: normal !important;
     823}
     824
     825/* end host details */
     826
     827.names img {
     828     width: 20px;
     829     height: 20px;
     830     vertical-align: middle;
     831     margin: 1px 10px 1px 1px;
     832     padding: 1px;
     833     border: 1px solid #89f;
     834     border-radius: 2px;
     835     background: #fff;
     836}
     837
     838.names img:hover, .names a:focus img {
     839     filter: drop-shadow(0 0 1px #f60) !important;
     840     -webkit-filter: drop-shadow(0 0 1px #f60) !important;
     841     box-shadow: 0 0 0 1px #f60;
     842}
     843
     844.names a:active img, .names a:focus img {
     845     transform: rotate(45deg) scale(0.8);
     846     transition: ease all 0.1s 0s;
     847}
     848
     849/* hostname list */
     850
     851#host_list th:first-child,
     852#host_list td:first-child {
     853     width: 150px;
     854     width: 30%;
     855     white-space: nowrap;
     856     padding-left: 5px;
     857}
     858
     859#host_list th:first-child {
     860     padding-left: 39px;
     861}
     862
     863#host_list td:last-child {
     864     width: 16px;
     865     white-space: nowrap;
     866     font-weight: bold;
     867}
     868
     869#host_list th:nth-child(2), #host_list td:nth-child(2),
     870#host_list th:nth-child(3), #host_list td:nth-child(3),
     871#host_list th:nth-child(4), #host_list td:nth-child(4) {
     872     width: 35px;
     873     width: 8%;
     874     padding: 0 5px !important;
     875     white-space: nowrap;
     876     text-align: center;
     877}
     878
     879#host_list td:nth-child(2) a:not(old) {
     880     font-size: 0 !important;
     881}
     882
     883#host_list td:nth-child(2) a::after {
     884     content: url(/themes/console/images/buttons/link.png);
     885     text-align: center;
     886     filter: drop-shadow(0 0 1px #555);
     887     -webkit-filter: drop-shadow(0 0 1px #555);
     888     cursor: pointer;
     889}
     890
     891#host_list td:nth-child(3) a:not(old) {
     892     font-size: 0 !important;
     893}
     894
     895#host_list td:nth-child(3) a::after {
     896     content: url(/themes/console/images/buttons/helper.png);
     897     cursor: pointer;
     898}
     899
     900#host_list th:nth-child(4), #host_list td:nth-child(4) {
     901     padding-right: 30px !important;
     902}
     903
     904#host_list td:nth-child(4) a:not(old) {
     905     font-size: 0 !important;
     906}
     907
     908#host_list td:nth-child(4) .addrhlpr a::after {
     909     content: url(/themes/console/images/buttons/fullview.png);
     910     text-align: center;
     911     padding: 0 10px !important;
     912     filter: drop-shadow(0 0 1px #555);
     913     -webkit-filter: drop-shadow(0 0 1px #555);
     914     cursor: pointer;
     915}
     916
     917#host_list td:nth-child(2) a:hover, #host_list td:nth-child(3) a:hover, #host_list td:nth-child(4) a:hover,
     918#host_list td:nth-child(2) a:focus, #host_list td:nth-child(3) a:focus, #host_list td:nth-child(4) a:focus {
     919     filter: drop-shadow(0 0 1px #f60);
     920     -webkit-filter: drop-shadow(0 0 1px #f60);
     921}
     922
     923#host_list .destaddress {
     924     overflow: auto !important;
     925     white-space: nowrap;
     926     font-family: "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", Courier, mono !important;
     927     font-weight: normal;
     928     color: #555;
     929     padding: 3px !important;
     930}
     931
     932/* end hostname list */
     933
     934td.destinations {
     935     max-width: 50px !important;
     936     border-left: 1px solid #89f;
     937     border-right: 1px solid #89f;
     938}
     939
     940/* MS Edge 14+ fix */
     941_:-ms-lang(x), * {
     942     filter: none !important;
     943     -webkit-filter: none !important;
     944}
     945
  • installer/resources/themes/susidns/dark/susidns.css

    ra22bf6b rbfe8c65  
    6161     border-radius: 0 0 2px 2px;
    6262     z-index: 999;
     63     text-align: center;
    6364}
    6465
     
    7273}
    7374
    74 #navi p {
    75      text-align: center;
    76      font-weight: bold;
    77      font-size: 9pt;
    78 }
    79 
    8075#navi a:link {
    8176     text-transform: capitalize;
     
    9186     filter: drop-shadow(0 0 1px #000);
    9287     -webkit-filter: drop-shadow(0 0 1px #000);
     88     padding: 2px 5px 3px 24px;
    9389}
    9490
     
    111107     background: #000 url(/themes/susidns/images/abook.png) 5px center no-repeat;
    112108     background: url(/themes/susidns/images/abook.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
    113      padding: 3px 5px 3px 24px;
    114109}
    115110
     
    125120     background: #000 url(/themes/susidns/images/subs.png) 5px center no-repeat;
    126121     background: url(/themes/susidns/images/subs.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
    127      padding: 3px 5px 3px 24px;
    128122}
    129123
     
    139133     background: #000 url(/themes/console/images/buttons/configure.png) 5px center no-repeat;
    140134     background: url(/themes/console/images/buttons/configure.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
    141      padding: 3px 5px 3px 24px;
    142135}
    143136
     
    153146     background: #000 url(/themes/susidns/images/overview.png) 5px center no-repeat;
    154147     background: url(/themes/susidns/images/overview.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
    155      padding: 3px 5px 3px 24px;
    156148}
    157149
     
    162154#navi a#overview:active {
    163155     background: #f60 url(/themes/susidns/images/overview.png) 5px center no-repeat !important;
    164 }
    165 
    166 #navi p {
    167      text-align: center !important;
    168      text-transform: capitalize;
    169      font-weight: bold;
    170      padding: 2px 5px !important;
    171      margin: 0 !important;
    172 }
    173 
    174 #navi p > * {
    175      vertical-align: middle;
    176156}
    177157
     
    191171div#filter {
    192172     border: 1px solid #2a5f29;
    193      padding: 0 0 15px;
     173     padding: 0 5px 15px;
    194174     text-align: center;
    195175     background: #000;
     
    329309     font-weight: bold;
    330310     border: 1px solid #2a5f29;
    331      padding: 5px 10px;
     311     padding: 7px 10px;
    332312     background: #000 url(/themes/console/dark/images/header.png) repeat-x scroll center center;
    333313     background: linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000000 56%, #000000 100%);
     
    359339.headline h3:first-child + h4 {
    360340     margin-top: -25px;
    361      margin-bottom: 25px !important;
     341     margin-bottom: 26px !important;
    362342}
    363343
     
    387367     border: 1px solid #2a5f29;
    388368     background: #000 url(/themes/susidns/images/addressbook.png) 10px center no-repeat;
    389      padding: 20px 20px 20px 50px !important; 
     369     padding: 20px 20px 20px 50px !important;
    390370}
    391371
     
    397377     padding: 12px 10px 8px 20px;
    398378     font-size: 10pt;
    399      margin: -15px 0 10px;
     379     margin: -14px 0 10px;
    400380}
    401381
     
    404384}
    405385
    406 .book th:first-child {
    407      padding: 0 !important;
     386.book th:first-child, .book td:first-child {
     387     padding: 0 10px !important;
    408388}
    409389
     
    412392}
    413393
    414 .book td:nth-child(3) {
     394.book td:nth-child(2) {
    415395     padding: 2px 0 2px 5px !important;
    416396     width: 30px;
    417397}
    418398
    419 .book td:nth-child(4) {
     399.book td:nth-child(3) {
    420400     text-align: center;
    421401     width: 20px;
     
    423403}
    424404
    425 .book td:nth-child(4) a:not(old) {
     405.book td:nth-child(3) a:not(old) {
    426406     font-size: 0 !important;
    427407}
    428408
    429 .book td:nth-child(4) .addrhlpr a::after {
     409.book td:nth-child(3) .addrhlpr a::after {
    430410     content: url(/themes/console/images/buttons/fullview.png);
    431411     text-align: center;
     
    497477     min-height: 16px;
    498478     background: none;
     479     cursor: pointer;
    499480}
    500481
     
    504485}
    505486
    506 div#buttons + div > table {
     487.iframed #visualid {
     488     margin-top: 16px;
     489}
     490
     491#visualid h3 {
     492     margin-bottom: -1px;
     493}
     494
     495#visualid h3 span {
     496     text-transform: normal !important;
     497}
     498
     499#visualid table {
    507500     width: 100%;
    508501     border: 1px solid #2a5f29;
    509      margin-top: -46px;
    510 }
    511 
    512 div#buttons + div > table > tbody > tr > td {
    513      padding-top: 51px !important;
    514 }
    515 
    516 div#buttons + div > table > tbody > tr > td:first-child {
     502     border-collapse: collapse;
     503}
     504
     505#visualid tr:first-child td {
     506     padding: 15px 5px !important;
     507}
     508
     509#visualid td:first-child {
    517510     text-align: right;
    518511}
    519512
    520 div#buttons + div > table > tbody > tr > td {
     513#visualid td {
    521514     text-align: left;
     515}
     516
     517#visualid td[colspan="2"] {
     518     padding: 15px 3px;
     519     border-top: 1px solid #2a5f29;
    522520}
    523521
     
    572570.help ul li:last-child {
    573571     margin-bottom: -10px;
    574 } 
     572}
    575573
    576574#helpsubs {
     
    625623div#config > textarea, div#content > textarea {
    626624     border-radius: 0;
    627      margin-top: -26px;
     625     margin-top: -27px;
    628626}
    629627
     
    658656div#book {
    659657     padding: 0;
    660      margin: -15px 0 -5px; 
     658     margin: -15px 0 -5px;
    661659}
    662660
     
    664662     width: 100%;
    665663     border: 1px solid #2a5f29;
    666      margin-top: -10px;
     664/*     margin-top: -10px;*/
    667665}
    668666
     
    686684}
    687685
    688 #book th:first-child {
     686#book th:last-child {
    689687     background: url(/themes/console/dark/images/header.png) repeat-x scroll center center #000;
    690688     background: url(images/bin.png) center center no-repeat, linear-gradient(to bottom, #001000 0%, #001900 50%, #000 51%, #000 100%) !important;
     
    694692     margin: 0;
    695693}
    696        
     694
    697695div#add {
    698696     border: 1px solid #2a5f29;
    699697     padding: 0 0 10px;
    700      margin-top: 20px;
     698     margin-top: 23px;
    701699     background: #000;
    702700}
     
    706704     margin-left: -1px;
    707705     margin-right: -1px;
    708      padding: 5px 10px;
     706     padding: 8px 10px;
    709707     font-size: 10pt;
    710708}
     
    730728}
    731729
    732 input[type="submit"]:hover, input[type="reset"]:hover, input[type="submit"]:focus, input[type="reset"]:focus {
     730input[type="submit"]:hover, input[type="reset"]:hover, input[type="submit"]:focus, input[type="reset"]:focus, .fakebutton:hover, #fakebutton:focus {
    733731     background: #000;
    734732     color: #f60;
    735733     border: 1px solid #f60;
    736734     box-shadow: inset 0 1px 1px 0 #ee9;
     735}
     736
     737.fakebutton, .fakebutton:visited {
     738     color: #494;
     739}
     740
     741.fakebutton:hover, .fakebutton:focus {
     742     color: #f60;
    737743}
    738744
     
    749755     border-radius: 2px;
    750756     border: 1px solid #2a5f29;
    751      background: #000 none !important;     
     757     background: #000 none !important;
    752758     color: #494;
    753759     margin: 2px 4px 2px 0;
     
    756762}
    757763
    758 input[type="submit"], input[type="reset"] {
     764input[type="submit"], input[type="reset"], .fakebutton {
    759765     color: #494;
    760766     background: #000;
     
    767773     min-height: 22px !important;
    768774     min-width: 80px !important;
    769 }
    770 
    771 input[type=submit]:active, input[type=reset]:active {
     775     cursor: pointer;
     776}
     777
     778input[type=submit]:active, input[type=reset]:active, .fakebutton:active {
    772779     background: #f60 !important;
    773780     color: #ee9 !important;
     
    802809     font: bold 8.5pt "Noto Mono", "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", Courier, mono;
    803810     border-radius: 2px;
    804      width: 100%; 
     811     width: 100%;
    805812     height: 120px;
    806813     line-height: 140%;
     
    820827     border: none;
    821828     border-left: 1px solid #2a5f29;
     829     border-right: 1px solid #2a5f29;
    822830     margin: 0 !important;
    823831     border-radius: 0;
     
    872880#navi a {
    873881     background: linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%) !important;
    874      padding: 3px 8px !important;     
     882     padding: 2px 8px !important;
     883}
     884
     885#navi a.abook:hover, #navi a#overview:hover, #navi a#subs:hover, #navi a#config:hover,
     886#navi a.abook:focus, #navi a#overview:focus, #navi a#subs:focus, #navi a#config:focus {
     887     background: #000 !important;
     888     padding: 2px 8px !important;
     889}
     890
     891#navi a.abook:active, #navi a#overview:active, #navi a#subs:active, #navi a#config:active {
     892     background: #f60 !important;
    875893}
    876894}
     
    881899}
    882900
    883 body, input[type="submit"], input[type="reset"], input, select, h4, td.names a, p, li {
     901body, input[type="submit"], input[type="reset"], .fakebutton, input, select, h4, td.names a, p, li, #filter a, #host_details td {
    884902     font-size: 10pt !important;
    885903}
     
    890908
    891909#navi a {
    892      font-size: 10.5pt !important;
    893      padding: 6px 5px 6px 25px !important;
    894 }
    895 
    896 h3, #filter a {
     910     font-size: 10pt !important;
     911     padding: 4px 7px 5px 25px !important;
     912}
     913
     914h3 {
    897915     font-size: 11pt !important;
    898916}
     
    900918#filter a:link, #filter a:visited {
    901919     margin: 3px 2px !important;
     920}
     921form[action="addressbook"] > p.buttons {
     922     margin-bottom: -20px;
    902923}
    903924}
     
    938959     display: none;
    939960}
     961
     962/* host details page */
     963
     964#host_details td {
     965     padding: 6px 10px !important;
     966}
     967
     968#host_details td:first-child {
     969     min-width: 10px !important;
     970     width: 10%;
     971     white-space: nowrap;
     972     font-weight: bold;
     973     text-align: right;
     974}
     975
     976#host_details td:last-child {
     977     width: 90%;
     978     text-align: left;
     979     border-left: none !important;
     980     border-right: none !important;
     981}
     982
     983#host_details td.destinations {
     984     background: none;
     985}
     986
     987#host_details tr:hover {
     988     background: #ffd;
     989}
     990
     991#host_details .destaddress {
     992     font-family: "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", Courier, mono !important;
     993     word-break: break-all !important;
     994     white-space: normal !important;
     995}
     996
     997/* end host details */
     998
     999.names img {
     1000     width: 20px;
     1001     height: 20px;
     1002     vertical-align: middle;
     1003     margin: 1px 10px 1px 1px;
     1004     padding: 1px;
     1005     border: 1px solid #141;
     1006     border-radius: 2px;
     1007     background: #000;
     1008}
     1009
     1010.names img:hover, .names a:focus img {
     1011/*     filter: drop-shadow(0 0 1px #f60) !important;
     1012     -webkit-filter: drop-shadow(0 0 1px #f60) !important;*/
     1013     border: 1px solid #f60;
     1014}
     1015
     1016.names a:active img, .names a:focus img {
     1017     transform: rotate(45deg) scale(0.8);
     1018     transition: ease all 0.1s 0s;
     1019}
     1020
     1021/* hostname list */
     1022
     1023#host_list {
     1024     margin-top: 28px;
     1025}
     1026
     1027#host_list th:first-child,
     1028#host_list td:first-child {
     1029     width: 150px;
     1030     width: 30%;
     1031     white-space: nowrap;
     1032     padding-left: 5px !important;
     1033}
     1034
     1035#host_list th:first-child {
     1036     padding-left: 39px !important;
     1037}
     1038
     1039#host_list td:last-child {
     1040     width: 16px;
     1041     white-space: nowrap;
     1042     font-weight: bold;
     1043}
     1044
     1045#host_list th:nth-child(2), #host_list td:nth-child(2),
     1046#host_list th:nth-child(3), #host_list td:nth-child(3),
     1047#host_list th:nth-child(4), #host_list td:nth-child(4) {
     1048     width: 35px;
     1049     width: 8%;
     1050     padding: 0 5px !important;
     1051     white-space: nowrap;
     1052     text-align: center;
     1053}
     1054
     1055#host_list td:nth-child(2) a:not(old) {
     1056     font-size: 0 !important;
     1057}
     1058
     1059#host_list td:nth-child(2) a::after {
     1060     content: url(/themes/console/images/buttons/link.png);
     1061     text-align: center;
     1062     filter: drop-shadow(0 0 1px #555);
     1063     -webkit-filter: drop-shadow(0 0 1px #555);
     1064     cursor: pointer;
     1065}
     1066
     1067#host_list td:nth-child(3) a:not(old) {
     1068     font-size: 0 !important;
     1069}
     1070
     1071#host_list td:nth-child(3) a::after {
     1072     content: url(/themes/console/images/buttons/helper.png);
     1073     cursor: pointer;
     1074}
     1075
     1076#host_list th:nth-child(4), #host_list td:nth-child(4) {
     1077     padding-right: 30px !important;
     1078}
     1079
     1080#host_list td:nth-child(4) a:not(old) {
     1081     font-size: 0 !important;
     1082}
     1083
     1084#host_list td:nth-child(4) .addrhlpr a::after {
     1085     content: url(/themes/console/images/buttons/fullview.png);
     1086     text-align: center;
     1087     padding: 0 10px !important;
     1088     filter: drop-shadow(0 0 1px #555);
     1089     -webkit-filter: drop-shadow(0 0 1px #555);
     1090     cursor: pointer;
     1091}
     1092
     1093#host_list td:nth-child(2) a:hover, #host_list td:nth-child(3) a:hover, #host_list td:nth-child(4) a:hover,
     1094#host_list td:nth-child(2) a:focus, #host_list td:nth-child(3) a:focus, #host_list td:nth-child(4) a:focus {
     1095     filter: drop-shadow(0 0 1px #f60);
     1096     -webkit-filter: drop-shadow(0 0 1px #f60);
     1097}
     1098
     1099#host_list .destaddress {
     1100     overflow: auto !important;
     1101     white-space: nowrap;
     1102     font-family: "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", Courier, mono !important;
     1103     font-weight: normal;
     1104     padding: 3px !important;
     1105}
     1106
     1107/* end hostname list */
     1108
     1109td.destinations {
     1110     max-width: 50px !important;
     1111     border-left: 1px solid #141;
     1112     border-right: 1px solid #141;
     1113}
     1114
     1115/* MS Edge 14+ fix */
     1116_:-ms-lang(x), * {
     1117     filter: none !important;
     1118     -webkit-filter: none !important;
     1119}
     1120
  • installer/resources/themes/susidns/light/susidns.css

    ra22bf6b rbfe8c65  
    5353}
    5454
     55code, tt, .destaddress {
     56     font-size: 8pt;
     57}
     58
    5559#navi {
    5660     margin: -1px 0 0;
    57      padding: 12px 3px;
     61     padding: 5px 3px;
    5862     text-align: center;
    5963     border: 1px solid #7778bf;
     
    6872
    6973.iframed #navi {
    70      margin: -1px 0 0;
    71      padding: 3px 2px;
     74     margin: -1px 0 10px;
     75     padding: 7px 5px 6px;
     76     border-radius: 2px;
     77     filter: drop-shadow(0px 0 1px #999);
     78     -webkit-filter: drop-shadow(0px 0 1px #999);
    7279}
    7380
     
    7582     border: 1px solid #77789f;
    7683     border-radius: 2px;
    77      filter: drop-shadow(0 0 1px #ccc);
    78      -webkit-filter: drop-shadow(0 0 1px #ccc);
     84     filter: drop-shadow(0 0 1px #bbb);
     85     -webkit-filter: drop-shadow(0 0 1px #bbb);
    7986     display: inline-block;
    8087     margin: 2px 0;
     88     text-transform: capitalize;
     89     box-shadow: inset 0 0 0 1px #fff;
     90}
     91
     92#navi a:hover, #navi a:focus {
     93     background-blend-mode: luminosity;
     94}
     95
     96#navi a:active {
     97     color: #555;
     98     box-shadow: inset 0 0 0 1px #fff, inset 3px 3px 2px #999;
     99     mix-blend-mode: luminosity;
    81100}
    82101
    83102#navi a.abook {
    84      background: #fff url(/themes/susidns/images/abook.png) 5px center no-repeat;
     103     background: url(/themes/susidns/images/abook.png) 5px center no-repeat, linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 50%, #ebebff 100%) #fff;
    85104     padding: 5px 5px 5px 24px;
    86105}
    87106
    88107#navi a#subs {
    89      background: #fff url(/themes/susidns/images/subs.png) 5px center no-repeat;
     108     background: url(/themes/susidns/images/subs.png) 5px center no-repeat, linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 50%, #ebebff 100%) #fff;
    90109     padding: 5px 5px 5px 24px;
    91110}
    92111
    93112#navi a#config {
    94      background: #fff url(/themes/console/images/buttons/configure.png) 5px center no-repeat;
     113     background: url(/themes/console/images/buttons/configure.png) 5px center no-repeat, linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 50%, #ebebff 100%) #fff;
    95114     padding: 5px 5px 5px 24px;
    96115}
    97116
    98117#navi a#overview {
    99      background: #fff url(/themes/susidns/images/overview.png) 5px center no-repeat;
     118     background: url(/themes/susidns/images/overview.png) 5px center no-repeat, linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 50%, #ebebff 100%) #fff;
    100119     padding: 5px 5px 5px 24px;
    101 }
    102 
    103 #navi p {
    104      text-align: center !important;
    105      text-transform: capitalize;
    106      font-weight: bold;
    107      padding: 0 5px !important;
    108      margin: 0 !important;
    109120}
    110121
     
    125136     padding: 2px 5px 3px 30px;
    126137     background: url(/themes/susidns/images/addressbook.png) left center no-repeat;
    127      font-size: 11pt; 
     138     font-size: 11pt;
    128139}
    129140
     
    149160     padding: 8px 10px 0;
    150161     padding: 8px 10px 0 33px;
    151      background: url(/themes/susidns/images/drive.png) 9px 6px no-repeat;
     162     background: url(/themes/susidns/images/drive.png) 9px 7px no-repeat;
    152163}
    153164
     
    160171
    161172.iframed #content {
    162      border-radius: 0 0 2px 2px;
    163      overflow: hidden; 
     173     border-radius: 2px;
     174     overflow: hidden;
    164175}
    165176
     
    186197#content h3 {
    187198     border: 1px solid #77789f;
    188      padding: 3px 8px;
     199     padding: 5px 8px;
    189200     border-radius: 2px;
    190201     background: linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 50%, #eef 100%);
     202     box-shadow: inset 0 0 0 1px #fff;
    191203     filter: drop-shadow(0 0 1px #999);
    192204     -webkit-filter: drop-shadow(0 0 1px #999);
     
    195207div#add {
    196208     border: 1px solid #7778bf;
     209     margin-top: -1px;
    197210     padding: 0 15px;
    198211     background: #fff;
     212}
     213
     214.iframed #add {
     215     margin-top: 10px;
    199216}
    200217
     
    226243
    227244div.help {
    228      border: 1px solid #7778bf; 
     245     border: 1px solid #7778bf;
    229246     padding: 0 15px;
    230247     background: #eef;
     
    234251.iframed div.help {
    235252     border-radius: 0 0 2px 2px;
    236 } 
     253}
    237254
    238255.help#helpsubs {
     
    257274     font-size: 10pt;
    258275     text-align: justify;
     276}
     277
     278.iframed #helpconfig, .iframed #helpsubs {
     279     margin-top: 10px;
     280     box-shadow: inset 0 0 0 1px #fff;
     281     border-radius: 0;
    259282}
    260283
     
    298321}
    299322
     323ol, ul {
     324     margin-left: -30px;
     325}
     326
    300327li {
    301328     font-size: 9pt;
     
    343370     color: #fff;
    344371     text-align: center;
    345      font-weight: bold;     
     372     font-weight: bold;
    346373}
    347374
     
    380407
    381408.page {
    382 /*     background-color: #fff;*/
    383409     margin: 0;
    384410     padding: 10px 0;
     
    516542}
    517543
    518 
    519544#filter span b {
    520545     font-size: 11pt;
     
    555580th {
    556581     background: linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 50%, #eef 100%);
     582     font-size: 9pt;
    557583}
    558584
     
    566592}
    567593
    568 .book th:first-child  {
     594.book th:first-child {
     595     padding-left: 10px;
     596}
     597
     598.book th:last-child  {
    569599     background: #fff url(/themes/console/images/buttons/delete.png) center center no-repeat;
    570600     background: url(/themes/console/images/buttons/delete.png) center center no-repeat, linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 50%, #eef 100%);
     
    577607}
    578608
    579 .book th:last-child {
    580      padding: 0 3px 0 0;
    581      background: linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 50%, #eef 100%);
    582 }
    583 
    584609.book tr:hover td {
    585610     background: #ffd;
     
    595620}
    596621
    597 .book td:first-child {
     622/* hostname list */
     623#host_list, #host_details {
     624     border: 1px solid #7778bf;
     625     box-shadow: 0 0 0 1px #fff;
     626}
     627
     628#host_list th:first-child,
     629#host_list td:first-child {
     630     width: 150px;
     631     width: 30%;
     632     white-space: nowrap;
     633     padding-left: 5px;
     634}
     635
     636#host_list th:first-child {
     637     padding-left: 39px;
     638}
     639
     640#host_list td:last-child {
    598641     width: 16px;
    599642     white-space: nowrap;
    600643     font-weight: bold;
    601 }
    602 
    603 .book td:nth-child(3) {
    604      width: 30px;
     644}
     645
     646#host_list th:nth-child(2), #host_list td:nth-child(2),
     647#host_list th:nth-child(3), #host_list td:nth-child(3),
     648#host_list th:nth-child(4), #host_list td:nth-child(4) {
     649     width: 35px;
     650     width: 8%;
     651     padding: 0 5px !important;
    605652     white-space: nowrap;
    606      padding-left: 10px;
    607 }
    608 
    609 .book td:nth-child(4) {
    610      text-align: center;
    611      width: 20px;
    612      padding: 2px 25px 2px 0 !important;
    613 }
    614 
    615 .book td:nth-child(4) a:not(old) {
     653     text-align: center;
     654}
     655
     656#host_list td:nth-child(2) a:not(old) {
    616657     font-size: 0 !important;
    617658}
    618659
    619 .book td:nth-child(4) .addrhlpr a::after {
     660#host_list td:nth-child(2) a::after {
     661     content: url(/themes/console/images/buttons/link.png);
     662     text-align: center;
     663     filter: drop-shadow(0 0 1px #555);
     664     -webkit-filter: drop-shadow(0 0 1px #555);
     665     cursor: pointer;
     666}
     667
     668#host_list td:nth-child(3) a:not(old) {
     669     font-size: 0 !important;
     670}
     671
     672#host_list td:nth-child(3) a::after {
     673     content: url(/themes/console/images/buttons/helper.png);
     674     cursor: pointer;
     675}
     676
     677#host_list th:nth-child(4), #host_list td:nth-child(4) {
     678     padding-right: 30px !important;
     679}
     680
     681#host_list td:nth-child(4) a:not(old) {
     682     font-size: 0 !important;
     683}
     684
     685#host_list td:nth-child(4) .addrhlpr a::after {
    620686     content: url(/themes/console/images/buttons/fullview.png);
    621687     text-align: center;
     
    623689     filter: drop-shadow(0 0 1px #555);
    624690     -webkit-filter: drop-shadow(0 0 1px #555);
    625 }
    626 
    627 .book td:nth-child(4) .addrhlpr:hover {
     691     cursor: pointer;
     692}
     693
     694#host_list td:nth-child(2) a:hover, #host_list td:nth-child(3) a:hover, #host_list td:nth-child(4) a:hover,
     695#host_list td:nth-child(2) a:focus, #host_list td:nth-child(3) a:focus, #host_list td:nth-child(4) a:focus {
    628696     filter: drop-shadow(0 0 1px #f60);
    629697     -webkit-filter: drop-shadow(0 0 1px #f60);
    630698}
     699
     700#host_list .destaddress {
     701     overflow: auto !important;
     702     white-space: nowrap;
     703     font-family: "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", Courier, mono;
     704     font-weight: normal;
     705     color: #555;
     706     padding: 3px !important;
     707}
     708
     709td.destinations {
     710     max-width: 50px !important;
     711     border-left: 1px solid #bbf;
     712     border-right: 1px solid #bbf;
     713     padding: 0;
     714     background: #fff;
     715}
     716
     717td.destinations textarea {
     718     box-shadow: none;
     719     height: 28px !important;
     720}
     721
     722/* end hostname list */
     723
     724/* host details page */
     725
     726#host_details td {
     727     padding: 5px 10px !important;
     728}
     729
     730#host_details td:first-child {
     731     min-width: 10px !important;
     732     width: 10%;
     733     white-space: nowrap;
     734     font-weight: bold;
     735     text-align: right;
     736}
     737
     738#host_details td:last-child {
     739     width: 90%;
     740     text-align: left;
     741     border-left: none !important;
     742     border-right: none !important;
     743}
     744
     745#host_details td.destinations {
     746     background: none;
     747}
     748
     749#host_details tr:hover {
     750     background: #ffd;
     751}
     752
     753#host_details .destaddress {
     754     font-family: "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", Courier, mono;
     755     word-break: break-all !important;
     756     white-space: normal !important;
     757}
     758
     759/* identicon + qr image */
     760
     761#visualid {
     762     border: 1px solid #7778bf !important;
     763     margin-top: -1px;
     764     border-radius: 2px;
     765     background: #fff;
     766     padding-top: 0;
     767}
     768
     769.iframed #visualid {
     770     margin-top: 9px;
     771}
     772
     773#visualid h3 {
     774     border-bottom: 1px solid #7778bf;
     775     padding: 8px 10px 6px;
     776     margin-top: 0;
     777     background: linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 50%, #eef 100%);
     778     box-shadow: inset 0 0 0 1px #fff;
     779}
     780
     781#visualid table {
     782     width: 100% !important;
     783     margin: 12px 0 0;
     784     background: none;
     785     border: none;
     786     border-collapse: collapse;
     787}
     788
     789#visualid tr:first-child td {
     790     padding-bottom: 15px;
     791}
     792
     793#visualid td {
     794     width: 50%;
     795}
     796
     797#visualid td:first-child {
     798     text-align: right;
     799}
     800
     801#visualid td[colspan="2"] {
     802     text-align: right;
     803     padding: 20px 5px;
     804     border-top: 1px solid #7778bf;
     805     background: #fff;
     806}
     807
     808img[src^="/imagegen"] {
     809     height: 256px;
     810     width: 256px;
     811     border: 1px solid #7778bf;
     812     padding: 3px;
     813     border-radius: 2px;
     814     background: #fff;
     815     filter: drop-shadow(0 0 1px #999);
     816     -webkit-filter: drop-shadow(0 0 1px #999);
     817}
     818
     819/* end host details */
     820
     821/* host list identicons */
     822
     823.names img {
     824     width: 20px;
     825     height: 20px;
     826     vertical-align: middle;
     827     margin: 1px 10px 1px 1px;
     828     padding: 1px;
     829}
     830
     831.names img:hover, .names a:focus img {
     832     filter: drop-shadow(0 0 1px #f60) !important;
     833     -webkit-filter: drop-shadow(0 0 1px #f60) !important;
     834     box-shadow: 0 0 0 1px #f60;
     835}
     836
     837.names a:active img, .names a:focus img {
     838     transform: rotate(45deg) scale(0.8);
     839     transition: ease all 0.1s 0s;
     840}
     841
     842/* end host list identicons */
    631843
    632844.book th {
     
    638850     margin: 0;
    639851     border: none;
    640      border-left: 1px solid #bbf;
     852     border-left: 1px solid #bbf;
     853     border-right: 1px solid #bbf;
    641854     resize: none;
    642855     background: none;
     
    644857
    645858div#book {
    646     padding: 0;
    647     background: #eef;
     859    padding: 8px;
     860    background: #efefff;
     861}
     862
     863.iframed div#book {
     864     margin-bottom: 10px;
    648865}
    649866
     
    651868     background: url(/themes/susidns/images/addressbook.png) 5px center no-repeat;
    652869     padding: 5px 5px 5px 33px;
    653 }
    654 
    655 td.destinations {
    656      padding: 0;
    657      background: #fff;
    658 }
    659 
    660 td.destinations textarea {
    661      box-shadow: none;
    662      height: 28px !important;
    663870}
    664871
     
    684891}
    685892
    686 /* identicon + qr image */
    687 #book + #buttons + div {
    688      border: 1px solid #7778bf;
    689      margin-top: -1px;
    690 }
    691 
    692 #book + #buttons + div table {
    693      width: 100%;
    694 }
    695 
    696 #book + #buttons + div td {
    697      width: 50%;
    698 }
    699 
    700 #book + #buttons + div td:first-child {
    701      text-align: right;
    702 }
    703 
    704 img[src^="/imagegen"] {
    705      height: 256px;
    706      width: 256px;
    707      border: 1px solid #7778bf;
    708      padding: 3px;
    709      border-radius: 2px;
    710      background: #fff;
    711      filter: drop-shadow(0 0 1px #999);
    712      -webkit-filter: drop-shadow(0 0 1px #999);
     893.iframed #book + #buttons {
     894     margin-top: -11px;
    713895}
    714896
    715897form[action="export"] {
    716      border: 1px solid #7778bf;
     898/*     border: 1px solid #7778bf; */
    717899     margin: -1px 0;
    718900}
    719901
    720 input[type="submit"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner  {
     902input[type="radio"], input[type="checkbox"] {
     903     background: none;
     904     cursor: pointer;
     905}
     906
     907input[type="submit"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, button::-moz-focus-inner  {
    721908     outline: none;
    722909     border: none;
    723910}
    724911
    725 input[type="submit"], input[type="reset"] {
     912input[type="submit"], input[type="reset"], .fakebutton {
    726913     margin: 5px;
    727914     font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
     
    737924     filter: saturate(70%) drop-shadow(0 0 1px #ccc);
    738925     -webkit-filter: saturate(70%) drop-shadow(0 0 1px #ccc);
    739 }
    740 
    741 input[type=submit]:hover, input[type=reset]:hover, input[type=submit]:focus, input[type=reset]:focus {
     926     cursor: pointer;
     927}
     928
     929.fakebutton a {
     930     color: #333;
     931     font-weight: normal;
     932}
     933
     934.fakebutton a:hover, .fakebutton a:focus {
     935     color: #111;
     936}
     937
     938.fakebutton a:active {
     939     color: #666 !important;
     940}
     941
     942input[type=submit]:hover, input[type=reset]:hover, input[type=submit]:focus, input[type=reset]:focus, .fakebutton:hover, .fakebutton:focus {
    742943     background: #eee;
    743944     background: linear-gradient(to bottom, #ddd 0%, #fff 100%);
     
    749950}
    750951
    751 input[type="submit"]:active, input[type="reset"]:active {
    752      box-shadow: inset 2px 2px 2px #555;
     952input[type="submit"]:active, input[type="reset"]:active, .fakebutton:active {
     953     box-shadow: inset 3px 3px 2px #555;
    753954     background-blend-mode: luminosity;
     955     color: #666;
    754956}
    755957
     
    8241026     background-size: 14px 14px, 100% 100%;
    8251027     padding: 5px 5px 5px 21px;
     1028     margin-top: 5px;
    8261029}
    8271030
     
    8611064     background: #fff url(/themes/console/images/buttons/search.png) no-repeat 6px center;
    8621065     padding: 5px 5px 5px 28px !important;
    863      margin: 1px 5px 0; 
     1066     margin: 1px 5px 0;
    8641067}
    8651068
    8661069input.search[type="text"]:focus {
    8671070     background: #fff url(/themes/console/images/buttons/search.png) no-repeat 6px center !important;
     1071}
     1072
     1073#visualid .fakebutton {
     1074     background: #eee url(/themes/console/images/buttons/go.png) no-repeat 6px center;
     1075     background: url(/themes/console/images/buttons/go.png) no-repeat 6px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
     1076     background-size: 14px 14px, 100% 100%;
     1077     padding: 6px 8px 6px 22px;
     1078}
     1079
     1080#visualid .fakebutton:hover, #visualid .fakebutton:focus {
     1081     background: #fff url(/themes/console/images/buttons/go.png) no-repeat 6px center;
     1082     background: url(/themes/console/images/buttons/go.png) no-repeat 6px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
     1083     background-size: 14px 14px, 100% 100%;
    8681084}
    8691085
     
    8801096}
    8811097
    882 /* hide export button on published page when empty */
     1098.iframed #export {
     1099     margin-bottom: 11px;
     1100}
     1101
     1102/* hide export button on published page when empty */
    8831103#messages + form[action="export"] {
    8841104     display: none;
     
    8921112     padding-right: 200px !important;
    8931113}
     1114
     1115/* responsive layout */
     1116
     1117@media screen and (max-width: 680px) {
     1118#navi {
     1119     padding: 5px 3px !important;
     1120}
     1121
     1122#navi a {
     1123     background: linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 50%, #ebebff 100%) #fff !important;
     1124     padding: 3px 5px !important;
     1125}
     1126
     1127#visualid img[src^="/imagegen"] {
     1128     width: 228px !important;
     1129     height: 228px !important;
     1130}
     1131}
     1132
     1133@media screen and (min-width: 1400px) {
     1134body, p, td, textarea, input, button, li, a, th, h4 {
     1135     font-size: 10pt !important;
     1136}
     1137
     1138code, tt, .destaddress {
     1139     font-size: 9pt !important;
     1140}
     1141
     1142#navi a {
     1143     font-size: 11pt;
     1144}
     1145
     1146h3 {
     1147     font-size: 12pt !important;
     1148}
     1149
     1150#export {
     1151     margin-top: -40px !important;
     1152}
     1153
     1154#filter span, #filter a {
     1155     font-size: 11pt !important;
     1156}
     1157
     1158td.destinations textarea {
     1159     height: 32px !important;
     1160}
     1161
     1162input.export {
     1163     margin-top: 8px;
     1164}
     1165
     1166#host_list th:nth-child(2), #host_list td:nth-child(2),
     1167#host_list th:nth-child(3), #host_list td:nth-child(3),
     1168#host_list th:nth-child(4), #host_list td:nth-child(4) {
     1169     padding: 0 20px;
     1170     width: 6%;
     1171}
     1172
     1173.headline h4 {
     1174     background: rgba(0, 0, 0, 0) url("/themes/susidns/images/drive.png") no-repeat scroll 10px 8px;
     1175}
     1176}
     1177
     1178@media screen and (max-width: 1000px) {
     1179.iframed .illustrate {
     1180     margin: 0 10px 15px;
     1181}
     1182}
     1183
     1184/* end responsive layout */
     1185
     1186/* MS Edge 14+ fix */
     1187_:-ms-lang(x), * {
     1188     filter: none !important;
     1189     -webkit-filter: none !important;
     1190}
     1191
  • installer/resources/themes/susidns/midnight/susidns.css

    ra22bf6b rbfe8c65  
    2525div#navi  {
    2626     border: 1px solid #2d295f;
    27      padding: 2px 0;
     27     padding: 3px 0 2px;
    2828     background: #002 url(/themes/console/midnight/images/header.png) repeat-x scroll center center !important;
    2929     background: linear-gradient(to bottom, #191729 0%, #201f33 7%, #1f1e32 9%, #161525 21%, #090812 49%, #05050e 50%, #020206 51%, #010103 53%, #000000 56%, #000000 100%) !important;
    30      margin: -10px 0 27px;
     30     margin: -11px 0 27px;
    3131     box-shadow: inset 0 0 0 1px #000;
    3232     position: sticky;
    33      top: 0;
     33     top: -1px;
    3434     z-index: 999;
     35     text-align: center !important;
     36     font-weight: bold;
     37     font-size: 9pt;
     38     padding: 6px 5px 5px !important;
     39     min-width: 512px;
    3540}
    3641
    3742.iframed #navi {
    38      padding: 0 !important;
     43     padding: 5px !important;
    3944     border: 1px solid #443da0 !important;
    4045     margin: 0 0 27px;
     
    127132}
    128133
    129 #navi p {
    130      text-align: center !important;
    131      text-transform: capitalize;
    132      font-weight: bold;
    133      font-size: 9pt;
    134      padding: 2px 5px !important;
    135      margin: 0 !important;
    136 }
    137 
    138 #navi p > * {
     134#navi > * {
    139135     vertical-align: middle;
    140136}
     
    295291     background: #001 url(/themes/susidns/images/addressbook.png) 10px center no-repeat;
    296292     background-size: 24px 24px;
    297      padding: 20px 20px 20px 42px !important; 
     293     padding: 20px 20px 20px 42px !important;
    298294}
    299295
     
    317313     border: 1px solid #2d295f;
    318314     padding: 7px 10px;
    319      border-radius: 2px; 
     315     border-radius: 2px;
    320316     background: #000 url(/themes/console/midnight/images/header.png) repeat-x scroll center center;
    321317     background: linear-gradient(to bottom, #191729 0%, #201f33 7%, #1f1e32 9%, #161525 21%, #090812 49%, #05050e 50%, #020206 51%, #010103 53%, #000 56%, #000 100%);
     
    365361     margin-left: -11px;
    366362     margin-right: -11px;
    367      padding: 5px 10px;
     363     padding: 8px 10px;
    368364     font-size: 10pt;
    369365}
     
    441437
    442438.iframed .book tr.head th {
    443      border-top: 1px solid #2d295f; 
    444      border-bottom: 1px solid #2d295f; 
    445 } 
    446 
    447 .book th:first-child {
     439     border-top: 1px solid #2d295f;
     440     border-bottom: 1px solid #2d295f;
     441}
     442
     443.book th:last-child {
    448444     background: #000 url(/themes/console/images/buttons/delete.png) center center no-repeat !important;
    449445     font-size: 0;
     
    529525.help ul li:last-child {
    530526     margin-bottom: -10px;
    531 } 
     527}
    532528
    533529.help p {
     
    641637     width: 100%;
    642638     border: 1px solid #2d295f !important;
    643      margin-top: -10px;
     639/*     margin-top: -10px;*/
    644640}
    645641
     
    672668}
    673669
    674 .book td:nth-child(3) {
     670.book th:first-child, .book td:first-child {
     671     padding: 0 10px !important;
     672     width: 200px;
     673     white-space: nowrap;
     674}
     675
     676.book td:nth-child(2) {
    675677     padding: 2px 0 2px 5px !important;
    676678     width: 30px;
    677679}
    678680
    679 .book td:nth-child(4) {
     681.book td:nth-child(3) {
    680682     text-align: center;
    681683     width: 20px;
     
    683685}
    684686
    685 .book td:nth-child(4) a:not(old) {
     687.book td:nth-child(3) a:not(old) {
    686688     font-size: 0 !important;
    687689}
    688690
    689 .book td:nth-child(4) .addrhlpr a::after {
     691.book td:nth-child(3) .addrhlpr a::after {
    690692     content: url(/themes/console/images/buttons/fullview.png);
    691693     text-align: center;
     
    695697}
    696698
    697 .book td:nth-child(4) .addrhlpr:hover {
     699.book td:nth-child(3) .addrhlpr:hover {
    698700     filter: drop-shadow(0 0 1px #b73fff);
    699701     -webkit-filter: drop-shadow(0 0 1px #b73fff);
     
    714716}
    715717
    716 #buttons + div > table {
    717      width: auto;
    718      margin: auto;
     718#visualid {
     719     border: 1px solid #2d295f;
     720     margin-top: -10px;
     721}
     722
     723.iframed #visualid {
     724     border: none;
     725}
     726
     727#visualid h3 {
     728     margin-top: -1px;
     729     border-left: none;
     730     border-right: none;
     731}
     732
     733#visualid table {
     734     width: 100%;
     735     margin-top: -15px;
     736     margin-bottom: 1px;
     737     border-collapse: collapse;
     738}
     739
     740#visualid td:first-child {
     741     text-align: right;
     742}
     743
     744#visualid td[colspan="2"] {
     745     text-align: right;
     746     border-top: 1px solid #2d295f;
     747     padding: 17px 9px 15px !important;
     748}
     749
     750.iframed #visualid td[colspan="2"] {
     751     padding: 20px 9px 5px !important;
    719752}
    720753
     
    746779     border-radius: 2px;
    747780     border: 1px solid #443da0;
    748      background: #000 none !important;     
     781     background: #000 none !important;
    749782     color: #443da0;
    750783     margin: 2px 4px 2px 0;
     
    753786}
    754787
    755 input[type="checkbox"], .optbox {
     788input[type="checkbox"], input[type="radio"], .optbox {
    756789     filter: invert(100%) sepia(100%) hue-rotate(200deg) saturate(200%); /* colorize radios and checkboxes */
    757790     -webkit-filter: invert(100%) sepia(100%) hue-rotate(200deg) saturate(200%);
     
    764797}
    765798
    766 input[type=submit], input[type=reset] {
     799input[type=submit], input[type=reset], .fakebutton {
    767800     color: #443da0;
    768801     background: #000;
     
    776809     min-width: 90px !important;
    777810     box-shadow: inset 0 0 0 1px #000;
     811     border-radius: 2px;
    778812}
    779813
    780814input[type=submit]:hover, input[type=reset]:hover,
    781 input[type=submit]:focus, input[type=reset]:focus {
     815input[type=submit]:focus, input[type=reset]:focus,
     816.fakebutton:hover, .fakebutton:focus {
    782817     background: #000 !important;
    783818     color: #652787;
     
    786821}
    787822
    788 input[type=submit]:active, input[type=reset]:active {
     823input[type=submit]:active, input[type=reset]:active, .fakebutton:active {
    789824     background: #652787 !important;
    790825     color: #c9ceff !important;
     
    821856     filter: drop-shadow(0 0 1px #99f);
    822857     -webkit-filter: drop-shadow( 0 0 1px #99f);
    823      transition: filter ease 0.3s 0s; 
     858     transition: filter ease 0.3s 0s;
    824859}
    825860
     
    838873     border: none;
    839874     border-left: 1px solid #17142f;
    840      height: 30px;
     875     border-right: 3px solid #17142f;
     876     height: 32px;
    841877     overflow-x: auto;
    842878     overflow-y: hidden !important;
     
    850886
    851887.iframed #navi, .iframed h3, .iframed h4, .iframed #book, .iframed #add, .iframed #filtered, .iframed #filter, .iframed #search,
    852 table.book, .iframed #buttons, .iframed .buttons, .iframed #messages + p, .iframed p.book, .iframed #helpsubs, 
     888table.book, .iframed #buttons, .iframed .buttons, .iframed #messages + p, .iframed p.book, .iframed #helpsubs,
    853889.iframed textarea[name="config"], .iframed textarea[name="content"], .iframed #helpconfig, .iframed p.messages {
    854890     border-right: none !important;
     
    893929
    894930@media screen and (min-width: 1500px) {
    895 body, input[type="text"], select, h4, td.names a, #filter p, #search td, p, a, textarea, .help li {
     931body, input[type="text"], select, h4, td.names a, #filter p, #search td, p, a, textarea, .help li, td, tt, code, textarea, input[type="submit"], input[type="reset"] {
    896932     font-size: 10pt !important;
    897933}
    898934
    899 textarea, input[type="submit"], input[type="reset"] {
    900      font-size: 9pt !important;
    901 }
    902 
    903 h3, #filter a, #navi a {
    904      font-size: 11pt;
     935#navi a {
     936     font-size: 10.5pt !important;
     937}
     938
     939h3 {
     940     font-size: 12pt !important;
     941}
     942
     943#filter a {
     944     font-size: 11pt !important;
    905945}
    906946
    907947#filter a:link, #filter a:visited {
    908948     margin: 3px 2px !important;
     949}
     950
     951.destinations textarea {
     952     height: 34px;
    909953}
    910954}
     
    943987     display: none;
    944988}
     989
     990
     991/* host details page */
     992
     993#host_details td {
     994     padding: 5px 10px !important;
     995}
     996
     997#host_details td:first-child {
     998     min-width: 10px !important;
     999     width: 10%;
     1000     white-space: nowrap;
     1001     font-weight: bold;
     1002     text-align: right;
     1003}
     1004
     1005#host_details td:last-child {
     1006     width: 90%;
     1007     text-align: left;
     1008     border-left: none !important;
     1009     border-right: none !important;
     1010}
     1011
     1012#host_details td.destinations {
     1013     background: none;
     1014}
     1015
     1016#host_details tr:hover {
     1017     background: #ffd;
     1018}
     1019
     1020#host_details .destaddress {
     1021     word-break: break-all !important;
     1022     white-space: normal !important;
     1023}
     1024
     1025/* end host details */
     1026
     1027.names img {
     1028     width: 20px;
     1029     height: 20px;
     1030     vertical-align: middle;
     1031     margin: 1px 10px 1px 1px;
     1032     padding: 1px;
     1033     border: 1px solid #17142f;
     1034     border-radius: 2px;
     1035     background: #000;
     1036}
     1037
     1038.names img:hover, .names a:focus img {
     1039     border: 1px solid #652787;
     1040     background: #652787;
     1041}
     1042
     1043.names a:active img, .names a:focus img {
     1044     transform: rotate(45deg) scale(0.8);
     1045     transition: ease all 0.1s 0s;
     1046}
     1047
     1048/* hostname list */
     1049
     1050#host_list {
     1051     margin-top: 28px;
     1052}
     1053
     1054#host_list th:first-child,
     1055#host_list td:first-child {
     1056     width: 150px;
     1057     width: 30%;
     1058     white-space: nowrap;
     1059     padding-left: 5px !important;
     1060}
     1061
     1062#host_list th:first-child {
     1063     padding-left: 39px !important;
     1064}
     1065
     1066#host_list td:last-child {
     1067     width: 16px;
     1068     white-space: nowrap;
     1069     font-weight: bold;
     1070}
     1071
     1072#host_list th:nth-child(2), #host_list td:nth-child(2),
     1073#host_list th:nth-child(3), #host_list td:nth-child(3),
     1074#host_list th:nth-child(4), #host_list td:nth-child(4) {
     1075     width: 35px;
     1076     width: 8%;
     1077     padding: 0 5px !important;
     1078     white-space: nowrap;
     1079     text-align: center;
     1080}
     1081
     1082#host_list td:nth-child(2) a:not(old) {
     1083     font-size: 0 !important;
     1084}
     1085
     1086#host_list td:nth-child(2) a::after {
     1087     content: url(/themes/console/images/buttons/link.png);
     1088     text-align: center;
     1089     filter: drop-shadow(0 0 1px #555);
     1090     -webkit-filter: drop-shadow(0 0 1px #555);
     1091     cursor: pointer;
     1092}
     1093
     1094#host_list td:nth-child(3) a:not(old) {
     1095     font-size: 0 !important;
     1096}
     1097
     1098#host_list td:nth-child(3) a::after {
     1099     content: url(/themes/console/images/buttons/helper.png);
     1100     cursor: pointer;
     1101}
     1102
     1103#host_list th:nth-child(4), #host_list td:nth-child(4) {
     1104     padding-right: 30px !important;
     1105}
     1106
     1107#host_list td:nth-child(4) a:not(old) {
     1108     font-size: 0 !important;
     1109}
     1110
     1111#host_list td:nth-child(4) .addrhlpr a::after {
     1112     content: url(/themes/console/images/buttons/fullview.png);
     1113     text-align: center;
     1114     padding: 0 10px !important;
     1115     filter: drop-shadow(0 0 1px #555);
     1116     -webkit-filter: drop-shadow(0 0 1px #555);
     1117     cursor: pointer;
     1118}
     1119
     1120#host_list td:nth-child(2) a:hover, #host_list td:nth-child(3) a:hover, #host_list td:nth-child(4) a:hover,
     1121#host_list td:nth-child(2) a:focus, #host_list td:nth-child(3) a:focus, #host_list td:nth-child(4) a:focus {
     1122     filter: drop-shadow(0 0 2px #652787);
     1123     -webkit-filter: drop-shadow(0 0 2px #652787);
     1124}
     1125
     1126#host_list .destaddress {
     1127     overflow: auto !important;
     1128     white-space: nowrap;
     1129     font-family: "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", Courier, mono !important;
     1130     font-weight: normal;
     1131     padding: 3px !important;
     1132}
     1133
     1134/* end hostname list */
     1135
     1136td.destinations {
     1137     max-width: 50px !important;
     1138     border-left: 1px solid #2d295f;
     1139     border-right: 1px solid #2d295f;
     1140}
     1141
     1142/* MS Edge 14+ fix */
     1143_:-ms-lang(x), * {
     1144     filter: none !important;
     1145     -webkit-filter: none !important;
     1146}
     1147
Note: See TracChangeset for help on using the changeset viewer.