12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667 |
- .highlight-container {
- position: relative;
- }
- .highlight-container:hover .copy-btn, .highlight-container .copy-btn:focus {
- opacity: 1;
- }
- .copy-btn {
- color: $black-dim;
- cursor: pointer;
- line-height: 1.6;
- opacity: 0;
- padding: 2px 6px;
- position: absolute;
- the-transition();
- if (hexo-config('codeblock.copy_button.style') == 'flat') {
- background: white;
- border: 0;
- font-size: $font-size-smaller;
- right: 0;
- top: 0;
- } else if (hexo-config('codeblock.copy_button.style') == 'mac') {
- color: white;
- font-size: 14px;
- right: 0;
- top: 2px;
- } else {
- background-color: $gainsboro;
- background-image: linear-gradient(#fcfcfc, $gainsboro);
- border: 1px solid #d5d5d5;
- border-radius: 3px;
- font-size: $font-size-smaller;
- right: 4px;
- top: 8px;
- }
- }
- if (hexo-config('codeblock.copy_button.style') == 'mac') {
- .highlight-container {
- background: #21252b;
- border-radius: 5px;
- box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .4);
- padding-top: 30px;
- &::before {
- background: #fc625d;
- border-radius: 50%;
- box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
- content: ' ';
- height: 12px;
- left: 12px;
- margin-top: -20px;
- position: absolute;
- width: 12px;
- }
- .highlight {
- border-radius: 0 0 5px 5px;
- .table-container {
- border-radius: 0 0 5px 5px;
- }
- }
- }
- }
|