Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

postcss_vars: Use underscore to follow better naming convention.

This commit is contained in:
Aman Agrawal 2021-01-25 08:18:09 +00:00 committed by Tim Abbott
parent c287377512
commit f8aea9aecb
17 changed files with 58 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
static/js/css_variables.js
View File

@ -14,22 +14,22 @@ const ms = 320; // Mobile small
module.exports = {
media_breakpoints: {
"xs-min": xs + "px",
"sm-min": sm + "px",
"md-min": md + "px",
"lg-min": lg + "px",
"xl-min": xl + "px",
"ml-min": ml + "px",
"mm-min": mm + "px",
"ms-min": ms + "px",
xs_min: xs + "px",
sm_min: sm + "px",
md_min: md + "px",
lg_min: lg + "px",
xl_min: xl + "px",
ml_min: ml + "px",
mm_min: mm + "px",
ms_min: ms + "px",
"xs-max": xs - 1 + "px",
"sm-max": sm - 1 + "px",
"md-max": md - 1 + "px",
"lg-max": lg - 1 + "px",
"xl-max": xl - 1 + "px",
"ml-max": ml - 1 + "px",
"mm-max": mm - 1 + "px",
"ms-max": ms - 1 + "px",
xs_max: xs - 1 + "px",
sm_max: sm - 1 + "px",
md_max: md - 1 + "px",
lg_max: lg - 1 + "px",
xl_max: xl - 1 + "px",
ml_max: ml - 1 + "px",
mm_max: mm - 1 + "px",
ms_max: ms - 1 + "px",
},
};

2
static/js/message_viewport.js
View File

