mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-01-01 23:37:43 +03:00
183 lines
4.4 KiB
CSS
183 lines
4.4 KiB
CSS
.pintura-editor {
|
|
--font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Droid Sans, Helvetica Neue, sans-serif !important;
|
|
}
|
|
|
|
.PinturaModal {
|
|
padding: 32px !important;
|
|
background-color: rgba(0, 0, 0, 0.6) !important;
|
|
}
|
|
|
|
.PinturaRoot {
|
|
border-radius: 9px !important;
|
|
}
|
|
|
|
.PinturaRoot[data-env~=landscape][data-env~=has-navigation] > .PinturaMain {
|
|
grid-column: 1 / -1 !important;
|
|
}
|
|
|
|
.PinturaRoot[data-env~=landscape] > .PinturaNavTools {
|
|
padding: 24px 24px 0 !important;
|
|
}
|
|
|
|
.PinturaRoot > .PinturaNav .PinturaButton:only-of-type {
|
|
padding: 0 14px !important;
|
|
height: 34px !important;
|
|
font-size: 2rem !important;
|
|
font-weight: 500 !important;
|
|
color: var(--white) !important;
|
|
background-color: var(--black) !important;
|
|
border-radius: 3px !important;
|
|
-webkit-font-smoothing: subpixel-antialiased !important;
|
|
}
|
|
|
|
.PinturaRoot > .PinturaNav .PinturaButtonExport .PinturaButtonInner {
|
|
height: auto !important;
|
|
}
|
|
|
|
.PinturaRoot .PinturaButtonExport:hover {
|
|
color: var(--black) !important;
|
|
background-color: var(--white) !important;
|
|
}
|
|
|
|
.PinturaNavGroup {
|
|
margin-left: 0 !important;
|
|
}
|
|
|
|
.PinturaUtilMain {
|
|
padding-right: 0 !important;
|
|
}
|
|
|
|
.PinturaUtilFooter {
|
|
padding-right: 0 !important;
|
|
}
|
|
|
|
|
|
/* Main nav */
|
|
|
|
.PinturaRoot[data-env~=landscape] > .PinturaNavMain {
|
|
left: 24px !important;
|
|
}
|
|
|
|
.PinturaRoot > .PinturaNavMain .PinturaTabList [aria-selected=true] {
|
|
color: var(--green-d1) !important;
|
|
}
|
|
|
|
.PinturaRoot[data-env~=landscape] > .PinturaNavMain button {
|
|
flex-direction: row !important;
|
|
gap: 8px !important;
|
|
width: 120px !important;
|
|
height: 32px !important;
|
|
box-shadow: none !important;
|
|
background: none !important;
|
|
backdrop-filter: none !important;
|
|
}
|
|
|
|
.PinturaRoot[data-env~=landscape] > .PinturaNavMain button svg {
|
|
width: 24px !important;
|
|
margin-top: 0 !important;
|
|
}
|
|
|
|
.PinturaRoot[data-env~=landscape] > .PinturaNavMain button span {
|
|
margin-top: 0 !important;
|
|
font-size: 13px !important;
|
|
font-weight: 600 !important;
|
|
text-align: left !important;
|
|
}
|
|
|
|
/* Cropping */
|
|
|
|
.PinturaRectManipulator[data-shape~=circle] {
|
|
width: auto !important;
|
|
height: auto !important;
|
|
margin: 0 !important;
|
|
background: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
.PinturaRectManipulator:not([data-shape=edge])::after {
|
|
inset: 0 !important;
|
|
border-radius: 0 !important;
|
|
content: "" !important;
|
|
border-style: solid !important;
|
|
border-width: 4px 4px 0 0 !important;
|
|
display: inline-block !important;
|
|
height: 16px !important;
|
|
position: relative !important;
|
|
transform: rotate(-90deg) !important;
|
|
width: 16px !important;
|
|
border-color: rgba(0,0,0,1) !important;
|
|
}
|
|
|
|
.PinturaRectManipulator[data-shape~=circle][data-direction=tr] {
|
|
left: -16px !important;
|
|
}
|
|
|
|
.PinturaRectManipulator[data-shape~=circle][data-direction=tr]::after {
|
|
transform: rotate(0) !important;
|
|
}
|
|
|
|
.PinturaRectManipulator[data-shape~=circle][data-direction=bl] {
|
|
top: -16px !important;
|
|
}
|
|
|
|
.PinturaRectManipulator[data-shape~=circle][data-direction=bl]::after {
|
|
transform: rotate(180deg) !important;
|
|
}
|
|
|
|
.PinturaRectManipulator[data-shape~=circle][data-direction=br] {
|
|
top: -16px !important;
|
|
left: -16px !important;
|
|
}
|
|
|
|
.PinturaRectManipulator[data-shape~=circle][data-direction=br]::after {
|
|
transform: rotate(90deg) !important;
|
|
}
|
|
|
|
/* Toolbar */
|
|
|
|
.PinturaUtilHeader {
|
|
padding-bottom: 4px !important;
|
|
}
|
|
|
|
.PinturaToolbar .PinturaToolbarInner > * {
|
|
margin: 0 4px !important;
|
|
}
|
|
|
|
.PinturaToolbar .PinturaButton:hover {
|
|
color: var(--green-d1) !important;
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
.PinturaToolbar .PinturaButton[title="Rotate left"] svg {
|
|
margin-top: -2px !important;
|
|
}
|
|
|
|
.PinturaToolbar .PinturaButton[title="Flip horizontal"] svg {
|
|
margin-top: -3px !important;
|
|
}
|
|
|
|
.PinturaButton svg + .PinturaButtonLabel {
|
|
margin-left: 4px !important;
|
|
}
|
|
|
|
/* Tab list */
|
|
|
|
.PinturaUtilFooter .PinturaControlList [role=tab] button {
|
|
padding: 0 10px !important;
|
|
}
|
|
|
|
.PinturaUtilFooter .PinturaControlList [role=tab][aria-selected=true] button {
|
|
color: var(--green-d1) !important;
|
|
background: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
.PinturaUtilFooter .PinturaControlList .PinturaControlListOption label:hover,
|
|
.PinturaUtilFooter .PinturaControlList [role=tab] button:hover {
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
.PinturaUtilFooter .PinturaControlList [role=tab] button span {
|
|
font-weight: 500 !important;
|
|
}
|