MediaWiki:Common.css: Difference between revisions

From Han Wiki
Jump to navigation Jump to search
update haeseo and add CwTexKai font
mNo edit summary
 
(51 intermediate revisions by the same user not shown)
Line 9: Line 9:
@font-face {
@font-face {
   font-family: HYhaeseo;
   font-family: HYhaeseo;
   src: url(https://wiki.michaelhan.net/fonts/HYhaeseo.ttf) format("truetype");
   src: url("/fonts/HYhaeseo.ttf") format('truetype');
}
}


Line 19: Line 19:


.blockhanja-haeseo {
.blockhanja-haeseo {
   font-family: HYhaeseo, 한양해서, ckai, sans-serif;
   font-family: HYhaeseo, 한양해서, ckai, serif;
   font-size: 3em;
   font-size: 3em;
   line-height: 100%;
   line-height: 100%;
Line 25: Line 25:


.haeseo {
.haeseo {
   font-family: HYhaeseo, 한양해서, ckai, sans-serif;
   font-family: HYhaeseo, 한양해서, ckai, serif;
}
}


.haeseo-larger {
.haeseo-larger {
   font-family: HYhaeseo, 한양해서, ckai, sans-serif;
   font-family: HYhaeseo, 한양해서, ckai, serif;
   font-size: 2em;
   font-size: 2em;
}
}
Line 40: Line 40:
/*  background-color: #f9f9f9; */
/*  background-color: #f9f9f9; */
   background-color: #d7d7d7;
   background-color: #d7d7d7;
}
div.vertical-panel {
  font-family: HYhaeseo, 한양해서, ckai, serif;
  font-size: 2em;
  float: right;
  display: grid;
  width: 100%;
}
div.vertical {
  writing-mode: vertical-rl;
  overflow-x: auto;
  word-break: keep-all;
}
}


Line 52: Line 66:
   border-radius: 3px;
   border-radius: 3px;
   box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
   box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
}
span.cmd {
  box-sizing: border-box;
  font-weight: bold;
  color: #0E62E2;
  padding: 2px 5px;
  white-space: nowrap;
  max-width: 100%;
  background: #fff;
  border: solid 1px #e1e4e5;
  font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
  overflow-x: auto;
  line-height: 24px;
  margin: 0;
  margin-bottom: 24px;
}
span.param {
  box-sizing: border-box;
  color: #E74C3C;
  padding: 2px 5px;
  white-space: nowrap;
  max-width: 100%;
  background: #fff;
  border: solid 1px #e1e4e5;
  font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
  overflow-x: auto;
  line-height: 24px;
  margin: 0;
  margin-bottom: 24px;
}
}


Line 84: Line 129:
}
}


div.cli {
.badge {
    display: inline-block;
    margin: 0;
    overflow: visible;
    color: rgba(255,255,255,0.9);
    -o-text-overflow: clip;
    text-overflow: clip;
    text-shadow: -1px -1px 0 rgba(170,170,170,0.66) ;
    -webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
    -moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
    -o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
    transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
    -webkit-transform: none;
    transform: none;
    -webkit-transform-origin: 50% 50% 0;
    transform-origin: 50% 50% 0;
}
 
.blabel {
    padding: 0 3px 0 5px;
    border: 1px 0 1px 1px solid rgba(186,186,186,0.66);
    -webkit-border-radius: 3px 0 0 3px;
    border-radius: 3px 0 0 3px;
    background: #545454;
    -webkit-box-shadow: 2px 0 2px 0 rgba(0,0,0,0.2) ;
    box-shadow: 2px 0 2px 0 rgba(0,0,0,0.2) ;
}
 
.bdata {
    padding: 0 5px 0 5px;
    border: 1px 1px 1px 0 solid rgba(186,186,186,0.66);
    -webkit-border-radius: 0 3px 3px 0;
    border-radius: 0 3px 3px 0;
    -webkit-box-shadow: 2px 2px 2px 0 rgba(0,80,186,0.2) ;
    box-shadow: 2px 2px 2px 0 rgba(0,80,186,0.2) ;
}
 
.bgblue {
  background-color: #201e91;
}
 
.bggreen {
  background-color: #1a6b28;
}
 
.bgred {
  background-color: #ba3b1b;
}
 
.bgyellow {
  background-color: #877511;
}
 
 
div.cli, .cli {
   font-family: 'Droid Sans Mono',sans-serif;
   font-family: 'Droid Sans Mono',sans-serif;
   border-radius: 3px;
   border-radius: 3px;
Line 113: Line 212:
}
}


/*
#toc {
#toc {
   float: right;
   float: right;
Line 119: Line 219:
   top: 100px;
   top: 100px;
   right: 10px;
   right: 10px;
}
*/
.smallcaps {
    font-variant: small-caps;
    text-transform: lowercase;
}
.smallcaps:first-letter {
    text-transform: uppercase;
}
}

Latest revision as of 18:16, 16 March 2024