@ -307,7 +307,7 @@ exports.is_narrow = function () {
// This basically returns true when we hide the right sidebar for
// the left_side_userlist skinny mode. It would be nice to have a less brittle
// test for this.
return window.innerWidth <= media_breakpoints["xl-max"];
return window.innerWidth <= media_breakpoints.xl_max;
};
exports.system_initiated_animate_scroll = function (scroll_amount) {

4
static/js/scroll_bar.js
View File

@ -59,12 +59,12 @@ exports.initialize = function () {
$("head").append(
"<style> @media (max-width: " +
media_breakpoints["xl-max"] +
media_breakpoints.xl_max +
") { .compose-content, .header-main .column-middle { margin-right: " +
(7 + sbWidth) +
"px !important; } } " +
"@media (max-width: " +
media_breakpoints["xl-max"] +
media_breakpoints.xl_max +
") { .fixed-app .column-middle { margin-left: " +
(7 + sbWidth) +
"px !important; } } " +

2
static/styles/alerts.css
View File

@ -240,7 +240,7 @@ $alert-error-red: hsl(0, 80%, 40%);
}
/* @media queries */
@media (max-width: $lg-max) {
@media (max-width: $lg_max) {
.alert-box {
width: 80%;
left: 10%;

4
static/styles/app_components.css
View File

@ -268,7 +268,7 @@
.stream_sorter_toggle {
margin-left: auto;
@media (max-width: $lg-max) {
@media (max-width: $lg_max) {
margin-left: unset;
}
}
@ -390,7 +390,7 @@
}
}
@media (max-width: $md-max) {
@media (max-width: $md_max) {
/* Override Bootstrap's responsive grid to display input at full width */
.input-append .stream-list-filter {
/* Input width = 100% - 10px margin x2 - 6px padding x2 - 1px border x2. */

10
static/styles/compose.css
View File

@ -16,7 +16,7 @@
line-height: 1em;
}
@media (min-width: $sm-min) {
@media (min-width: $sm_min) {
display: none;
}
}
@ -33,7 +33,7 @@
display: none;
}
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
.compose_stream_button,
.compose_private_button {
display: none;
@ -497,20 +497,20 @@ a#undo_markdown_preview {
}
/* This max-width must be synced with message_viewport.is_narrow */
@media (max-width: $xl-max) {
@media (max-width: $xl_max) {
.compose-content {
margin-right: 7px;
}
}
@media (max-width: $md-max) {
@media (max-width: $md_max) {
.compose-content {
margin-right: 7px;
margin-left: 7px;
}
}
@media (max-width: $mm-max) {
@media (max-width: $mm_max) {
#stream_message_recipient_topic.recipient_box {
width: calc(100% - 175px);
min-width: 95px;

4
static/styles/drafts.css
View File

@ -11,7 +11,7 @@
display: flex;
flex-direction: column;
@media (max-width: $md-max) {
@media (max-width: $md_max) {
height: 95%;
max-width: none;
width: 90%;
@ -111,7 +111,7 @@
right: -80px;
font-size: 0.9em;
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
right: 0;
}

2
static/styles/informational_overlays.css
View File

@ -122,7 +122,7 @@
margin-bottom: 10px !important;
}
@media only screen and (max-width: $md-max) {
@media only screen and (max-width: $md_max) {
.informational-overlays {
.overlay-content {
width: calc(100% - 20px);

2
static/styles/lightbox.css
View File

@ -253,7 +253,7 @@
}
}
@media only screen and (min-width: $ms-min) and (max-width: $md-max) {
@media only screen and (min-width: $ms_min) and (max-width: $md_max) {
#lightbox_overlay {
.image-actions {
float: left;

4
static/styles/popovers.css
View File

@ -353,7 +353,7 @@ ul {
}
}
@media (max-width: $md-max) {
@media (max-width: $md_max) {
.message-info-popover,
.user-info-popover {
display: flex !important;
@ -402,7 +402,7 @@ ul {
pointer-events: all;
}
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
.popover-inner {
width: 70%;
}

4
static/styles/recent_topics.css
View File

@ -11,7 +11,7 @@
display: flex;
flex-direction: column;
@media (max-width: $md-max) {
@media (max-width: $md_max) {
height: 95%;
max-width: none;
width: 90%;
@ -279,7 +279,7 @@
white-space: nowrap;
}
@media (max-width: $md-max) {
@media (max-width: $md_max) {
/* Hide participants and last message time
on smaller screens. This ensures user always
has a nice UI experience. */

2
static/styles/rendered_markdown.css
View File

@ -464,7 +464,7 @@
right: 12px;
}
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
.rendered_markdown .message_embed {
height: auto;

6
static/styles/right_sidebar.css
View File

@ -196,7 +196,7 @@
}
/* This max-width must be synced with message_viewport.is_narrow */
@media (max-width: $xl-max) {
@media (max-width: $xl_max) {
#sidebar-keyboard-shortcuts {
/* This is supposed to fix this appearing improperly in narrow
windows. It's likely the wrong solution; a proper fix likely
@ -210,14 +210,14 @@
}
}
@media (max-width: $md-max) {
@media (max-width: $md_max) {
#user_search_section .user-list-filter {
/* input should be 100% - 6px padding x2 - 1px border x2. */
width: calc(100% - 12px - 2px);
}
}
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
#userlist-toggle {
height: 30px;
line-height: 30px;

6
static/styles/settings.css
View File

@ -1761,7 +1761,7 @@ body:not(.night-mode) #settings_page .custom_user_field .datepicker {
margin: 20px;
}
@media (max-width: $lg-max) {
@media (max-width: $lg_max) {
.user-avatar-section,
.realm-icon-section {
float: none;
@ -1784,7 +1784,7 @@ body:not(.night-mode) #settings_page .custom_user_field .datepicker {
/* This value needs to match with the same in subscriptions.css, as
we have some shared styles declared there */
@media (max-width: $md-max) {
@media (max-width: $md_max) {
#settings_overlay_container {
/* this variable allows JavaScript to detect this media query */
--single-column: yes;
@ -1878,7 +1878,7 @@ body:not(.night-mode) #settings_page .custom_user_field .datepicker {
}
}
@media only screen and (max-width: $lg-max) {
@media only screen and (max-width: $lg_max) {
/* Show bot-information-box at full width on small
screen sizes. Not having this media query breaks the
information box */

8
static/styles/subscriptions.css
View File

@ -1087,7 +1087,7 @@ ul.grey-box {
}
}
@media (max-width: $lg-max) {
@media (max-width: $lg_max) {
.subscriptions-container {
max-width: 95%;
}
@ -1103,7 +1103,7 @@ ul.grey-box {
}
}
@media (max-width: $lg-max) {
@media (max-width: $lg_max) {
.subscriptions-container .left .search-container {
flex-wrap: wrap;
justify-content: space-evenly;
@ -1119,7 +1119,7 @@ ul.grey-box {
Longer-term we should extract this logic two-column-overlay class
to read more naturally. */
@media (max-width: $md-max) {
@media (max-width: $md_max) {
.subscriptions-container {
position: relative;
overflow: hidden;
@ -1180,7 +1180,7 @@ ul.grey-box {
}
}
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
#subscription_overlay .subscription_settings .button-group {
display: block;
float: unset;

4
static/styles/typing_notifications.css
View File

@ -11,13 +11,13 @@
}
/* This max-width must be synced with message_viewport.is_narrow */
@media (max-width: $xl-max) {
@media (max-width: $xl_max) {
#typing_notifications {
margin-right: 7px;
}
}
@media (max-width: $md-max) {
@media (max-width: $md_max) {
#typing_notifications {
margin-right: 7px;
margin-left: 7px;

20
static/styles/zulip.css
View File

@ -1584,7 +1584,7 @@ div.focused_table {
padding: 12px 6px;
overflow: hidden;
text-overflow: ellipsis;
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
padding: 7px 3.5px; /* based on having ~41.66% decrease */
}
i {
@ -1639,14 +1639,14 @@ div.focused_table {
height: 50%;
color: hsl(0, 0%, 88%);
font-size: 20px;
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
top: 10%;
}
}
&::before {
left: -3px;
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
/* this ensures the before "|" doesn't overlap
with the stream name text on small narrows */
left: 0;
@ -1671,7 +1671,7 @@ div.focused_table {
padding: 12px 0;
padding-left: 10px;
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
padding: 7px 0;
padding-left: 10px;
}
@ -1689,7 +1689,7 @@ div.focused_table {
font-size: 20px;
padding: 10px 15px 0 0;
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
padding: 5px 15px 0 0;
}
}
@ -1827,13 +1827,13 @@ div.focused_table {
padding: 0;
}
@media (min-width: $sm-min) {
@media (min-width: $sm_min) {
.pill {
padding: 2px 0 2px 0 !important;
font-size: 14px;
}
}
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
#search_arrows .pill {
line-height: 20px;
@ -2600,7 +2600,7 @@ select.inline_select_topic_edit {
}
/* This max-width must be synced with message_viewport.is_narrow */
@media (max-width: $xl-max) {
@media (max-width: $xl_max) {
.app-main,
.header-main {
min-width: 750px;
@ -2680,7 +2680,7 @@ select.inline_select_topic_edit {
}
}
@media (max-width: $md-max) {
@media (max-width: $md_max) {
body {
padding: 0;
}
@ -2778,7 +2778,7 @@ select.inline_select_topic_edit {
}
}
@media (max-width: $sm-max) {
@media (max-width: $sm_max) {
.column-right.expanded .right-sidebar,
.column-left.expanded .left-sidebar {
margin-top: 31px;