Skip to content

Commit

Permalink
Fixed Overflow Issue (#1353)
Browse files Browse the repository at this point in the history 
Fixed #729 -- Add overflow-wrap to monospace mixin
---------

Co-authored-by: Sarah Abderemane <sarahabderemane@gmail.com>
Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
  • Loading branch information
@Tushar-sahani @sabderemane @pre-commit-ci
3 people committed Jun 2, 2023
1 parent d27708d commit ef47866
Showing 1 changed file with 76 additions and 75 deletions.
151 changes: 76 additions & 75 deletions djangoproject/scss/_utils.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,144 +46,145 @@ $logo-bg-dark: #272c27;
// @font-face declarations

@font-face {
font-family: 'Fira Mono';
src: url('#{$font-path}/FiraMono-Regular.eot');
src: url('#{$font-path}/FiraMono-Regular.eot') format('embedded-opentype'),
url('#{$font-path}/FiraMono-Regular.woff') format('woff'),
url('#{$font-path}/FiraMono-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
font-family: 'Fira Mono';
src: url('#{$font-path}/FiraMono-Regular.eot');
src: url('#{$font-path}/FiraMono-Regular.eot') format('embedded-opentype'),
url('#{$font-path}/FiraMono-Regular.woff') format('woff'),
url('#{$font-path}/FiraMono-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}

@font-face {
font-family: 'Fira Mono';
src: url('#{$font-path}/FiraMono-Bold.eot');
src: url('#{$font-path}/FiraMono-Bold.eot') format('embedded-opentype'),
url('#{$font-path}/FiraMono-Bold.woff') format('woff'),
url('#{$font-path}/FiraMono-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
font-family: 'Fira Mono';
src: url('#{$font-path}/FiraMono-Bold.eot');
src: url('#{$font-path}/FiraMono-Bold.eot') format('embedded-opentype'),
url('#{$font-path}/FiraMono-Bold.woff') format('woff'),
url('#{$font-path}/FiraMono-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}

// Media Queries Mixin (http://jakearchibald.github.com/sass-ie/)
@mixin respond-min($width) {
@media screen and (min-width: $width) {
@content;
}
@media screen and (min-width: $width) {
@content;
}
}

@mixin respond-max($width) {
@media screen and (max-width: $width) {
@content;
}
@media screen and (max-width: $width) {
@content;
}
}

@mixin device-min($width) {
@media screen and (min-device-width: $width) {
@content;
}
@media screen and (min-device-width: $width) {
@content;
}
}

// Retina media query mixin
@mixin retina-display {

@media only screen and (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
@content;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
@content;
}
}

// Font Family Mixins
@mixin serif {
font-family: Palatino, "Palatino Linotype", "Book Antiqua", "Hoefler Text", Georgia, "Lucida Bright", Cambria, Times, "Times New Roman", serif;
font-family: Palatino, "Palatino Linotype", "Book Antiqua", "Hoefler Text", Georgia, "Lucida Bright", Cambria, Times, "Times New Roman", serif;
}

@mixin sans-serif {
font-family: "Roboto", Corbel, Avenir, "Lucida Grande", "Lucida Sans", sans-serif;
font-family: "Roboto", Corbel, Avenir, "Lucida Grande", "Lucida Sans", sans-serif;
}

@mixin monospace {
font-family: "Fira Mono", Consolas, Menlo, Monaco, "Courier New", Courier, monospace;
font-variant-ligatures: no-common-ligatures; // disables the common ligatures only
text-rendering: optimizeSpeed; // for Safari 7.x
font-family: "Fira Mono", Consolas, Menlo, Monaco, "Courier New", Courier, monospace;
font-variant-ligatures: no-common-ligatures; // disables the common ligatures only
text-rendering: optimizeSpeed; // for Safari 7.x
overflow-wrap: break-word;
}

// Font Sizing Mixin (http://css-tricks.com/snippets/css/less-mixin-for-rem-font-sizing/)
html {
font-size: 62.5%;
font-size: 62.5%;
}

@mixin font-size ($size: 16) {
font-size: $size + px;
font-size: $size/10 + rem;
font-size: $size + px;
font-size: $size/10 + rem;
}

// Boilerplate Helper mixins (https://github.com/h5bp/html5-boilerplate/blob/v4.1.0/doc/css.md)
@mixin visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}

@mixin clearfix {

&:before,
&:after {
content: "";
display: table;
}
&:before,
&:after {
content: "";
display: table;
}

&:after {
clear: both;
}
&:after {
clear: both;
}
}

@mixin svg-image ($name ) {
background-image: url('../img/' +$name+'.png');
background-image: url('../img/' +$name+'.png');

.mdzr-svg & {
background-image: url('../img/' +$name+'.svg');
}
.mdzr-svg & {
background-image: url('../img/' +$name+'.svg');
}
}

// Green Link Mixin
@mixin link-green {
color: var(--link-color);
text-decoration: none;
color: var(--link-color);
text-decoration: none;

&:visited {
color: var(--link-color);
}
&:visited {
color: var(--link-color);
}

&:hover,
&:active,
&:focus {
color: lighten($green, 6%);
text-decoration: none;
}
&:hover,
&:active,
&:focus {
color: lighten($green, 6%);
text-decoration: none;
}

}

// Secondary content box-shadow:
@mixin secondary-shadow-top {
-moz-box-shadow: 0 4px 8px rgba(12, 60, 38, 0.07);
-webkit-box-shadow: 0 4px 8px rgba(12, 60, 38, 0.07);
box-shadow: 0 4px 8px rgba(12, 60, 38, 0.07);
-moz-box-shadow: 0 4px 8px rgba(12, 60, 38, 0.07);
-webkit-box-shadow: 0 4px 8px rgba(12, 60, 38, 0.07);
box-shadow: 0 4px 8px rgba(12, 60, 38, 0.07);
}

@mixin secondary-shadow-bottom {
-moz-box-shadow: 0 -4px 8px rgba(12, 60, 38, 0.07);
-webkit-box-shadow: 0 -4px 8px rgba(12, 60, 38, 0.07);
box-shadow: 0 -4px 8px rgba(12, 60, 38, 0.07);
-moz-box-shadow: 0 -4px 8px rgba(12, 60, 38, 0.07);
-webkit-box-shadow: 0 -4px 8px rgba(12, 60, 38, 0.07);
box-shadow: 0 -4px 8px rgba(12, 60, 38, 0.07);
}

@mixin framed-image {
padding: 20px;
border: 1px solid var(--hairline-color);
border-radius: 4px;
padding: 20px;
border: 1px solid var(--hairline-color);
border-radius: 4px;
}

0 comments on commit ef47866

Please sign in to comment.