/* CSS placed here will be applied to all skins */
@import url(//fonts.googleapis.com/css?family=Droid+Sans+Mono);

@font-face {
  font-family: ckai;
  src: url(//fonts.googleapis.com/earlyaccess/cwtexkai.css);
}

@font-face {
  font-family: HYhaeseo;
  src: url("/fonts/HYhaeseo.ttf") format('truetype');
}

.blockhanja {
  font-family: HYhaeseo, 한양해서, ckai, Batang, serif;
  font-size: 3em;
  line-height: 100%;
}

.blockhanja-haeseo {
  font-family: HYhaeseo, 한양해서, ckai, serif;
  font-size: 3em;
  line-height: 100%;
}

.haeseo {
  font-family: HYhaeseo, 한양해서, ckai, serif;
}

.haeseo-larger {
  font-family: HYhaeseo, 한양해서, ckai, serif;
  font-size: 2em;
}

div.mw-geshi {
  font-family: 'Droid Sans Mono',sans-serif;
  padding: 1em;
  margin: 1em 0; 
  border: 1px dashed #2f6fab;
/*  background-color: #f9f9f9; */
  background-color: #d7d7d7;
}

div.vertical-panel {
  font-family: HYhaeseo, 한양해서, ckai, serif;
  font-size: 2em;
  float: right;
  display: grid;
  width: 100%;
}

div.vertical {
  writing-mode: vertical-rl;
  overflow-x: auto;
  word-break: keep-all;
}

.mw-highlight .lineno { user-select: none; }

code {
  font-family: 'Droid Sans Mono',sans-serif;
  padding: 2px 4px;
  font-size: 90%;
  color: #FFF;
  background-color: #333;
  border-radius: 3px;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
}

span.cmd {
  box-sizing: border-box;
  font-weight: bold;
  color: #0E62E2;
  padding: 2px 5px;
  white-space: nowrap;
  max-width: 100%;
  background: #fff;
  border: solid 1px #e1e4e5;
  font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
  overflow-x: auto;
  line-height: 24px;
  margin: 0;
  margin-bottom: 24px;
}

span.param {
  box-sizing: border-box;
  color: #E74C3C;
  padding: 2px 5px;
  white-space: nowrap;
  max-width: 100%;
  background: #fff;
  border: solid 1px #e1e4e5;
  font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
  overflow-x: auto;
  line-height: 24px;
  margin: 0;
  margin-bottom: 24px;
}

span.package {
  font-family: 'Droid Sans Mono',sans-serif;
  padding: 2px 4px;
  font-size: 90%;
  color: #333;
  background-color: #ddd;
  border-radius: 3px;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
}

span.shell,span.path {
  white-space: nowrap;
  padding: 2px 4px;
  margin: 0;
  border: 1px solid #ddd;
  background-color: #f8f8f8;
  border-radius: 3px;
  max-width: 100%;
  display: inline-block;
  overflow: auto;
  vertical-align: middle;
  line-height: 1.3;
  font-family: 'Droid Sans Mono',sans-serif;
  font-size: 12px;
  box-sizing: border-box;
  text-shadow: none;
  background: rgba(65,131,196,0.4);
  color: #333333;
}

.badge {
    display: inline-block;
    margin: 0;
    overflow: visible;
    color: rgba(255,255,255,0.9);
    -o-text-overflow: clip;
    text-overflow: clip;
    text-shadow: -1px -1px 0 rgba(170,170,170,0.66) ;
    -webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
    -moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
    -o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
    transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
    -webkit-transform: none;
    transform: none;
    -webkit-transform-origin: 50% 50% 0;
    transform-origin: 50% 50% 0;
}

.blabel {
    padding: 0 3px 0 5px;
    border: 1px 0 1px 1px solid rgba(186,186,186,0.66);
    -webkit-border-radius: 3px 0 0 3px;
    border-radius: 3px 0 0 3px;
    background: #545454;
    -webkit-box-shadow: 2px 0 2px 0 rgba(0,0,0,0.2) ;
    box-shadow: 2px 0 2px 0 rgba(0,0,0,0.2) ;
}

.bdata {
    padding: 0 5px 0 5px;
    border: 1px 1px 1px 0 solid rgba(186,186,186,0.66);
    -webkit-border-radius: 0 3px 3px 0;
    border-radius: 0 3px 3px 0;
    -webkit-box-shadow: 2px 2px 2px 0 rgba(0,80,186,0.2) ;
    box-shadow: 2px 2px 2px 0 rgba(0,80,186,0.2) ;
}

.bgblue {
  background-color: #201e91;
}

.bggreen {
  background-color: #1a6b28;
}

.bgred {
  background-color: #ba3b1b;
}

.bgyellow {
  background-color: #877511;
}


div.cli, .cli {
  font-family: 'Droid Sans Mono',sans-serif;
  border-radius: 3px;
  border: 1px solid #000000;
  background-color: black;
  color: white;
  padding: 0em 0.5em;
}

pre.output {
  font-family: 'Droid Sans Mono',sans-serif;
  border-radius: 3px;
  color:#cccccc;
  padding: 3px 5px;
  background-color: black;
  border:none;
}

.mw-highlight pre {
  word-wrap: normal;
  border: 0;
  background-color: #eff0f1;
  font-family: Consolas,Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace,sans-serif;
}

.mw-highlight pre .hll {
  background-color: #ffd996;
}

/*
#toc {
  float: right;
  margin: 0 0 1em 1em;
  position: fixed;
  top: 100px;
  right: 10px;
}
*/


.smallcaps {
    font-variant: small-caps;
    text-transform: lowercase;
}
.smallcaps:first-letter {
    text-transform: uppercase;
}