miteruzo
/
mr-legend_wiki
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 Commit
1 Branch
13 MiB
 
 
 
 
 
Branch: main
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from 'main'
${ noResults }
mr-legend_wiki/lib/tpl/material/css/basic.less

482 lines
8.7 KiB
Raw Permalink Blame History 

  1. //TODO: clean up less file

  2. 

  3. body {

  4.   //TODO: nicer fonts some day

  5. }

  6. 

  7. .mdl-button--icon {

  8.   .material-icons {

  9.     text-shadow: none;

  10.   }

  11. }

  12. 

  13. .material-icons {

  14.   //text-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);

  15. }

  16. 

  17. .page-content {

  18.   a,

  19.   a:link,

  20.   a:active,

  21.   a:visited,

  22.   a:hover {

  23.     color: #3986dd;

  24.     text-decoration: none;

  25.   }

  26.   a:hover {

  27.     text-decoration: underline;

  28.   }

  29. 

  30.   pre,

  31.   code,

  32.   samp,

  33.   kbd {

  34.       font-family: Consolas,Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace,sans-serif;

  35.       font-size: 1em;

  36.       direction: ltr;

  37.       text-align: left;

  38.       background-color: @ini_code_background;

  39.       color: @ini_text;

  40.   }

  41.   pre {

  42.       overflow: auto;

  43.       word-wrap: normal;

  44.       line-height: 1.3;

  45.       padding: .7em 1em;

  46.   }

  47. 

  48.   h1, h2, h3, h4, h5, h6 {

  49.     //TODO: nice heading styles

  50.   }

  51.   blockquote{

  52.     font-size: 1.2em;

  53.     letter-spacing: 0px;

  54.     min-width: 20%;

  55.     margin: 1em 1em;

  56.     color: #555555;

  57.     font-style: normal;

  58.     padding: 1.2em 30px 1.2em 10px;// 75px;

  59.     border-left: 8px solid #909090 ;

  60.     line-height:1.4;

  61.     position: relative;

  62.     background:#EDEDED;

  63.   }

  64. 

  65.   table{

  66.     background: white;

  67.     border-radius: 6px;

  68.     border-collapse: collapse;

  69.     max-width: 600px;

  70.     padding: 12px;

  71.     width: 100%;

  72.     ._shadow_0dp;

  73.   }

  74. 

  75.   th {

  76.     color: @light_primary;

  77.     background: rgba(0, 0, 0, 0.64);

  78.     font-size: 1.5em;

  79.     font-weight: 100;

  80.     padding: 12px;

  81.     text-align:left;

  82.     vertical-align:middle;

  83.   }

  84. 

  85.   th:first-child {

  86.     border-top-left-radius: 6px;

  87.   }

  88. 

  89.   th:last-child {

  90.     border-top-right-radius: 6px;

  91.     border-right:none;

  92.   }

  93. 

  94.   tr {

  95.     color:#666B85;

  96.     font-size: 1em;

  97.     font-weight:normal;

  98.   }

  99. 

  100.   tr:first-child {

  101.     border-top: 6px;

  102.   }

  103. 

  104.   tr:nth-child(odd) td {

  105.     background: rgba(0,0,0,0.05 );

  106.   }

  107. 

  108.   td {

  109.     background:#FFFFFF;

  110.     padding: 12px 12px;

  111.     text-align:left;

  112.     vertical-align:middle;

  113.     font-size:1em;

  114. 

  115.     &.centeralign {

  116.       text-align: center;

  117.     }

  118.     &.rightalign {

  119.       text-align: right;

  120.     }

  121.     &.leftalign {

  122.       text-align: left;

  123.     }

  124.   }

  125. 

  126.   /*blockquote::before{

  127.     font-family:Arial;

  128.     content: "\201C";

  129.     color:#78C0A8;

  130.     font-size:4em;

  131.     position: absolute;

  132.     left: 10px;

  133.     top:-10px;

  134.   }*/

  135. 

  136.   blockquote::before{

  137.     content: '';

  138.   }

  139. 

  140.   blockquote::after{

  141.     content: '';

  142.   }

  143. 

  144.   blockquote cite{

  145.     display:block;

  146.     color:#333333;

  147.     font-style: normal;

  148.     font-weight: bold;

  149.     margin-top:1em;

  150.   }

  151. }

  152. 

  153. @media (min-width: 1025px) {

  154.   .page-content {

  155.     margin-left: 16px;

  156.   }

  157. }

  158. 

  159. @media (min-width: 1600px) {

  160.   .page-content {

  161.     width: 1200px;

  162.     margin: 0 auto;

  163.   }

  164. }

  165. 

  166. @media (min-width: 2000px) {

  167.   .page-content {

  168.     width: 1400px;

  169.     margin: 0 auto;

  170.   }

  171. }

  172. 

  173. .content-search__popup {

  174.   background: #fff;

  175.   width: 100%;

  176.   ._shadow_1dp;

  177.   margin-top: -10px;

  178.   padding-top: 10px;

  179.   strong{

  180.     padding: 1em;

  181.   }

  182. }

  183. 

  184. .drawer-top {

  185.   background: @primary;

  186.   padding: 5px 0 20px;

  187.   min-height: 15em;

  188.   box-shadow: inset 0px -1px 4px 0px rgba(0,0,0,0.7);

  189.   ._shadow_1dp;

  190.   .mdl-logo{

  191.     padding: 16px;

  192.     margin: 0;

  193.     img {

  194.       width: 100%;

  195.     }

  196.   }

  197. }

  198. 

  199. .mdl-logo {

  200.   a {

  201.     color: @light_primary;

  202.     text-decoration: none;

  203.   }

  204. }

  205. 

  206. .drawer-tagline {

  207.   color: @light_primary;

  208.   margin: 1em;

  209.   text-align: center;

  210.   font-size: 1.3em;

  211. }

  212. 

  213. .mdl-navigation {

  214.   margin-top: 16px;

  215.   a{

  216.     color: @light_secondary;

  217.     text-decoration: none;

  218.     margin: 10px;

  219.     font-size: 14px;

  220.     font-weight: 400;

  221.     line-height: 24px;

  222.     letter-spacing: 0;

  223.   }

  224. }

  225. 

  226. .content-title {

  227.   font-size: 2em !important;

  228.   font-weight: bold;

  229. }

  230. 

  231. .content-notif {

  232.   margin: 1em 2em;

  233. }

  234. 

  235. .content-youarehere {

  236.   margin: 1em 2em;

  237.   margin-right: 48px;

  238.   background: transparent;

  239.   color: rgba(0,0,0,0.8);

  240.   p {

  241.     line-height: 2em;

  242.     padding-left: 1em;

  243.   }

  244. }

  245. 

  246. .content-actions {

  247.   position: absolute;

  248.   right: 0;

  249.   top: 10px;

  250.   margin-right: -30px;

  251.   display: flex;

  252.   flex-direction: column;

  253.   justify-content: flex-start;

  254. }

  255. 

  256. .content-actions__container {

  257.   position: fixed;

  258.   margin: 0px -55px;

  259. }

  260. 

  261. .content-actions__action {

  262.   padding: .3em 0;

  263.   svg{

  264.     fill: #fff;

  265.     stroke: #fff;

  266.     color: #fff;

  267.   }

  268. }

  269. 

  270. .content-actions__action-button {

  271.   ._shadow_hover;

  272.   ._shadow_2dp;

  273. }

  274. 

  275. .content-card {

  276.   ._shadow_1dp;

  277.   margin: 2em;

  278.   background: #fff;

  279.   position: relative;

  280.   margin-right: 48px;

  281.   min-height: 300px;

  282. }

  283. 

  284. .content-card__title {

  285.   ._shadow_0dp;

  286.   margin-bottom: 10px;

  287.   h1{

  288.     margin: 12px 0px;

  289.   }

  290. }

  291. 

  292. .pagename-bar {

  293.   display: block;

  294.   padding: 1em;

  295.   background-color: @primary;

  296.   color: @light_primary;

  297.   text-transform: lowercase;

  298.   font-weight: bold;

  299. }

  300. 

  301. .pagename-title {

  302.   padding: 0.2em;

  303. }

  304. 

  305. .content-card__text {

  306.   padding: 2em;

  307.   padding-top: 0.5em;

  308.   /*

  309. 

  310.   TODO: nicely format lists

  311. 

  312.   .toc, .idx {

  313.     .level1 {

  314.       list-style: decimal;

  315.       margin-left: 1em;

  316.     }

  317.     .level2 {

  318.       list-style: lower-roman;

  319.       margin-left: 2em;

  320.     }

  321.   }

  322.   .idx {

  323.     li {

  324.       list-style: decimal;

  325.       margin-left: 1em;

  326.     }

  327.   }

  328. 

  329. 

  330.   //TODO: proper heading sizes

  331.   h1 {

  332.     font-size: 3em

  333.   }

  334.   h2 {

  335.     font-size: 2em

  336.   }

  337.   h3 {

  338.     font-size: 1.5em

  339.   }

  340.   h4 {

  341.     font-size: 1em;

  342.   }

  343.   */

  344.   h2,h3,h4,h5,h6 {

  345.     font-weight: 300;

  346.   }

  347.   .edit {

  348.     width: 98%;

  349.   }

  350.   #size__ctl{

  351.     display: none;

  352.   }

  353.   .editButtons {

  354.     button {

  355.       background: transparent;

  356.       border: none;

  357.       border-radius: 2px;

  358.       color: rgb(0, 0, 0);

  359.       position: relative;

  360.       height: 32px;

  361.       margin: .5em 1em;

  362.       min-width: 48px;

  363.       padding: 0 12px;

  364.       display: inline-block;

  365.       font-family: "Roboto", "Helvetica", "Arial", sans-serif;

  366.       font-size: 14px;

  367.       font-weight: 500;

  368.       text-transform: uppercase;

  369.       letter-spacing: 0;

  370.       overflow: hidden;

  371.       will-change: box-shadow;

  372.       transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);

  373.       outline: none;

  374.       cursor: pointer;

  375.       text-decoration: none;

  376.       text-align: center;

  377.       line-height: 36px;

  378.       vertical-align: middle;

  379.       background: rgba(158, 158, 158, 0.20);

  380.       box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);

  381.     }

  382.     button::-moz-focus-inner {

  383.       border: 0;

  384.     }

  385.     button:hover {

  386.       background-color: rgba(158, 158, 158, 0.20);

  387.     }

  388.     button:focus:not(:active) {

  389.       box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36);

  390.       background-color: rgba(158, 158, 158, 0.40);

  391.     }

  392.     button:active {

  393.       box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);

  394.       background-color: rgba(158, 158, 158, 0.40);

  395.     }

  396.     #edbtn__save {

  397.       background: @ini_accent;

  398.       color: rgb(255,255,255)

  399.     }

  400.     .toolbutton {

  401.       background: transparent;

  402.     }

  403.   }

  404. }

  405. 

  406. #config__manager{

  407.   fieldset{

  408.     background: #fff;

  409.     ._shadow_1dp;

  410.     margin: 16px 0px;

  411.     table{

  412.       width: auto;

  413.     }

  414.     .value{

  415.       width: auto;

  416.     }

  417.   }

  418. }

  419. 

  420. #config__manager tr.default .input, #config__manager tr.default input, #config__manager tr.default textarea, #config__manager tr.default select, #config__manager .selectiondefault {

  421.   background-color: #fff;

  422. }

  423. 

  424. .secedit {

  425.   button {

  426.     background: transparent;

  427.     border: none;

  428.     border-radius: 2px;

  429.     color: rgb(0, 0, 0);

  430.     position: relative;

  431.     height: 32px;

  432.     margin: 0;

  433.     min-width: 48px;

  434.     padding: 0 12px;

  435.     display: inline-block;

  436.     font-family: "Roboto", "Helvetica", "Arial", sans-serif;

  437.     font-size: 14px;

  438.     font-weight: 500;

  439.     text-transform: uppercase;

  440.     letter-spacing: 0;

  441.     overflow: hidden;

  442.     will-change: box-shadow;

  443.     transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);

  444.     outline: none;

  445.     cursor: pointer;

  446.     text-decoration: none;

  447.     text-align: center;

  448.     line-height: 36px;

  449.     vertical-align: middle;

  450.     background: rgba(158, 158, 158, 0.20);

  451.     box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);

  452.   }

  453.   button::-moz-focus-inner {

  454.     border: 0;

  455.   }

  456.   button:hover {

  457.     background-color: rgba(158, 158, 158, 0.20);

  458.   }

  459.   button:focus:not(:active) {

  460.     box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36);

  461.     background-color: rgba(158, 158, 158, 0.40);

  462.   }

  463.   button:active {

  464.     box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);

  465.     background-color: rgba(158, 158, 158, 0.40);

  466.   }

  467. }

  468. 

  469. .ui-admin {

  470.   svg{

  471.     fill: @primary;

  472.   }

  473. }

  474. 

  475. .mdl-mini-footer {

  476.   min-height: max-content;

  477.   .mdl-mini-footer__left-section {

  478.     overflow: hidden;

  479.     padding-left: 12px;

  480.   }

  481. }