From 0ba7a1bd480e8c27c852863a62369d569645e666 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B0=8F=E5=B0=8F=E7=99=BD=E5=93=A6?= Date: Sun, 31 Aug 2025 15:06:30 +0800 Subject: [PATCH] Create moderno.less --- resources/less/moderno.less | 201 ++++++++++++++++++++++++++++++++++++ 1 file changed, 201 insertions(+) create mode 100644 resources/less/moderno.less diff --git a/resources/less/moderno.less b/resources/less/moderno.less new file mode 100644 index 0000000..eca4f01 --- /dev/null +++ b/resources/less/moderno.less @@ -0,0 +1,201 @@ +@border-radius: 8px; +.tooltip-arrow, +.Hero-close { + display: none; +} +@media @phone { + .Dropdown-menu { + margin: 8px !important; + border-radius: 8px !important; + padding: 4px !important; + } +} +.Dropdown-menu { + border-radius: 12px; + padding: 1px; + &>li { + margin: 4px; + &>a, + &>button, + &>span { + border-radius: 8px; + transition: 0.4s; + } + } +} +.Button { + transition: background-color 0.4s; +} +.Button:active, +.Button.active, +.open>.Button.Dropdown-toggle { + box-shadow: unset; +} +.Modal, .Modal-content { + border-radius: 12px; +} +.backdrop { + background-color: ~"#0000004D"; +} +@media @phone { + .dropdown-backdrop, .drawer-backdrop, .composer-backdrop { + background-color: ~"#0000004D"; + } +} +.LoadingIndicator { + animation: none; + border: none; + border-radius: 0; + background-color: currentColor; + --animation-image: url("data:image/svg+xml,%3Csvg viewBox='5.963 5.963 21.940666 21.940666' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'%3E%3Cg id='layer1'%3E%3Ccircle cx='16.933332' cy='16.933332' r='9.4701843' stroke='%23000' stroke-width='2' fill='none' stroke-dashoffset='' id='circlebar' stroke-dasharray='1 100'%3E %3CanimateTransform attributeName='transform' attributeType='AUTO' type='rotate' values='-95 16.933332 16.933332;355 16.933332 16.933332;985 16.933332 16.933332' dur='2s' repeatCount='indefinite' /%3E %3Canimate attributeName='stroke-dasharray' attributeType='AUTO' type='rotate' values='0.01 100;30 100;0.01 100' dur='2s' repeatCount='indefinite' /%3E%3C/circle%3E%3C/g%3E%3C/svg%3E"); + -webkit-mask: var(--animation-image); + mask: var(--animation-image); +} +.AfruxWidgets-Widget-content { + border-radius: 8px !important; + background: @control-bg; +} +.Composer { + border-radius: 12px 12px 0 0; +} +.ComposerBody-loading { + border-radius: 12px; +} +.Post { + border-radius: 12px; + margin-left: 4px; + margin-right: 4px; + margin-top: 16px; + margin-bottom: 16px; + background: @control-bg; +} +.PostStream-item { + &:not(:last-child) { + border-bottom: none; + } +} +.EventPost { + background-color: transparent; + .Post-footer { + display: none; + } +} +.ReplyPlaceholder { + background: none; + margin: auto; + margin-top: 8px; + width: 100%; +} +@media (min-width:992px) { + .TagTiles>li { + width: 30% !important; + border-radius: 8px !important; + margin: 15px; + } +} +@media (max-width:991px) and (min-width:768px) { + .TagTiles>li { + width: 45% !important; + border-radius: 12px !important; + margin: 15px; + } +} +@media (max-width:767px) { + .TagTiles>li { + border-radius: 12px !important; + margin: 15px; + } +} +.DiscussionListItem { + margin: 0 0 8px; + border-radius: 12px; + background: @control-bg; + @media @phone { + margin: 8px !important; + } + &-controls .Dropdown-toggle { + border-radius: 12px; + } +} +.DiscussionListItem-content { + box-shadow: unset !important; + border-radius: 12px !important; +} +.Hero { + margin: 15px auto 0; + max-width: @screen-desktop-hd; + border-radius: 12px; + @media @desktop { + max-width: @screen-desktop; + } + @media @tablet { + max-width: @screen-tablet; + } + @media @phone { + max-width: calc(~"100% - 30px"); + margin-bottom: 15px; + } +} +.darkenBackground { + border-radius: 12px; +} +.Post-body pre { + font-size: 12px; + padding: 0; + border-left: 4px solid #929292; + border-radius: 2px; +} +.Post-body blockquote { + fontsize: 14px; + padding: 10px; + border: 0; + border-left: 4px solid #0066d0; + border-radius: 2px; + & when (@config-dark-mode =false) { + background: #f7f7f7; + color: #444; + } + & when (@config-dark-mode =true) { + background: #111111; + color: #eee; + } +} +.aaalert.aaerror .aainner, +.aaalert.aainfo .aainner, +.aaalert.aasuccess .aainner { + font-size: 14px; + text-align: left; +} +.aaalert.aaerror .aainner { + border-left: 4px solid #ff5c5c !important; +} +.aaalert.aasuccess .aainner { + border-left: 4px solid #58a400 !important; +} +.aaalert.aainfo .aainner { + border-left: 4px solid #569ff7 !important; +} +ul.NotificationGroup-content { + &>li { + margin: 4px 8px; + &>a { + &.Notification { + border-radius: 12px; + transition: 0.4s; + } + &.unread .Notification-title:after { + content: ''; + display: inline-block; + width: 1em; + height: 1em; + border-radius: 50%; + background-color: var(--primary-color); + transform: translateY(10%); + margin-left: 8px; + } + } + } +} +.ConversationsList .chat .chat-message { + border-radius: 0 0 @border-radius 0 !important; +}