::v-deep=>:deep()
This commit is contained in:
		| @@ -14,7 +14,7 @@ | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| </script>  | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
|   .ai-article { | ||||
| @@ -26,62 +26,62 @@ | ||||
|     text-align: justify; | ||||
|     overflow-x: auto; | ||||
|     word-break: break-word; | ||||
|      | ||||
|     ::v-deep h1 { | ||||
|  | ||||
|     :deep( h1 ){ | ||||
|       margin: 1.3rem 0; | ||||
|       line-height: 1.2 | ||||
|     } | ||||
|      | ||||
|     ::v-deep p { | ||||
|  | ||||
|     :deep( p ){ | ||||
|       line-height: 2.27rem | ||||
|     } | ||||
|      | ||||
|     ::v-deep hr { | ||||
|  | ||||
|     :deep( hr ){ | ||||
|       border: none; | ||||
|       border-top: 1px solid #ddd; | ||||
|       margin-top: 2.7rem; | ||||
|       margin-bottom: 2.7rem | ||||
|     } | ||||
|      | ||||
|     ::v-deep img:not(.equation), ::v-deep iframe, ::v-deep embed, ::v-deep video { | ||||
|  | ||||
|     :deep( img:not(.equation)), :deep( iframe), :deep( embed), :deep( video ){ | ||||
|       display: block; | ||||
|       margin: 18px auto; | ||||
|       max-width: 100% !important; | ||||
|     } | ||||
|      | ||||
|     ::v-deep img.equation { | ||||
|  | ||||
|     :deep( img.equation ){ | ||||
|       margin: 0 .1em; | ||||
|       max-width: 100% !important; | ||||
|       vertical-align: middle | ||||
|     } | ||||
|  | ||||
|     ::v-deep figure { | ||||
|     :deep( figure ){ | ||||
|       margin: 2.7rem auto; | ||||
|       text-align: center | ||||
|     } | ||||
|  | ||||
|     ::v-deep img:not(.equation) { | ||||
|     :deep( img:not(.equation) ){ | ||||
|       cursor: zoom-in | ||||
|     } | ||||
|  | ||||
|     ::v-deep figure figcaption { | ||||
|     :deep( figure figcaption ){ | ||||
|       text-align: center; | ||||
|       font-size: 1rem; | ||||
|       line-height: 2.7rem; | ||||
|       color: #909090 | ||||
|     } | ||||
|  | ||||
|     ::v-deep pre { | ||||
|     :deep( pre ){ | ||||
|       line-height: 1.93rem; | ||||
|       overflow: auto | ||||
|     } | ||||
|  | ||||
|     ::v-deep code, | ||||
|     ::v-deep pre { | ||||
|     :deep( code), | ||||
|     :deep( pre ){ | ||||
|       font-family: Menlo, Monaco, Consolas, Courier New, monospace | ||||
|     } | ||||
|  | ||||
|     ::v-deep code { | ||||
|     :deep( code ){ | ||||
|       font-size: 1rem; | ||||
|       padding: .26rem .53em; | ||||
|       word-break: break-word; | ||||
| @@ -90,25 +90,25 @@ | ||||
|       border-radius: 2px; | ||||
|       overflow-x: auto | ||||
|     } | ||||
|      | ||||
|     ::v-deep pre>code { | ||||
|  | ||||
|     :deep( pre>code ){ | ||||
|       font-size: 1rem; | ||||
|       padding: .67rem 1.3rem; | ||||
|       margin: 0; | ||||
|       word-break: normal; | ||||
|       display: block | ||||
|     } | ||||
|      | ||||
|     ::v-deep a { | ||||
|  | ||||
|     :deep( a ){ | ||||
|       color: #259 | ||||
|     } | ||||
|  | ||||
|     ::v-deep a:active, | ||||
|     ::v-deep a:hover { | ||||
|     :deep( a:active), | ||||
|     :deep( a:hover ){ | ||||
|       color: #275b8c | ||||
|     } | ||||
|  | ||||
|     ::v-deep table { | ||||
|     :deep( table ){ | ||||
|       width: 100%; | ||||
|       margin-top: 18px; | ||||
|       margin-bottom: 18px; | ||||
| @@ -119,80 +119,80 @@ | ||||
|       border-left: 1px solid #ccc; | ||||
|     } | ||||
|  | ||||
|     ::v-deep thead { | ||||
|     :deep( thead ){ | ||||
|       background: #f6f6f6; | ||||
|       color: #000; | ||||
|       text-align: left | ||||
|     } | ||||
|  | ||||
|     ::v-deep td, | ||||
|     ::v-deep th { | ||||
|     :deep( td), | ||||
|     :deep( th ){ | ||||
|       padding: 3px 5px; | ||||
|       border-bottom: 1px solid #ccc; | ||||
|       border-right: 1px solid #ccc; | ||||
|     } | ||||
|      | ||||
|     ::v-deep td { | ||||
|  | ||||
|     :deep( td ){ | ||||
|       min-width: 10rem | ||||
|     } | ||||
|  | ||||
|     ::v-deep blockquote { | ||||
|     :deep( blockquote ){ | ||||
|       margin: 1em 0; | ||||
|       border-left: 4px solid #ddd; | ||||
|       padding: 0 1.3rem | ||||
|     } | ||||
|  | ||||
|     ::v-deep blockquote>p { | ||||
|     :deep( blockquote>p ){ | ||||
|       margin: .6rem 0 | ||||
|     } | ||||
|  | ||||
|     ::v-deep ol, | ||||
|     ::v-deep ul { | ||||
|     :deep( ol), | ||||
|     :deep( ul ){ | ||||
|       padding-left: 2.7rem | ||||
|     } | ||||
|  | ||||
|     ::v-deep ol li, | ||||
|     ::v-deep ul li { | ||||
|     :deep( ol li), | ||||
|     :deep( ul li ){ | ||||
|       margin-bottom: .6rem | ||||
|     } | ||||
|  | ||||
|     ::v-deep ol ol, | ||||
|     ::v-deep ol ul, | ||||
|     ::v-deep ul ol, | ||||
|     ::v-deep ul ul { | ||||
|     :deep( ol ol), | ||||
|     :deep( ol ul), | ||||
|     :deep( ul ol), | ||||
|     :deep( ul ul ){ | ||||
|       margin-top: .27rem | ||||
|     } | ||||
|  | ||||
|     ::v-deep pre>code { | ||||
|     :deep( pre>code ){ | ||||
|       overflow-x: auto; | ||||
|       -webkit-overflow-scrolling: touch; | ||||
|       color: #333; | ||||
|       background: #f8f8f8 | ||||
|     } | ||||
|  | ||||
|     ::v-deep p { | ||||
|     :deep( p ){ | ||||
|       line-height: inherit; | ||||
|       margin-top: 18px; | ||||
|       margin-bottom: 18px | ||||
|     } | ||||
|  | ||||
|     ::v-deep img { | ||||
|     :deep( img ){ | ||||
|       max-height: none | ||||
|     } | ||||
|  | ||||
|     ::v-deep a { | ||||
|     :deep( a ){ | ||||
|       color: #0269c8; | ||||
|       border-bottom: 1px solid #d1e9ff | ||||
|     } | ||||
|  | ||||
|     ::v-deep code { | ||||
|     :deep( code ){ | ||||
|       background-color: #fff5f5; | ||||
|       color: #ff502c; | ||||
|       font-size: .87em; | ||||
|       padding: .065em .4em | ||||
|     } | ||||
|  | ||||
|     ::v-deep blockquote { | ||||
|     :deep( blockquote ){ | ||||
|       color: #666; | ||||
|       padding: 1px 23px; | ||||
|       margin: 18px 0; | ||||
| @@ -200,22 +200,22 @@ | ||||
|       background-color: #f8f8f8 | ||||
|     } | ||||
|  | ||||
|     ::v-deep blockquote:after { | ||||
|     :deep( blockquote:after ){ | ||||
|       display: block; | ||||
|       content: "" | ||||
|     } | ||||
|  | ||||
|     ::v-deep blockquote>p { | ||||
|     :deep( blockquote>p ){ | ||||
|       margin: 10px 0 | ||||
|     } | ||||
|  | ||||
|     ::v-deep blockquote.warning { | ||||
|     :deep( blockquote.warning ){ | ||||
|       position: relative; | ||||
|       border-left-color: #f75151; | ||||
|       margin-left: 8px | ||||
|     } | ||||
|  | ||||
|     ::v-deep blockquote.warning:before { | ||||
|     :deep( blockquote.warning:before ){ | ||||
|       position: absolute; | ||||
|       top: 14px; | ||||
|       left: -12px; | ||||
| @@ -230,52 +230,52 @@ | ||||
|       justify-content: center | ||||
|     } | ||||
|  | ||||
|     ::v-deep ol, | ||||
|     ::v-deep ul { | ||||
|     :deep( ol), | ||||
|     :deep( ul ){ | ||||
|       padding-left: 28px | ||||
|     } | ||||
|  | ||||
|     ::v-deep ol li, | ||||
|     ::v-deep ul li { | ||||
|     :deep( ol li), | ||||
|     :deep( ul li ){ | ||||
|       margin-bottom: 0; | ||||
|       list-style: inherit | ||||
|     } | ||||
|  | ||||
|     ::v-deep ol li.task-list-item, | ||||
|     ::v-deep ul li.task-list-item { | ||||
|     :deep( ol li.task-list-item), | ||||
|     :deep( ul li.task-list-item ){ | ||||
|       list-style: none | ||||
|     } | ||||
|  | ||||
|     ::v-deep ol li.task-list-item ol, | ||||
|     ::v-deep ol li.task-list-item ul, | ||||
|     ::v-deep ul li.task-list-item ol, | ||||
|     ::v-deep ul li.task-list-item ul { | ||||
|     :deep( ol li.task-list-item ol), | ||||
|     :deep( ol li.task-list-item ul), | ||||
|     :deep( ul li.task-list-item ol), | ||||
|     :deep( ul li.task-list-item ul ){ | ||||
|       margin-top: 0 | ||||
|     } | ||||
|  | ||||
|     ::v-deep ol li { | ||||
|     :deep( ol li ){ | ||||
|       padding-left: 6px | ||||
|     } | ||||
|  | ||||
|     ::v-deep pre { | ||||
|     :deep( pre ){ | ||||
|       position: relative; | ||||
|       line-height: 1.75 | ||||
|     } | ||||
|  | ||||
|     ::v-deep pre>code { | ||||
|     :deep( pre>code ){ | ||||
|       padding: 15px 12px | ||||
|     } | ||||
|  | ||||
|     ::v-deep pre>code.hljs[lang] { | ||||
|     :deep( pre>code.hljs[lang] ){ | ||||
|       padding: 18px 15px 12px | ||||
|     } | ||||
|  | ||||
|     ::v-deep h1, | ||||
|     ::v-deep h2, | ||||
|     ::v-deep h3, | ||||
|     ::v-deep h4, | ||||
|     ::v-deep h5, | ||||
|     ::v-deep h6 { | ||||
|     :deep( h1), | ||||
|     :deep( h2), | ||||
|     :deep( h3), | ||||
|     :deep( h4), | ||||
|     :deep( h5), | ||||
|     :deep( h6 ){ | ||||
|       color: #333; | ||||
|       line-height: 1.5; | ||||
|       margin-top: 35px; | ||||
| @@ -284,47 +284,47 @@ | ||||
|       font-weight: 500; | ||||
|     } | ||||
|  | ||||
|     ::v-deep h1 { | ||||
|     :deep( h1 ){ | ||||
|       font-size: 30px; | ||||
|       margin-bottom: 5px | ||||
|     } | ||||
|  | ||||
|     ::v-deep h2 { | ||||
|     :deep( h2 ){ | ||||
|       padding-bottom: 12px; | ||||
|       font-size: 24px; | ||||
|       border-bottom: 1px solid #ececec | ||||
|     } | ||||
|  | ||||
|     ::v-deep h3 { | ||||
|     :deep( h3 ){ | ||||
|       font-size: 18px; | ||||
|       padding-bottom: 0 | ||||
|     } | ||||
|  | ||||
|     ::v-deep h4 { | ||||
|     :deep( h4 ){ | ||||
|       font-size: 16px | ||||
|     } | ||||
|  | ||||
|     ::v-deep h5 { | ||||
|     :deep( h5 ){ | ||||
|       font-size: 15px | ||||
|     } | ||||
|  | ||||
|     ::v-deep h6 { | ||||
|     :deep( h6 ){ | ||||
|       margin-top: 5px | ||||
|     } | ||||
|  | ||||
|     ::v-deep h1.heading+h2.heading { | ||||
|     :deep( h1.heading+h2.heading ){ | ||||
|       margin-top: 20px | ||||
|     } | ||||
|  | ||||
|     ::v-deep h1.heading+h3.heading { | ||||
|     :deep( h1.heading+h3.heading ){ | ||||
|       margin-top: 15px | ||||
|     } | ||||
|  | ||||
|     ::v-deep .heading+.heading { | ||||
|     :deep( .heading+.heading ){ | ||||
|       margin-top: 0 | ||||
|     } | ||||
|  | ||||
|     ::v-deep h1+:not(.heading) { | ||||
|     :deep( h1+:not(.heading) ){ | ||||
|       margin-top: 25px | ||||
|     } | ||||
|   } | ||||
|   | ||||
		Reference in New Issue
	
	Block a user