mirror of
https://github.com/nkanaev/yarr.git
synced 2025-10-31 15:02:57 +00:00
rename assets
This commit is contained in:
Nazar Kanaev
511
assets/stylesheets/app.css
Normal file
511
assets/stylesheets/app.css
Normal file
@@ -0,0 +1,511 @@
|
||||
[v-cloak] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: 15px !important;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
max-width: 1440px;
|
||||
margin: 0 auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* bootstrap customizations */
|
||||
|
||||
.btn-link {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
select.form-control {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
select.form-control:not([multiple]):not([size]) {
|
||||
box-shadow: 0 1px 2px rgba(0,0,0,0.1);
|
||||
background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.6rem .6rem;
|
||||
padding-right: 1.2rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.form-control:focus, .btn:focus {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.dropdown-header {
|
||||
cursor: default;
|
||||
max-width: 180px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.dropdown-toggle-no-caret:after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#settings-modal {
|
||||
color: #212529 !important;
|
||||
}
|
||||
|
||||
.settings-dropdown .dropdown-toggle {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
padding: 0;
|
||||
box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.07);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.dropdown-item, .dropdown-header {
|
||||
padding: .375rem 1rem;
|
||||
}
|
||||
|
||||
.dropdown-divider {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.settings-dropdown .dropdown-menu:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.settings-dropdown .dropdown-item:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.settings-dropdown.large .dropdown-item {
|
||||
padding: .5rem 1rem;
|
||||
}
|
||||
|
||||
.dropdown-danger .dropdown-item {
|
||||
color: #dc3545!important;
|
||||
}
|
||||
|
||||
.modal-backdrop {
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
.b-dropdown-form:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.popover:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.b-tooltip {
|
||||
opacity: 1;
|
||||
font-size: .7rem;
|
||||
}
|
||||
|
||||
.b-tooltip:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/* custom elements */
|
||||
|
||||
.icon {
|
||||
height: 1rem;
|
||||
width: 1rem;
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.icon > svg , .icon > img {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.icon-small {
|
||||
width: .6rem;
|
||||
height: .6rem;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.icon-small > svg , .icon-small > img {
|
||||
width: .6rem;
|
||||
height: .6rem;
|
||||
}
|
||||
|
||||
.feed-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
min-width: 16px;
|
||||
margin-left: -18px !important;
|
||||
}
|
||||
|
||||
.counter {
|
||||
padding-left: .5rem;
|
||||
opacity: .6;
|
||||
}
|
||||
|
||||
.light {
|
||||
opacity: .6;
|
||||
}
|
||||
|
||||
.selectgroup {
|
||||
position: relative;
|
||||
display: block;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.selectgroup *, .noselect, .dropdown-menu * {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.selectgroup input {
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
top: 0; left: 0;
|
||||
}
|
||||
|
||||
.selectgroup + .selectgroup {
|
||||
margin-top: .25rem;
|
||||
}
|
||||
|
||||
.selectgroup-label {
|
||||
padding: .375rem .5rem;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.selectgroup-label:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.list-row:hover,
|
||||
.toolbar-item:hover,
|
||||
.toolbar-search:hover,
|
||||
.selectgroup-label:hover,
|
||||
.dropdown-item:hover {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
.expanded {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
@keyframes loading {
|
||||
0% {
|
||||
transform: rotate(0)
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg)
|
||||
}
|
||||
}
|
||||
|
||||
.loading {
|
||||
color: transparent!important;
|
||||
min-height: .8rem;
|
||||
pointer-events: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.loading::after {
|
||||
animation: loading .5s infinite linear;
|
||||
border: .1rem solid #6c757d;
|
||||
border-radius: 50%;
|
||||
border-right-color: transparent;
|
||||
border-top-color: transparent;
|
||||
content: "";
|
||||
display: block;
|
||||
height: 1rem;
|
||||
width: 1rem;
|
||||
left: 50%;
|
||||
margin-left: -.5rem;
|
||||
margin-top: -.5rem;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.btn-default {
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: .25rem;
|
||||
box-shadow: 0 1px 2px rgba(0,0,0,0.1);
|
||||
background: linear-gradient(#fff, #f5f7f9);
|
||||
}
|
||||
|
||||
.btn-default:active {
|
||||
background: #f5f7f9;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.btn-outline {
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: .25rem;
|
||||
}
|
||||
|
||||
.btn-outline:hover {
|
||||
background-color: #f8f9fa;
|
||||
}
|
||||
|
||||
.list-row {
|
||||
padding-left: .5rem;
|
||||
padding-right: .5rem;
|
||||
margin-left: -.5rem;
|
||||
margin-right: -.5rem;
|
||||
border-radius: 3px;
|
||||
user-select: none;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.toolbar {
|
||||
min-height: 2rem !important;
|
||||
max-height: 2rem !important;
|
||||
}
|
||||
|
||||
.toolbar-item {
|
||||
display: inline-block;
|
||||
background-color: transparent;
|
||||
text-decoration: none;
|
||||
user-select: none;
|
||||
border: 1px solid transparent;
|
||||
padding: .25rem .5rem;
|
||||
font-size: 1rem;
|
||||
border-radius: .25rem;
|
||||
line-height: 1;
|
||||
color: inherit;
|
||||
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
border-radius: 3px;
|
||||
cursor: pointer;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.toolbar-item:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.toolbar-item:disabled {
|
||||
opacity: 0.4;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.cursor-pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.cursor-default {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.drag {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 6px;
|
||||
height: 100%;
|
||||
z-index: 900;
|
||||
cursor: col-resize;
|
||||
}
|
||||
|
||||
.input-icon {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.input-icon .icon {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
width: 2rem;
|
||||
justify-content: center;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.input-icon input {
|
||||
padding-left: 2rem !important;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.toolbar-search {
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
padding: .25rem .5rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.toolbar-search:hover, .toolbar-search:focus {
|
||||
background-color: #f3f3f3;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.themepicker {
|
||||
position: relative;
|
||||
background: none;
|
||||
border: none;
|
||||
width: 100%;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.themepicker input {
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
top: 0; left: 0;
|
||||
}
|
||||
|
||||
.themepicker-label {
|
||||
height: 1.75rem;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.themepicker input[value=light] + .themepicker-label {
|
||||
box-shadow: inset 0 0 0px 1px #dee2e6;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.themepicker + .themepicker {
|
||||
margin-left: .5rem;
|
||||
}
|
||||
|
||||
.themepicker-label:hover {
|
||||
box-shadow: inset 0 0 0 2px rgb(1, 123, 254, .6) !important;
|
||||
}
|
||||
|
||||
.themepicker input:checked + .themepicker-label {
|
||||
box-shadow: inset 0 0 0px 2px #017bfe !important;
|
||||
}
|
||||
|
||||
.appearance-option {
|
||||
height: 2rem;
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
#opml-import-form input[type="file"]::-webkit-file-upload-button {
|
||||
position: absolute;
|
||||
top: -999px;
|
||||
left: -999px;
|
||||
}
|
||||
|
||||
/* content */
|
||||
|
||||
.content {
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.content img, .content video {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.content pre {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.content a {
|
||||
color: inherit;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.content blockquote {
|
||||
border-left: 3px solid #22262a;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
|
||||
.content pre {
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
.content h1 {
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
.content h2 {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
.content h3 {
|
||||
font-size: 1.17rem;
|
||||
}
|
||||
.content h4,
|
||||
.content h5,
|
||||
.content h6 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
/* theme: light */
|
||||
|
||||
a,
|
||||
.btn-link:hover,
|
||||
.toolbar-item.active {
|
||||
color: #0080d4;
|
||||
}
|
||||
|
||||
.dropdown-item.active,
|
||||
.dropdown-item:active,
|
||||
.selectgroup input:checked + .selectgroup-label {
|
||||
color: #fff;
|
||||
background-color: #0080d4 !important;
|
||||
}
|
||||
|
||||
.btn-default:focus,
|
||||
.form-control:focus {
|
||||
border-color: #0080d4;
|
||||
}
|
||||
|
||||
/* theme: sepia */
|
||||
|
||||
.themepicker input[value=sepia] + .themepicker-label,
|
||||
.theme-sepia,
|
||||
.theme-sepia .toolbar-search {
|
||||
background-color: #f4f0e5;
|
||||
}
|
||||
.theme-sepia .content hr,
|
||||
.theme-sepia .border-right,
|
||||
.theme-sepia .border-top {
|
||||
border-color: #e0d6ba !important;
|
||||
}
|
||||
.theme-sepia .selectgroup-label:not(.appearance-option):hover,
|
||||
.theme-sepia .toolbar-item:hover,
|
||||
.theme-sepia .toolbar-search:hover,
|
||||
.theme-sepia .toolbar-search:focus {
|
||||
background-color: #e0d6ba;
|
||||
}
|
||||
|
||||
/* theme: night */
|
||||
|
||||
.themepicker input[value=night] + .themepicker-label,
|
||||
.theme-night,
|
||||
.theme-night .toolbar-search {
|
||||
color: #d1d1d1;
|
||||
background-color: #0e0e0e;
|
||||
}
|
||||
|
||||
.theme-night .content hr,
|
||||
.theme-night .border-right,
|
||||
.theme-night .border-top {
|
||||
border-color: #1a1a1a !important;
|
||||
}
|
||||
|
||||
.theme-night .selectgroup-label:not(.appearance-option):hover,
|
||||
.theme-night .toolbar-item:hover,
|
||||
.theme-night .toolbar-search:hover,
|
||||
.theme-night .toolbar-search:focus {
|
||||
background-color: #1a1a1a;
|
||||
}
|
||||
|
||||
/* animation */
|
||||
.indicator-enter-active, .indicator-leave-active {
|
||||
transition: all .3s;
|
||||
}
|
||||
.indicator-enter, .indicator-leave-to {
|
||||
width: 0;
|
||||
opacity: 0;
|
||||
margin: 0 !important;
|
||||
}
|
||||
Reference in New Issue
Block a user