css오류 수정

_posts/2024-08-04-twillio.md

@@ -7,4 +7,26 @@ tags: [algorithm, 알고리즘, 완전탐색]
 image: assets/img/posts/20240804/testcat.jpg
 ---
 
-## dd
+## 계정 생성, 번호 구매
+![DFS_example](assets\img\posts\20240804\twillio1.png)
+
+홈페이지에서 좌측 사이드바에서 Develop -> United States -> # Phone Numbers -> Manage -> Buy a number로 들어간다.
+
+![DFS_example](assets\img\posts\20240804\twillio1.png)
+
+"Voice"에 체크하고, 아무 번호나 구매한다.
+trial 계정의 경우 무료로 제공되는 15$가 있으므로 따로 비용이 들진 않는다.
+
+![DFS_example](assets\img\posts\20240804\twillio1.png)
+
+번호를 구매하면 사이드바에 "Active numbers"에 구입한 번호가 뜬다.
+
+![DFS_example](assets\img\posts\20240804\twillio1.png)
+
+Active Numbers에서 번호를 클릭하면 다음과 같이 Vocie Configuration이 뜨는데, 앞으로 구축할 Falsk api가 제공하는 url을 여기에 입력하게 된다.
+지금은 일단 그대로 두고 계속 진행하도록 하자.
+
+## account_sid, auth_token 확인
+
+
+## 

_sass/addon/commons.scss

@@ -1,6 +1,8 @@
 /* The common styles */
 
 html {
+  font-size: 16px;
+
   @media (prefers-color-scheme: light) {
     &:not([data-mode]),
     &[data-mode='light'] {
@@ -21,9 +23,7 @@ html {
     &[data-mode='light'] {
       @include light-scheme;
     }
-  }
-
-  font-size: 16px;
+  } 
 }
 
 body {
@@ -221,13 +221,12 @@ i {
 
 #access-lastmod {
   a {
+    color: inherit;
+    @extend %no-bottom-border;
+
     &:hover {
       @extend %link-hover;
     }
-
-    @extend %no-bottom-border;
-
-    color: inherit;
   }
 }
 
@@ -717,15 +716,15 @@ $btn-mb: 0.5rem;
 
   /* border-right: 1px solid var(--sidebar-border-color); */
 
+  /* Hide scrollbar for IE, Edge and Firefox */
+  -ms-overflow-style: none; /* IE and Edge */
+  scrollbar-width: none; /* Firefox */
+
   /* Hide scrollbar for Chrome, Safari and Opera */
   &::-webkit-scrollbar {
     display: none;
   }
 
-  /* Hide scrollbar for IE, Edge and Firefox */
-  -ms-overflow-style: none; /* IE and Edge */
-  scrollbar-width: none; /* Firefox */
-
   %sidebar-link-hover {
     &:hover {
       color: var(--sidebar-active-color);
@@ -1089,6 +1088,10 @@ search {
   padding-bottom: 3rem;
 
   a {
+
+    font-size: 1.4rem;
+    line-height: 2.5rem;
+
     &:hover {
       @extend %link-hover;
     }
@@ -1097,8 +1100,7 @@ search {
     @extend %no-bottom-border;
     @extend %heading;
 
-    font-size: 1.4rem;
-    line-height: 2.5rem;
+
   }
 
   > article {

_sass/addon/syntax.scss

@@ -50,12 +50,14 @@ html {
   @extend %rounded;
   @extend %code-snippet-bg;
 
+  overflow: auto;
+  padding-bottom: 0.75rem;
+
   @at-root figure#{&} {
     @extend %code-snippet-bg;
   }
 
-  overflow: auto;
-  padding-bottom: 0.75rem;
+
 
   pre {
     margin-bottom: 0;

_sass/colors/typography-dark.scss

@@ -107,6 +107,8 @@
   --timeline-color: rgb(63, 65, 68);
   --timeline-year-dot-color: var(--timeline-color);
 
+  color-scheme: dark;
+
   .light {
     display: none;
   }
@@ -145,7 +147,7 @@
     );
   }
 
-  color-scheme: dark;
+
 
   /* stylelint-disable-next-line selector-id-pattern */
   #disqus_thread {

_sass/colors/typography-light.scss

@@ -2,6 +2,7 @@
  * The syntax light mode typography colors
  */
 
+
 @mixin light-scheme {
   /* Framework color */
   --main-bg: white;
@@ -86,27 +87,30 @@
   --prompt-danger-bg: rgb(248, 215, 218, 0.56);
   --prompt-danger-icon-color: #df3c30;
 
+
+  /* Categories */
+  --categories-border: rgba(0, 0, 0, 0.125);
+  --categories-hover-bg: var(--btn-border-color);
+  --categories-icon-hover-color: darkslategray;
+
+  /* Archive */
+  --timeline-color: rgba(0, 0, 0, 0.075);
+  --timeline-node-bg: #c2c6cc;
+  --timeline-year-dot-color: #ffffff;
+
   /* Tags */
   --tag-border: #dee2e6;
   --tag-shadow: var(--btn-border-color);
   --tag-hover: rgb(222, 226, 230);
   --search-tag-bg: #f8f9fa;
 
-  [class^='prompt-'] {
-    --link-underline-color: rgb(219, 216, 216);
+  &{
+    [class^='prompt-'] {
+      --link-underline-color: rgb(219, 216, 216);
+    }
   }
 
   .dark {
     display: none;
   }
-
-  /* Categories */
-  --categories-border: rgba(0, 0, 0, 0.125);
-  --categories-hover-bg: var(--btn-border-color);
-  --categories-icon-hover-color: darkslategray;
-
-  /* Archive */
-  --timeline-color: rgba(0, 0, 0, 0.075);
-  --timeline-node-bg: #c2c6cc;
-  --timeline-year-dot-color: #ffffff;
-} /* light-scheme */
+}