mirror of
https://github.com/overleaf/overleaf.git
synced 2024-10-17 21:05:04 -04:00
171 lines
3.9 KiB
SCSS
171 lines
3.9 KiB
SCSS
|
.project-list-empty-col {
|
||
|
display: flex;
|
||
|
height: 100%;
|
||
|
flex-direction: column;
|
||
|
flex-wrap: nowrap;
|
||
|
.row:first-child {
|
||
|
flex-grow: 1; /* fill vertical space so notifications are pushed to bottom */
|
||
|
}
|
||
|
.card-body {
|
||
|
// h2 + .card-thin top padding
|
||
|
padding-bottom: calc(var(--line-height-03) + var(--line-height-03) / 2);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.project-list-react {
|
||
|
body > &.content {
|
||
|
padding-top: $header-height;
|
||
|
padding-bottom: 0;
|
||
|
min-height: calc(100vh - #{$header-height});
|
||
|
display: flex;
|
||
|
flex-direction: column;
|
||
|
}
|
||
|
|
||
|
.project-list-wrapper {
|
||
|
display: flex;
|
||
|
align-items: stretch;
|
||
|
width: 100%;
|
||
|
min-height: calc(100vh - #{$header-height});
|
||
|
}
|
||
|
|
||
|
.project-list-sidebar-wrapper-react {
|
||
|
position: relative;
|
||
|
background-color: var(--bg-dark-secondary);
|
||
|
flex: 0 0 15%;
|
||
|
min-height: calc(100vh - #{$header-height});
|
||
|
max-width: 320px;
|
||
|
min-width: 200px;
|
||
|
|
||
|
.project-list-sidebar-subwrapper {
|
||
|
display: flex;
|
||
|
flex-direction: column;
|
||
|
height: 100%;
|
||
|
|
||
|
.project-list-sidebar-react {
|
||
|
flex-grow: 1;
|
||
|
padding-left: var(--spacing-06);
|
||
|
padding-right: var(--spacing-06);
|
||
|
-ms-overflow-style: -ms-autohiding-scrollbar;
|
||
|
padding-top: var(--spacing-08);
|
||
|
padding-bottom: var(--spacing-08);
|
||
|
color: var(--neutral-40);
|
||
|
|
||
|
.small {
|
||
|
color: var(--neutral-40);
|
||
|
}
|
||
|
|
||
|
button {
|
||
|
white-space: normal;
|
||
|
word-wrap: anywhere;
|
||
|
// prevents buttons from expanding sidebar width
|
||
|
}
|
||
|
|
||
|
> .dropdown {
|
||
|
width: 100%;
|
||
|
|
||
|
.new-project-button {
|
||
|
width: 100%;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.project-list-welcome-wrapper {
|
||
|
width: 100%;
|
||
|
padding-bottom: var(--spacing-08);
|
||
|
|
||
|
.welcome-new-wrapper {
|
||
|
.welcome-title {
|
||
|
@include heading-xl();
|
||
|
margin-top: var(--spacing-08);
|
||
|
}
|
||
|
|
||
|
.welcome-message-cards-wrapper {
|
||
|
display: flex;
|
||
|
flex-direction: column;
|
||
|
justify-content: space-between;
|
||
|
align-items: center;
|
||
|
margin-top: var(--spacing-11);
|
||
|
|
||
|
@include media-breakpoint-up(lg) {
|
||
|
flex-direction: row;
|
||
|
justify-content: center;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.welcome-message-card {
|
||
|
border: 1px solid $bg-light-tertiary;
|
||
|
border-radius: $border-radius-large;
|
||
|
display: flex;
|
||
|
flex-direction: column;
|
||
|
align-items: center;
|
||
|
justify-content: space-between;
|
||
|
padding: var(--spacing-08) var(--spacing-06);
|
||
|
margin: var(--spacing-05) 0;
|
||
|
width: 280px;
|
||
|
height: 200px;
|
||
|
position: relative;
|
||
|
cursor: pointer;
|
||
|
|
||
|
@include media-breakpoint-up(lg) {
|
||
|
margin: 0 var(--spacing-06);
|
||
|
height: 240px;
|
||
|
}
|
||
|
|
||
|
&:hover {
|
||
|
background-color: $bg-light-secondary;
|
||
|
}
|
||
|
|
||
|
.welcome-message-card-img {
|
||
|
@include media-breakpoint-up(lg) {
|
||
|
margin-bottom: var(--spacing-07);
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.create-new-project-dropdown {
|
||
|
transform: none !important;
|
||
|
top: 100% !important;
|
||
|
left: var(--spacing-06) !important;
|
||
|
right: var(--spacing-06) !important;
|
||
|
|
||
|
@include media-breakpoint-down(lg) {
|
||
|
left: 0 !important;
|
||
|
right: 0 !important;
|
||
|
margin-top: calc(var(--spacing-05) * -1);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.welcome-message-card-link {
|
||
|
&,
|
||
|
&:hover {
|
||
|
text-decoration: none;
|
||
|
color: $neutral-60;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.project-list-main-react {
|
||
|
flex: 1;
|
||
|
overflow-x: hidden;
|
||
|
padding: var(--spacing-08) var(--spacing-06);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.project-list-upload-project-modal-uppy-dashboard .uppy-Root {
|
||
|
.uppy-Dashboard-AddFiles-title {
|
||
|
display: flex;
|
||
|
flex-direction: column;
|
||
|
color: var(--neutral-60);
|
||
|
white-space: pre-line;
|
||
|
|
||
|
button.uppy-Dashboard-browse {
|
||
|
@extend .btn;
|
||
|
@extend .btn-lg;
|
||
|
@extend .btn-primary;
|
||
|
}
|
||
|
}
|
||
|
}
|